Moved the github fork image locally

hojberg · hojberg · commit 5a2d74a995f3 · 2012-05-27T13:07:48.000-04:00
Often the image would not be able to
load when using the external cdn.
Instead we now host the image in
order for it to always load.

Also added some simple transition
styles to the image when you hover.
diff --git a/public/css/app.css b/public/css/app.css
@@ -25,6 +25,8 @@ input[type='radio']           { border: 0; }
 #footer a                     { vertical-align: top; color: #fff; }
 .clr:after                    { clear:both; content:"."; display: block; height:0; visibility: hidden; line-height:0; font-size:0; }
 
+.ir                           { border: 0; font: 0/0 a; text-shadow: none; color: transparent; background-color: transparent; }
+
 .preview_and_configuration    { float: left; width: 395px; }
 
 /* =MODULES
@@ -53,3 +55,18 @@ input[type='radio']           { border: 0; }
 .css_result                       { position: relative; float: right; width: 402px; }
 .css_result .code                 { white-space: pre; padding: 10px; display: block; width: 380px; font-size: 12px; font-family: 'Courier new'; font-weight: bold; background: #8c9196; background: rgba(0, 0, 0, 0.15); border-radius: 4px; color: #fff; text-shadow: 0 1px 1px rgba(0, 0, 0, 0.3); border: 1px solid #696d72; border-color: rgba(0, 0, 0, 0.2); box-shadow: 0 1px 1px 0 rgba(255, 255, 255, 0.3), inset 0 1px 5px rgba(0, 0, 0, 0.1); }
 .css_result .copy_code            { position: absolute; bottom: 5px; right: 10px; width: 14px; height: 22px; background: url(../img/clippy.png) no-repeat 0 4px; }
+
+
+/* fork_me */
+.fork_me                          { position: absolute; top: 0; right: 0; display: block; width: 149px; height: 149px; background: url(../img/fork.png);
+  opacity: 0.7;
+  -webkit-transition: all 0.2s ease-in;
+     -moz-transition: all 0.2s ease-in;
+          transition: all 0.2s ease-in;
+}
+.fork_me:hover { 
+  opacity: 1; 
+  -webkit-transform: scale(1.03);
+     -moz-transform: scale(1.03);
+          transform: scale(1.03);
+}
diff --git a/public/img/fork.png b/public/img/fork.png
diff --git a/public/index.html b/public/index.html
@@ -7,8 +7,6 @@
     <link rel="stylesheet" type="text/css" href="css/app.css" />
   </head>
   <body>
-  
-    <a href="http://github.com/hojberg/cssarrowplease"><img style="position: absolute; top: 0; right: 0; border: 0;" src="https://a248.e.akamai.net/assets.github.com/img/30f550e0d38ceb6ef5b81500c64d970b7fb0f028/687474703a2f2f73332e616d617a6f6e6177732e636f6d2f6769746875622f726962626f6e732f666f726b6d655f72696768745f6f72616e67655f6666373630302e706e67" alt="Fork me on GitHub"></a>
 
     <div id='content' class='clr'>
       <div class='preview_and_configuration'>
@@ -57,6 +55,10 @@ <h2>Arrow configuration</h2>
         <code class='code' readonly='readonly'></code>
         <div class='copy_code'></div>
       </div>
+  
+      <a href="http://github.com/hojberg/cssarrowplease" class='fork_me ir'>
+        Fork me on Github
+      </a>
 
     </div>
 
