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

kss - styles organization

Browse Source
This commit is contained in:
Luis Sacristán
2017-09-29 23:57:24 +02:00
parent 2bc4e0e714
commit 4df45aaa60
172 changed files with 5865 additions and 19783 deletions
Download Patch File Download Diff File Expand all files Collapse all files

958
doc/styleguide/section-typography.html
View File

@@ -1,958 +0,0 @@
<!DOCTYPE html>
<html class="no-js" lang="en">
<head>
<meta charset="utf-8">
<title>WebSlides - Documentation 1.5.0</title>
<meta name="description" content="">
<meta name="generator" content="kss-node">
<meta name="viewport" content="width=device-width">
<link rel="stylesheet" href="kss-assets/kss.css">
<link rel="stylesheet" href="../../static/css/webslides.css">
</head>
<body id="kss-node" >
<header class="kss-header">
<h1 class="kss-doc-title"><img src="../../static/images/favicons/favicon.svg" alt="WebSlides - Documentation 1.5.0" /></h1>
<nav class="kss-header-nav">
<ul>
<li><a href="../../index.html" target="_blank">WebSlides</a></li>
<li><a href="./" target="_blank">Documentation</a></li>
<li><a href=".../demos/index.html" target="_blank">Demos</a></li>
</ul>
</nav>
</header>
<div class="kss-sub-header">
<p>WebSlides - Documentation 1.5.0</p>
</div>
<div class="kss-container">
<div class="kss-sidebar kss-style">
<nav class="kss-nav">
<ul class="kss-nav__menu">
<li class="kss-nav__menu-item">
<a class="kss-nav__menu-link kss-nav__menu-link-activefalse" href="./">
<span class="kss-nav__name">Introduction</span>
</a>
</li>
<li class="kss-nav__menu-item ">
<a class="kss-nav__menu-link " href="section-avatars.html">
<span class="kss-nav__name">Avatars</span>
</a>
</li>
<li class="kss-nav__menu-item ">
<a class="kss-nav__menu-link " href="section-badgets.html">
<span class="kss-nav__name">Badges</span>
</a>
</li>
<li class="kss-nav__menu-item kss-nav-has-children">
<a class="kss-nav__menu-link " href="section-base.html">
<span class="kss-nav__name">Base</span>
</a>
</li>
<li class="kss-nav__menu-item kss-nav-has-children">
<a class="kss-nav__menu-link " href="section-blocks.html">
<span class="kss-nav__name">Blocks</span>
</a>
</li>
<li class="kss-nav__menu-item ">
<a class="kss-nav__menu-link " href="section-buttons.html">
<span class="kss-nav__name">Buttons</span>
</a>
</li>
<li class="kss-nav__menu-item ">
<a class="kss-nav__menu-link " href="section-cards.html">
<span class="kss-nav__name">Cards</span>
</a>
</li>
<li class="kss-nav__menu-item kss-nav-has-children">
<a class="kss-nav__menu-link " href="section-content.html">
<span class="kss-nav__name">Content</span>
</a>
</li>
<li class="kss-nav__menu-item kss-nav-has-children">
<a class="kss-nav__menu-link " href="section-elements.html">
<span class="kss-nav__name">Elements</span>
</a>
</li>
<li class="kss-nav__menu-item kss-nav-has-children">
<a class="kss-nav__menu-link " href="section-flexblock.html">
<span class="kss-nav__name">Flexblock</span>
</a>
</li>
<li class="kss-nav__menu-item kss-nav-has-children">
<a class="kss-nav__menu-link " href="section-forms.html">
<span class="kss-nav__name">Forms</span>
</a>
</li>
<li class="kss-nav__menu-item ">
<a class="kss-nav__menu-link " href="section-grid.html">
<span class="kss-nav__name">Grid</span>
</a>
</li>
<li class="kss-nav__menu-item kss-nav-has-children">
<a class="kss-nav__menu-link " href="section-layout.html">
<span class="kss-nav__name">Layout</span>
</a>
</li>
<li class="kss-nav__menu-item ">
<a class="kss-nav__menu-link " href="section-longform.html">
<span class="kss-nav__name">Longform</span>
</a>
</li>
<li class="kss-nav__menu-item kss-nav-has-children">
<a class="kss-nav__menu-link " href="section-media.html">
<span class="kss-nav__name">Media</span>
</a>
</li>
<li class="kss-nav__menu-item ">
<a class="kss-nav__menu-link " href="section-navigation.html">
<span class="kss-nav__name">Navigation</span>
</a>
</li>
<li class="kss-nav__menu-item ">
<a class="kss-nav__menu-link " href="section-screenshots.html">
<span class="kss-nav__name">Screenshots</span>
</a>
</li>
<li class="kss-nav__menu-item kss-nav-has-children">
<a class="kss-nav__menu-link " href="section-slide.html">
<span class="kss-nav__name">Slide</span>
</a>
</li>
<li class="kss-nav__menu-item kss-nav-has-children">
<a class="kss-nav__menu-link " href="section-slides.html">
<span class="kss-nav__name">fullscreen</span>
</a>
</li>
<li class="kss-nav__menu-item kss-nav-has-children">
<a class="kss-nav__menu-link " href="section-slides.html">
<span class="kss-nav__name">Slides</span>
</a>
</li>
<li class="kss-nav__menu-item kss-nav-has-children">
<a class="kss-nav__menu-link kss-nav__menu-link-active" href="section-typography.html">
<span class="kss-nav__name">Typography</span>
</a>
<ul class="kss-nav__menu-child">
<li class="kss-nav__menu-item">
<a class="kss-nav__menu-link kss-nav__ref " href="section-typography.html#kssref-typography-columns">
<span class="kss-nav__name">Columns</span>
</a>
</li>
<li class="kss-nav__menu-item">
<a class="kss-nav__menu-link kss-nav__ref " href="section-typography.html#kssref-typography-context">
<span class="kss-nav__name">Context</span>
</a>
</li>
<li class="kss-nav__menu-item">
<a class="kss-nav__menu-link kss-nav__ref " href="section-typography.html#kssref-typography-data">
<span class="kss-nav__name">Data</span>
</a>
</li>
<li class="kss-nav__menu-item">
<a class="kss-nav__menu-link kss-nav__ref " href="section-typography.html#kssref-typography-emoji">
<span class="kss-nav__name">Emoji</span>
</a>
</li>
<li class="kss-nav__menu-item">
<a class="kss-nav__menu-link kss-nav__ref " href="section-typography.html#kssref-typography-info">
<span class="kss-nav__name">Info Messages</span>
</a>
</li>
<li class="kss-nav__menu-item">
<a class="kss-nav__menu-link kss-nav__ref " href="section-typography.html#kssref-typography-interviews">
<span class="kss-nav__name">Interviews</span>
</a>
</li>
<li class="kss-nav__menu-item">
<a class="kss-nav__menu-link kss-nav__ref " href="section-typography.html#kssref-typography-intro">
<span class="kss-nav__name">Intro</span>
</a>
</li>
<li class="kss-nav__menu-item">
<a class="kss-nav__menu-link kss-nav__ref " href="section-typography.html#kssref-typography-label">
<span class="kss-nav__name">Label</span>
</a>
</li>
<li class="kss-nav__menu-item">
<a class="kss-nav__menu-link kss-nav__ref " href="section-typography.html#kssref-typography-landings">
<span class="kss-nav__name">Landings</span>
</a>
</li>
<li class="kss-nav__menu-item">
<a class="kss-nav__menu-link kss-nav__ref " href="section-typography.html#kssref-typography-lowercase">
<span class="kss-nav__name">Lowercase</span>
</a>
</li>
<li class="kss-nav__menu-item">
<a class="kss-nav__menu-link kss-nav__ref " href="section-typography.html#kssref-typography-pull_quote">
<span class="kss-nav__name">Pull Quote</span>
</a>
</li>
<li class="kss-nav__menu-item">
<a class="kss-nav__menu-link kss-nav__ref " href="section-typography.html#kssref-typography-separator">
<span class="kss-nav__name">Separator</span>
</a>
</li>
<li class="kss-nav__menu-item">
<a class="kss-nav__menu-link kss-nav__ref " href="section-typography.html#kssref-typography-serif">
<span class="kss-nav__name">Serif</span>
</a>
</li>
<li class="kss-nav__menu-item">
<a class="kss-nav__menu-link kss-nav__ref " href="section-typography.html#kssref-typography-subtitle">
<span class="kss-nav__name">Subtitule</span>
</a>
</li>
<li class="kss-nav__menu-item">
<a class="kss-nav__menu-link kss-nav__ref " href="section-typography.html#kssref-typography-symbols">
<span class="kss-nav__name">Symbols</span>
</a>
</li>
<li class="kss-nav__menu-item">
<a class="kss-nav__menu-link kss-nav__ref " href="section-typography.html#kssref-typography-uppercase">
<span class="kss-nav__name">Uppercase</span>
</a>
</li>
</ul>
</li>
</ul>
</nav>
</div>
<div role="main" class="kss-main">
<div id="kssref-typography" class="kss-section kss-section--depth-1 ">
<div class="kss-style">
<h1 class="kss-title kss-title--level-1">
<a class="kss-title__permalink" href="#kssref-typography">
Typography
</a>
</h1>
</div>
</div>
<div id="kssref-typography-columns" class="kss-section kss-section--depth-2 ">
<div class="kss-style">
<h2 class="kss-title kss-title--level-2">
<a class="kss-title__permalink" href="#kssref-typography-columns">
Columns
</a>
</h2>
<div class="kss-description">
<p>Magazine Two Columns</p>
</div>
</div>
<div class="kss-modifier__wrapper">
<div class="kss-modifier__heading kss-style">
Example
</div>
<div class="kss-modifier__example">
<div class="text-cols"><p><strong>Column 1</strong> text</p><p><strong>Column 2</strong> text</p></div>
<div class="kss-modifier__example-footer"></div>
</div>
</div>
<details class="kss-markup kss-style">
<summary>
Markup
</summary>
<pre class="prettyprint linenums lang-html"><code data-language="html">&lt;div class&#x3D;&quot;text-cols&quot;&gt;&lt;p&gt;&lt;strong&gt;Column 1&lt;/strong&gt; text&lt;/p&gt;&lt;p&gt;&lt;strong&gt;Column 2&lt;/strong&gt; text&lt;/p&gt;&lt;/div&gt;</code></pre>
</details>
<div class="kss-source kss-style">
Source: <code>_typography.scss</code>, line 346
</div>
</div>
<div id="kssref-typography-context" class="kss-section kss-section--depth-2 ">
<div class="kss-style">
<h2 class="kss-title kss-title--level-2">
<a class="kss-title__permalink" href="#kssref-typography-context">
Context
</a>
</h2>
<div class="kss-description">
<p>Heading with border</p>
</div>
</div>
<div class="kss-modifier__wrapper">
<div class="kss-modifier__heading kss-style">
Example
</div>
<div class="kss-modifier__example">
<p class="text-context">Why WebSlides?</p>
<div class="kss-modifier__example-footer"></div>
</div>
</div>
<details class="kss-markup kss-style">
<summary>
Markup
</summary>
<pre class="prettyprint linenums lang-html"><code data-language="html">&lt;p class&#x3D;&quot;text-context&quot;&gt;Why WebSlides?&lt;/p&gt;</code></pre>
</details>
<div class="kss-source kss-style">
Source: <code>_typography.scss</code>, line 376
</div>
</div>
<div id="kssref-typography-data" class="kss-section kss-section--depth-2 ">
<div class="kss-style">
<h2 class="kss-title kss-title--level-2">
<a class="kss-title__permalink" href="#kssref-typography-data">
Data
</a>
</h2>
<div class="kss-description">
<p>Numbers (results, sales... )-</p>
</div>
</div>
<div class="kss-modifier__wrapper">
<div class="kss-modifier__heading kss-style">
Example
</div>
<div class="kss-modifier__example">
<p class="text-data">23,478,289</p>
<div class="kss-modifier__example-footer"></div>
</div>
</div>
<details class="kss-markup kss-style">
<summary>
Markup
</summary>
<pre class="prettyprint linenums lang-html"><code data-language="html">&lt;p class&#x3D;&quot;text-data&quot;&gt;23,478,289&lt;/p&gt;</code></pre>
</details>
<div class="kss-source kss-style">
Source: <code>_typography.scss</code>, line 314
</div>
</div>
<div id="kssref-typography-emoji" class="kss-section kss-section--depth-2 ">
<div class="kss-style">
<h2 class="kss-title kss-title--level-2">
<a class="kss-title__permalink" href="#kssref-typography-emoji">
Emoji
</a>
</h2>
<div class="kss-description">
<p>You&#39;ll love this</p>
</div>
</div>
<div class="kss-modifier__wrapper">
<div class="kss-modifier__heading kss-style">
Example
</div>
<div class="kss-modifier__example">
<p class="text-emoji">😀😁😂😅😉😋😎😍</p>
<div class="kss-modifier__example-footer"></div>
</div>
</div>
<details class="kss-markup kss-style">
<summary>
Markup
</summary>
<pre class="prettyprint linenums lang-html"><code data-language="html">&lt;p class&#x3D;&quot;text-emoji&quot;&gt;😀😁😂😅😉😋😎😍&lt;/p&gt;</code></pre>
</details>
<div class="kss-source kss-style">
Source: <code>_typography.scss</code>, line 296
</div>
</div>
<div id="kssref-typography-info" class="kss-section kss-section--depth-2 ">
<div class="kss-style">
<h2 class="kss-title kss-title--level-2">
<a class="kss-title__permalink" href="#kssref-typography-info">
Info Messages
</a>
</h2>
<div class="kss-description">
<p>Error, warning, success...</p>
</div>
</div>
<div class="kss-modifier__wrapper">
<div class="kss-modifier__heading kss-style">
Example
</div>
<div class="kss-modifier__example">
<p class="text-info">Psychiatrists have long debated whether it really exists.</p>
<div class="kss-modifier__example-footer"></div>
</div>
</div>
<details class="kss-markup kss-style">
<summary>
Markup
</summary>
<pre class="prettyprint linenums lang-html"><code data-language="html">&lt;p class&#x3D;&quot;text-info&quot;&gt;Psychiatrists have long debated whether it really exists.&lt;/p&gt;</code></pre>
</details>
<div class="kss-source kss-style">
Source: <code>_typography.scss</code>, line 546
</div>
</div>
<div id="kssref-typography-interviews" class="kss-section kss-section--depth-2 ">
<div class="kss-style">
<h2 class="kss-title kss-title--level-2">
<a class="kss-title__permalink" href="#kssref-typography-interviews">
Interviews
</a>
</h2>
<div class="kss-description">
<p>Questions &amp; Answers</p>
</div>
</div>
<div class="kss-modifier__wrapper">
<div class="kss-modifier__heading kss-style">
Example
</div>
<div class="kss-modifier__example">
<dl class="text-interview">
<dt>Driftwood</dt>
<dd>
<p>It says, "The party of the first part shall be known in this contract as the party of the first part." How do you like that? That's pretty neat, eh?</p>
</dd>
<dt>Fiorello</dt>
<dd>
<p>No. It's no good.</p>
</dd>
<dt>Driftwood</dt>
<dd>
<p>What's the matter with it?</p>
</dd>
<dt>Fiorello</dt>
<dd>
<p>I don't know, let's hear it again.</p>
</dd>
</dl>
<div class="kss-modifier__example-footer"></div>
</div>
</div>
<details class="kss-markup kss-style">
<summary>
Markup
</summary>
<pre class="prettyprint linenums lang-html"><code data-language="html">&lt;dl class&#x3D;&quot;text-interview&quot;&gt;
&lt;dt&gt;Driftwood&lt;/dt&gt;
&lt;dd&gt;
&lt;p&gt;It says, &quot;The party of the first part shall be known in this contract as the party of the first part.&quot; How do you like that? That&#x27;s pretty neat, eh?&lt;/p&gt;
&lt;/dd&gt;
&lt;dt&gt;Fiorello&lt;/dt&gt;
&lt;dd&gt;
&lt;p&gt;No. It&#x27;s no good.&lt;/p&gt;
&lt;/dd&gt;
&lt;dt&gt;Driftwood&lt;/dt&gt;
&lt;dd&gt;
&lt;p&gt;What&#x27;s the matter with it?&lt;/p&gt;
&lt;/dd&gt;
&lt;dt&gt;Fiorello&lt;/dt&gt;
&lt;dd&gt;
&lt;p&gt;I don&#x27;t know, let&#x27;s hear it again.&lt;/p&gt;
&lt;/dd&gt;
&lt;/dl&gt;</code></pre>
</details>
<div class="kss-source kss-style">
Source: <code>_typography.scss</code>, line 504
</div>
</div>
<div id="kssref-typography-intro" class="kss-section kss-section--depth-2 ">
<div class="kss-style">
<h2 class="kss-title kss-title--level-2">
<a class="kss-title__permalink" href="#kssref-typography-intro">
Intro
</a>
</h2>
<div class="kss-description">
<p>Typography Classes = .text-</p>
</div>
</div>
<div class="kss-modifier__wrapper">
<div class="kss-modifier__heading kss-style">
Example
</div>
<div class="kss-modifier__example">
<p class="text-intro">Create a simple web presence.</p>
<div class="kss-modifier__example-footer"></div>
</div>
</div>
<details class="kss-markup kss-style">
<summary>
Markup
</summary>
<pre class="prettyprint linenums lang-html"><code data-language="html">&lt;p class&#x3D;&quot;text-intro&quot;&gt;Create a simple web presence.&lt;/p&gt;</code></pre>
</details>
<div class="kss-source kss-style">
Source: <code>_typography.scss</code>, line 206
</div>
</div>
<div id="kssref-typography-label" class="kss-section kss-section--depth-2 ">
<div class="kss-style">
<h2 class="kss-title kss-title--level-2">
<a class="kss-title__permalink" href="#kssref-typography-label">
Label
</a>
</h2>
</div>
<div class="kss-modifier__wrapper">
<div class="kss-modifier__heading kss-style">
Example
</div>
<div class="kss-modifier__example">
<p><span class="text-label">Website:</span> <a href="#">http://webslides.tv</a></p>
<div class="kss-modifier__example-footer"></div>
</div>
</div>
<details class="kss-markup kss-style">
<summary>
Markup
</summary>
<pre class="prettyprint linenums lang-html"><code data-language="html">&lt;p&gt;&lt;span class&#x3D;&quot;text-label&quot;&gt;Website:&lt;/span&gt; &lt;a href&#x3D;&quot;#&quot;&gt;http://webslides.tv&lt;/a&gt;&lt;/p&gt;</code></pre>
</details>
<div class="kss-source kss-style">
Source: <code>_typography.scss</code>, line 333
</div>
</div>
<div id="kssref-typography-landings" class="kss-section kss-section--depth-2 ">
<div class="kss-style">
<h2 class="kss-title kss-title--level-2">
<a class="kss-title__permalink" href="#kssref-typography-landings">
Landings
</a>
</h2>
<div class="kss-description">
<p>h1,h2... Promo/Landings</p>
</div>
</div>
<div class="kss-modifier__wrapper">
<div class="kss-modifier__heading kss-style">
Example
</div>
<div class="kss-modifier__example">
<h1 class="text-landing">Landings</h1>
<div class="kss-modifier__example-footer"></div>
</div>
</div>
<details class="kss-markup kss-style">
<summary>
Markup
</summary>
<pre class="prettyprint linenums lang-html"><code data-language="html">&lt;h1 class&#x3D;&quot;text-landing&quot;&gt;Landings&lt;/h1&gt;</code></pre>
</details>
<div class="kss-source kss-style">
Source: <code>_typography.scss</code>, line 233
</div>
</div>
<div id="kssref-typography-lowercase" class="kss-section kss-section--depth-2 ">
<div class="kss-style">
<h2 class="kss-title kss-title--level-2">
<a class="kss-title__permalink" href="#kssref-typography-lowercase">
Lowercase
</a>
</h2>
</div>
<div class="kss-modifier__wrapper">
<div class="kss-modifier__heading kss-style">
Example
</div>
<div class="kss-modifier__example">
<p class="text-lowercase">Create a simple web presence.</p>
<div class="kss-modifier__example-footer"></div>
</div>
</div>
<details class="kss-markup kss-style">
<summary>
Markup
</summary>
<pre class="prettyprint linenums lang-html"><code data-language="html">&lt;p class&#x3D;&quot;text-lowercase&quot;&gt;Create a simple web presence.&lt;/p&gt;</code></pre>
</details>
<div class="kss-source kss-style">
Source: <code>_typography.scss</code>, line 286
</div>
</div>
<div id="kssref-typography-pull_quote" class="kss-section kss-section--depth-2 ">
<div class="kss-style">
<h2 class="kss-title kss-title--level-2">
<a class="kss-title__permalink" href="#kssref-typography-pull_quote">
Pull Quote
</a>
</h2>
<div class="kss-description">
<p>Pull Quote Right/Left</p>
</div>
</div>
<div class="kss-modifier__wrapper">
<div class="kss-modifier__heading kss-style">
Example
</div>
<div class="kss-modifier__example">
<p>Imagine that you are in Florence. If you suddenly start to feel that you literally cannot breathe, you may be experiencing Stendhal Syndrome.</p>
<p class="text-pull-right">Psychiatrists have long debated whether it really exists.</p>
<p>Imagine that you are in Florence. If you suddenly start to feel that you literally cannot breathe, you may be experiencing Stendhal Syndrome.</p>
<p class="text-pull-left">Psychiatrists have long debated whether it really exists.</p>
<div class="kss-modifier__example-footer"></div>
</div>
</div>
<details class="kss-markup kss-style">
<summary>
Markup
</summary>
<pre class="prettyprint linenums lang-html"><code data-language="html">&lt;p&gt;Imagine that you are in Florence. If you suddenly start to feel that you literally cannot breathe, you may be experiencing Stendhal Syndrome.&lt;/p&gt;
&lt;p class&#x3D;&quot;text-pull-right&quot;&gt;Psychiatrists have long debated whether it really exists.&lt;/p&gt;
&lt;p&gt;Imagine that you are in Florence. If you suddenly start to feel that you literally cannot breathe, you may be experiencing Stendhal Syndrome.&lt;/p&gt;
&lt;p class&#x3D;&quot;text-pull-left&quot;&gt;Psychiatrists have long debated whether it really exists.&lt;/p&gt;</code></pre>
</details>
<div class="kss-source kss-style">
Source: <code>_typography.scss</code>, line 449
</div>
</div>
<div id="kssref-typography-separator" class="kss-section kss-section--depth-2 ">
<div class="kss-style">
<h2 class="kss-title kss-title--level-2">
<a class="kss-title__permalink" href="#kssref-typography-separator">
Separator
</a>
</h2>
<div class="kss-description">
<p>Stars <em> </em> *</p>
</div>
</div>
<div class="kss-modifier__wrapper">
<div class="kss-modifier__heading kss-style">
Example
</div>
<div class="kss-modifier__example">
<p class="text-separator">Separator</p>
<div class="kss-modifier__example-footer"></div>
</div>
</div>
<details class="kss-markup kss-style">
<summary>
Markup
</summary>
<pre class="prettyprint linenums lang-html"><code data-language="html">&lt;p class&#x3D;&quot;text-separator&quot;&gt;Separator&lt;/p&gt;</code></pre>
</details>
<div class="kss-source kss-style">
Source: <code>_typography.scss</code>, line 418
</div>
</div>
<div id="kssref-typography-serif" class="kss-section kss-section--depth-2 ">
<div class="kss-style">
<h2 class="kss-title kss-title--level-2">
<a class="kss-title__permalink" href="#kssref-typography-serif">
Serif
</a>
</h2>
<div class="kss-description">
<p>Maitree font</p>
</div>
</div>
<div class="kss-modifier__wrapper">
<div class="kss-modifier__heading kss-style">
Example
</div>
<div class="kss-modifier__example">
<p class="text-serif">Create a simple web presence.</p>
<div class="kss-modifier__example-footer"></div>
</div>
</div>
<details class="kss-markup kss-style">
<summary>
Markup
</summary>
<pre class="prettyprint linenums lang-html"><code data-language="html">&lt;p class&#x3D;&quot;text-serif&quot;&gt;Create a simple web presence.&lt;/p&gt;</code></pre>
</details>
<div class="kss-source kss-style">
Source: <code>_typography.scss</code>, line 220
</div>
</div>
<div id="kssref-typography-subtitle" class="kss-section kss-section--depth-2 ">
<div class="kss-style">
<h2 class="kss-title kss-title--level-2">
<a class="kss-title__permalink" href="#kssref-typography-subtitle">
Subtitule
</a>
</h2>
<div class="kss-description">
<p>Subtitle (Before h1, h2)</p>
</div>
</div>
<div class="kss-modifier__wrapper">
<div class="kss-modifier__heading kss-style">
Example
</div>
<div class="kss-modifier__example">
<p class="text-subtitle">Powered by <a href="#">#WebSlides</a> <code>.text-subtitle</code></p>
<div class="kss-modifier__example-footer"></div>
</div>
</div>
<details class="kss-markup kss-style">
<summary>
Markup
</summary>
<pre class="prettyprint linenums lang-html"><code data-language="html">&lt;p class&#x3D;&quot;text-subtitle&quot;&gt;Powered by &lt;a href&#x3D;&quot;#&quot;&gt;#WebSlides&lt;/a&gt; &lt;code&gt;.text-subtitle&lt;/code&gt;&lt;/p&gt;</code></pre>
</details>
<div class="kss-source kss-style">
Source: <code>_typography.scss</code>, line 250
</div>
</div>
<div id="kssref-typography-symbols" class="kss-section kss-section--depth-2 ">
<div class="kss-style">
<h2 class="kss-title kss-title--level-2">
<a class="kss-title__permalink" href="#kssref-typography-symbols">
Symbols
</a>
</h2>
<div class="kss-description">
<p>Stars <em> </em> *</p>
</div>
</div>
<div class="kss-modifier__wrapper">
<div class="kss-modifier__heading kss-style">
Example
</div>
<div class="kss-modifier__example">
<p class="text-symbols">* * *</p>
<div class="kss-modifier__example-footer"></div>
</div>
</div>
<details class="kss-markup kss-style">
<summary>
Markup
</summary>
<pre class="prettyprint linenums lang-html"><code data-language="html">&lt;p class&#x3D;&quot;text-symbols&quot;&gt;* * *&lt;/p&gt;</code></pre>
</details>
<div class="kss-source kss-style">
Source: <code>_typography.scss</code>, line 404
</div>
</div>
<div id="kssref-typography-uppercase" class="kss-section kss-section--depth-2 ">
<div class="kss-style">
<h2 class="kss-title kss-title--level-2">
<a class="kss-title__permalink" href="#kssref-typography-uppercase">
Uppercase
</a>
</h2>
</div>
<div class="kss-modifier__wrapper">
<div class="kss-modifier__heading kss-style">
Example
</div>
<div class="kss-modifier__example">
<p class="text-uppercase">Create a simple web presence.</p>
<div class="kss-modifier__example-footer"></div>
</div>
</div>
<details class="kss-markup kss-style">
<summary>
Markup
</summary>
<pre class="prettyprint linenums lang-html"><code data-language="html">&lt;p class&#x3D;&quot;text-uppercase&quot;&gt;Create a simple web presence.&lt;/p&gt;</code></pre>
</details>
<div class="kss-source kss-style">
Source: <code>_typography.scss</code>, line 276
</div>
</div>
</div>
</div>
<!-- SCRIPTS -->
<script src="kss-assets/kss.js"></script>
<script src="kss-assets/scrollspy.js"></script>
<script src="kss-assets/prettify.js"></script>
<script src="kss-assets/kss-fullscreen.js"></script>
<script src="kss-assets/kss-guides.js"></script>
<script src="kss-assets/kss-markup.js"></script>
<script>
prettyPrint();
var spy = new ScrollSpy('#kss-node', {
nav: '.kss-nav__menu-child > li > a',
className: 'is-in-viewport'
});
var kssFullScreen = new KssFullScreen({
idPrefix: 'kss-fullscreen-',
bodyClass: 'kss-fullscreen-mode',
elementClass: 'is-fullscreen'
});
var kssGuides = new KssGuides({
bodyClass: 'kss-guides-mode'
});
var kssMarkup = new KssMarkup({
bodyClass: 'kss-markup-mode',
detailsClass: 'kss-markup'
});
</script>
<!-- Automatically built using <a href="https://github.com/kss-node/kss-node">kss-node</a>. -->
</body>
</html>