From c763ff19688ee08a7fac86cdce4ba75e5af435d7 Mon Sep 17 00:00:00 2001 From: Brian Talbot Date: Fri, 13 May 2016 09:44:41 -0400 Subject: [PATCH] changing examples to be CDN auto-a11y based with note --- src/_includes/examples/animated.html | 10 ++++---- src/_includes/examples/basic.html | 4 ++-- src/_includes/examples/bootstrap.html | 34 +++++++++++++-------------- src/_includes/examples/list.html | 16 ++++++------- src/examples.html | 11 ++++++++- 5 files changed, 42 insertions(+), 33 deletions(-) diff --git a/src/_includes/examples/animated.html b/src/_includes/examples/animated.html index 960ebd182..927e98bbd 100644 --- a/src/_includes/examples/animated.html +++ b/src/_includes/examples/animated.html @@ -31,19 +31,19 @@ with 8 steps. Works well with fa-spinner, fa-refresh, and fa-cog.

{% highlight html %} - + Loading... - + Loading... - + Loading... - + Loading... - + Loading... {% endhighlight %}

diff --git a/src/_includes/examples/basic.html b/src/_includes/examples/basic.html index 2b691a0b5..c00fb4787 100644 --- a/src/_includes/examples/basic.html +++ b/src/_includes/examples/basic.html @@ -10,7 +10,7 @@

- + Example: basic icon fa-camera-retro

@@ -22,7 +22,7 @@ brevity, but using a <span> is more semantically correct).

{% highlight html %} - fa-camera-retro + fa-camera-retro {% endhighlight %}
    diff --git a/src/_includes/examples/bootstrap.html b/src/_includes/examples/bootstrap.html index 0d6c03b8f..bcc6c0171 100644 --- a/src/_includes/examples/bootstrap.html +++ b/src/_includes/examples/bootstrap.html @@ -4,13 +4,13 @@

    - Delete + Delete - Settings + Settings

    - Font Awesome
    Version {{ site.fontawesome.version }}     + Font Awesome
    Version {{ site.fontawesome.version }}

    @@ -30,26 +30,26 @@
    - +
    - +
    - User + User
    @@ -61,12 +61,12 @@

    {% highlight html %} - Delete + Delete - Settings + Settings - Font Awesome
    Version {{ site.fontawesome.version }}     + Font Awesome
    Version {{ site.fontawesome.version }}
    @@ -98,11 +98,11 @@
    {% endhighlight %} diff --git a/src/_includes/examples/list.html b/src/_includes/examples/list.html index a708902be..1c7f3008f 100644 --- a/src/_includes/examples/list.html +++ b/src/_includes/examples/list.html @@ -9,20 +9,20 @@
      -
    • List icons
      • -
    • can be used
      • -
    • as bullets
      • -
    • in lists
      • +
    • List icons
      • +
    • can be used
      • +
    • as bullets
      • +
    • in lists

    Use fa-ul and fa-li to easily replace default bullets in unordered lists.

    {% highlight html %}
      -
    • List icons
      • -
    • can be used
      • -
    • as bullets
      • -
    • in lists
      • +
    • List icons
      • +
    • can be used
      • +
    • as bullets
      • +
    • in lists
    {% endhighlight %}
    diff --git a/src/examples.html b/src/examples.html index 3e23ac147..9f14ef11b 100644 --- a/src/examples.html +++ b/src/examples.html @@ -20,15 +20,24 @@ relative_path: ../ {% endcapture %} {% include stripe-ad.html %} +
    +
    + +
    +
    +

    The following examples are kept simple and assume use of Font Awesome CDN, which provides auto-accessibility support. If you are not using the Font Awesome CDN, please see the manual accessibility examples and read more about making your icons more awesome for all users

    +
    +
    + {% include examples/basic.html %} {% include examples/larger.html %} {% include examples/fixed-width.html %} {% include examples/list.html %} {% include examples/bordered-pulled.html %} {% include examples/animated.html %} - {% include examples/accessible.html %} {% include examples/rotated-flipped.html %} {% include examples/stacked.html %} {% include examples/bootstrap.html %} {% include examples/custom.html %} + {% include examples/accessible.html %}