Skip to content

Commit e45f69d

Browse files
carlbennettcarlbennett
committed
First stab at mobile site
1 parent a5f4347 commit e45f69d

File tree

4 files changed

+389
-29
lines changed

4 files changed

+389
-29
lines changed

‎static/a/main-mobile.css

Lines changed: 358 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,358 @@
1+
/**
2+
* BNETDocs (C) 2016 Creative Commons CC-BY-NC-SA 4.0 License
3+
*/
4+
5+
body {
6+
background: #272727 url("/a/main_bg.png") repeat fixed center;
7+
color: #ddd;
8+
font: 13pt source sans pro, verdana, arial, sans-serif;
9+
margin: 48px 0px 0px 0px;
10+
padding: 0px;
11+
}
12+
a,
13+
a:focus {
14+
outline: none;
15+
}
16+
a:hover {
17+
text-decoration: underline;
18+
}
19+
a:link {
20+
color: #00c0ff;
21+
text-decoration: none;
22+
}
23+
a:visited {
24+
color: #00a0cf;
25+
}
26+
header.main-page {
27+
background-color: rgba(64,64,64,0.8);
28+
-moz-box-sizing: border-box;
29+
box-sizing: border-box;
30+
cursor: default;
31+
color: rgba(0,222,180,0.9);
32+
font: 20pt source sans pro, verdana, arial, sans-serif;
33+
left: 0px;
34+
line-height: 32px;
35+
padding: 8px 12px;
36+
position: fixed;
37+
right: 0px;
38+
top: 0px;
39+
-webkit-touch-callout: none;
40+
-webkit-user-select: none;
41+
-khtml-user-select: none;
42+
-moz-user-select: none;
43+
-ms-user-select: none;
44+
user-select: none;
45+
}
46+
nav {
47+
/* TODO
48+
* JAVASCRIPT INTEGRATION
49+
* AUTO-SHOW/HIDE
50+
*/
51+
background-color: rgba(64,64,64,1);
52+
cursor: default;
53+
display: none; // FIXME
54+
font: 16pt source sans pro, verdana, arial, sans-serif;
55+
line-height: 28px;
56+
overflow: auto;
57+
padding: 4px;
58+
position: fixed;
59+
right: 0px;
60+
left: 0px;
61+
top: 48px;
62+
width: 80%;
63+
-webkit-touch-callout: none;
64+
-webkit-user-select: none;
65+
-khtml-user-select: none;
66+
-moz-user-select: none;
67+
-ms-user-select: none;
68+
user-select: none;
69+
}
70+
nav > a {
71+
color: inherit;
72+
cursor: default;
73+
display: block;
74+
font-size: 14pt;
75+
font-weight: bold;
76+
}
77+
nav > a:hover {
78+
text-decoration: none;
79+
}
80+
nav > a[href] {
81+
border: 1px solid rgba(128,128,128,0.15);
82+
cursor: pointer;
83+
display: inline-block;
84+
font-family: source sans pro, verdana, arial, sans-serif;
85+
font-size: 13pt;
86+
font-weight: inherit;
87+
padding-top: 0px;
88+
}
89+
nav > a[href]:hover {
90+
background-color: rgba(128,128,128,0.15);
91+
text-decoration: none;
92+
}
93+
nav > a#nav-current {
94+
background-image: url("/a/nav_arrow.png");
95+
background-position: left center;
96+
background-repeat: no-repeat;
97+
}
98+
main {
99+
overflow: hidden;
100+
width: 100%;
101+
}
102+
main > article,
103+
main.slim > article {
104+
margin: 10px 0px;
105+
overflow: hidden;
106+
}
107+
main > article:first-of-type,
108+
main.slim > article:first-of-type {
109+
margin-top: 0px;
110+
}
111+
main > article:last-of-type,
112+
main.slim > article:last-of-type {
113+
margin-bottom: 0px;
114+
}
115+
main > article > header {
116+
background-color: rgba(64,64,64,0.6);
117+
display: block;
118+
font: 14pt source sans pro;
119+
padding: 10px;
120+
}
121+
main > article > header.no-select {
122+
cursor: default;
123+
-webkit-touch-callout: none;
124+
-webkit-user-select: none;
125+
-khtml-user-select: none;
126+
-moz-user-select: none;
127+
-ms-user-select: none;
128+
user-select: none;
129+
}
130+
main > article header.green {
131+
background-color: rgba(64,128,64,0.6);
132+
}
133+
main > article header.red {
134+
background-color: rgba(128,64,64,0.6);
135+
}
136+
main > article .social-btn {
137+
display: inline-block;
138+
border-radius: 4px;
139+
box-shadow: inset 0 0 10px rgba(0,0,0,0.5);
140+
margin: 4px 4px 4px 0px;
141+
padding: 6px;
142+
-webkit-touch-callout: none;
143+
-webkit-user-select: none;
144+
-khtml-user-select: none;
145+
-moz-user-select: none;
146+
-ms-user-select: none;
147+
user-select: none;
148+
vertical-align: top;
149+
}
150+
main > article section {
151+
background-color: rgba(64,64,64,0.4);
152+
padding: 10px;
153+
}
154+
main > article section.green {
155+
background-color: rgba(64,128,64,0.4);
156+
}
157+
main > article section.red {
158+
background-color: rgba(128,64,64,0.4);
159+
}
160+
main > article section.fixed-width-text {
161+
font-family: source code pro, courier new, monospace;
162+
font-size: 85%;
163+
white-space: pre-wrap;
164+
}
165+
main > article section > p:first-of-type {
166+
margin-top: 0px;
167+
}
168+
main > article section > p:last-of-type {
169+
margin-bottom: 0px;
170+
}
171+
main > article section img {
172+
max-width: 100%;
173+
}
174+
main > article > footer {
175+
background-color: rgba(64, 64, 64, 0.6);
176+
display: block;
177+
font: 12pt source sans pro;
178+
margin: 0px;
179+
min-height: 20px;
180+
padding: 10px;
181+
}
182+
main > p.pagination {
183+
text-align: center;
184+
margin-left: 232px;
185+
}
186+
p.pagination > a {
187+
background-color: rgba(128,128,128,0.4);
188+
border: 0px;
189+
-moz-box-sizing: border-box;
190+
box-sizing: border-box;
191+
display: inline-block;
192+
color: inherit;
193+
cursor: pointer;
194+
margin: 1px 0px;
195+
outline: none;
196+
padding: 4px 8px;
197+
text-align: center;
198+
}
199+
p.pagination > a.active {
200+
background-color: rgba(128,128,128,0.8);
201+
}
202+
footer.main-page,
203+
footer.main-page.slim {
204+
box-sizing: border-box;
205+
color: rgba(224,224,224,0.3);
206+
font: 8pt source code pro, monospace;
207+
margin: 0px;
208+
overflow: hidden;
209+
padding: 20px;
210+
text-align: center;
211+
width: 100%;
212+
}
213+
::-webkit-scrollbar {
214+
height: 0.6em;
215+
width: 0.6em;
216+
}
217+
::-webkit-scrollbar-track,
218+
::-webkit-scrollbar-corner {
219+
background: rgba(255,255,255,0.25);
220+
}
221+
::-webkit-scrollbar-thumb {
222+
background: rgba(255,255,255,0.3);
223+
}
224+
.float-left {
225+
float: left;
226+
}
227+
.float-right {
228+
float: right;
229+
}
230+
p.left,
231+
span.left,
232+
th.left,
233+
td.left {
234+
text-align: left;
235+
}
236+
p.center,
237+
span.center,
238+
th.center,
239+
td.center {
240+
text-align: center;
241+
}
242+
p.justify,
243+
span.justify,
244+
th.justify,
245+
td.justify {
246+
text-align: justify;
247+
}
248+
p.right,
249+
span.right,
250+
th.right,
251+
td.right {
252+
text-align: right;
253+
}
254+
p.red,
255+
span.red,
256+
th.red,
257+
td.red {
258+
color: #d74747;
259+
}
260+
p.green,
261+
span.green,
262+
th.green,
263+
td.green {
264+
color: #47d747;
265+
}
266+
p.blue,
267+
span.blue
268+
th.blue,
269+
td.blue {
270+
color: #4747d7;
271+
}
272+
.monospace {
273+
font-family: source code pro, courier new, monospace;
274+
}
275+
code {
276+
background-color: rgba(255,255,255,0.1);
277+
border-radius: 3px;
278+
font-family: source code pro, courier new, monospace;
279+
font-size: 85%;
280+
line-height: 16pt;
281+
margin: 0px;
282+
padding: 0.1em 0px 0.1em 0px;
283+
}
284+
code:before,
285+
code:after {
286+
content: "\00a0";
287+
letter-spacing: -0.3em;
288+
}
289+
pre > code {
290+
background-color: rgba(255,255,255,0.05);
291+
border-radius: 5px;
292+
box-sizing: border-box;
293+
clear: both;
294+
display: block;
295+
line-height: 11pt;
296+
margin: 0px;
297+
overflow: auto;
298+
padding: 16px;
299+
white-space: pre;
300+
word-break: normal;
301+
word-wrap: normal;
302+
}
303+
pre > code:before,
304+
pre > code:after {
305+
content: initial;
306+
letter-spacing: initial;
307+
}
308+
ol.decimal {
309+
list-style-type: decimal;
310+
}
311+
ol.lower-alpha {
312+
list-style-type: lower-alpha;
313+
}
314+
ol.lower-latin {
315+
list-style-type: lower-latin;
316+
}
317+
blockquote {
318+
background-image: url("/a/quote-symbol.png");
319+
background-position: 0px -12px;
320+
background-repeat: no-repeat;
321+
margin: 0px;
322+
padding: 0px 0px 0px 48px;
323+
}
324+
table {
325+
border-collapse: collapse;
326+
border-width: 0px;
327+
width: 100%;
328+
}
329+
table th,
330+
table td {
331+
border: 1px solid rgba(255,255,255,0.05);
332+
line-height: 22px;
333+
padding: 4px 6px;
334+
}
335+
table thead tr:first-child th,
336+
table tbody tr:first-child th,
337+
table tbody tr:first-child td {
338+
border-top: 0px;
339+
}
340+
table tbody tr:last-child th,
341+
table tbody tr:last-child td {
342+
border-bottom: 0px;
343+
}
344+
table tr th:first-child,
345+
table tr td:first-child {
346+
border-left: 0px;
347+
}
348+
table tr th:last-child,
349+
table tr td:last-child {
350+
border-right: 0px;
351+
}
352+
table img.avatar {
353+
border-radius: 3px;
354+
float: left;
355+
max-height: 22px;
356+
max-width: 22px;
357+
margin: 0px 8px 0px 0px;
358+
}

0 commit comments

Comments
 (0)