From 3ce576c59db05cffad20b2f418cdd355800754ae Mon Sep 17 00:00:00 2001 From: Angelos Chalaris Date: Mon, 13 Feb 2017 12:22:58 +0200 Subject: [PATCH] Updated quick reference for contextual, progress and utility --- docs/quick_reference.html | 20 +++++++++++++++++++- docs/v2/DEVLOG.md | 2 ++ 2 files changed, 21 insertions(+), 1 deletion(-) diff --git a/docs/quick_reference.html b/docs/quick_reference.html index ccb4cba..bc44f58 100644 --- a/docs/quick_reference.html +++ b/docs/quick_reference.html @@ -950,6 +950,7 @@
  • Alerts have no pre-defined behavior, use Javascript
  • The .alert class can be applied to <div> elements and textual elements alike
  • Avoid applying the .alert class to non-textual elements, such as images
    • +
  • Use either the role="alert" attribute or the role="alertdialog" attribute for accessible alerts
    • @@ -969,10 +970,25 @@

    Notes

    + +
    +
    +

    Tooltips  View on Codepen

    + 
    <span class="tooltip" aria-label="This is a tooltip">Hover over this text to see a tooltip!</span>
+<span class="tooltip bottom" aria-label="This is a tooltip">Hover over this text to see a reverse tooltip!</span>
    +
    +
    +

    Notes

    +
      +
    • Create using the .tooltip class
      • +
    • Put tooltip text in the aria-label attribute's value
      • +
    • Use the .bottom class to make a tooltip display at the bottom of its context
      • +
    +
    @@ -1026,6 +1042,7 @@
  • Apply class to a <div> or <span> element
  • Do not insert text inside the .spinner-donut element
  • Donut spinners can be displayed inline
    • +
  • Use the role="progressbar" attribute to make donut spinner accessible
    • @@ -1121,6 +1138,7 @@
  • To create breadcrumbs, create a <ul> element implementing the .breadcrumbs class
  • Do not use <ol> for breadcrumbs
  • Do not nest lists inside the .breadcrumbs
    • +
  • Use the role="navigation" attribute to make breadcrumbs accessible
    • diff --git a/docs/v2/DEVLOG.md b/docs/v2/DEVLOG.md index 510f1a0..d348eca 100644 --- a/docs/v2/DEVLOG.md +++ b/docs/v2/DEVLOG.md @@ -872,3 +872,5 @@ - Updated the `quick_reference.html` page with the new guidelines for `grid` module. - Updated the `quick_reference.html` page with new guidelines for `navigation`, `input_control` and `table`. +- Updated the `quick_reference.html` page with new guidelines for `contextual`, `progress` and `utility`. +- *TODO* Update module descriptions where needed.