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