beenull/mini.css
1
0
Fork 0
Code Issues Pull requests Packages Projects Releases Wiki Activity

Minor fix in base module's fonts, added demos for buttons and labels

Browse source
This commit is contained in:
Angelos Chalaris 2016-09-15 14:10:56 +03:00
parent 54fd3d467d
commit 6b3db97a89
4 changed files with 46 additions and 4 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

42
docs/modules.html
View file

@ -450,6 +450,48 @@
&lt;/form&gt;</pre>
</div><br>
<h2 id="button">Buttons</h2>
<p>Use the <code>.btn</code> class on <code>&lt;button&gt;</code>, <code>&lt;a&gt;</code>, <code>&lt;label&gt;</code> or similar elements to give them a unique style. Color variants are provided (<code>.red</code>, <code>.green</code> and <code>.blue</code>), as well as size variants (<code>.sm</code> and <code>.lg</code>).</p>
<h3>Button styles and variants</h3>
<div class="panel" ><h4 class="head">Example</h4><br>
&nbsp;&nbsp;<button class="btn">Default button</button>
&nbsp;&nbsp;<button class="btn red">Red button</button>
&nbsp;&nbsp;<button class="btn green">Green button</button>
&nbsp;&nbsp;<button class="btn blue">Blue button</button>
&nbsp;&nbsp;<button class="btn sm">Small button</button>
&nbsp;&nbsp;<button class="btn lg">Large button</button><br><br>
<pre class="panelcode">&lt;button class=&quot;btn&quot;&gt;Default button&lt;/button&gt;
&lt;button class=&quot;btn red&quot;&gt;Red button&lt;/button&gt;
&lt;button class=&quot;btn green&quot;&gt;Green button&lt;/button&gt;
&lt;button class=&quot;btn blue&quot;&gt;Blue button&lt;/button&gt;
&lt;button class=&quot;btn sm&quot;&gt;Small button&lt;/button&gt;
&lt;button class=&quot;btn lg&quot;&gt;Large button&lt;/button&gt;</pre>
</div><br>
<h2 id="label">Labels &amp; Badges</h2>
<p>Use the <code>.lbl</code> or <code>.bdg</code> class on any elements to style them like labels or badges. Color variants are provided (<code>.red</code>, <code>.green</code> and <code>.blue</code>) for both of these styles.</p>
<h3>Labels and badge styles</h3>
<div class="panel" ><h4 class="head">Example</h4><br>
&nbsp;&nbsp;<span class="lbl">Label</span>
<span class="lbl red">Red label</span>
<span class="lbl green">Green label</span>
<span class="lbl blue">Blue label</span>
<span class="bdg">12</span>
<span class="bdg red">3</span>
<span class="bdg green">45</span>
<span class="bdg blue">6</span><br><br>
<pre class="panelcode">&lt;span class=&quot;lbl&quot;&gt;Label&lt;/span&gt;
&lt;span class=&quot;lbl red&quot;&gt;Red label&lt;/span&gt;
&lt;span class=&quot;lbl green&quot;&gt;Green label&lt;/span&gt;
&lt;span class=&quot;lbl blue&quot;&gt;Blue label&lt;/span&gt;
&lt;span class=&quot;bdg&quot;&gt;12&lt;/span&gt;
&lt;span class=&quot;bdg red&quot;&gt;3&lt;/span&gt;
&lt;span class=&quot;bdg green&quot;&gt;45&lt;/span&gt;
&lt;span class=&quot;bdg blue&quot;&gt;6&lt;/span&gt;</pre>
</div><br>
</div>
</div>

2
flavors/mini-default.css
View file

@ -234,7 +234,7 @@ button, input, hr {
Style for buttons and input elements.
*/
button, input, optgroup, select, textarea {
font-family: '"Helvetica Neue", Helvetica, sans-serif';
font-family: "Helvetica Neue", Helvetica, sans-serif;
font-size: 100%;
line-height: 1.2;
margin: 0; }

2
flavors/mini-default.min.css vendored
View file

File diff suppressed because one or more lines are too long

4
scss/mini/_base.scss
View file

@ -83,7 +83,7 @@ ul, ol {
Styles for code and preformatted.
*/
samp, kbd, code, pre{
font-family: $code-fonts;
font-family: #{$code-fonts};
font-size: $base-font-size;
}
kbd, code, pre {
@ -224,7 +224,7 @@ button, input, hr {
Style for buttons and input elements.
*/
button, input, optgroup, select, textarea {
font-family: $button-fonts;
font-family: #{$button-fonts};
font-size: $button-font-size;
line-height: $base-line-height * $button-line-height-multiplier;
margin: $button-margin;