uniform-ui 0.6 → 1.0

Sign up to get free protection for your applications and to get access to all the features.
Files changed (106) hide show
  1. checksums.yaml +4 -4
  2. data/CHANGELOG.md +27 -0
  3. data/CNAME +1 -0
  4. data/Gemfile +0 -4
  5. data/Gemfile.lock +1 -11
  6. data/README.md +2 -3
  7. data/Rakefile +34 -24
  8. data/index.html +240 -1160
  9. data/preview/{_tables.html.erb → alerts.html.erb} +0 -0
  10. data/preview/buttons.html.erb +62 -0
  11. data/preview/cards.html.erb +23 -0
  12. data/preview/colors.html.erb +22 -0
  13. data/preview/{_tabs.html.erb → dropdown.html.erb} +0 -0
  14. data/preview/form.html.erb +233 -0
  15. data/preview/grid.html.erb +304 -0
  16. data/preview/helpers.html.erb +225 -0
  17. data/preview/index.html.erb +74 -50
  18. data/preview/{_tiles.html.erb → labels.html.erb} +0 -0
  19. data/preview/layout.html.erb +63 -0
  20. data/preview/loaders.html.erb +83 -0
  21. data/preview/modal.html.erb +1 -0
  22. data/preview/nav.html.erb +77 -0
  23. data/preview/preview.scss +39 -10
  24. data/preview/rows.html.erb +36 -0
  25. data/preview/select.html.erb +1 -0
  26. data/preview/tables.html.erb +1 -0
  27. data/preview/tabs.html.erb +17 -0
  28. data/preview/tiles.html.erb +1 -0
  29. data/preview/tooltip.erb +1 -0
  30. data/site/alerts.html +157 -0
  31. data/site/alerts.html copy +133 -0
  32. data/site/buttons.html +286 -0
  33. data/site/cards.html +177 -0
  34. data/site/colors.html +275 -0
  35. data/site/dropdown.html +157 -0
  36. data/site/dropdown.html copy +141 -0
  37. data/site/form.html +369 -0
  38. data/site/grid.html +716 -0
  39. data/site/helpers.html +1008 -0
  40. data/site/index.html +208 -617
  41. data/site/labels.html +157 -0
  42. data/site/layout.html +313 -0
  43. data/site/loaders.html +233 -0
  44. data/site/modal.html +157 -0
  45. data/site/nav.html +229 -0
  46. data/site/preview.css +1 -1
  47. data/site/preview.js +59 -0
  48. data/site/rows.html +190 -0
  49. data/site/select.html +157 -0
  50. data/site/tables.html +157 -0
  51. data/site/tabs.html +171 -0
  52. data/site/tiles.html +157 -0
  53. data/site/tiles.html copy +109 -0
  54. data/site/tooltip +157 -0
  55. data/site/uniform.css +1 -1
  56. data/uniform.gemspec +2 -8
  57. data/vendor/assets/stylesheets/uniform.scss +4 -4
  58. data/vendor/assets/stylesheets/uniform/base.scss +2 -0
  59. data/vendor/assets/stylesheets/uniform/components/alert.scss +27 -0
  60. data/vendor/assets/stylesheets/uniform/components/buttons.scss +135 -86
  61. data/vendor/assets/stylesheets/uniform/components/card.scss +69 -67
  62. data/vendor/assets/stylesheets/uniform/components/dropdown.scss +69 -0
  63. data/vendor/assets/stylesheets/uniform/components/form.scss +268 -85
  64. data/vendor/assets/stylesheets/uniform/components/grid.scss +214 -72
  65. data/vendor/assets/stylesheets/uniform/components/label.scss +63 -0
  66. data/vendor/assets/stylesheets/uniform/components/loaders.scss +38 -18
  67. data/vendor/assets/stylesheets/uniform/components/modal.scss +51 -0
  68. data/vendor/assets/stylesheets/uniform/components/nav.scss +171 -54
  69. data/vendor/assets/stylesheets/uniform/components/row.scss +69 -101
  70. data/vendor/assets/stylesheets/uniform/components/select.scss +98 -0
  71. data/vendor/assets/stylesheets/uniform/components/table.scss +83 -0
  72. data/vendor/assets/stylesheets/uniform/components/tabs.scss +39 -26
  73. data/vendor/assets/stylesheets/uniform/components/tile.scss +15 -27
  74. data/vendor/assets/stylesheets/uniform/components/tooltip.scss +46 -0
  75. data/vendor/assets/stylesheets/uniform/defaults.scss +85 -19
  76. data/vendor/assets/stylesheets/uniform/helpers.scss +82 -81
  77. data/vendor/assets/stylesheets/uniform/helpers/colors.scss +37 -0
  78. data/vendor/assets/stylesheets/uniform/helpers/margin.scss +44 -0
  79. data/vendor/assets/stylesheets/uniform/helpers/padding.scss +74 -0
  80. data/vendor/assets/stylesheets/uniform/helpers/sizes.scss +31 -0
  81. data/vendor/assets/stylesheets/uniform/helpers/text.scss +121 -0
  82. data/vendor/assets/stylesheets/uniform/mixins.scss +25 -48
  83. data/vendor/assets/stylesheets/uniform/variables.scss +10 -28
  84. metadata +61 -85
  85. data/preview/_buttons.html.erb +0 -59
  86. data/preview/_cards.html.erb +0 -82
  87. data/preview/_colors.html.erb +0 -12
  88. data/preview/_forms.html.erb +0 -196
  89. data/preview/_grid.html.erb +0 -49
  90. data/preview/_helpers.html.erb +0 -158
  91. data/preview/_inputs.html.erb +0 -93
  92. data/preview/_installation.html.erb +0 -4
  93. data/preview/_lists.html.erb +0 -53
  94. data/preview/_loaders.html.erb +0 -72
  95. data/preview/_nav.html.erb +0 -46
  96. data/preview/_philosophy.html.erb +0 -33
  97. data/preview/_rows.html.erb +0 -35
  98. data/preview/_uniform.html.erb +0 -4
  99. data/site/site/logo.png +0 -0
  100. data/site/site/preview.css +0 -1
  101. data/site/site/uniform.css +0 -1
  102. data/vendor/assets/stylesheets/uniform/components/inputs.scss +0 -131
  103. data/vendor/assets/stylesheets/uniform/components/lists.scss +0 -62
  104. data/vendor/assets/stylesheets/uniform/components/table-container.scss +0 -44
  105. data/vendor/assets/stylesheets/uniform/components/table-form.scss +0 -159
  106. data/vendor/assets/stylesheets/uniform/mixins/grid-framework.scss +0 -142
data/site/loaders.html ADDED
@@ -0,0 +1,233 @@
1
+ <!DOCTYPE html>
2
+ <head>
3
+ <meta http-equiv="Content-type" content="text/html; charset=utf-8">
4
+ <title>Uniform</title>
5
+ <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/normalize/4.2.0/normalize.css" type="text/css" media="screen">
6
+ <link rel="stylesheet" href="/site/uniform.css" type="text/css" media="screen" title="no title" charset="utf-8">
7
+ <link rel="stylesheet" href="/site/preview.css" type="text/css" media="screen" charset="utf-8">
8
+ </head>
9
+ <body>
10
+ <div class="side-nav">
11
+ <div class="pad">
12
+ <a href="/">
13
+ <img src="/site/logo.png" class="block">
14
+ </a>
15
+ </div>
16
+ <div class="uniformNav vertical">
17
+ <div class="nav">
18
+
19
+
20
+
21
+ <a href="/site/helpers.html">
22
+ Helpers
23
+
24
+ </a>
25
+
26
+
27
+ <a href="/site/colors.html">
28
+ Colors
29
+
30
+ </a>
31
+
32
+
33
+ <a href="/site/grid.html">
34
+ Grid
35
+
36
+ </a>
37
+
38
+
39
+ <a href="/site/buttons.html">
40
+ Buttons
41
+
42
+ </a>
43
+
44
+
45
+ <a href="/site/tables.html">
46
+ Tables
47
+
48
+ <span class="uniformLabel yellow">todo</span>
49
+
50
+ </a>
51
+
52
+
53
+ <a href="/site/cards.html">
54
+ Cards
55
+
56
+ </a>
57
+
58
+
59
+ <a href="/site/rows.html">
60
+ Rows
61
+
62
+ </a>
63
+
64
+
65
+ <a href="/site/form.html">
66
+ Form
67
+
68
+ </a>
69
+
70
+
71
+ <a href="/site/loaders.html">
72
+ Loaders
73
+
74
+ </a>
75
+
76
+
77
+ <a href="/site/nav.html">
78
+ Nav
79
+
80
+ </a>
81
+
82
+
83
+ <a href="/site/tabs.html">
84
+ Tabs
85
+
86
+ </a>
87
+
88
+
89
+ <a href="/site/tiles.html">
90
+ Tiles
91
+
92
+ <span class="uniformLabel yellow">todo</span>
93
+
94
+ </a>
95
+
96
+
97
+ <a href="/site/labels.html">
98
+ Labels
99
+
100
+ <span class="uniformLabel yellow">todo</span>
101
+
102
+ </a>
103
+
104
+
105
+ <a href="/site/alerts.html">
106
+ Alerts
107
+
108
+ <span class="uniformLabel yellow">todo</span>
109
+
110
+ </a>
111
+
112
+
113
+ <a href="/site/dropdown.html">
114
+ Dropdown
115
+
116
+ <span class="uniformLabel yellow">todo</span>
117
+
118
+ </a>
119
+
120
+
121
+ <a href="/site/modal.html">
122
+ Modal
123
+
124
+ <span class="uniformLabel yellow">todo</span>
125
+
126
+ </a>
127
+
128
+
129
+ <a href="/site/select.html">
130
+ Select
131
+
132
+ <span class="uniformLabel yellow">todo</span>
133
+
134
+ </a>
135
+
136
+
137
+ <a href="/site/tooltip.html">
138
+ Tooltip
139
+
140
+ <span class="uniformLabel yellow">todo</span>
141
+
142
+ </a>
143
+
144
+ </div>
145
+ </div>
146
+ </div>
147
+ <div class="main-content overflow-hidden">
148
+ <div class="section">
149
+ <h1>Loaders</h1>
150
+ <div class="grid">
151
+ <div class="col-6">
152
+ <div class="uniform-loader">
153
+ <div class="uniform-loader-container">
154
+ <span>&bull;</span>
155
+ <span>&bull;</span>
156
+ <span>&bull;</span>
157
+ </div>
158
+ </div>
159
+ </div>
160
+ <div class="col-6">
161
+ <pre class=''>&lt;div class=&quot;uniform-loader&quot;&gt;
162
+ &lt;div class=&quot;uniform-loader-container&quot;&gt;
163
+ &lt;span&gt;&amp;bull;&lt;/span&gt;
164
+ &lt;span&gt;&amp;bull;&lt;/span&gt;
165
+ &lt;span&gt;&amp;bull;&lt;/span&gt;
166
+ &lt;/div&gt;
167
+ &lt;/div&gt;</pre>
168
+ </div>
169
+ </div>
170
+ <div class="grid">
171
+ <div class="col-6">
172
+ <code>.cover</code><br>
173
+ <span style="position:relative; display:inline-block">
174
+ <img src="https://unsplash.it/150/100/?random" style="display:block;" width="150" height="100">
175
+ <div class="uniform-loader cover">
176
+ <div class="uniform-loader-container">
177
+ <span>&bull;</span>
178
+ <span>&bull;</span>
179
+ <span>&bull;</span>
180
+ </div>
181
+ </div>
182
+ </span>
183
+ </div>
184
+ <div class="col-6">
185
+ <pre class=''>&lt;span style=&quot;position:relative; display:inline-block&quot;&gt;
186
+ &lt;img src=&quot;https://unsplash.it/150/100/?random&quot; style=&quot;display:block;&quot;&gt;
187
+ &lt;div class=&quot;uniform-loader cover&quot;&gt;
188
+ &lt;div class=&quot;uniform-loader-container&quot;&gt;
189
+ &lt;span&gt;&amp;bull;&lt;/span&gt;
190
+ &lt;span&gt;&amp;bull;&lt;/span&gt;
191
+ &lt;span&gt;&amp;bull;&lt;/span&gt;
192
+ &lt;/div&gt;
193
+ &lt;/div&gt;
194
+ &lt;/span&gt;</pre>
195
+ </div>
196
+ </div>
197
+ <div class="grid">
198
+ <div class="col-6">
199
+ <code>.cover.light</code><br>
200
+ <span style="position:relative; display:inline-block">
201
+ <img src="https://unsplash.it/150/100/?random" style="display:block;" width="150" height="100">
202
+ <div class="uniform-loader cover light">
203
+ <div class="uniform-loader-container">
204
+ <span>&bull;</span>
205
+ <span>&bull;</span>
206
+ <span>&bull;</span>
207
+ </div>
208
+ </div>
209
+ </span>
210
+ </div>
211
+ <div class="col-6">
212
+ <pre class=''>&lt;span style=&quot;position:relative; display:inline-block&quot;&gt;
213
+ &lt;img src=&quot;https://unsplash.it/150/100/?random&quot; style=&quot;display:block;&quot;&gt;
214
+ &lt;div class=&quot;uniform-loader cover light&quot;&gt;
215
+ &lt;div class=&quot;uniform-loader-container&quot;&gt;
216
+ &lt;span&gt;&amp;bull;&lt;/span&gt;
217
+ &lt;span&gt;&amp;bull;&lt;/span&gt;
218
+ &lt;span&gt;&amp;bull;&lt;/span&gt;
219
+ &lt;/div&gt;
220
+ &lt;/div&gt;
221
+ &lt;/span&gt;</pre>
222
+ </div>
223
+ </div>
224
+ </div>
225
+ </div>
226
+ <script>document.write('<script src="http://' + (location.host || 'localhost').split(':')[0] + ':35729/livereload.js?snipver=1"></' + 'script>')</script>
227
+ <script src="https://cdnjs.cloudflare.com/ajax/libs/underscore.js/1.8.3/underscore-min.js"></script>
228
+ <script
229
+ src="https://code.jquery.com/jquery-1.11.3.min.js"
230
+ integrity="sha256-7LkWEzqTdpEfELxcZZlS6wAx5Ff13zZ83lYO2/ujj7g="
231
+ crossorigin="anonymous"></script>
232
+ <script src="/site/preview.js"></script>
233
+ </body>
data/site/modal.html ADDED
@@ -0,0 +1,157 @@
1
+ <!DOCTYPE html>
2
+ <head>
3
+ <meta http-equiv="Content-type" content="text/html; charset=utf-8">
4
+ <title>Uniform</title>
5
+ <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/normalize/4.2.0/normalize.css" type="text/css" media="screen">
6
+ <link rel="stylesheet" href="/site/uniform.css" type="text/css" media="screen" title="no title" charset="utf-8">
7
+ <link rel="stylesheet" href="/site/preview.css" type="text/css" media="screen" charset="utf-8">
8
+ </head>
9
+ <body>
10
+ <div class="side-nav">
11
+ <div class="pad">
12
+ <a href="/">
13
+ <img src="/site/logo.png" class="block">
14
+ </a>
15
+ </div>
16
+ <div class="uniformNav vertical">
17
+ <div class="nav">
18
+
19
+
20
+
21
+ <a href="/site/helpers.html">
22
+ Helpers
23
+
24
+ </a>
25
+
26
+
27
+ <a href="/site/colors.html">
28
+ Colors
29
+
30
+ </a>
31
+
32
+
33
+ <a href="/site/grid.html">
34
+ Grid
35
+
36
+ </a>
37
+
38
+
39
+ <a href="/site/buttons.html">
40
+ Buttons
41
+
42
+ </a>
43
+
44
+
45
+ <a href="/site/tables.html">
46
+ Tables
47
+
48
+ <span class="uniformLabel yellow">todo</span>
49
+
50
+ </a>
51
+
52
+
53
+ <a href="/site/cards.html">
54
+ Cards
55
+
56
+ </a>
57
+
58
+
59
+ <a href="/site/rows.html">
60
+ Rows
61
+
62
+ </a>
63
+
64
+
65
+ <a href="/site/form.html">
66
+ Form
67
+
68
+ </a>
69
+
70
+
71
+ <a href="/site/loaders.html">
72
+ Loaders
73
+
74
+ </a>
75
+
76
+
77
+ <a href="/site/nav.html">
78
+ Nav
79
+
80
+ </a>
81
+
82
+
83
+ <a href="/site/tabs.html">
84
+ Tabs
85
+
86
+ </a>
87
+
88
+
89
+ <a href="/site/tiles.html">
90
+ Tiles
91
+
92
+ <span class="uniformLabel yellow">todo</span>
93
+
94
+ </a>
95
+
96
+
97
+ <a href="/site/labels.html">
98
+ Labels
99
+
100
+ <span class="uniformLabel yellow">todo</span>
101
+
102
+ </a>
103
+
104
+
105
+ <a href="/site/alerts.html">
106
+ Alerts
107
+
108
+ <span class="uniformLabel yellow">todo</span>
109
+
110
+ </a>
111
+
112
+
113
+ <a href="/site/dropdown.html">
114
+ Dropdown
115
+
116
+ <span class="uniformLabel yellow">todo</span>
117
+
118
+ </a>
119
+
120
+
121
+ <a href="/site/modal.html">
122
+ Modal
123
+
124
+ <span class="uniformLabel yellow">todo</span>
125
+
126
+ </a>
127
+
128
+
129
+ <a href="/site/select.html">
130
+ Select
131
+
132
+ <span class="uniformLabel yellow">todo</span>
133
+
134
+ </a>
135
+
136
+
137
+ <a href="/site/tooltip.html">
138
+ Tooltip
139
+
140
+ <span class="uniformLabel yellow">todo</span>
141
+
142
+ </a>
143
+
144
+ </div>
145
+ </div>
146
+ </div>
147
+ <div class="main-content overflow-hidden">
148
+ TODO
149
+ </div>
150
+ <script>document.write('<script src="http://' + (location.host || 'localhost').split(':')[0] + ':35729/livereload.js?snipver=1"></' + 'script>')</script>
151
+ <script src="https://cdnjs.cloudflare.com/ajax/libs/underscore.js/1.8.3/underscore-min.js"></script>
152
+ <script
153
+ src="https://code.jquery.com/jquery-1.11.3.min.js"
154
+ integrity="sha256-7LkWEzqTdpEfELxcZZlS6wAx5Ff13zZ83lYO2/ujj7g="
155
+ crossorigin="anonymous"></script>
156
+ <script src="/site/preview.js"></script>
157
+ </body>
data/site/nav.html ADDED
@@ -0,0 +1,229 @@
1
+ <!DOCTYPE html>
2
+ <head>
3
+ <meta http-equiv="Content-type" content="text/html; charset=utf-8">
4
+ <title>Uniform</title>
5
+ <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/normalize/4.2.0/normalize.css" type="text/css" media="screen">
6
+ <link rel="stylesheet" href="/site/uniform.css" type="text/css" media="screen" title="no title" charset="utf-8">
7
+ <link rel="stylesheet" href="/site/preview.css" type="text/css" media="screen" charset="utf-8">
8
+ </head>
9
+ <body>
10
+ <div class="side-nav">
11
+ <div class="pad">
12
+ <a href="/">
13
+ <img src="/site/logo.png" class="block">
14
+ </a>
15
+ </div>
16
+ <div class="uniformNav vertical">
17
+ <div class="nav">
18
+
19
+
20
+
21
+ <a href="/site/helpers.html">
22
+ Helpers
23
+
24
+ </a>
25
+
26
+
27
+ <a href="/site/colors.html">
28
+ Colors
29
+
30
+ </a>
31
+
32
+
33
+ <a href="/site/grid.html">
34
+ Grid
35
+
36
+ </a>
37
+
38
+
39
+ <a href="/site/buttons.html">
40
+ Buttons
41
+
42
+ </a>
43
+
44
+
45
+ <a href="/site/tables.html">
46
+ Tables
47
+
48
+ <span class="uniformLabel yellow">todo</span>
49
+
50
+ </a>
51
+
52
+
53
+ <a href="/site/cards.html">
54
+ Cards
55
+
56
+ </a>
57
+
58
+
59
+ <a href="/site/rows.html">
60
+ Rows
61
+
62
+ </a>
63
+
64
+
65
+ <a href="/site/form.html">
66
+ Form
67
+
68
+ </a>
69
+
70
+
71
+ <a href="/site/loaders.html">
72
+ Loaders
73
+
74
+ </a>
75
+
76
+
77
+ <a href="/site/nav.html">
78
+ Nav
79
+
80
+ </a>
81
+
82
+
83
+ <a href="/site/tabs.html">
84
+ Tabs
85
+
86
+ </a>
87
+
88
+
89
+ <a href="/site/tiles.html">
90
+ Tiles
91
+
92
+ <span class="uniformLabel yellow">todo</span>
93
+
94
+ </a>
95
+
96
+
97
+ <a href="/site/labels.html">
98
+ Labels
99
+
100
+ <span class="uniformLabel yellow">todo</span>
101
+
102
+ </a>
103
+
104
+
105
+ <a href="/site/alerts.html">
106
+ Alerts
107
+
108
+ <span class="uniformLabel yellow">todo</span>
109
+
110
+ </a>
111
+
112
+
113
+ <a href="/site/dropdown.html">
114
+ Dropdown
115
+
116
+ <span class="uniformLabel yellow">todo</span>
117
+
118
+ </a>
119
+
120
+
121
+ <a href="/site/modal.html">
122
+ Modal
123
+
124
+ <span class="uniformLabel yellow">todo</span>
125
+
126
+ </a>
127
+
128
+
129
+ <a href="/site/select.html">
130
+ Select
131
+
132
+ <span class="uniformLabel yellow">todo</span>
133
+
134
+ </a>
135
+
136
+
137
+ <a href="/site/tooltip.html">
138
+ Tooltip
139
+
140
+ <span class="uniformLabel yellow">todo</span>
141
+
142
+ </a>
143
+
144
+ </div>
145
+ </div>
146
+ </div>
147
+ <div class="main-content overflow-hidden">
148
+ <div class="section">
149
+ <h1>Nav</h1>
150
+ <div class="uniformNav margin-bottom">
151
+ <div class="mobile-nav">
152
+ <button type="button">
153
+ <img src="/site/logo.png" height="31" width="137">
154
+ </button>
155
+ </div>
156
+ <div class="non-mobile-nav">
157
+ <div class="nav">
158
+ <a href="#" class="pad-none pad-right"><img src="/site/logo.png" height="31" width="137"></a>
159
+ <a href="#">Home</a>
160
+ <a href="#">About</a>
161
+ <a href="#">Contact</a>
162
+ </div>
163
+ </div>
164
+ </div>
165
+ <pre class=''>&lt;div class=&quot;uniformNav&quot;&gt;
166
+ &lt;div class=&quot;mobile-nav&quot;&gt;
167
+ &lt;button type=&quot;button&quot;&gt;
168
+ &lt;img src=&quot;/site/logo.png&quot; height=&quot;31&quot; width=&quot;137&quot;&gt;
169
+ &lt;/button&gt;
170
+ &lt;/div&gt;
171
+ &lt;div class=&quot;non-mobile-nav&quot;&gt;
172
+ &lt;div class=&quot;nav&quot;&gt;
173
+ &lt;a href=&quot;#&quot; class=&quot;pad-none pad-right&quot;&gt;&lt;img src=&quot;/site/logo.png&quot; height=&quot;31&quot; width=&quot;137&quot;&gt;&lt;/a&gt;
174
+ &lt;a href=&quot;#&quot;&gt;Home&lt;/a&gt;
175
+ &lt;a href=&quot;#&quot;&gt;About&lt;/a&gt;
176
+ &lt;a href=&quot;#&quot;&gt;Contact&lt;/a&gt;
177
+ &lt;/div&gt;
178
+ &lt;/div&gt;
179
+ &lt;/div&gt;</pre>
180
+ <br><br>
181
+ <h3>Vertical</h3>
182
+ <div class="grid no-wrap">
183
+ <div class="col-4">
184
+ <div class="uniformNav vertical">
185
+ <div class="mobile-nav">
186
+ <button type="button">
187
+ <img src="/site/logo.png" height="31" width="137">
188
+ </button>
189
+ </div>
190
+ <div class="non-mobile-nav">
191
+ <div class="nav">
192
+ <a href="#" class="pad-none pad-right"><img src="/site/logo.png" height="31" width="137"></a>
193
+ <a href="#">Home</a>
194
+ <a href="#">About</a>
195
+ <a href="#">Contact</a>
196
+ </div>
197
+ </div>
198
+ </div>
199
+ </div>
200
+ <div class="col-8">
201
+ <pre class='width-100-p'>&lt;div class=&quot;uniformNav vertical&quot;&gt;
202
+ &lt;div class=&quot;mobile-nav&quot;&gt;
203
+ &lt;button type=&quot;button&quot;&gt;
204
+ &lt;img src=&quot;/site/logo.png&quot; height=&quot;31&quot; width=&quot;137&quot;&gt;
205
+ &lt;/button&gt;
206
+ &lt;/div&gt;
207
+ &lt;div class=&quot;non-mobile-nav&quot;&gt;
208
+ &lt;div class=&quot;nav&quot;&gt;
209
+ &lt;a href=&quot;#&quot; class=&quot;pad-none pad-right&quot;&gt;&lt;img src=&quot;/site/logo.png&quot; height=&quot;31&quot; width=&quot;137&quot;&gt;&lt;/a&gt;
210
+ &lt;a href=&quot;#&quot;&gt;Home&lt;/a&gt;
211
+ &lt;a href=&quot;#&quot;&gt;About&lt;/a&gt;
212
+ &lt;a href=&quot;#&quot;&gt;Contact&lt;/a&gt;
213
+ &lt;/div&gt;
214
+ &lt;/div&gt;
215
+ &lt;/div&gt;</pre>
216
+ </div>
217
+ </div>
218
+
219
+ <p>//TODO show more options</p>
220
+ </div>
221
+ </div>
222
+ <script>document.write('<script src="http://' + (location.host || 'localhost').split(':')[0] + ':35729/livereload.js?snipver=1"></' + 'script>')</script>
223
+ <script src="https://cdnjs.cloudflare.com/ajax/libs/underscore.js/1.8.3/underscore-min.js"></script>
224
+ <script
225
+ src="https://code.jquery.com/jquery-1.11.3.min.js"
226
+ integrity="sha256-7LkWEzqTdpEfELxcZZlS6wAx5Ff13zZ83lYO2/ujj7g="
227
+ crossorigin="anonymous"></script>
228
+ <script src="/site/preview.js"></script>
229
+ </body>