Skip to content

Commit

Permalink
Sassplate v1.1.0
Browse files Browse the repository at this point in the history
  • Loading branch information
@glen-cheney
glen-cheney committed Jul 27, 2017
1 parent aecf604 commit 2c95d3d
Show file tree
Hide file tree
Showing 9 changed files with 642 additions and 887 deletions.
2 changes: 1 addition & 1 deletion docs/index.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -497,7 +497,7 @@ <h2 class="odo-component__title">
<div class="odo-component__content">
<h2 class="odo-component__title">
<span class="odo-component__title-text">Sassplate</span>
<span class="odo-component__badge">v1.0.0</span>
<span class="odo-component__badge">v1.1.0</span>
</h2>


Expand Down
74 changes: 48 additions & 26 deletions docs/odo-sassplate/colors.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -56,10 +56,11 @@ <h2 class="docs-type-header-2">Colors</h2>


<div class="col-2@xs col-2@sm docs-color-swatch-wrap">
<div class="docs-color-swatch aspect background--blue-dk "></div>
<div class="docs-color-swatch aspect background--blue-dark "></div>
<div class="docs-color-labels">
<span class="docs-type-classname docs-type-classname--blocky">blue-dk</span>
<span class="docs-type-property">#005992</span>
<span class="docs-type-classname docs-type-classname--blocky">blue-dark</span>
<br>
<code>#005992</code>
</div>
</div>

Expand All @@ -70,18 +71,20 @@ <h2 class="docs-type-header-2">Colors</h2>
<div class="docs-color-swatch aspect background--blue "></div>
<div class="docs-color-labels">
<span class="docs-type-classname docs-type-classname--blocky">blue</span>
<span class="docs-type-property">#1b9ec6</span>
<br>
<code>#1b9ec6</code>
</div>
</div>




<div class="col-2@xs col-2@sm docs-color-swatch-wrap">
<div class="docs-color-swatch aspect background--purple-dk "></div>
<div class="docs-color-swatch aspect background--purple-dark "></div>
<div class="docs-color-labels">
<span class="docs-type-classname docs-type-classname--blocky">purple-dk</span>
<span class="docs-type-property">#711471</span>
<span class="docs-type-classname docs-type-classname--blocky">purple-dark</span>
<br>
<code>#711471</code>
</div>
</div>

Expand All @@ -92,7 +95,8 @@ <h2 class="docs-type-header-2">Colors</h2>
<div class="docs-color-swatch aspect background--purple "></div>
<div class="docs-color-labels">
<span class="docs-type-classname docs-type-classname--blocky">purple</span>
<span class="docs-type-property">#a14fa8</span>
<br>
<code>#a14fa8</code>
</div>
</div>

Expand All @@ -103,7 +107,8 @@ <h2 class="docs-type-header-2">Colors</h2>
<div class="docs-color-swatch aspect background--teal "></div>
<div class="docs-color-labels">
<span class="docs-type-classname docs-type-classname--blocky">teal</span>
<span class="docs-type-property">#00a38a</span>
<br>
<code>#00a38a</code>
</div>
</div>

Expand All @@ -114,7 +119,8 @@ <h2 class="docs-type-header-2">Colors</h2>
<div class="docs-color-swatch aspect background--lime "></div>
<div class="docs-color-labels">
<span class="docs-type-classname docs-type-classname--blocky">lime</span>
<span class="docs-type-property">#b2bb21</span>
<br>
<code>#b2bb21</code>
</div>
</div>
</div>
Expand All @@ -135,7 +141,8 @@ <h2 class="docs-type-header-2">Grays</h2>
<div class="docs-color-swatch aspect background--white docs-color-swatch--dark-bordered"></div>
<div class="docs-color-labels">
<span class="docs-type-classname docs-type-classname--blocky">white</span>
<span class="docs-type-property">#ffffff</span>
<br>
<code>#ffffff</code>
</div>
</div>

Expand All @@ -146,7 +153,8 @@ <h2 class="docs-type-header-2">Grays</h2>
<div class="docs-color-swatch aspect background--gray90 "></div>
<div class="docs-color-labels">
<span class="docs-type-classname docs-type-classname--blocky">gray90</span>
<span class="docs-type-property">#edf0f1</span>
<br>
<code>#edf0f1</code>
</div>
</div>

Expand All @@ -157,7 +165,8 @@ <h2 class="docs-type-header-2">Grays</h2>
<div class="docs-color-swatch aspect background--gray80 "></div>
<div class="docs-color-labels">
<span class="docs-type-classname docs-type-classname--blocky">gray80</span>
<span class="docs-type-property">#dfe4e6</span>
<br>
<code>#dfe4e6</code>
</div>
</div>

Expand All @@ -168,7 +177,8 @@ <h2 class="docs-type-header-2">Grays</h2>
<div class="docs-color-swatch aspect background--gray70 "></div>
<div class="docs-color-labels">
<span class="docs-type-classname docs-type-classname--blocky">gray70</span>
<span class="docs-type-property">#bec5c7</span>
<br>
<code>#bec5c7</code>
</div>
</div>

Expand All @@ -179,7 +189,8 @@ <h2 class="docs-type-header-2">Grays</h2>
<div class="docs-color-swatch aspect background--gray60 "></div>
<div class="docs-color-labels">
<span class="docs-type-classname docs-type-classname--blocky">gray60</span>
<span class="docs-type-property">#919698</span>
<br>
<code>#919698</code>
</div>
</div>

Expand All @@ -190,7 +201,8 @@ <h2 class="docs-type-header-2">Grays</h2>
<div class="docs-color-swatch aspect background--gray40 "></div>
<div class="docs-color-labels">
<span class="docs-type-classname docs-type-classname--blocky">gray40</span>
<span class="docs-type-property">#61686a</span>
<br>
<code>#61686a</code>
</div>
</div>

Expand All @@ -201,7 +213,8 @@ <h2 class="docs-type-header-2">Grays</h2>
<div class="docs-color-swatch aspect background--gray30 "></div>
<div class="docs-color-labels">
<span class="docs-type-classname docs-type-classname--blocky">gray30</span>
<span class="docs-type-property">#30373d</span>
<br>
<code>#30373d</code>
</div>
</div>

Expand All @@ -212,7 +225,8 @@ <h2 class="docs-type-header-2">Grays</h2>
<div class="docs-color-swatch aspect background--gray20 "></div>
<div class="docs-color-labels">
<span class="docs-type-classname docs-type-classname--blocky">gray20</span>
<span class="docs-type-property">#242a2f</span>
<br>
<code>#242a2f</code>
</div>
</div>

Expand All @@ -223,7 +237,8 @@ <h2 class="docs-type-header-2">Grays</h2>
<div class="docs-color-swatch aspect background--black "></div>
<div class="docs-color-labels">
<span class="docs-type-classname docs-type-classname--blocky">black</span>
<span class="docs-type-property">#000000</span>
<br>
<code>#000000</code>
</div>
</div>

Expand All @@ -234,7 +249,8 @@ <h2 class="docs-type-header-2">Grays</h2>
<div class="docs-color-swatch aspect background--grayblue40 "></div>
<div class="docs-color-labels">
<span class="docs-type-classname docs-type-classname--blocky">grayblue40</span>
<span class="docs-type-property">#526675</span>
<br>
<code>#526675</code>
</div>
</div>

Expand All @@ -245,7 +261,8 @@ <h2 class="docs-type-header-2">Grays</h2>
<div class="docs-color-swatch aspect background--grayblue30 "></div>
<div class="docs-color-labels">
<span class="docs-type-classname docs-type-classname--blocky">grayblue30</span>
<span class="docs-type-property">#3e4d5a</span>
<br>
<code>#3e4d5a</code>
</div>
</div>

Expand All @@ -256,7 +273,8 @@ <h2 class="docs-type-header-2">Grays</h2>
<div class="docs-color-swatch aspect background--grayblue20 "></div>
<div class="docs-color-labels">
<span class="docs-type-classname docs-type-classname--blocky">grayblue20</span>
<span class="docs-type-property">#2b343c</span>
<br>
<code>#2b343c</code>
</div>
</div>
</div>
Expand All @@ -277,7 +295,8 @@ <h2 class="docs-type-header-2">Gradients</h2>
<div class="docs-color-swatch aspect background--blue--purple "></div>
<div class="docs-color-labels">
<span class="docs-type-classname docs-type-classname--blocky">blue--purple</span>
<span class="docs-type-property">#389dd3 to #6645ae</span>
<br>
<code>#389dd3 to #6645ae</code>
</div>
</div>

Expand All @@ -288,7 +307,8 @@ <h2 class="docs-type-header-2">Gradients</h2>
<div class="docs-color-swatch aspect background--teal--blue "></div>
<div class="docs-color-labels">
<span class="docs-type-classname docs-type-classname--blocky">teal--blue</span>
<span class="docs-type-property">#00a38a to #389dd3</span>
<br>
<code>#00a38a to #389dd3</code>
</div>
</div>

Expand All @@ -299,7 +319,8 @@ <h2 class="docs-type-header-2">Gradients</h2>
<div class="docs-color-swatch aspect background--white--gray90 docs-color-swatch--dark-bordered"></div>
<div class="docs-color-labels">
<span class="docs-type-classname docs-type-classname--blocky">white--gray90</span>
<span class="docs-type-property">#ffffff to #edf0f1</span>
<br>
<code>#ffffff to #edf0f1</code>
</div>
</div>

Expand All @@ -310,7 +331,8 @@ <h2 class="docs-type-header-2">Gradients</h2>
<div class="docs-color-swatch aspect background--red--orange "></div>
<div class="docs-color-labels">
<span class="docs-type-classname docs-type-classname--blocky">red--orange</span>
<span class="docs-type-property">#d9122e to #f6543a</span>
<br>
<code>#d9122e to #f6543a</code>
</div>
</div>
</div>
Expand Down
2 changes: 1 addition & 1 deletion docs/odo-sassplate/css-utilities.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -162,7 +162,7 @@ <h3 class="docs-type-header-4">Markup</h3>
<div class="col-12@sm">
<h2 class="docs-type-header-1">Flag Object</h2>
<blockquote class="docs-blockquote">
<p>An object (like an image) and content to the right or left. <a href="http://stubbornella.org/content/?p=497" class="type-link-text-1">Source</a></p>
<p>An object (like an image) and content to the right or left. <a href="https://csswizardry.com/2013/05/the-flag-object/" class="type-link-text-1">Source</a></p>
</blockquote>
<p class="docs-type-body-3"><strong class="type--bold">Heads up!</strong> For this method to work, the image cannot have <code>max-width: 100%;</code> so it is set to <code>none</code>. Hi resolution images may grow larger than you expect. To avoid this, set a width on the image.</p>
</div>
Expand Down
44 changes: 19 additions & 25 deletions docs/odo-sassplate/css/docs.css
View file

Some generated files are not rendered by default. Learn more about how customized files appear on GitHub.

2 changes: 1 addition & 1 deletion docs/odo-sassplate/css/docs.css.map
View file

Large diffs are not rendered by default.

Loading

0 comments on commit 2c95d3d

Please sign in to comment.