Files: a806cd1af8952ab8009acf977d0d69b04a3fd95f / style.css
4036 bytesRaw
1 | body { |
2 | margin: 0; |
3 | background: #141414; |
4 | font-family: sans-serif; |
5 | color: #d5d5d5; |
6 | font-size: 14px; |
7 | line-height: 20px; |
8 | } |
9 | |
10 | #screen { |
11 | position: absolute; |
12 | top: 35px; |
13 | bottom: 0px; |
14 | left: 0px; |
15 | right: 0px; |
16 | } |
17 | |
18 | .hyperscroll { |
19 | width: 100%; |
20 | } |
21 | |
22 | .header { |
23 | padding-bottom: .7em; |
24 | border-bottom: 1px solid #252525; |
25 | } |
26 | |
27 | h1, h2, h3, h4, h5, h6 { |
28 | font-size: 1.2em; |
29 | margin-top: .35ex; |
30 | } |
31 | |
32 | hr { |
33 | border: solid #222; |
34 | clear: both; |
35 | border-width: 1px 0 0; |
36 | height: 0; |
37 | margin-bottom: .9em; |
38 | } |
39 | |
40 | |
41 | p { |
42 | margin-top: .35ex; |
43 | margin-bottom: 10px; |
44 | } |
45 | |
46 | /*a { |
47 | color: #00aaff; |
48 | text-decoration: none; |
49 | } |
50 | |
51 | a:hover, |
52 | a:focus { |
53 | color: #0088cc; |
54 | text-decoration: underline; |
55 | }*/ |
56 | |
57 | a { |
58 | color: white; |
59 | *text-decoration: none; |
60 | } |
61 | |
62 | a:hover { |
63 | color: #ddd; |
64 | } |
65 | |
66 | .navbar a { |
67 | color: #999; |
68 | text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.25); |
69 | text-decoration: none; |
70 | } |
71 | |
72 | .navbar a:hover, .navbar a:focus { |
73 | color: #fff; |
74 | text-decoration: none; |
75 | } |
76 | |
77 | .navbar { |
78 | background: #1b1b1b; |
79 | background: linear-gradient(#222, #111); |
80 | border-bottom: 1px solid #252525; |
81 | } |
82 | |
83 | .navbar { |
84 | width: 100%; |
85 | position: fixed; |
86 | z-index: 1000; |
87 | margin: 0; |
88 | padding-top: .3em; |
89 | padding-bottom: .3em; |
90 | left: 0; right: 0; |
91 | top: 0; |
92 | } |
93 | |
94 | .navbar .internal { |
95 | max-width: 680px; |
96 | margin-left: auto; |
97 | margin-right: auto; |
98 | } |
99 | |
100 | .navbar li { |
101 | margin-top: .3em; |
102 | float: left; |
103 | margin-right: .6em; |
104 | margin-left: .3em; |
105 | list-style-type: none; |
106 | } |
107 | |
108 | .navbar li.right { |
109 | padding-left: .4em; |
110 | padding-right: .4em; |
111 | margin-top: .3em; |
112 | margin-right: 1.7em; |
113 | float: right; |
114 | list-style-type: none; |
115 | background: #333; |
116 | border-radius: 100%; |
117 | } |
118 | |
119 | .content { |
120 | max-width: 680px; |
121 | margin-left: auto; |
122 | margin-right: auto; |
123 | } |
124 | |
125 | .hyperscroll > .content { |
126 | max-width: 680px; |
127 | margin-left: auto; |
128 | margin-right: auto; |
129 | } |
130 | |
131 | .message, .message > *, .navbar, .navbar > * { |
132 | animation: fadein .5s; |
133 | } |
134 | |
135 | @keyframes fadein { |
136 | from { opacity: 0; } |
137 | to { opacity: 1; } |
138 | } |
139 | |
140 | .message, .embedded { |
141 | display: block; |
142 | margin: .6em; |
143 | background: #111; |
144 | padding: .7em; |
145 | border-radius: 3px; |
146 | border: 1px solid #252525; |
147 | } |
148 | |
149 | .embedded { |
150 | padding-left: 1em; |
151 | } |
152 | |
153 | .message:hover, .embedded:hover { |
154 | background: #141414; |
155 | } |
156 | |
157 | .message img, .message video { |
158 | max-width: 100%; |
159 | } |
160 | |
161 | img { |
162 | border-radius: 3px; |
163 | } |
164 | |
165 | .timestamp, .votes { |
166 | float: right; |
167 | } |
168 | |
169 | .avatar--small img { |
170 | vertical-align: top; |
171 | width: 1.4em; |
172 | height: 1.4em; |
173 | margin-right: .2em; |
174 | } |
175 | |
176 | .avatar--medium img { |
177 | float: left; |
178 | vertical-align: top; |
179 | width: 5em; |
180 | height: 5em; |
181 | margin-right: .5em; |
182 | margin-bottom: .5em; |
183 | } |
184 | |
185 | .compose, textarea, input { |
186 | font-family: sans-serif; |
187 | font-size: 14px; |
188 | line-height: 20px; |
189 | background: #111; |
190 | color: #ccc; |
191 | border: none; |
192 | border-radius: 3px; |
193 | } |
194 | |
195 | textarea { |
196 | width: 100%; |
197 | height: 100px; |
198 | } |
199 | |
200 | .compose:hover { |
201 | background: #141414; |
202 | } |
203 | |
204 | .compose:focus { |
205 | outline: none; |
206 | } |
207 | |
208 | .emoji { |
209 | padding: .2em; |
210 | } |
211 | |
212 | .right { |
213 | float: right; |
214 | } |
215 | |
216 | .emoji { |
217 | *float: left; |
218 | width: 1em; |
219 | vertical-align: top; |
220 | } |
221 | |
222 | pre { |
223 | width: 100%; |
224 | display: block; |
225 | } |
226 | |
227 | code { |
228 | display: inline-block; |
229 | vertical-align: bottom; |
230 | } |
231 | |
232 | code, pre { |
233 | overflow: auto; |
234 | word-break: break-all; |
235 | word-wrap: break-word; |
236 | white-space: pre; |
237 | white-space: -moz-pre-wrap; |
238 | white-space: pre-wrap; |
239 | white-space: pre\9; |
240 | } |
241 | |
242 | code, pre { |
243 | font-size: 12px; |
244 | color: #ccc; |
245 | } |
246 | |
247 | code { |
248 | color: #ccc; |
249 | } |
250 | |
251 | pre { |
252 | margin: 0 0 10px; |
253 | font-size: 13px; |
254 | line-height: 20px; |
255 | } |
256 | |
257 | button {margin: 0; margin-top: -.2em;} |
258 | |
259 | input {width: 88%; } |
260 | |
261 | #profile input {width: 50%;} |
262 | |
263 | .btn { |
264 | display: inline-block; |
265 | *display: inline; |
266 | padding: 2px 6px; |
267 | margin-bottom: 0; |
268 | margin-right: .2em; |
269 | font-size: 14px; |
270 | line-height: 20px; |
271 | color: #d5d5d5; |
272 | text-align: center; |
273 | text-shadow: 0 1px 1px rgba(0, 0, 0, 0.75); |
274 | vertical-align: middle; |
275 | cursor: pointer; |
276 | background-color: #222; |
277 | border: 1px solid #222; |
278 | border-radius: 4px; |
279 | } |
280 | |
281 | |
282 | .btn:hover, |
283 | .btn:focus, |
284 | .btn:active, |
285 | .btn.active, |
286 | .btn.disabled, |
287 | .btn[disabled] { |
288 | color: white; |
289 | background-color: black; |
290 | } |
291 | |
292 | .btn:active, |
293 | .btn.active { |
294 | background-color: #111; |
295 | } |
296 | |
297 | .btn:first-child { |
298 | *margin-left: 0; |
299 | } |
300 | |
301 |
Built with git-ssb-web