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-04 14:29:24 +10:00
parent 65edc80530
commit 8802781f4a
4 changed files with 69 additions and 18 deletions
Download Patch File Download Diff File Expand all files Collapse all files

30
docs/3df57813b7ec2de885ea6075ff46ed46.js
View File

File diff suppressed because one or more lines are too long

13
docs/index.html
View File

File diff suppressed because one or more lines are too long

42
index.html
View File

@ -37,6 +37,7 @@
<a class="sidebar__link" href="#hairline-border"><span>Hairline border</span></a>
<a class="sidebar__link" href="#overflow-scroll-gradient"><span>Overflow scroll gradient</span></a>
<a class="sidebar__link" href="#pretty-text-underline"><span>Pretty text underline</span></a>
<a class="sidebar__link" href="#reset-all-styles"><span>Reset all styles</span></a>
<a class="sidebar__link" href="#shape-separator"><span>Shape separator</span></a>
<a class="sidebar__link" href="#system-font-stack"><span>System font stack</span></a>
<a class="sidebar__link" href="#triangle"><span>Triangle</span></a>
@ -1414,6 +1415,47 @@ var y = e.pageY - btn.offsetTop - btn.offsetParent.offsetTop
<!-- tags: visual -->
</div>
<div class="snippet">
<h3 id="reset-all-styles"><span>Reset all styles</span><span class="tags__tag snippet__tag" data-type="visual"><i data-feather="eye"></i>visual</span></h3>
<p>Resets all styles to default values with one property. This will not affect <code>direction</code> and <code>unicode-bidi</code> properties.</p>
<h4 data-type="HTML">HTML</h4><pre><code class="lang-html">&lt;div class="reset-all-styles"&gt;
&lt;h4&gt;Title&lt;/h4&gt;
&lt;p&gt;Lorem ipsum dolor sit amet consectetur adipisicing elit. Iure id exercitationem nulla qui repellat laborum vitae, molestias tempora velit natus. Quas, assumenda nisi. Quisquam enim qui iure, consequatur velit sit?&lt;/p&gt;
&lt;/div&gt;
</code></pre>
<h4 data-type="CSS">CSS</h4><pre><code class="lang-css">.reset-all-styles {
all: initial;
}
</code></pre>
<h4>Demo</h4>
<div class="snippet-demo">
<div class="snippet-demo__reset-all-styles">
<h3>Title</h3>
<p>Lorem ipsum dolor sit amet consectetur adipisicing elit. Iure id exercitationem nulla qui repellat laborum vitae, molestias tempora velit natus. Quas, assumenda nisi. Quisquam enim qui iure, consequatur velit sit?</p>
</div>
</div>
<style>
.snippet-demo__reset-all-styles {
all: initial;
}
</style>
<h4>Explanation</h4>
<p>The <code>all</code> property allows you to reset all styles (inherited or not) to default values.</p>
<h4>Browser support</h4>
<div>
<div class="snippet__browser-support">
87.5%
</div>
</div>
<p><span class="snippet__support-note">⚠️ MS Edge status is under consideration.</span></p>
<ul>
<li>
<a href="https://caniuse.com/#feat=css-all" target="_blank">https://caniuse.com/#feat=css-all</a>
</li>
</ul>
<!-- tags: visual -->
</div>
<div class="snippet">
<h3 id="shape-separator"><span>Shape separator</span><span class="tags__tag snippet__tag" data-type="visual"><i data-feather="eye"></i>visual</span></h3>
<p>Uses an SVG shape to separate two different blocks to create more a interesting visual appearance compared to standard horizontal separation.</p>

2
snippets/reset-all-styles.md
View File

@ -43,3 +43,5 @@ The `all` property allows you to reset all styles (inherited or not) to default
<span class="snippet__support-note">⚠️ MS Edge status is under consideration.</span>
* https://caniuse.com/#feat=css-all
<!-- tags: visual -->