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