Some improvements for documentation

ffoodd · Apr 21, 2016 · bf267a3 · bf267a3
1 parent 834fd34
commit bf267a3
Show file tree

Hide file tree

Showing 21 changed files with 36 additions and 31 deletions.
diff --git a/css/a11y-en.css b/css/a11y-en.css
diff --git a/css/a11y-en_advices-only.css b/css/a11y-en_advices-only.css
diff --git a/css/a11y-en_error.css b/css/a11y-en_error.css
diff --git a/css/a11y-en_errors-only.css b/css/a11y-en_errors-only.css
diff --git a/css/a11y-en_obsolete-only.css b/css/a11y-en_obsolete-only.css
diff --git a/css/a11y-en_obsolete.css b/css/a11y-en_obsolete.css
diff --git a/css/a11y-en_warning.css b/css/a11y-en_warning.css
diff --git a/css/a11y-en_warnings-only.css b/css/a11y-en_warnings-only.css
diff --git a/css/a11y-fr.css b/css/a11y-fr.css
diff --git a/css/a11y-fr_advices-only.css b/css/a11y-fr_advices-only.css
diff --git a/css/a11y-fr_error.css b/css/a11y-fr_error.css
diff --git a/css/a11y-fr_errors-only.css b/css/a11y-fr_errors-only.css
diff --git a/css/a11y-fr_obsolete-only.css b/css/a11y-fr_obsolete-only.css
diff --git a/css/a11y-fr_obsolete.css b/css/a11y-fr_obsolete.css
diff --git a/css/a11y-fr_warning.css b/css/a11y-fr_warning.css
diff --git a/css/a11y-fr_warnings-only.css b/css/a11y-fr_warnings-only.css
diff --git a/docs/Hologram/test-assets/_header.html b/docs/Hologram/test-assets/_header.html
@@ -89,10 +89,7 @@
 
           <p>
             Just drag this to your bookmarks, and you'll be able to use <b>a11y.css</b> on any page:
-            <a id="bookmarklet--link" href="javascript:(function(){a11ycss=document.createElement('LINK');a11ycss.href='https://rawgit.com/ffoodd/a11y.css/master/css/a11y-en.css';a11ycss.rel='stylesheet';a11ycss.media='(max-width: 800px)';document.body.appendChild(a11ycss);})();" class="bookmarklet">
-              <span>Grab your a11y.css</span>
-              bookmarklet
-            </a>
+            <a id="bookmarklet--link" href="javascript:(function(){a11ycss=document.createElement('LINK');a11ycss.href='https://rawgit.com/ffoodd/a11y.css/master/css/a11y-en.css';a11ycss.rel='stylesheet';a11ycss.media='(max-width: 800px)';document.body.appendChild(a11ycss);})();" class="bookmarklet">a11y.css</a>
           </p>
         </div>
       </aside>

diff --git a/docs/Hologram/test-assets/sass/doc.scss b/docs/Hologram/test-assets/sass/doc.scss
@@ -664,8 +664,8 @@ a[target$="blank"]::after {
   transition: all 300ms;
 }
 
-#bookmarklet--link span {
-  background-image:
+#bookmarklet--link::before {
+  background:
     linear-gradient(
         to right,
         rgba( 255, 255, 255, .3 ) 0%,
@@ -674,15 +674,23 @@ a[target$="blank"]::after {
         transparent 80%,
         rgba( 255, 255, 255, .3 ) 80%,
         rgba( 255, 255, 255, .3 ) 100%
-    );
-  background-position: 0 50%;
-  background-repeat: no-repeat;
-  background-size: 100% 1px;
+    )
+    0 50% / 100% 1px
+    no-repeat
+    !important;
+  border: 0 !important;
+  color: inherit !important;
+  content: "Grab your bookmarklet" !important;
   display: block;
-  font-size: small;
-  font-weight: 400;
+  font: inherit !important;
+  font-size: small !important;
+  font-weight: 400 !important;
   opacity: .8;
+  padding: 0;
+  position: static !important;
   text-indent: 0;
+  transform: none !important;
+  width: 100% !important;
 }
 
 #bookmarklet--link:hover,

diff --git a/docs/Hologram/test-assets/static/doc.css b/docs/Hologram/test-assets/static/doc.css
diff --git a/sass/base/_base.scss b/sass/base/_base.scss
@@ -11,7 +11,7 @@ html {
     background-size: 0.5em 100%;
     bottom: 1em;
     color: rgb(255, 255, 255);
-    font: 700 1.2rem/1.5 "Arial", "Nimbus Sans L", sans-serif;
+    font: 700 18px/1.5 "Arial", "Nimbus Sans L", sans-serif;
     left: 1em;
     padding: 0.75em 1em 0.75em 1.5em;
     position: fixed;

diff --git a/sass/utils/_mixins.scss b/sass/utils/_mixins.scss
@@ -211,7 +211,7 @@
   border-bottom: 1px solid !important;
   border-radius: 0 !important;
   bottom: auto !important;
-  font: 400 normal 1.2rem/1.5 monospace !important;
+  font: 400 normal 16px/1.5 monospace !important;
   height: auto !important;
   left: 0 !important;
   opacity: 0;