Przeglądaj źródła

updating bugs and doc

Dave Gandy 13 lat temu
rodzic
commit
775a40bec6
5 zmienionych plików z 101 dodań i 32 usunięć
  1. 36 0
      assets/css/font-awesome.css
  2. 0 0
      assets/css/site.css
  3. 39 11
      assets/less/font-awesome.less
  4. 9 13
      assets/less/site.less
  5. 17 8
      index.html

+ 36 - 0
assets/css/font-awesome.css

@@ -1,3 +1,26 @@
+/*  Font Awesome
+    the iconic font designed for use with Twitter Bootstrap
+    -------------------------------------------------------
+    The full suite of pictographic icons, examples, and documentation
+    can be found at: http://fortawesome.github.com/Font-Awesome/
+
+    License
+    -------------------------------------------------------
+    The Font Awesome webfont, CSS, and LESS files are licensed under CC BY 3.0:
+    http://creativecommons.org/licenses/by/3.0/ A mention of
+    'Font Awesome - http://fortawesome.github.com/Font-Awesome' in human-readable
+    source code is considered acceptable attribution (most common on the web).
+    If human readable source code is not available to the end user, a mention in
+    an 'About' or 'Credits' screen is considered acceptable (most common in desktop
+    or mobile software).
+
+    Contact
+    -------------------------------------------------------
+    Email: dave@davegandy.com
+    Twitter: http://twitter.com/fortaweso_me
+    Work: http://lemonwi.se co-founder
+
+    */
 @font-face {
   font-family: 'FontAwesome';
   src: url('../font/fontawesome-webfont.eot');
@@ -10,11 +33,20 @@
   font-weight: normal;
   font-style: normal;
   display: inline-block;
+  text-decoration: inherit;
 }
+a [class^="icon-"], a [class*=" icon-"] {
+  display: inline-block;
+  text-decoration: inherit;
+}
+/* makes the font 33% larger relative to the icon container */
 .icon-large:before {
+  vertical-align: top;
   font-size: 1.3333333333333333em;
 }
 .btn [class^="icon-"], .btn [class*=" icon-"] {
+  /* keeps button heights with and without icons the same */
+
   line-height: .9em;
 }
 li [class^="icon-"], li [class*=" icon-"] {
@@ -23,6 +55,8 @@ li [class^="icon-"], li [class*=" icon-"] {
   text-align: center;
 }
 li .icon-large[class^="icon-"], li .icon-large[class*=" icon-"] {
+  /* 1.5 increased font size for icon-large * 1.25 width */
+
   width: 1.875em;
 }
 li[class^="icon-"], li[class*=" icon-"] {
@@ -36,6 +70,8 @@ li[class^="icon-"]:before, li[class*=" icon-"]:before {
 li[class^="icon-"].icon-large:before, li[class*=" icon-"].icon-large:before {
   text-indent: -1.3333333333333333em;
 }
+/*  Font Awesome uses the Unicode Private Use Area (PUA) to ensure screen
+    readers do not read off random characters that represent icons */
 .icon-glass:before {
   content: "\f000";
 }

Plik diff jest za duży
+ 0 - 0
assets/css/site.css


+ 39 - 11
assets/less/font-awesome.less

@@ -1,3 +1,27 @@
+/*  Font Awesome
+    the iconic font designed for use with Twitter Bootstrap
+    -------------------------------------------------------
+    The full suite of pictographic icons, examples, and documentation
+    can be found at: http://fortawesome.github.com/Font-Awesome/
+
+    License
+    -------------------------------------------------------
+    The Font Awesome webfont, CSS, and LESS files are licensed under CC BY 3.0:
+    http://creativecommons.org/licenses/by/3.0/ A mention of
+    'Font Awesome - http://fortawesome.github.com/Font-Awesome' in human-readable
+    source code is considered acceptable attribution (most common on the web).
+    If human readable source code is not available to the end user, a mention in
+    an 'About' or 'Credits' screen is considered acceptable (most common in desktop
+    or mobile software).
+
+    Contact
+    -------------------------------------------------------
+    Email: dave@davegandy.com
+    Twitter: http://twitter.com/fortaweso_me
+    Work: http://lemonwi.se co-founder
+
+    */
+
 @font-face {
     font-family: 'FontAwesome';
     src: url('../font/fontawesome-webfont.eot');
@@ -10,29 +34,32 @@
     font-style: normal;
 }
 
-// ICONS
-// Glyphs and icons for buttons, nav, and more
-// -------------------------------------------
-// Font Awesome courtesy of Dave Gandy at fortaweso.me/font-awesome
-
 [class^="icon-"]:before,
 [class*=" icon-"]:before {
     font-family: FontAwesome;
     font-weight: normal;
     font-style: normal;
     display: inline-block;
+    text-decoration: inherit;
+}
+
+a [class^="icon-"],
+a [class*=" icon-"] {
+    display: inline-block;
+    text-decoration: inherit;
 }
 
-// makes the font 33% larger relative to the icon container
+/* makes the font 33% larger relative to the icon container */
 .icon-large:before {
-//    display: inline-block;
+    vertical-align: top;
     font-size: 4/3em;
 }
 
 .btn {
     [class^="icon-"],
     [class*=" icon-"] {
-    line-height: .9em; // keeps button heights with and without icons the same
+        /* keeps button heights with and without icons the same */
+        line-height: .9em;
     }
 }
 
@@ -45,7 +72,8 @@ li {
     }
     .icon-large[class^="icon-"],
     .icon-large[class*=" icon-"]  {
-        width: 1.5*1.25em; // 1.5 increased font size for icon-large * 1.25 width
+        /* 1.5 increased font size for icon-large * 1.25 width */
+        width: 1.5*1.25em;
     }
 }
 
@@ -63,8 +91,8 @@ li[class*=" icon-"] {
     }
 }
 
-// Uses Unicode Private Use Area (PUA) to ensure screen readers do not read off
-// random characters that represent icons
+/*  Font Awesome uses the Unicode Private Use Area (PUA) to ensure screen
+    readers do not read off random characters that represent icons */
 .icon-glass:before              { content: "\f000"; }
 .icon-music:before              { content: "\f001"; }
 .icon-search:before             { content: "\f002"; }

+ 9 - 13
assets/less/site.less

@@ -44,11 +44,14 @@ h1, h2, h3, h4, h5, h6 { font-family: @baseHeaderFontFamily; }
     }
 }
 
-a[href^='http://']:after {
-    font-family: FontAwesome;
-    content: "\0020 \f08e";
-    &:hover {
-        text-decoration: none;
+a[href^='http://'] {
+    display: inline-block;
+    &:after {
+        font-family: FontAwesome;
+        content: "\0020 \f08e";
+        &:hover {
+            text-decoration: none;
+        }
     }
 }
 
@@ -116,10 +119,6 @@ a[href^='http://']:after {
     }
 }
 
-/*section {*/
-    /*margin: 30px 0;*/
-/*}*/
-
 .the-icons {
     li[class^="icon-"],
     li[class*=" icon-"] {
@@ -193,10 +192,7 @@ a[href^='http://']:after {
 
         span.star:hover:before, span.star:hover ~ span.star:before {
             content: "\f005"; // solid star
-            color: #c49c38;
-            #gradient > .vertical(#fffeb8, #c49c38);
-            -webkit-background-clip: text;
-            -webkit-text-fill-color: transparent;
+            color: #e3cf7a;
         }
     }
 }

+ 17 - 8
index.html

@@ -31,7 +31,7 @@
 <div class="navbar navbar-fixed-top">
     <div class="navbar-inner">
         <div class="container">
-            <h3><a class="brand" href="#"><i class="icon-flag"> </i>Font Awesome</a></h3>
+            <h3><a class="brand" href="#"><i class="icon-flag"></i> Font Awesome</a></h3>
             <ul class="nav">
                 <li><a href="#overview">Overview</a></li>
                 <li><a href="#base-icons">Base Icons</a></li>
@@ -114,7 +114,7 @@
             </div>
             <div class="span4">
                 <h3><i class="icon-ok icon-large"></i> Broad compatibility</h3>
-                Wide @font-face support means Font Awesome even works in IE4 (<a href="http://www.fontsquirrel.com/fontface" target="_blank">no kidding</a>).
+                Wide @font-face support means Font Awesome works in <a href="#roadmap" rel="tooltip" data-original-title="IE7 support coming soon">modern browsers <i class="icon-info-sign"></i></a>.
             </div>
         </div>
         <div class="row">
@@ -716,8 +716,9 @@
         <h1>Roadmap</h1>
         <p>Here's the plan for future updates.</p>
         <ul>
+            <li class="icon-plus">Support for IE7.</li>
             <li class="icon-plus">Better hinting for smaller font sizes.</li>
-            <li class="icon-plus">More icons. Have any requests? <a href="https://github.com/FortAwesome/Font-Awesome/issues/new" target="_blank">Open an issue</a> in the Font Awesome GitHub project.</li>
+            <li class="icon-plus">More icons. Have any requests? <a href="https://github.com/FortAwesome/Font-Awesome/issues" target="_blank">Open an issue</a> in the Font Awesome GitHub project.</li>
             <li class="icon-plus">More complete Twitter Bootstrap compatibility.</li>
             <li class="icon-plus">Tricks and tips for super-awesome creative CSS methods, like the star example above.</li>
         </ul>
@@ -736,17 +737,19 @@
             <div class="span8">
                 <h2>License</h2>
                 The Font Awesome webfont, CSS, and LESS files are licensed under
-                <a href="http://creativecommons.org/licenses/by/3.0/">CC BY 3.0</a>.
+                <a href="http://creativecommons.org/licenses/by/3.0/" target="_blank">CC BY 3.0</a>.
                 A mention of <code>Font Awesome - http://fortawesome.github.com/Font-Awesome</code> in human-readable source code
                 is considered acceptable attribution (most common on the web). If human readable source code is not available to
                 the end user, a mention in an 'About' or 'Credits' screen is considered acceptable (most common in desktop or
                 mobile software).
             </div>
+            <div class="span12">
+                <h2>Special Thanks</h2>
+                Special thanks to <a href="http://twitter.com/robmadole/" target="_blank">@robmadole</a> and
+                <a href="http://twitter.com/supercodepoet/" target="_blank">@supercodepoet</a> for icon design
+                review, advice, and some backbone.js help.
+            </div>
         </div>
-
-
-
-
     </footer>
 
 
@@ -827,6 +830,12 @@
             interval: 5000
         });
 
+        // tooltips
+        $('#why').tooltip({
+            selector: "a[rel=tooltip]",
+            placement: 'bottom'
+        })
+
         // make code pretty
         window.prettyPrint && prettyPrint();
     });

Niektóre pliki nie zostały wyświetlone z powodu dużej ilości zmienionych plików