mirror/webslides
1
0
Fork 0
mirror of https://github.com/webslides/WebSlides.git synced 2025-08-22 21:03:23 +02:00
Code Issues Releases Wiki Activity

kss - Layouts section

Browse Source
This commit is contained in:
Luis Sacristán
2017-10-13 21:03:44 +02:00
parent e9d9bf973d
commit f31f8045c0
23 changed files with 590 additions and 231 deletions
Download Patch File Download Diff File Expand all files Collapse all files

66
doc/styleguide/item-layout-backgrounds.html
View File

@@ -91,6 +91,20 @@
</div>
<div class="kss-modifier__heading kss-style">
Demos
</div>
<ul class="kss__demos">
<li>
<a href="https://webslides.tv/demos/classes#slide&#x3D;24" title="White" target="_blank">White</a>
</li>
<li>
<a href="https://webslides.tv/demos/classes#slide&#x3D;28" title="Several colors" target="_blank">Several colors</a>
</li>
<li>
<a href="https://webslides.tv/demos/components#slide&#x3D;27" title="Examples" target="_blank">Examples</a>
</li>
</ul>
<div class="kss-modifier__wrapper">
<div class="kss-modifier__heading kss-style">
@@ -99,19 +113,19 @@
<div class="kss-modifier__example">
<span class="bg-primary size-20">Primary #44d</span>
<span class="bg-secondary size-20">Secondary #67d</span>
<span class="bg-light size-20">Light #f7f9fb</span>
<span class="bg-black size-20">Black #000</span>
<span class="bg-black-blue size-20">Black blue #123</span>
<span class="bg-blue size-20">Blue #346</span>
<span class="bg-brown size-20">Brown #f9f8f2</span>
<span class="bg-gray size-20">Gray #d5d9e2</span>
<span class="bg-green size-20">Green #077</span>
<span class="bg-purple size-20">Purple #62b</span>
<span class="bg-red size-20">Red #c23</span>
<span class="bg-white size-20">White #fff</span>
<span class="bg-facebook size-20">Facebook #3b5998</span>
<span class="bg-primary">Primary #44d</span>
<span class="bg-secondary">Secondary #67d</span>
<span class="bg-light">Light #f7f9fb</span>
<span class="bg-black">Black #000</span>
<span class="bg-black-blue">Black blue #123</span>
<span class="bg-blue">Blue #346</span>
<span class="bg-brown">Brown #f9f8f2</span>
<span class="bg-gray">Gray #d5d9e2</span>
<span class="bg-green">Green #077</span>
<span class="bg-purple">Purple #62b</span>
<span class="bg-red">Red #c23</span>
<span class="bg-white">White #fff</span>
<span class="bg-facebook">Facebook #3b5998</span>
<div class="kss-modifier__example-footer"></div>
</div>
@@ -121,19 +135,19 @@
<summary>
Markup
</summary>
<pre class="prettyprint linenums lang-html"><code data-language="html">&lt;span class&#x3D;&quot;bg-primary size-20&quot;&gt;Primary #44d&lt;/span&gt;
&lt;span class&#x3D;&quot;bg-secondary size-20&quot;&gt;Secondary #67d&lt;/span&gt;
&lt;span class&#x3D;&quot;bg-light size-20&quot;&gt;Light #f7f9fb&lt;/span&gt;
&lt;span class&#x3D;&quot;bg-black size-20&quot;&gt;Black #000&lt;/span&gt;
&lt;span class&#x3D;&quot;bg-black-blue size-20&quot;&gt;Black blue #123&lt;/span&gt;
&lt;span class&#x3D;&quot;bg-blue size-20&quot;&gt;Blue #346&lt;/span&gt;
&lt;span class&#x3D;&quot;bg-brown size-20&quot;&gt;Brown #f9f8f2&lt;/span&gt;
&lt;span class&#x3D;&quot;bg-gray size-20&quot;&gt;Gray #d5d9e2&lt;/span&gt;
&lt;span class&#x3D;&quot;bg-green size-20&quot;&gt;Green #077&lt;/span&gt;
&lt;span class&#x3D;&quot;bg-purple size-20&quot;&gt;Purple #62b&lt;/span&gt;
&lt;span class&#x3D;&quot;bg-red size-20&quot;&gt;Red #c23&lt;/span&gt;
&lt;span class&#x3D;&quot;bg-white size-20&quot;&gt;White #fff&lt;/span&gt;
&lt;span class&#x3D;&quot;bg-facebook size-20&quot;&gt;Facebook #3b5998&lt;/span&gt;</code></pre>
<pre class="prettyprint linenums lang-html"><code data-language="html">&lt;span class&#x3D;&quot;bg-primary&quot;&gt;Primary #44d&lt;/span&gt;
&lt;span class&#x3D;&quot;bg-secondary&quot;&gt;Secondary #67d&lt;/span&gt;
&lt;span class&#x3D;&quot;bg-light&quot;&gt;Light #f7f9fb&lt;/span&gt;
&lt;span class&#x3D;&quot;bg-black&quot;&gt;Black #000&lt;/span&gt;
&lt;span class&#x3D;&quot;bg-black-blue&quot;&gt;Black blue #123&lt;/span&gt;
&lt;span class&#x3D;&quot;bg-blue&quot;&gt;Blue #346&lt;/span&gt;
&lt;span class&#x3D;&quot;bg-brown&quot;&gt;Brown #f9f8f2&lt;/span&gt;
&lt;span class&#x3D;&quot;bg-gray&quot;&gt;Gray #d5d9e2&lt;/span&gt;
&lt;span class&#x3D;&quot;bg-green&quot;&gt;Green #077&lt;/span&gt;
&lt;span class&#x3D;&quot;bg-purple&quot;&gt;Purple #62b&lt;/span&gt;
&lt;span class&#x3D;&quot;bg-red&quot;&gt;Red #c23&lt;/span&gt;
&lt;span class&#x3D;&quot;bg-white&quot;&gt;White #fff&lt;/span&gt;
&lt;span class&#x3D;&quot;bg-facebook&quot;&gt;Facebook #3b5998&lt;/span&gt;</code></pre>
</details>
<div class="kss-source kss-style">