JasonWoof Got questions, comments, patches, etc.? Contact Jason Woofenden
css fix: add missing width: property on tabs
[hexbog.git] / main.html
index fd8573b..d5668fc 100644 (file)
--- a/main.html
+++ b/main.html
@@ -1,9 +1,10 @@
 <!DOCTYPE html>
 <html lang="en">
 <head>
-       <title>HexBog</title>
-       <meta charset="utf-8" />
-       <link rel="shortcut icon" href="favicon.ico" />
+       <title>HexBog &ndash; a simple word game</title>
+       <meta charset="utf-8">
+       <meta name="viewport" content="width=648">
+       <link rel="icon" href="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAAAAAA6mKC9AAAA/UlEQVQY02P4DwKnPYWFPU6BmQxAfOusJLu4ODvXk+tggecZLAn+7NLSHJYLmVOf/meo5mJgEG/msLXhyMliYOCqYmBwm5PJ0MLR3cwxy4RbigEIiv//5ZvBcfYExw7JpXeYgAJq4WaatzmevOC4wn/7vwlICUP6q28c339wfGT58v/3XwYGQQG2xv+cv39xfGH+qsDNx8BQ8v+6wEPuT+857nI/apEEaqj6/0dxD9/zJxzHhPb/1wAKGAcpMSzm2r2PY5mudwkrA0M1N1CwjqO8iqMkH+iwaob/L7JZZRLZjYw5HDeypD8De+7uDkWQ5wQ+3YT6FuJ9r7NgJgAB9nPOaCTI7QAAAABJRU5ErkJggg==" />
        <style>
 cat style.css
        </style>
@@ -13,6 +14,7 @@ cat style.css
        <div id="centerer">
                <div id="boarder">
                        <div id="board">
+                               <!--
                                <div class="tile" style="background-color: #aaf; overflow: hiden">
                                        <div class="head">
                                                J
@@ -26,6 +28,7 @@ cat style.css
                                                <div class="eye2"></div>
                                        </div>
                                </div>
+                               -->
                                <div id="loading">Loading...</div>
                        </div>
                </div>
@@ -39,33 +42,33 @@ cat style.css
                        <div id="tabs">
                                <div id="instructions" class="selected-tab" style="height: 150px">
                                        <div class="tabtab">Instructions</div>
-                                       <ol>
-                                               <li>Click letter tiles to make a word (they have to touch).</li>
-                                               <li>Click the last letter tile again.</li>
-                                       </ol>
+                                       <div class="tabbody">
+                                               <div style="margin-left: 20px; text-indent: -20px"><strong>1.</strong> Click letter tiles to make a word (they have to touch).</div>
+                                               <div style="margin-left: 20px; text-indent: -20px"><strong>2.</strong> Click the last letter tile again.</div>
+                                       </div>
                                </div>
                                <div id="definition" class="tab" style="height: 20px">
                                        <div class="tabtab">Definition</div>
-                                       <div id="definition_body">When you make a word, a definition should appear here.</div>
+                                       <div id="definition_body" class="tabbody">
+                                               When you make a word, a definition should appear here.
+                                       </div>
                                </div>
 
-                               <div id="logtab" class="tab" style="height: 20px">
-                                       <div class="tabtab">log</div>
-                                       <div id="log">
-                                               <div>&nbsp;</div>
-                                               <div>&nbsp;</div>
-                                               <div>&nbsp;</div>
-                                               <div>&nbsp;</div>
-                                               <div>&nbsp;</div>
+                               <div id="donate" class="tab" style="height: 20px">
+                                       <div class="tabtab">Donate</div>
+                                       <div class="tabbody">
+                                               Please support this project by sending me money via <a href="http://flattr.com/thing/1146710/HexBog-A-simple-word-game" target="_blank">Flattr</a>, <a href="http://jasonwoof.com/pay.html" target="_blank">Dwolla</a> or <a href="http://jasonwoof.com/pay.fs" target="_blank">PayPal</a>.<br><br>
+                                               Thank you! &ndash; Jason
                                        </div>
                                </div>
 
                                <div id="restart" class="tab" style="height: 20px">
                                        <div class="tabtab">New Game</div>
+                                       <div class="tabbody">
+                                               <p class="warning">Warning: There's no undo! This will clear your score and reset the board.</p>
 
-                                       <p class="warning">Warning: There's no undo! This will clear your score and reset the board.</p>
-
-                                       <p><a id="start-over" href="#" class="button">New Game</a></p>
+                                               <p><a id="start-over" href="#" class="button">New Game</a></p>
+                                       </div>
                                </div>
                        </div>