mirror/webslides
1
0
Fork 0
mirror of https://github.com/webslides/WebSlides.git synced 2025-08-29 16:00:31 +02:00
Code Issues Releases Wiki Activity

kss - adding new section Demos

Browse Source
This commit is contained in:
Luis Sacristán
2017-10-02 22:15:08 +02:00
parent 5daf67f957
commit bd7468de4e
80 changed files with 290 additions and 114 deletions
Download Patch File Download Diff File Expand all files Collapse all files

45
doc/styleguide/section-media.html
View File

@@ -121,6 +121,7 @@
</div>
<div id="kssref-media-avatars" class="kss-section kss-section--depth-2 ">
@@ -138,6 +139,18 @@
</div>
<div class="kss-modifier__heading kss-style">
Demos
</div>
<ul class="kss__demos">
<li>
<a href="https://webslides.tv/demos/components#slide&#x3D;83" title="Quotes - Components" target="_blank">Quotes - Components</a>
</li>
<li>
<a href="https://webslides.tv/demos/components#slide&#x3D;112" title="Avatars - Components" target="_blank">Avatars - Components</a>
</li>
</ul>
<div class="kss-modifier__wrapper">
<div class="kss-modifier__heading kss-style">
Example
@@ -145,12 +158,12 @@
<div class="kss-modifier__example">
<img src="http://lorempixel.com/output/people-q-c-200-200-7.jpg" class="avatar-40" />
<img src="http://lorempixel.com/output/people-q-c-200-200-7.jpg" class="avatar-48" />
<img src="http://lorempixel.com/output/people-q-c-200-200-7.jpg" class="avatar-56" />
<img src="http://lorempixel.com/output/people-q-c-200-200-7.jpg" class="avatar-64" />
<img src="http://lorempixel.com/output/people-q-c-200-200-7.jpg" class="avatar-72" />
<img src="http://lorempixel.com/output/people-q-c-200-200-7.jpg" class="avatar-80" />
<img src="http://lorempixel.com/output/people-q-c-200-200-9.jpg" class="avatar-40" />
<img src="http://lorempixel.com/output/people-q-c-200-200-9.jpg" class="avatar-48" />
<img src="http://lorempixel.com/output/people-q-c-200-200-9.jpg" class="avatar-56" />
<img src="http://lorempixel.com/output/people-q-c-200-200-9.jpg" class="avatar-64" />
<img src="http://lorempixel.com/output/people-q-c-200-200-9.jpg" class="avatar-72" />
<img src="http://lorempixel.com/output/people-q-c-200-200-9.jpg" class="avatar-80" />
<div class="kss-modifier__example-footer"></div>
</div>
@@ -160,12 +173,12 @@
<summary>
Markup
</summary>
<pre class="prettyprint linenums lang-html"><code data-language="html">&lt;img src&#x3D;&quot;http://lorempixel.com/output/people-q-c-200-200-7.jpg&quot; class&#x3D;&quot;avatar-40&quot; /&gt;
&lt;img src&#x3D;&quot;http://lorempixel.com/output/people-q-c-200-200-7.jpg&quot; class&#x3D;&quot;avatar-48&quot; /&gt;
&lt;img src&#x3D;&quot;http://lorempixel.com/output/people-q-c-200-200-7.jpg&quot; class&#x3D;&quot;avatar-56&quot; /&gt;
&lt;img src&#x3D;&quot;http://lorempixel.com/output/people-q-c-200-200-7.jpg&quot; class&#x3D;&quot;avatar-64&quot; /&gt;
&lt;img src&#x3D;&quot;http://lorempixel.com/output/people-q-c-200-200-7.jpg&quot; class&#x3D;&quot;avatar-72&quot; /&gt;
&lt;img src&#x3D;&quot;http://lorempixel.com/output/people-q-c-200-200-7.jpg&quot; class&#x3D;&quot;avatar-80&quot; /&gt;</code></pre>
<pre class="prettyprint linenums lang-html"><code data-language="html">&lt;img src&#x3D;&quot;http://lorempixel.com/output/people-q-c-200-200-9.jpg&quot; class&#x3D;&quot;avatar-40&quot; /&gt;
&lt;img src&#x3D;&quot;http://lorempixel.com/output/people-q-c-200-200-9.jpg&quot; class&#x3D;&quot;avatar-48&quot; /&gt;
&lt;img src&#x3D;&quot;http://lorempixel.com/output/people-q-c-200-200-9.jpg&quot; class&#x3D;&quot;avatar-56&quot; /&gt;
&lt;img src&#x3D;&quot;http://lorempixel.com/output/people-q-c-200-200-9.jpg&quot; class&#x3D;&quot;avatar-64&quot; /&gt;
&lt;img src&#x3D;&quot;http://lorempixel.com/output/people-q-c-200-200-9.jpg&quot; class&#x3D;&quot;avatar-72&quot; /&gt;
&lt;img src&#x3D;&quot;http://lorempixel.com/output/people-q-c-200-200-9.jpg&quot; class&#x3D;&quot;avatar-80&quot; /&gt;</code></pre>
</details>
<div class="kss-source kss-style">
@@ -187,6 +200,7 @@
</div>
<div id="kssref-media-background-anim" class="kss-section kss-section--depth-3 ">
@@ -200,6 +214,7 @@
</div>
<div class="kss-modifier__wrapper">
<div class="kss-modifier__heading kss-style">
Example
@@ -241,6 +256,7 @@
</div>
<div class="kss-modifier__wrapper">
<div class="kss-modifier__heading kss-style">
Example
@@ -298,6 +314,7 @@
</div>
<div class="kss-modifier__wrapper">
<div class="kss-modifier__heading kss-style">
Example
@@ -341,6 +358,7 @@
</div>
<div class="kss-modifier__wrapper">
<div class="kss-modifier__heading kss-style">
Example
@@ -388,6 +406,7 @@
</div>
<div id="kssref-media-fullscreen-embed" class="kss-section kss-section--depth-3 ">
@@ -406,6 +425,7 @@
</div>
<div class="kss-modifier__wrapper">
<div class="kss-modifier__heading kss-style">
Example
@@ -459,6 +479,7 @@
</div>
<div class="kss-modifier__wrapper">
<div class="kss-modifier__heading kss-style">
Example