Files: bdc777360c48b4ead49e30a0a5932c35621c0c90 / style.css
3165 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 | p { |
33 | margin-top: .35ex; |
34 | margin-bottom: 10px; |
35 | } |
36 | |
37 | |
38 | a { |
39 | color: white; |
40 | *text-decoration: none; |
41 | } |
42 | |
43 | a:hover { |
44 | color: #ddd; |
45 | } |
46 | |
47 | .navbar a { |
48 | color: #999; |
49 | text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.25); |
50 | text-decoration: none; |
51 | } |
52 | |
53 | .navbar a:hover, .navbar a:focus { |
54 | color: #fff; |
55 | text-decoration: none; |
56 | } |
57 | |
58 | .navbar { |
59 | background: #1b1b1b; |
60 | background: linear-gradient(#222, #111); |
61 | border-bottom: 1px solid #252525; |
62 | } |
63 | |
64 | .navbar { |
65 | width: 100%; |
66 | position: fixed; |
67 | z-index: 1000; |
68 | margin: 0; |
69 | padding-top: .3em; |
70 | padding-bottom: .3em; |
71 | left: 0; right: 0; |
72 | top: 0; |
73 | } |
74 | |
75 | .navbar .internal { |
76 | max-width: 680px; |
77 | margin-left: auto; |
78 | margin-right: auto; |
79 | } |
80 | |
81 | .navbar li { |
82 | margin-top: .3em; |
83 | float: left; |
84 | margin-right: .6em; |
85 | margin-left: .3em; |
86 | list-style-type: none; |
87 | } |
88 | |
89 | .navbar li.right { |
90 | padding-left: .4em; |
91 | padding-right: .4em; |
92 | margin-top: .3em; |
93 | margin-right: 1.7em; |
94 | float: right; |
95 | list-style-type: none; |
96 | background: #333; |
97 | border-radius: 100%; |
98 | } |
99 | |
100 | .content { |
101 | max-width: 680px; |
102 | margin-left: auto; |
103 | margin-right: auto; |
104 | } |
105 | |
106 | .hyperscroll > .content { |
107 | max-width: 680px; |
108 | margin-left: auto; |
109 | margin-right: auto; |
110 | } |
111 | |
112 | .message, .message > *, .navbar, .navbar > * { |
113 | animation: fadein .5s; |
114 | } |
115 | |
116 | @keyframes fadein { |
117 | from { opacity: 0; } |
118 | to { opacity: 1; } |
119 | } |
120 | |
121 | .message, .embedded { |
122 | display: block; |
123 | margin: .6em; |
124 | background: #111; |
125 | padding: .7em; |
126 | border-radius: 3px; |
127 | border: 1px solid #252525; |
128 | } |
129 | |
130 | .embedded { |
131 | padding-left: 1em; |
132 | } |
133 | |
134 | .message:hover, .embedded:hover { |
135 | background: #141414; |
136 | } |
137 | |
138 | .message img { |
139 | max-width: 100%; |
140 | } |
141 | |
142 | .timestamp, .votes { |
143 | float: right; |
144 | } |
145 | |
146 | .avatar--small img { |
147 | vertical-align: top; |
148 | width: 1.4em; |
149 | height: 1.4em; |
150 | margin-right: .2em; |
151 | } |
152 | |
153 | .compose { |
154 | background: #222; |
155 | color: #ccc; |
156 | width: 100%; |
157 | height: 100px; |
158 | border: 1px solid #252525; |
159 | border-radius: 3px; |
160 | } |
161 | |
162 | .emoji { |
163 | float: left; |
164 | width: 1em; |
165 | vertical-align: top; |
166 | } |
167 | |
168 | pre { |
169 | width: 100%; |
170 | display: block; |
171 | } |
172 | |
173 | code { |
174 | display: inline-block; |
175 | vertical-align: bottom; |
176 | } |
177 | |
178 | code, pre { |
179 | overflow: auto; |
180 | word-break: break-all; |
181 | word-wrap: break-word; |
182 | white-space: pre; |
183 | white-space: -moz-pre-wrap; |
184 | white-space: pre-wrap; |
185 | white-space: pre\9; |
186 | } |
187 | |
188 | |
189 | .btn { |
190 | display: inline-block; |
191 | *display: inline; |
192 | padding: 2px 6px; |
193 | margin-bottom: 0; |
194 | margin-right: .2em; |
195 | font-size: 14px; |
196 | line-height: 20px; |
197 | color: #d5d5d5; |
198 | text-align: center; |
199 | text-shadow: 0 1px 1px rgba(0, 0, 0, 0.75); |
200 | vertical-align: middle; |
201 | cursor: pointer; |
202 | background-color: #222; |
203 | border: 1px solid #222; |
204 | border-radius: 4px; |
205 | } |
206 | |
207 | |
208 | .btn:hover, |
209 | .btn:focus, |
210 | .btn:active, |
211 | .btn.active, |
212 | .btn.disabled, |
213 | .btn[disabled] { |
214 | color: white; |
215 | background-color: black; |
216 | } |
217 | |
218 | .btn:active, |
219 | .btn.active { |
220 | background-color: #111; |
221 | } |
222 | |
223 | .btn:first-child { |
224 | *margin-left: 0; |
225 | } |
226 | |
227 |
Built with git-ssb-web