mirror/mini-css
1
0
Fork 0
mirror of https://github.com/Chalarangelo/mini.css.git synced 2025-07-31 02:50:26 +02:00
Code Issues Releases Wiki Activity

Deprecated alert component (documentation)

Browse Source 
Updated documentation to reflect the fact that the alert component is now deprecated. Most things will be properly updated when the toast component is ready.
This commit is contained in:
Angelos Chalaris
2017-05-11 00:47:20 +03:00
parent 7b8ba434b5
commit 2f4d9525e4
5 changed files with 17 additions and 69 deletions
Download Patch File Download Diff File Expand all files Collapse all files

24
docs/quick_reference.html
View File

@@ -958,9 +958,10 @@
</ul>
</div>
</div>
<!-- TODO (Also remember to change the Codepen link)-->
<div class="section row">
<div class="col-sm-12 col-md-6 col-md-first col-sm-first">
<h3>Alerts <a href="https://codepen.io/chalarangelo/pen/bBzYzj" target="_blank" class="button small"><i class="fa fa-codepen" aria-hidden="true"></i>&nbsp;View on Codepen</a></h3>
<h3>Toasts <a href="https://codepen.io/chalarangelo/pen/bBzYzj" target="_blank" class="button small"><i class="fa fa-codepen" aria-hidden="true"></i>&nbsp;View on Codepen</a></h3>
<pre>&lt;div class=&quot;alert&quot;&gt;
&lt;h3&gt;This is an alert&lt;/h3&gt;
&lt;p&gt;Make sure you read this!&lt;/p&gt;
@@ -985,27 +986,6 @@
<li>Use either the <code><span class="fore-secondary">role</span>=<span class="fore-primary">&quot;<a href="https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/ARIA_Techniques/Using_the_alert_role">alert</a>&quot;</span></code> attribute or the <code><span class="fore-secondary">role</span>=<span class="fore-primary">&quot;<a href="https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/ARIA_Techniques/Using_the_alertdialog_role">alertdialog</a>&quot;</span></code> attribute for accessible alerts</li>
</ul>
</div>
</div>
<div class="section row">
<div class="col-sm-12 col-md-6 col-md-first col-sm-first">
<h3>Animated alerts <a href="https://codepen.io/chalarangelo/pen/NbowoL" target="_blank" class="button small"><i class="fa fa-codepen" aria-hidden="true"></i>&nbsp;View on Codepen</a></h3>
<pre>&lt;div class=&quot;alert animated&quot;&gt;
&lt;h3&gt;Animated alert&lt;/h3&gt;
&lt;/div&gt;
&lt;div class=&quot;alert urgent animated&quot;&gt;
&lt;h3&gt;Animated urgent alert&lt;/h3&gt;
&lt;/div&gt;
&lt;div class=&quot;alert critical animated&quot;&gt;
&lt;h3&gt;Animated critical alert&lt;/h3&gt;
&lt;/div&gt;</pre>
</div>
<div class="col-sm-12 col-md-6">
<h3>Notes</h3>
<ul>
<li>Animated alerts are available using the <code>.animated</code> class</li>
<li>Compatible with modern browsers, but might cause some problems and bluriness in Webkit-based or older browsers</li>
</ul>
</div>
</div>
<div class="section row">
<div class="col-sm-12 col-md-6 col-md-first col-sm-first">