Update styleguide.blade.php

This commit is contained in:
Thomas G 2022-07-23 00:58:20 +10:00
parent 793602745e
commit 17cb5f3075
1 changed files with 85 additions and 41 deletions

View File

@ -8,12 +8,21 @@
<p>This is a page explaining and showing how (most) of the CSS works for this site.</p> <p>This is a page explaining and showing how (most) of the CSS works for this site.</p>
<br> <br>
<h4>Buttons</h4> <h4>Buttons</h4>
<p>Buttons.. Don't you like them? They're used for most things that you need to click that aren't links. These look similar to tabs, but buttons are round and have more variants.</p> <p>Buttons.. Don't you like them? They're used for most things that you need to click that aren't links. These look
similar to tabs, but buttons are round and have more variants.</p>
<br> <br>
<button class="greenbutton">.greenbutton</button> <button class="greenbutton">.greenbutton</button>
<button class="bluebutton">.bluebutton</button> <button class="bluebutton">.bluebutton</button>
<button class="redbutton">.redbutton</button> <button class="redbutton">.redbutton</button>
<button class="greybutton">.greybutton</button> <button class="greybutton">.greybutton</button>
<textarea style="resize: none" readonly>
<pre>
<button class="greenbutton">.greenbutton</button>
<button class="bluebutton">.bluebutton</button>
<button class="redbutton">.redbutton</button>
<button class="greybutton">.greybutton</button>
</pre>
</textarea>
<br> <br>
<br> <br>
<h4>Tabs</h4> <h4>Tabs</h4>
@ -21,6 +30,12 @@
<br> <br>
<a href="#" class="tab_selected">.tab_selected</a> <a href="#" class="tab_selected">.tab_selected</a>
<a href="#" class="tab">.tab</a> <a href="#" class="tab">.tab</a>
<textarea style="resize: none" readonly>
<pre>
<a href="#" class="tab_selected">.tab_selected</a>
<a href="#" class="tab">.tab</a>
</pre>
</textarea>
<br> <br>
<br> <br>
<h4>content_special</h4> <h4>content_special</h4>
@ -29,16 +44,25 @@
<div class="content_special"> <div class="content_special">
<p>Hello i'm some text in the .content_special/#content_special div</p> <p>Hello i'm some text in the .content_special/#content_special div</p>
</div> </div>
<textarea style="resize: none" readonly>
<pre>
<div class="content_special">
<p>Hello i'm some text in the .content_special/#content_special div</p>
</div>
</pre>
</textarea>
<br> <br>
<br> <br>
<h4>Feed, FeedContainer, FeedContainerBox, FeedContainerBoxImageContainer, FeedContainerBoxTextContainer, FeedContainerBox1Username, FeedContainerBox1Text, FeedContainerBox1Timestamp</h4> <h4>Feed, FeedContainer, FeedContainerBox, FeedContainerBoxImageContainer, FeedContainerBoxTextContainer,
FeedContainerBox1Username, FeedContainerBox1Text, FeedContainerBox1Timestamp</h4>
<p>The boxes containing the content of My Feed.</p> <p>The boxes containing the content of My Feed.</p>
<div id="Feed"> <div id="Feed">
<p>#Feed</p> <p>#Feed</p>
<div id="FeedContainer"> <div id="FeedContainer">
<div class="FeedContainerBox"> <div class="FeedContainerBox">
<div class="FeedContainerBoxImageContainer"> <div class="FeedContainerBoxImageContainer">
<a href="#"><img alt="Profile Image" src="{{ asset('img/defaultrender.png') }}" width="60px" height="100%"></a> <a href="#"><img alt="Profile Image" src="{{ asset('img/defaultrender.png') }}" width="60px"
height="100%"></a>
</div> </div>
<div class="FeedContainerBoxTextContainer"> <div class="FeedContainerBoxTextContainer">
<a id="FeedContainerBox1Username">#FeedContainerBox1Username</a> <a id="FeedContainerBox1Username">#FeedContainerBox1Username</a>
@ -48,4 +72,24 @@
</div> </div>
</div> </div>
</div> </div>
<textarea style="resize: none" readonly>
<pre>
<div id="Feed">
<p>#Feed</p>
<div id="FeedContainer">
<div class="FeedContainerBox">
<div class="FeedContainerBoxImageContainer">
<a href="#"><img alt="Profile Image" src="{{ asset('img/defaultrender.png') }}" width="60px"
height="100%"></a>
</div>
<div class="FeedContainerBoxTextContainer">
<a id="FeedContainerBox1Username">#FeedContainerBox1Username</a>
<p id="FeedContainerBox1Text" style="word-wrap:break-word;max-width:400px">#FeedContainerBox1Text</p>
<p id="FeedContainerBox1Timestamp">#FeedContainerBox1Timestamp</p>
</div>
</div>
</div>
</div>
</pre>
</textarea>
@endsection @endsection