mirror of
https://github.com/Chalarangelo/mini.css.git
synced 2025-04-16 10:21:51 +02:00
Customization documentation for core
Fully documented core module, fixed an issue with the blockquote border styling and added box-shadow customization to samp elements.
This commit is contained in:
Angelos Chalaris
parent
35d737e57d
commit
27058d2fba
@ -60,8 +60,7 @@
|
||||
</div>
|
||||
<div class="section">
|
||||
<h2>Quick start</h2>
|
||||
<p>To use the <strong>core</strong> module, simply include the link to the flavor you are using and start writing your HTML page as usual. One suggestion we will make is to add the following line inside your HTML page's <code><head></code> to utilize the viewport meta tag:</p><br>
|
||||
<pre><<span class="fore-tertiary">meta</span> <span class="fore-secondary">name</span>=<span class="fore-primary">"viewport"</span> <span class="fore-secondary">content</span>=<span class="fore-primary">"width=device-width, initial-scale=1"</span>></pre><br>
|
||||
<p>To customize the <strong>core</strong> module, duplicate an existing flavor file (we suggest you use the <code>mini-default.scss</code> flavor file) and use this page's variable tables and mixins as a reference to change only the values you need. Remember to compile your flavor file (not the module's partial file) using a Sass preprocessor (we highly recommend using <a href="https://atom.io/packages/sass-autocompile">sass-autocompile</a> if you are working with <a href="https://atom.io/">Atom</a>).</p><br>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
@ -72,7 +71,7 @@
|
||||
<div class="card fluid">
|
||||
<div class="section"><h2>Typography & headings</h2></div>
|
||||
<div class="section">
|
||||
<p>The <strong>core</strong> module's typography rules are quite extensive and deal with background & foreground colors, used fonts, sizing and line height, along with heading and paragraph styling.</p><br/>
|
||||
<p>The <strong>core</strong> module's typography rules are quite extensive and deal with background and foreground colors, used fonts, sizing and line height, along with heading, link and paragraph styling.</p><br/>
|
||||
<table width="100%" class="striped">
|
||||
<thead>
|
||||
<tr><th>Variable</th><th>Type</th><th>Description</th><th>Sample value</th></tr>
|
||||
@ -158,6 +157,58 @@
|
||||
<td data-label="Variable">$heading-smalltext-b-top-margin</td><td data-label="Type">Margin</td>
|
||||
<td data-label="Description">Top margin for <code><small></code> elements inside headings<sup><a href="#typo-note-two">2</a></sup></td><td data-label="Sample value">-4px</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td data-label="Variable">$paragraph-margin</td><td data-label="Type">Margin</td>
|
||||
<td data-label="Description">Margin for <code><p></code> elements</td><td data-label="Sample value">1px 8px</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td data-label="Variable">$bold-font-weight</td><td data-label="Type">Font weight</td>
|
||||
<td data-label="Description">Font weight for <code><b></code> and <code><strong></code> elements</td><td data-label="Sample value">700</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td data-label="Variable">$small-font-size</td><td data-label="Type">Font size (percentage preferred)</td>
|
||||
<td data-label="Description">Font size for <code><small></code> elements</td><td data-label="Sample value">75%</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td data-label="Variable">$sup-font-size</td><td data-label="Type">Font size (percentage preferred)</td>
|
||||
<td data-label="Description">Font size for <code><sup></code> elements</td><td data-label="Sample value">75%</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td data-label="Variable">$sup-top</td><td data-label="Type">Position top</td>
|
||||
<td data-label="Description">Position top for <code><sup></code> elements</td><td data-label="Sample value">-8px</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td data-label="Variable">$sub-font-size</td><td data-label="Type">Font size (percentage preferred)</td>
|
||||
<td data-label="Description">Font size for <code><sub></code> elements</td><td data-label="Sample value">75%</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td data-label="Variable">$sub-bottom</td><td data-label="Type">Position bottom</td>
|
||||
<td data-label="Description">Position bottom for <code><sub></code> elements</td><td data-label="Sample value">-4px</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td data-label="Variable">$link-fore-color</td><td data-label="Type">Color</td>
|
||||
<td data-label="Description">Text color for links (unvisited)</td><td data-label="Sample value">#0277bd</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td data-label="Variable">$link-visited-fore-color</td><td data-label="Type">Color</td>
|
||||
<td data-label="Description">Text color for links (visited)</td><td data-label="Sample value">#01579b</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td data-label="Variable">$link-hover-fore-color</td><td data-label="Type">Color</td>
|
||||
<td data-label="Description">Text color for links (on hover)<sup><a href="#typo-note-three">3</a></sup></td><td data-label="Sample value">#0288d1</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td data-label="Variable">$apply-link-hover-fade</td><td data-label="Type">Logical</td>
|
||||
<td data-label="Description">Applies fading to links on hover<sup><a href="#typo-note-three">3</a></sup></td><td data-label="Sample value">true</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td data-label="Variable">$link-font-weight</td><td data-label="Type">Font weight</td>
|
||||
<td data-label="Description">Font weight for links</td><td data-label="Sample value">500</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td data-label="Variable">$apply-link-underline</td><td data-label="Type">Logical</td>
|
||||
<td data-label="Description">Applies underlining to links on hover</td><td data-label="Sample value">true</td>
|
||||
</tr>
|
||||
</tbody>
|
||||
</table><br/>
|
||||
</div>
|
||||
@ -166,11 +217,249 @@
|
||||
<ol>
|
||||
<li id="typo-note-one">The value of <code>$base-font-size</code> will only be applied if <code>$apply-defaults-to-all</code> is set to <code class="fore-tertiary">true</code>.</li>
|
||||
<li id="typo-note-two">The values of <code>$heading-smalltext-b-font-size</code> and <code>$heading-smalltext-b-top-margin</code> will only be applied if <code>$make-heading-smalltext-block</code> is set to <code class="fore-tertiary">true</code>.</li>
|
||||
<li id="typo-note-three">The value of <code>$link-hover-fore-color</code> will only be applied if <code>$apply-link-hover-fade</code> is set to <code class="fore-secondary">false</code>.</li>
|
||||
</ol>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="row">
|
||||
<div class="col-sm-12 col-lg-10 col-lg-offset-1">
|
||||
<div class="card fluid">
|
||||
<div class="section"><h2>Common elements & fixes</h2></div>
|
||||
<div class="section">
|
||||
<p>The <strong>core</strong> module contains a plethora of styles for horizontal rules, lists and code elements, as well as a few optional display fixes for certain other elements.</p><br/>
|
||||
<table width="100%" class="striped">
|
||||
<thead>
|
||||
<tr><th>Variable</th><th>Type</th><th>Description</th><th>Sample value</th></tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
<tr>
|
||||
<td data-label="Variable">$list-margin</td><td data-label="Type">Margin</td>
|
||||
<td data-label="Description">Margin for <code><ul></code> and <code><ol></code> elements</td><td data-label="Sample value">8px</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td data-label="Variable">$list-left-padding</td><td data-label="Type">Padding left</td>
|
||||
<td data-label="Description">Left padding for <code><ul></code> and <code><ol></code> elements</td><td data-label="Sample value">8px</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td data-label="Variable">$horizontal-rule-line-height</td><td data-label="Type">Line height</td>
|
||||
<td data-label="Description">Line height for <code><hr></code> elements</td><td data-label="Sample value">1.25em</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td data-label="Variable">$horizontal-rule-margin</td><td data-label="Type">Margin</td>
|
||||
<td data-label="Description">Margin for <code><hr></code> elements</td><td data-label="Sample value">8px</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td data-label="Variable">$horizontal-rule-border-style</td><td data-label="Type">Border</td>
|
||||
<td data-label="Description">Border style for <code><hr></code> elements<sup><a href="#other-note-one">1</a></sup></td><td data-label="Sample value">1px solid #757575</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td data-label="Variable">$horizontal-rule-fancy-style</td><td data-label="Type">Logical</td>
|
||||
<td data-label="Description">Applies gradient styling to <code><hr></code> elements<sup><a href="#other-note-two">2</a></sup></td><td data-label="Sample value">true</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td data-label="Variable">$horizontal-rule-fancy-gradient</td><td data-label="Type">Gradient</td>
|
||||
<td data-label="Description">Gradient styling for <code><hr></code> elements<sup><a href="#other-note-two">2</a></sup></td><td data-label="Sample value">to right, #616161, #bdbdbd</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td data-label="Variable">$blockquote-back-color</td><td data-label="Type">Color</td>
|
||||
<td data-label="Description">Background color for <code><blockquote></code> elements</td><td data-label="Sample value">#eeeeee</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td data-label="Variable">$blockquote-fore-color</td><td data-label="Type">Color</td>
|
||||
<td data-label="Description">Text color for <code><blockquote></code> elements</td><td data-label="Sample value">$fore-color</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td data-label="Variable">$blockquote-margin</td><td data-label="Type">Margin</td>
|
||||
<td data-label="Description">Margin for <code><blockquote></code> elements</td><td data-label="Sample value">8px 10px</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td data-label="Variable">$blockquote-padding</td><td data-label="Type">Padding</td>
|
||||
<td data-label="Description">Padding for <code><blockquote></code> elements</td><td data-label="Sample value">8px</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td data-label="Variable">$blockquote-border-style</td><td data-label="Type">Border</td>
|
||||
<td data-label="Description">Border style for <code><blockquote></code> elements</td><td data-label="Sample value">1px solid #424242</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td data-label="Variable">$blockquote-border-radius</td><td data-label="Type">Border radius</td>
|
||||
<td data-label="Description">Border radius for <code><blockquote></code> elements</td><td data-label="Sample value">2px</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td data-label="Variable">$blockquote-box-shadow</td><td data-label="Type">Box shadow</td>
|
||||
<td data-label="Description">Box shadow for <code><blockquote></code> elements</td><td data-label="Sample value">0 1px 3px rgba(0,0,0, 0.1)</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td data-label="Variable">$blockquote-sidebar-style</td><td data-label="Type">Border</td>
|
||||
<td data-label="Description">Style for the sidebar of <code><blockquote></code> elements</td><td data-label="Sample value">3px solid #616161</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td data-label="Variable">$blockquote-cite-font-size</td><td data-label="Type">Font size</td>
|
||||
<td data-label="Description">Font size for citations in <code><blockquote></code> elements</td><td data-label="Sample value">0.85em</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td data-label="Variable">$blockquote-cite-fore-color</td><td data-label="Type">Color</td>
|
||||
<td data-label="Description">Text color for citations in <code><blockquote></code> elements</td><td data-label="Sample value">#616161</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td data-label="Variable">$blockquote-cite-left-position</td><td data-label="Type">Position left</td>
|
||||
<td data-label="Description">Position left for citations in <code><blockquote></code> elements</td><td data-label="Sample value">10px</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td data-label="Variable">$blockquote-cite-bottom-position</td><td data-label="Type">Position bottom</td>
|
||||
<td data-label="Description">Position bottom for citations in <code><blockquote></code> elements</td><td data-label="Sample value">0</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td data-label="Variable">$use-default-code-fonts</td><td data-label="Type">Logical</td>
|
||||
<td data-label="Description">Use default fonts for code elements<sup><a href="#other-note-three">3</a></sup></td><td data-label="Sample value">true</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td data-label="Variable">$code-font-family</td><td data-label="Type">Font family</td>
|
||||
<td data-label="Description">Font for code elements<sup><a href="#other-note-three">3</a></sup></td><td data-label="Sample value">monospace</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td data-label="Variable">$code-element-padding</td><td data-label="Type">Padding</td>
|
||||
<td data-label="Description">Padding for <code><code></code> elements</td><td data-label="Sample value">4px</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td data-label="Variable">$code-element-fore-color</td><td data-label="Type">Color</td>
|
||||
<td data-label="Description">Text color for <code><code></code> elements</td><td data-label="Sample value">$fore-color</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td data-label="Variable">$code-element-back-color</td><td data-label="Type">Color</td>
|
||||
<td data-label="Description">Background color for <code><code></code> elements</td><td data-label="Sample value">#e0e0e0</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td data-label="Variable">$code-element-border-style</td><td data-label="Type">Border</td>
|
||||
<td data-label="Description">Border style for <code><code></code> elements</td><td data-label="Sample value">1px solid #424242</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td data-label="Variable">$code-element-border-radius</td><td data-label="Type">Border radius</td>
|
||||
<td data-label="Description">Border radius for <code><code></code> elements</td><td data-label="Sample value">2px</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td data-label="Variable">$code-element-box-shadow</td><td data-label="Type">Box shadow</td>
|
||||
<td data-label="Description">Box shadow for <code><code></code> elements</td><td data-label="Sample value">0 1px 2px rgba(0,0,0, 0.1)</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td data-label="Variable">$pre-element-padding</td><td data-label="Type">Padding</td>
|
||||
<td data-label="Description">Padding for <code><pte></code> elements</td><td data-label="Sample value">12px</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td data-label="Variable">$pre-element-margin</td><td data-label="Type">Margin</td>
|
||||
<td data-label="Description">Margin for <code><pte></code> elements</td><td data-label="Sample value">8px</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td data-label="Variable">$pre-element-fore-color</td><td data-label="Type">Color</td>
|
||||
<td data-label="Description">Text color for <code><pre></code> elements</td><td data-label="Sample value">$fore-color</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td data-label="Variable">$pre-element-back-color</td><td data-label="Type">Color</td>
|
||||
<td data-label="Description">Background color for <code><pre></code> elements</td><td data-label="Sample value">#e0e0e0</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td data-label="Variable">$pre-element-border-style</td><td data-label="Type">Border</td>
|
||||
<td data-label="Description">Border style for <code><pre></code> elements</td><td data-label="Sample value">1px solid #424242</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td data-label="Variable">$pre-element-border-radius</td><td data-label="Type">Border radius</td>
|
||||
<td data-label="Description">Border radius for <code><pre></code> elements</td><td data-label="Sample value">2px</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td data-label="Variable">$pre-element-box-shadow</td><td data-label="Type">Box shadow</td>
|
||||
<td data-label="Description">Box shadow for <code><pre></code> elements</td><td data-label="Sample value">0 1px 2px rgba(0,0,0, 0.1)</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td data-label="Variable">$add-pre-element-sidebar</td><td data-label="Type">Logical</td>
|
||||
<td data-label="Description">Adds a sidebar to <code><pre></code> elements<sup><a href="#other-note-four">4</a></sup></td><td data-label="Sample value">true</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td data-label="Variable">$pre-element-sidebar-style</td><td data-label="Type">Border</td>
|
||||
<td data-label="Description">Style of the sidebar for <code><pre></code> elements<sup><a href="#other-note-four">4</a></sup></td><td data-label="Sample value">3px solid #1565c0</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td data-label="Variable">$kbd-element-padding</td><td data-label="Type">Padding</td>
|
||||
<td data-label="Description">Padding for <code><kbd></code> elements</td><td data-label="Sample value">4px</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td data-label="Variable">$kbd-element-fore-color</td><td data-label="Type">Color</td>
|
||||
<td data-label="Description">Text color for <code><kbd></code> elements</td><td data-label="Sample value">#fafafa</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td data-label="Variable">$kbd-element-back-color</td><td data-label="Type">Color</td>
|
||||
<td data-label="Description">Background color for <code><kbd></code> elements</td><td data-label="Sample value">$fore-color</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td data-label="Variable">$kbd-element-border-style</td><td data-label="Type">Border</td>
|
||||
<td data-label="Description">Border style for <code><kbd></code> elements</td><td data-label="Sample value">1px solid #212121</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td data-label="Variable">$kbd-element-border-radius</td><td data-label="Type">Border radius</td>
|
||||
<td data-label="Description">Border radius for <code><kbd></code> elements</td><td data-label="Sample value">2px</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td data-label="Variable">$kbd-element-box-shadow</td><td data-label="Type">Box shadow</td>
|
||||
<td data-label="Description">Box shadow for <code><kbd></code> elements</td><td data-label="Sample value">0 1px 2px rgba(0,0,0, 0.1)</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td data-label="Variable">$style-samp-element</td><td data-label="Type">Logical</td>
|
||||
<td data-label="Description">Applies styling to <code><samp></code> elements<sup><a href="#other-note-five">5</a></sup></td><td data-label="Sample value">true</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td data-label="Variable">$samp-element-padding</td><td data-label="Type">Padding</td>
|
||||
<td data-label="Description">Padding for <code><samp></code> elements<sup><a href="#other-note-five">5</a></sup></td><td data-label="Sample value">4px</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td data-label="Variable">$samp-element-fore-color</td><td data-label="Type">Color</td>
|
||||
<td data-label="Description">Text color for <code><samp></code> elements<sup><a href="#other-note-five">5</a></sup></td><td data-label="Sample value">$fore-color</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td data-label="Variable">$samp-element-back-color</td><td data-label="Type">Color</td>
|
||||
<td data-label="Description">Background color for <code><samp></code> elements<sup><a href="#other-note-five">5</a></sup></td><td data-label="Sample value">#2196f3</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td data-label="Variable">$samp-element-border-style</td><td data-label="Type">Border</td>
|
||||
<td data-label="Description">Border style for <code><samp></code> elements<sup><a href="#other-note-five">5</a></sup></td><td data-label="Sample value">1px solid #424242</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td data-label="Variable">$samp-element-border-radius</td><td data-label="Type">Border radius</td>
|
||||
<td data-label="Description">Border radius for <code><samp></code> elements<sup><a href="#other-note-five">5</a></sup></td><td data-label="Sample value">2px</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td data-label="Variable">$samp-element-box-shadow</td><td data-label="Type">Box shadow</td>
|
||||
<td data-label="Description">Box shadow for <code><samp></code> elements<sup><a href="#other-note-five">5</a></sup></td><td data-label="Sample value">0 1px 2px rgba(0,0,0, 0.1)</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td data-label="Variable">$include-dfn-fix</td><td data-label="Type">Logical</td>
|
||||
<td data-label="Description">Includes a display fix for <code><dfn></code> elements for Android 4.3</td><td data-label="Sample value">true</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td data-label="Variable">$figcaption-font-size</td><td data-label="Type">Font size (percentage preferred)</td>
|
||||
<td data-label="Description">Font size for <code><figcaption></code> elements</td><td data-label="Sample value">80%</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td data-label="Variable">$figcaption-fore-color</td><td data-label="Type">Color</td>
|
||||
<td data-label="Description">Text color for <code><figcaption></code> elements</td><td data-label="Sample value">#424242</td>
|
||||
</tr>
|
||||
</tbody>
|
||||
</table><br/>
|
||||
</div>
|
||||
<div class="section">
|
||||
<h3>Notes:</h3>
|
||||
<ol>
|
||||
<li id="other-note-one">The value of <code>$horizontal-rule-border-style</code> will only be applied if <code>$horizontal-rule-fancy-style</code> is set to <code class="fore-secondary">false</code>.</li>
|
||||
<li id="other-note-two">The value of <code>$horizontal-rule-fancy-gradient</code> will only be applied if <code>$horizontal-rule-fancy-style</code> is set to <code class="fore-tertiary">true</code>.</li>
|
||||
<li id="other-note-three">The value of <code>$code-font-family</code> will only be applied if <code>$use-default-code-fonts</code> is set to <code class="fore-secondary">false</code>.</li>
|
||||
<li id="other-note-four">The value of <code>$pre-element-sidebar-style</code> will only be applied if <code>$add-pre-element-sidebar</code> is set to <code class="fore-tertiary">true</code>.</li>
|
||||
<li id="other-note-five">The values of all the variables that refer to <code><samp></code> elements will only be applied if <code>$style-samp-element</code> is set to <code class="fore-tertiary">true</code>.</li>
|
||||
</ol>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="row" style="padding-bottom: 20px; padding-top:20px;">
|
||||
<div class="col-sm-12 col-lg-10 col-lg-offset-1">
|
||||
<p>If you want to learn more about customizing <strong>mini.css</strong>, go back to the <a href="index.html">customization page</a> or choose a module from the top menu to see its documentation.</p>
|
||||
|
||||
@ -956,3 +956,6 @@
|
||||
## 20170411
|
||||
|
||||
- *TODO* Actually explain what the deal with Pull requests is, using a `dev` branch OR use `cdnjs`, provided the fact that it is now updated to the latest release (will it stay that way?).
|
||||
- Tweaked the way `border` was used inside `blockquote`, ordering wasn't doing me any favors. Should not cause any problems now. Random catch, thank you **hugging cat**!
|
||||
- Added `$samp-element-box-shadow` for consistency, mostly.
|
||||
- Fully documented customization page for `core` module.
|
||||
|
||||
@ -84,6 +84,8 @@ $style-samp-element: false; // Should styles for <samp> be included?
|
||||
//$samp-element-back-color: #2196f3; // Background color for <samp>
|
||||
//$samp-element-border-style: 0; // Border style for <samp>
|
||||
//$samp-element-border-radius:2px; // Border radius for <samp>
|
||||
//$samp-element-box-shadow: // Box shadow for <samp>
|
||||
//0 1px 2px rgba(0,0,0, 0.1), 0 1px 1px rgba(0, 0, 0, 0.15);
|
||||
$include-dfn-fix: true; // Should the fix for Android 4.3 concerning <dfn> be included (`true`/`false`) [9]
|
||||
$small-font-size: 75%; // Font size for <small> elements
|
||||
$sup-font-size: 75%; // Font size for <sup> elements
|
||||
|
||||
@ -165,12 +165,12 @@ blockquote {
|
||||
// Overwrite defaults
|
||||
margin: $blockquote-margin;
|
||||
padding: $blockquote-padding;
|
||||
@if $blockquote-sidebar-style != 0 {
|
||||
border-left: $blockquote-sidebar-style;
|
||||
}
|
||||
@if $blockquote-border-style != 0 {
|
||||
border: $blockquote-border-style;
|
||||
}
|
||||
@if $blockquote-sidebar-style != 0 {
|
||||
border-left: $blockquote-sidebar-style;
|
||||
}
|
||||
@if $blockquote-border-radius != 0 {
|
||||
border-radius: $blockquote-border-radius;
|
||||
}
|
||||
@ -290,6 +290,9 @@ $style-samp-element: false !default;
|
||||
@if $samp-element-padding != 0 {
|
||||
padding: $samp-element-padding;
|
||||
}
|
||||
@if $samp-element-box-shadow != none {
|
||||
box-shadow: $samp-element-box-shadow;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
Loading…
x
Reference in New Issue
Block a user