diff options
Improve Docs homepage
1 files changed, 14 insertions, 14 deletions
| -rw-r--r-- | docs/getting-started.html | 28 |
diff --git a/docs/getting-started.html b/docs/getting-started.html index 501a5e2..a283d1a 100644 --- a/docs/getting-started.html +++ b/docs/getting-started.html @@ -6,7 +6,7 @@ <meta name="viewport" content="width=device-width, initial-scale=1.0, shrink-to-fit=no" /> <meta http-equiv="X-UA-Compatible" content="IE=edge" /> <meta name="author" content="https://github.com/picturepan2/" /> - <title>Getting started - Spectre.css</title> + <title>Getting started - Spectre.css CSS Framework</title> <link rel="stylesheet" href="dist/spectre.css" /> <link rel="stylesheet" href="dist/spectre-icons.css" /> <link rel="stylesheet" href="css/docs.css" /> @@ -15,8 +15,8 @@ <div class="s-container container"> <div class="columns"> <div class="s-brand"> - <a href="index.html" class="s-logo tooltip tooltip-bottom" data-tooltip="Spectre.css" > - <img src="img/spectre-logo.svg" alt="Spectre.css"/> + <a href="index.html" class="s-logo tooltip tooltip-bottom" data-tooltip="Spectre.css CSS Framework"> + <img src="img/spectre-logo.svg" alt="Spectre.css CSS Framework" /> <h2>Spectre.css</h2> </a> <div class="menu-btn"> @@ -253,7 +253,7 @@ <div id="content" class="s-content"> <div id="introduction" class="container"> <h3 class="s-title"><a href="#introduction" class="anchor" aria-hidden="true">#</a>Introduction</h3> - <div class="notes"> + <div class="docs-note"> <p><strong>Spectre.css</strong> is a lightweight and responsive and modern CSS framework for faster and extensible development.</p> <p>Spectre provides basic styles for typography and elements, flexbox based responsive layout system, CSS components and utilities with best practice coding and consistent design language.</p> </div> @@ -261,10 +261,10 @@ <div id="installation" class="container"> <h3 class="s-title"><a href="#installation" class="anchor" aria-hidden="true">#</a>Installation</h3> - <div class="notes"> + <div class="docs-note"> <p>There are 5 ways to get started with Spectre CSS framework in your projects. You can either install manually, from CDN or use NPM, Yarn and Bower.</p> </div> - <div class="notes"> + <div class="docs-note"> <h5>Install manually</h5> <p>Download the compiled and minified <a href="https://github.com/picturepan2/spectre/tree/master/docs/dist" target="_blank">Spectre CSS file</a> (~10KB min+gzip):</p> <p><a href="https://github.com/picturepan2/spectre/tree/master/docs/dist" target="_blank" class="btn btn-primary">Download Spectre.css</a></p> @@ -277,7 +277,7 @@ <<span class="tag">link</span> <span class="atn">rel</span>=<span class="atv">"stylesheet"</span> <span class="atn">href</span>=<span class="atv">"spectre-icons.min.css"</span> /> </code></pre> - <div class="notes"> + <div class="docs-note"> <h5>Install from CDN</h5> <p>Alternatively, you can use the <a href="https://unpkg.com/" target="_blank">unpkg</a> CDN to load compiled Spectre.css.</p> </div> @@ -286,7 +286,7 @@ <pre class="code"><code><<span class="tag">link</span> <span class="atn">rel</span>=<span class="atv">"stylesheet"</span> <span class="atn">href</span>=<span class="atv">"https://unpkg.com/spectre.css/dist/spectre.min.css"</span> /> </code></pre> - <div class="notes"> + <div class="docs-note"> <h5>Install with NPM</h5> <!-- install with npm example --> @@ -294,7 +294,7 @@ </code></pre> </div> - <div class="notes"> + <div class="docs-note"> <h5>Install with Yarn</h5> <!-- install with yarn example --> @@ -302,7 +302,7 @@ </code></pre> </div> - <div class="notes"> + <div class="docs-note"> <h5>Install with Bower</h5> <!-- install with bower example --> @@ -314,7 +314,7 @@ <div id="compiling" class="container"> <h3 class="s-title"><a href="#comiling" class="anchor" aria-hidden="true">#</a>Custom version</h3> - <div class="notes"> + <div class="docs-note"> <p>Spectre uses <a href="http://gulpjs.com/" target="_blank">Gulp</a> for compiling CSS. You can customize your version of Spectre.css by editing LESS files in <code>/src</code> directory or removing unneeded components from <code>spectre.less</code>, <code>spectre-exp.less</code> and <code>spectre-icons.less</code>.</p> <p>Then, you can build the CSS file from the command line:</p> <ol> @@ -363,7 +363,7 @@ </code></pre> <h4 id="variables" class="s-subtitle"><a href="#variables" class="anchor" aria-hidden="true">#</a>Variables</h4> - <div class="notes"> + <div class="docs-note"> <p>Spectre.css is designed with consistent design language. You can modify <code>variables.less</code> to create your new or match existing design. <h5>Colors</h5> <div class="columns"> @@ -453,7 +453,7 @@ <div id="browsers" class="container"> <h3 class="s-title"><a href="#browsers" class="anchor" aria-hidden="true">#</a>Browser support</h3> - <div class="notes"> + <div class="docs-note"> <p>Spectre uses <a href="https://github.com/postcss/autoprefixer" target="_blank">Autoprefixer</a> to make most styles compatible with earlier browsers and <a href="https://necolas.github.io/normalize.css/" target="_blank">Normalize.css</a> for CSS resets. Spectre is designed for modern browsers. For best compatibility, these browsers are recommended:</p> <ul> <li>Chrome <small class="label label-success">LAST 4</small></li> @@ -468,7 +468,7 @@ <div id="whatsnew" class="container"> <h3 class="s-title"><a href="#whatsnew" class="anchor" aria-hidden="true">#</a>What's new</h3> - <div class="notes"> + <div class="docs-note"> <p><strong>April 2017</strong></p> <ul> <li> |