Browse Source

Add logo and links to alternatives.

Martin Kleppe 12 years ago
parent
commit
35aa4a896d
1 changed files with 46 additions and 23 deletions
  1. 46 23
      index.html

+ 46 - 23
index.html

@@ -3,33 +3,53 @@
   <title>JSFuck - Write any JavaScript with 6 Characters: []()!+</title>
   <meta name="description" content="JSFuck is an esoteric and educational programming style based on the atomic parts of JavaScript. It uses only six different characters execute code.">
   <meta property="og:image" content="http://www.jsfuck.com/preview.png" />
+  <meta name="viewport" content="width=device-width" />
   <style>
     
     body {
       padding: 20px;
-      max-width: 800px;
     }
     
     body, * {
       font-family: monospace;
       font-size: 14px;
+      line-height: 1.4em;
     }
     
     h1 {
       font-size: 2em;
     }
     
+    h2 {
+      width: 90px;
+      text-align: right;
+      padding: 50px 5px 5px;
+      background: #F0DB4E;
+      color: #323230;
+      font-weight: bold;
+      font-size: 20px;
+      line-height: 1em;
+    }
+    
     h3 {
       font-weight: bold;
     }
+        
+    p, li, textarea {
+      width: 100%;
+      max-width: 600px;
+    }
     
     textarea {
       display: block;
-      width: 100%;
       height: 200px;
       margin: 1em 0;
     }
     
+    ul.pre li{
+      white-space: pre;
+    }
+    
     .checkbox {
       display: inline-block;
     }
@@ -37,7 +57,9 @@
   </style>
 </head>
 <body>
-  <h1>JSFuck []()!+</h1>
+  <h1>JSFuck</h1>
+  
+  <h2>()+<br>[]!</h2>
   
   <p>JSFuck is an esoteric and educational programming style based on the
   atomic parts of JavaScript. It uses only six different characters to
@@ -58,31 +80,32 @@
   
   <h3>Links</h3>
   
-  <p>
-    * View source on <a href="http://github.com/aemkei/jsfuck">GitHub</a> <br>
-    * Follow <a href="http://twitter.com/aemkei">@aemkei</a> (Martin Kleppe) <br>
-    * Original discussion at <a href="http://sla.ckers.org/forum/read.php?24,32930">Sla.ckers.org</a>
-  </p>
+  <ul>
+    <li>View source on <a href="http://github.com/aemkei/jsfuck">GitHub</a></li>
+    <li>Follow <a href="http://twitter.com/aemkei">@aemkei</a> (Martin Kleppe)</li>
+    <li>Original discussion at <a href="http://sla.ckers.org/forum/read.php?24,32930">Sla.ckers.org</a></li>
+    <li>Alternatives: <a href="http://patriciopalladino.com/files/hieroglyphy/">Hieroglyphy</a> (8 chars), <a href="http://utf-8.jp/public/jsfuck.html">utf-8.jp</a> (broken)</li>
+  </ul>
   
   <h3>Basics</h3>
   
-  <pre>
-* 'false'       =>  ![]
-* 'true'        =>  !![]
-* 'undefined'   =>  [][[]]
-* 'NaN'         =>  +[![]]
+  <ul class="pre">
+    <li>'false'       =>  ![]</li>
+    <li>'true'        =>  !![]</li>
+    <li>'undefined'   =>  [][[]]</li>
+    <li>'NaN'         =>  +[![]]</li>
+    
+    <li>'Array'       =>  []</li>
+    <li>'Number'      =>  +[]</li>
+    <li>'String'      =>  []+[]</li>
+    <li>'Boolean'     =>  ![]</li>
+    <li>'Function'    =>  []["sort"]</li>
 
-* 'Array'       =>  []
-* 'Number'      =>  +[]
-* 'String'      =>  []+[]
-* 'Boolean'     =>  ![]
-* 'Function'    =>  []["sort"]
- 
-* eval          =>  []["sort"]["constructor"]( CODE )()
-* window        =>  []["sort"]["constructor"]("return this")()
-  </pre>
+    <li>eval          =>  []["sort"]["constructor"]( CODE )()</li>
+    <li>window        =>  []["sort"]["constructor"]("return this")()</li>
+  </ul>
 
-  <p>See the full list <a href="https://github.com/aemkei/jsfuck/blob/master/jsfuck.js">here.</a></p>
+  <p>See the full list <a href="https://github.com/aemkei/jsfuck/blob/master/jsfuck.js">here</a>.</p>
 
   <script src="jsfuck.js"></script>
   <script>