andre/30-seconds-of-code
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

rebuild docs

Browse Source
This commit is contained in:
atomiks
2018-03-01 07:53:35 +11:00
parent 214775df27
commit 3a9255ef35
2 changed files with 4 additions and 4 deletions
Download Patch File Download Diff File Expand all files Collapse all files

6
docs/4d4edbda57043aeeabeac31d2dd12d0d.js
View File

File diff suppressed because one or more lines are too long

2
docs/index.html
View File

@ -1,4 +1,4 @@
<!DOCTYPE html> <html lang="en"> <head> <meta charset="utf-8"> <meta name="viewport" content="width=device-width,initial-scale=1"> <title>30 Seconds of CSS</title> <link rel="icon" type="image/png" sizes="32x32" href="cf2ed1ce6be4ba59eed1079db594cc6e.png"> <script src="4d4edbda57043aeeabeac31d2dd12d0d.js" defer=""></script> <script async="" defer="" src="https://buttons.github.io/buttons.js"></script> <link rel="stylesheet" href="4d4edbda57043aeeabeac31d2dd12d0d.css"></head> <body> <button class="back-to-top-button" aria-label="back to top">↑</button> <nav class="sidebar" aria-label="Table of Contents"> <button class="hamburger hamburger--spin sidebar__menu" type="button" aria-label="Menu"> <span class="hamburger-box"> <span class="hamburger-inner"></span> </span> </button> <div class="sidebar__links"> <a class="sidebar__link" href="#clearfix">Clearfix</a> <a class="sidebar__link" href="#constant-width-to-height-ratio">Constant width to height ratio</a> <a class="sidebar__link" href="#custom-text-selection">Custom text selection</a> <a class="sidebar__link" href="#disable-selection">Disable selection</a> <a class="sidebar__link" href="#donut-spinner">Donut spinner</a> <a class="sidebar__link" href="#easing-variables">Easing variables</a> <a class="sidebar__link" href="#etched-text">Etched text</a> <a class="sidebar__link" href="#gradient-text">Gradient text</a> <a class="sidebar__link" href="#hairline-border">Hairline border</a> <a class="sidebar__link" href="#horizontal-and-vertical-centering">Horizontal and vertical centering</a> <a class="sidebar__link" href="#mouse-cursor-gradient-tracking">Mouse cursor gradient tracking</a> <a class="sidebar__link" href="#overflow-scroll-gradient">Overflow scroll gradient</a> <a class="sidebar__link" href="#popout-menu">Popout menu</a> <a class="sidebar__link" href="#pretty-text-underline">Pretty text underline</a> <a class="sidebar__link" href="#shape-separator">Shape separator</a> <a class="sidebar__link" href="#system-font-stack">System font stack</a> <a class="sidebar__link" href="#triangle">Triangle</a> <a class="sidebar__link" href="#truncate-text">Truncate text</a> </div> </nav> <div class="content-wrapper"> <header class="header"> <div class="container"> <img class="header__logo" draggable="false" src="76f3fcef6c36c4d7c29fc6fcd102dfe3.png"> <h1 class="header__heading">30 Seconds of <strong class="header__css">CSS</strong></h1> <p class="header__description"> A curated collection of useful CSS snippets you can understand in 30 seconds or less. </p> <a class="github-button header__github-button" href="https://github.com/atomiks/30-seconds-of-css" data-icon="octicon-star" data-size="large" data-show-count="true" aria-label="Star atomiks/30-seconds-of-css on GitHub">Star</a> </div> </header> <main class="main" id="main"> <div class="container"> <div class="snippet"> <h3 id="clearfix">Clearfix</h3> <p>Ensures that an element self-clears its children.</p> <h6 data-type="Note: This is only useful if you are still using float to build layouts. Please consider using a modern approach with flexbox layout or grid layout.">Note: This is only useful if you are still using float to build layouts. Please consider using a modern approach with flexbox layout or grid layout.</h6> <h4 data-type="HTML">HTML</h4><pre><code class="lang-html">&lt;div class="clearfix"&gt;
<!DOCTYPE html> <html lang="en"> <head> <meta charset="utf-8"> <meta name="viewport" content="width=device-width,initial-scale=1"> <title>30 Seconds of CSS</title> <meta name="description" content="A curated collection of useful CSS snippets you can understand in 30 seconds or less. From foundational elements such as clearfix to gradient text color and gradient cursor tracking to CSS easing and far beyond."> <link rel="icon" type="image/png" sizes="32x32" href="cf2ed1ce6be4ba59eed1079db594cc6e.png"> <script src="4d4edbda57043aeeabeac31d2dd12d0d.js" defer=""></script> <script async="" defer="" src="https://buttons.github.io/buttons.js"></script> <link rel="stylesheet" href="4d4edbda57043aeeabeac31d2dd12d0d.css"></head> <body> <button class="back-to-top-button" aria-label="back to top">↑</button> <nav class="sidebar" aria-label="Table of Contents"> <button class="hamburger hamburger--spin sidebar__menu" type="button" aria-label="Menu"> <span class="hamburger-box"> <span class="hamburger-inner"></span> </span> </button> <div class="sidebar__links"> <a class="sidebar__link" href="#clearfix">Clearfix</a> <a class="sidebar__link" href="#constant-width-to-height-ratio">Constant width to height ratio</a> <a class="sidebar__link" href="#custom-text-selection">Custom text selection</a> <a class="sidebar__link" href="#disable-selection">Disable selection</a> <a class="sidebar__link" href="#donut-spinner">Donut spinner</a> <a class="sidebar__link" href="#easing-variables">Easing variables</a> <a class="sidebar__link" href="#etched-text">Etched text</a> <a class="sidebar__link" href="#gradient-text">Gradient text</a> <a class="sidebar__link" href="#hairline-border">Hairline border</a> <a class="sidebar__link" href="#horizontal-and-vertical-centering">Horizontal and vertical centering</a> <a class="sidebar__link" href="#mouse-cursor-gradient-tracking">Mouse cursor gradient tracking</a> <a class="sidebar__link" href="#overflow-scroll-gradient">Overflow scroll gradient</a> <a class="sidebar__link" href="#popout-menu">Popout menu</a> <a class="sidebar__link" href="#pretty-text-underline">Pretty text underline</a> <a class="sidebar__link" href="#shape-separator">Shape separator</a> <a class="sidebar__link" href="#system-font-stack">System font stack</a> <a class="sidebar__link" href="#triangle">Triangle</a> <a class="sidebar__link" href="#truncate-text">Truncate text</a> </div> </nav> <div class="content-wrapper"> <header class="header"> <div class="container"> <img class="header__logo" draggable="false" src="76f3fcef6c36c4d7c29fc6fcd102dfe3.png"> <h1 class="header__heading">30 Seconds of <strong class="header__css">CSS</strong></h1> <p class="header__description"> A curated collection of useful CSS snippets you can understand in 30 seconds or less. </p> <a class="github-button header__github-button" href="https://github.com/atomiks/30-seconds-of-css" data-icon="octicon-star" data-size="large" data-show-count="true" aria-label="Star atomiks/30-seconds-of-css on GitHub">Star</a> </div> </header> <main class="main" id="main"> <div class="container"> <div class="snippet"> <h3 id="clearfix">Clearfix</h3> <p>Ensures that an element self-clears its children.</p> <h6 data-type="Note: This is only useful if you are still using float to build layouts. Please consider using a modern approach with flexbox layout or grid layout.">Note: This is only useful if you are still using float to build layouts. Please consider using a modern approach with flexbox layout or grid layout.</h6> <h4 data-type="HTML">HTML</h4><pre><code class="lang-html">&lt;div class="clearfix"&gt;
&lt;div class="floated"&gt;float a&lt;/div&gt;
&lt;div class="floated"&gt;float b&lt;/div&gt;
&lt;div class="floated"&gt;float c&lt;/div&gt;