rev |
line source |
al@898
|
1 /* CSS style for SliTaz Cooker */
|
al@898
|
2
|
al@898
|
3 *{font:14px/18px monospace;margin:0;padding:0}
|
al@898
|
4 html,body{height:100%;color:#888;background-color:#000}
|
al@898
|
5 #container {
|
al@898
|
6 position: relative;
|
al@898
|
7 min-height: 100%;
|
al@898
|
8 margin: 0 auto;
|
al@898
|
9 }
|
al@898
|
10
|
al@898
|
11
|
al@898
|
12 /* HEADER */
|
al@898
|
13
|
al@898
|
14 header,body>h2{background-color:#333}
|
al@898
|
15 header h1{display:inline-block;padding:18px 0}
|
al@898
|
16 header h1,body>h2{white-space:nowrap}
|
al@898
|
17 body>h2{padding:1rem 0}
|
al@898
|
18 header h1::before{content:'#! '}
|
al@898
|
19 header a,body>h2{color:#CCC}
|
al@898
|
20 .network{float:right}
|
al@898
|
21 .network a{padding:18px 8px 18px 0}
|
al@898
|
22 header select, header option {
|
al@898
|
23 background-color: transparent;
|
al@898
|
24 color: inherit;
|
al@898
|
25 border: none;
|
al@898
|
26 }
|
al@898
|
27
|
al@898
|
28
|
al@898
|
29 /* FOOTER */
|
al@898
|
30
|
al@898
|
31 footer, div.foot {
|
al@898
|
32 padding: 18px 0;
|
al@898
|
33 clear: both;
|
al@898
|
34 text-align: center;
|
al@898
|
35 color: #CCC;
|
al@898
|
36 background-color: #333;
|
al@898
|
37
|
al@898
|
38 position: absolute;
|
al@898
|
39 bottom: 0;
|
al@898
|
40 width: 100%;
|
al@898
|
41 }
|
al@898
|
42 footer a+a::before {
|
al@898
|
43 display: inline-block;
|
al@898
|
44 content: ' • ';
|
al@898
|
45 color: #E81;
|
al@898
|
46 }
|
al@898
|
47
|
al@898
|
48
|
al@898
|
49 /* CONTENT */
|
al@898
|
50
|
al@898
|
51 h2,h3{font-weight:bold;background-color:#333}
|
al@898
|
52 h2::before,h3::before{content:'#'}
|
al@898
|
53 h2{color:#F0F}
|
al@898
|
54 h3{color:#FF0}
|
al@898
|
55 a{display:inline-block;text-decoration:none;color:#00F}
|
al@898
|
56 a:hover,body>h2:hover{text-decoration:underline}
|
al@898
|
57 pre {
|
al@898
|
58 background-color: rgba(0,0,0,0.03);
|
al@898
|
59 border: 1px solid rgba(0,0,0,0.1);
|
al@898
|
60 margin: 18px 0 0;
|
al@898
|
61 overflow: auto;
|
al@898
|
62 font: 13px/18px monospace;
|
al@898
|
63 }
|
al@898
|
64 li::before{content:' * '}
|
al@898
|
65 p{margin-top:18px}
|
al@898
|
66
|
al@898
|
67 main{margin:auto;padding:0 0 54px}
|
al@898
|
68 section{margin-bottom:18px}
|
al@898
|
69 #content2, div.list {
|
al@898
|
70 width: 100%; box-sizing: border-box;
|
al@898
|
71 max-width: 700px;
|
al@898
|
72 margin: auto;
|
al@898
|
73 padding: 18px 0;
|
al@898
|
74 }
|
al@898
|
75 #info{margin:18px 0}
|
al@898
|
76
|
al@898
|
77 .btnList{margin-bottom:18px}
|
al@898
|
78
|
al@898
|
79 .span-ok { color: #0a0; }
|
al@898
|
80 .span-red { color: red; }
|
al@898
|
81 .span-sky { color: blue; }
|
al@898
|
82 .span-no { color: #d90; }
|
al@898
|
83 .span-line { color: #888; }
|
al@898
|
84 .log-date { color: #666; font-size: 95%; }
|
al@898
|
85 .sh-comment { color: #a00; }
|
al@898
|
86 .sh-val { color: #e50; font-weight: bold; }
|
al@898
|
87 .var { color: #05a; }
|
al@898
|
88
|
al@898
|
89
|
al@898
|
90 /* Colored log */
|
al@898
|
91
|
al@898
|
92 .log b { font-weight: normal; color: red; }
|
al@898
|
93 .log u { text-decoration: none; color: darkorange; }
|
al@898
|
94 .log i { font-style: normal; color: green; }
|
al@898
|
95 .log em { font-style: normal; background-color: lightsteelblue; font-weight: bold; display: inline-block; width: 100%; }
|
al@898
|
96
|
al@898
|
97
|
al@898
|
98
|
al@898
|
99 /* Buttons */
|
al@898
|
100
|
al@898
|
101 .button,button{color:#888}
|
al@898
|
102 .button::before,button::before{content:'['}
|
al@898
|
103 .button::after,button::after{content:']'}
|
al@898
|
104 .button.active {
|
al@898
|
105 color: inherit;
|
al@898
|
106 border: none;
|
al@898
|
107 text-decoration: none;
|
al@898
|
108 }
|
al@898
|
109 .button:hover, button:hover, input:hover {
|
al@898
|
110 color: #FFF;
|
al@898
|
111 text-decoration: none;
|
al@898
|
112 }
|
al@898
|
113 .button[data-acc]::before {
|
al@898
|
114 content: attr(data-acc);
|
al@898
|
115 padding:0 8px;
|
al@898
|
116 background-color: orange;
|
al@898
|
117 color: #000;
|
al@898
|
118 display: inline-block;
|
al@898
|
119 text-transform: uppercase;
|
al@898
|
120 }
|
al@898
|
121 .btnList .button::after{content:''}
|
al@898
|
122
|
al@898
|
123
|
al@898
|
124 /* Search box */
|
al@898
|
125
|
al@898
|
126 .search input{font-size:inherit;font-family:inherit;color:inherit;border:none;height:inherit}
|
al@898
|
127 .search button{border:0;height:inherit;float:right;background:transparent;cursor:pointer}
|
al@898
|
128
|
al@898
|
129
|
al@898
|
130
|
al@898
|
131
|
al@898
|
132
|
al@898
|
133 .log a[name]{text-decoration:none;color:#666}
|
al@898
|
134 .log a[name]:hover{color:#FFF}
|
al@898
|
135
|
al@898
|
136 .r{float:right}
|
al@898
|
137
|
al@898
|
138 [class*="bigicon-"] {
|
al@898
|
139 margin: 0.5rem 0;
|
al@898
|
140 padding: 1rem 0.8rem 1rem 3rem;
|
al@898
|
141 background-color: hsla(0,0%,100%,0.8);
|
al@898
|
142 box-shadow: 0 0 3px rgba(0,0,0,0.4);
|
al@898
|
143 }
|
al@898
|
144
|
al@898
|
145
|
al@898
|
146 a:target { background-color: yellow; }
|
al@898
|
147
|
al@898
|
148
|
al@898
|
149 /* Table */
|
al@898
|
150
|
al@898
|
151 table{width:100%;box-sizing:border-box;border-collapse:collapse}
|
al@898
|
152 td{vertical-align:top}
|
al@898
|
153 td:first-child{white-space:nowrap;width:5rem}
|
al@898
|
154 td+td,th+th { border-left: 1px solid rgba(0,0,0,0.1); }
|
al@898
|
155 .activity td:first-child, .cooknotes td:first-child, td.m { color: #444; }
|
al@898
|
156 table td:nth-child(2)::before{content:': '}
|
al@898
|
157 .activity .r.c20::after{content:' '}
|
al@898
|
158
|
al@898
|
159 div.list td, div.list th { padding: 5px 2px; }
|
al@898
|
160
|
al@898
|
161 .texinfo pre { display: none; }
|
al@898
|
162 .texinfo pre:target { display: block; }
|
al@898
|
163
|
al@898
|
164
|
al@898
|
165 /* HTML5 progress */
|
al@898
|
166
|
al@898
|
167 .meter{height:18px}
|
al@898
|
168 .meter progress {
|
al@898
|
169 height: inherit;
|
al@898
|
170 width: 100%;
|
al@898
|
171 display: inline-block;
|
al@898
|
172 vertical-align: middle;
|
al@898
|
173 border: none;
|
al@898
|
174 }
|
al@898
|
175 progress {
|
al@898
|
176 border: 1px solid rgba(0,0,0,0.2);
|
al@898
|
177 background-color: hsla(0,0%,100%,0.6);
|
al@898
|
178 box-shadow: inset 0 0 4px rgba(0,0,0,0.1);
|
al@898
|
179 -webkit-transition: all .5s; transition: all .5s;
|
al@898
|
180 }
|
al@898
|
181 progress::-webkit-progress-bar {
|
al@898
|
182 background-color: hsla(0,0%,100%,0.6);
|
al@898
|
183 box-shadow: inset 0 0 4px rgba(0,0,0,0.1);
|
al@898
|
184 }
|
al@898
|
185 progress::-webkit-progress-value {
|
al@898
|
186 background-color: hsla(100,100%,40%,0.7);
|
al@898
|
187 -webkit-transition: all .5s; transition: all .5s;
|
al@898
|
188 }
|
al@898
|
189 progress::-moz-progress-bar {
|
al@898
|
190 background-color: hsla(100,100%,40%,0.7);
|
al@898
|
191 transition: all .5s;
|
al@898
|
192 }
|
al@898
|
193 .meter span {
|
al@898
|
194 display: block;
|
al@898
|
195 white-space: nowrap;
|
al@898
|
196 position: relative;
|
al@898
|
197 margin-top: -18px;
|
al@898
|
198 text-align: center;
|
al@898
|
199 color: #000;
|
al@898
|
200 }
|
al@898
|
201
|
al@898
|
202
|
al@898
|
203
|
al@898
|
204
|
al@898
|
205 /* Documents iframe */
|
al@898
|
206
|
al@898
|
207 iframe {
|
al@898
|
208 border: none;
|
al@898
|
209 }
|
al@898
|
210
|
al@898
|
211
|
al@898
|
212 /* Terminal colors */
|
al@898
|
213
|
al@898
|
214 pre.files { background-color: hsla(0,0%,0%,0.8); color: hsla(0,0%,100%,0.9); }
|
al@898
|
215 pre.files a { text-decoration: none; }
|
al@898
|
216 .c00 { color: #d3d7cf; } .c01 { color: #555753; }
|
al@898
|
217 .c10 { color: #cc0000; } .c11 { color: #ef2929; }
|
al@898
|
218 .c20 { color: #4e9a06; } .c21 { color: #8ae234; }
|
al@898
|
219 .c30 { color: #c4a000; } .c31 { color: #fce94f; }
|
al@898
|
220 .c40 { color: #3465a4; } .c41 { color: #729fcf; }
|
al@898
|
221 .c50 { color: #75507b; } .c51 { color: #ad7fa8; }
|
al@898
|
222 .c60 { color: #06989a; } .c61 { color: #34e2e2; }
|
al@898
|
223 .c70 { color: #2e3436; } .c71 { color: #eeeeec; }
|
al@898
|
224 .c01,.c11,.c21,.c31,.c41,.c51,.c61,.c71 { font-weight: bold; }
|
al@898
|
225
|
al@898
|
226 /* Old webkit-gtk compatibility */
|
al@898
|
227
|
al@898
|
228 header, footer, main {
|
al@898
|
229 display: block;
|
al@898
|
230 }
|
al@898
|
231
|
al@898
|
232
|
al@898
|
233 /* FOLLOWING CSS HAS SOME CHANGES FOR SLITAZ COOKER! */
|
al@898
|
234
|
al@898
|
235 /* http://prismjs.com/download.html?themes=prism-okaidia&languages=markup+css+clike+javascript+asciidoc+bash+c+css-extras+diff+ini+markdown+perl+python */
|
al@898
|
236 /**
|
al@898
|
237 * okaidia theme for JavaScript, CSS and HTML
|
al@898
|
238 * Loosely based on Monokai textmate theme by http://www.monokai.nl/
|
al@898
|
239 * @author ocodia
|
al@898
|
240 */
|
al@898
|
241 code[class*="language-"], pre[class*="language-"] {
|
al@898
|
242 color: #f8f8f2;
|
al@898
|
243 background: none;
|
al@898
|
244 text-shadow: 0 1px rgba(0,0,0,0.3);
|
al@898
|
245 text-align: left;
|
al@898
|
246 white-space: pre;
|
al@898
|
247 word-spacing: normal;
|
al@898
|
248 word-break: normal;
|
al@898
|
249 word-wrap: normal;
|
al@898
|
250 -moz-tab-size: 4; -o-tab-size: 4; tab-size: 4;
|
al@898
|
251 -webkit-hyphens: none; -moz-hyphens: none; hyphens: none;
|
al@898
|
252 }
|
al@898
|
253 /* Code blocks */
|
al@898
|
254 pre[class*="language-"] {
|
al@898
|
255 padding: 1em;
|
al@898
|
256 margin: .5em 0;
|
al@898
|
257 overflow: auto;
|
al@898
|
258 }
|
al@898
|
259 :not(pre) > code[class*="language-"], pre[class*="language-"] {
|
al@898
|
260 background: #272822;
|
al@898
|
261 }
|
al@898
|
262 /* Inline code */
|
al@898
|
263 :not(pre) > code[class*="language-"] {
|
al@898
|
264 padding: .1em;
|
al@898
|
265 white-space: normal;
|
al@898
|
266 }
|
al@898
|
267 .token.comment,.token.prolog,.token.doctype,.token.cdata{color:slategray;}
|
al@898
|
268 .token.punctuation{color:#f8f8f2;}
|
al@898
|
269 .namespace{opacity:.7;}
|
al@898
|
270 .token.property,.token.tag,.token.constant,.token.symbol,.token.deleted{color:#f92672;}
|
al@898
|
271 .token.boolean,.token.number,.token.coord{color:#ae81ff;}
|
al@898
|
272 .token.selector,.token.attr-name,.token.string,.token.char,.token.builtin,.token.inserted{color:#a6e22e;}
|
al@898
|
273 .token.operator,.token.entity,.token.url,.language-css .token.string,.style .token.string,.token.variable{color:#f8f8f2;}
|
al@898
|
274 .token.atrule,.token.attr-value,.token.function{color:#e6db74;}
|
al@898
|
275 .token.keyword{color:#66d9ef;}
|
al@898
|
276 .token.regex,.token.important{color:#fd971f;}
|
al@898
|
277 .token.important,.token.bold{font-weight:bold;}
|
al@898
|
278 .token.italic{font-style:italic;}
|
al@898
|
279 .token.entity{cursor:help;}
|