JasonWoof Got questions, comments, patches, etc.? Contact Jason Woofenden
change layout, factor out css, use lesscss
[hexbog.git] / main.html
1 <!DOCTYPE html>
2 <html lang="en">
3 <head>
4         <title>HexBog</title>
5         <meta charset="utf-8" />
6         <link rel="shortcut icon" href="favicon.ico" />
7         <style>
8 cat style.css
9         </style>
10 </head>
11
12 <body>
13         <div id="centerer">
14                 <div id="boarder">
15                         <div id="board">
16                                 <div class="tile" style="background-color: #aaf; overflow: hiden">
17                                         <div class="head">
18                                                 J
19                                                 <div class="chin"></div>
20                                                 <div class="pate"></div>
21                                                 <div class="tooth1"></div>
22                                                 <div class="tooth2"></div>
23                                                 <div class="tooth3"></div>
24                                                 <div class="tooth4"></div>
25                                                 <div class="eye1"></div>
26                                                 <div class="eye2"></div>
27                                         </div>
28                                 </div>
29                                 <div id="loading">Loading...</div>
30                         </div>
31                 </div>
32                 <div id="right">
33                         <h1>HexBog</h1>
34                         <div id="subhead">&mdash; A simple word game &mdash;</div>
35
36                         <div>Selection: "<span id="selection"></span>"</div>
37                         <div>Score: <span id="score">0</span></div>
38
39                         <div id="tabs">
40                                 <div id="instructions" class="selected-tab" style="height: 150px">
41                                         <div class="tabtab">Instructions</div>
42                                         <ol>
43                                                 <li>Click letter tiles to make a word (they have to touch).</li>
44                                                 <li>Click the last letter tile again.</li>
45                                         </ol>
46                                 </div>
47                                 <div id="definition" class="tab" style="height: 20px">
48                                         <div class="tabtab">Definition</div>
49                                         <div id="definition_body">When you make a word, a definition should appear here.</div>
50                                 </div>
51
52                                 <div id="logtab" class="tab" style="height: 20px">
53                                         <div class="tabtab">log</div>
54                                         <div id="log">
55                                                 <div>&nbsp;</div>
56                                                 <div>&nbsp;</div>
57                                                 <div>&nbsp;</div>
58                                                 <div>&nbsp;</div>
59                                                 <div>&nbsp;</div>
60                                         </div>
61                                 </div>
62
63                                 <div id="restart" class="tab" style="height: 20px">
64                                         <div class="tabtab">New Game</div>
65
66                                         <p class="warning">Warning: There's no undo! This will clear your score and reset the board.</p>
67
68                                         <p><a id="start-over" href="#" class="button">New Game</a></p>
69                                 </div>
70                         </div>
71
72                         <div id="copyright">
73                                 &copy;2013 <a href="http://jasonwoof.com/" target="_blank">Jason Woofenden</a> &ndash; <a href="http://gitorious.org/hexbog" target="_blank">AGPLv3+</a>.
74                         <div>
75                 </div>
76         </div>
77         <script>
78 cat main_min.js
79         </script>
80         <script>
81 cat wordlist_min.js
82         </script>
83 </body>
84 </html>