Files: 4bcfc9f6bc102b97669476fbfb3c7cf0457647ee / style.css
3338 bytesRaw
1 | body { |
2 | font-family: "Source Sans Pro", sans-serif; |
3 | } |
4 | |
5 | p { margin-top: .35ex;} |
6 | |
7 | .screen { |
8 | position: absolute; |
9 | top: 0px; bottom: 0px; |
10 | left: 0px; right: 0px; |
11 | overflow-y: hidden; |
12 | } |
13 | |
14 | .column { |
15 | display: flex; |
16 | flex-direction: column; |
17 | background: #f5f5f5; |
18 | min-height: 0px; |
19 | } |
20 | |
21 | .row { |
22 | display: flex; |
23 | flex-direction: row; |
24 | } |
25 | |
26 | .stretch { |
27 | flex-basis: 0; |
28 | } |
29 | |
30 | .fixed { |
31 | flex-grow: 1; |
32 | flex-shrink: 1; |
33 | } |
34 | |
35 | .scroll-y { |
36 | overflow-y: auto; |
37 | } |
38 | |
39 | .scroll-x { |
40 | overflow-x: auto; |
41 | } |
42 | |
43 | .button { |
44 | border: 2px; margin: 3px; |
45 | max-width: 50px; |
46 | overflow-x: hidden; |
47 | } |
48 | |
49 | |
50 | img { |
51 | max-width: 100%; |
52 | display: block; |
53 | } |
54 | |
55 | pre { |
56 | max-width: 650px; |
57 | white-space: pre-wrap; |
58 | } |
59 | |
60 | /* scrolling feeds, threads */ |
61 | |
62 | .scroller { |
63 | width: 100%; |
64 | } |
65 | |
66 | .scroller > * { |
67 | margin-left: auto; |
68 | margin-right: auto; |
69 | } |
70 | |
71 | .scroller__wrapper { |
72 | width: 100%; |
73 | } |
74 | |
75 | @media (min-width: 600px) { |
76 | .scroller__wrapper { |
77 | width: 600px; |
78 | } |
79 | } |
80 | |
81 | |
82 | /* --- hypertabs ------- */ |
83 | |
84 | .hypertabs__tabs { |
85 | overflow-y: hide; |
86 | } |
87 | |
88 | .hypertabs > .row { |
89 | flex-grow: 0; flex-shrink: 0; |
90 | margin: 10px; |
91 | } |
92 | |
93 | .hypertabs__tabs > * { |
94 | max-width: 50px; |
95 | overflow-x: hidden; |
96 | margin-right: 5px; |
97 | padding-top: 1px; |
98 | } |
99 | |
100 | .hypertabs--selected { |
101 | background: white; |
102 | border: 1px solid #ccc; |
103 | padding-top: 0; |
104 | padding-left: 5px; |
105 | padding-right: 5px; |
106 | max-width: 200px; |
107 | } |
108 | |
109 | /* message id */ |
110 | |
111 | input { |
112 | margin-left: 3px; |
113 | margin-right: 3px; |
114 | border: 1px solid #eee; |
115 | } |
116 | |
117 | textarea { |
118 | border: 1px solid #eee; |
119 | } |
120 | |
121 | /* compose */ |
122 | |
123 | .compose { |
124 | width: 100%; |
125 | } |
126 | |
127 | /* messages */ |
128 | |
129 | .message { |
130 | border: 1px solid #eee; |
131 | padding: 7px; |
132 | margin-top: .5em; |
133 | background: white; |
134 | display: block; |
135 | flex-basis: 0; |
136 | max-width: 100%; |
137 | min-width: 300px; |
138 | word-wrap:break-word; |
139 | display:inline-block; |
140 | } |
141 | |
142 | .message_meta input { |
143 | border: none; |
144 | font-size: .8em; |
145 | color: #666; |
146 | background: #ddd; |
147 | } |
148 | |
149 | .message_meta { |
150 | margin-left: auto; |
151 | } |
152 | .message_meta > * { |
153 | margin-left: 5px; |
154 | } |
155 | .message_actions { |
156 | float: right; |
157 | } |
158 | |
159 | .dig { |
160 | border-right: 2px solid #eee; |
161 | padding-right: .6ex; |
162 | margin-right: .1ex; |
163 | } |
164 | |
165 | .message > .title > .avatar { |
166 | margin-left: 0; |
167 | } |
168 | |
169 | .message_content { |
170 | margin-top: 5px; |
171 | border-top: 1px solid #eee; |
172 | padding-top: 3px; |
173 | } |
174 | |
175 | /* -- suggest box */ |
176 | |
177 | |
178 | .suggest-box > * { |
179 | background: #f5f5f5; |
180 | border: 1px solid #ccc; |
181 | margin: 3px; |
182 | } |
183 | |
184 | .suggest-box { |
185 | width: 200px; |
186 | } |
187 | |
188 | .suggest-box ul { |
189 | list-style-type: none; |
190 | padding-left: -20px; |
191 | } |
192 | |
193 | .suggest-box .selected { |
194 | background: #ccc; |
195 | } |
196 | |
197 | .suggest-box img { |
198 | width: 40px; |
199 | } |
200 | .suggest-box,.selected img { |
201 | width: 200px; |
202 | } |
203 | /* avatar */ |
204 | |
205 | .avatar { |
206 | display: flex; |
207 | flex-direction: row; |
208 | } |
209 | .avatar img { |
210 | width: 40px; |
211 | height: 40px; |
212 | margin-right: 3px; |
213 | border: 1px solid #ccc; |
214 | } |
215 | |
216 | .profile { |
217 | background: #fff; |
218 | padding: .5em; |
219 | border: 1px solid #eee; |
220 | } |
221 | |
222 | .profile img { |
223 | width: 150px; |
224 | height: 150px; |
225 | border: 1px solid #eee; |
226 | } |
227 | |
228 | .profile__info { |
229 | margin-left: .5em; |
230 | } |
231 | |
232 | /* lightbox - used in message-confirm */ |
233 | |
234 | .lightbox { |
235 | overflow: auto; |
236 | background: #fff; |
237 | width: 600px; |
238 | border: 1px solid #eee; |
239 | top: 2em; |
240 | bottom: 2em; |
241 | left: 2em; |
242 | right: 2em; |
243 | padding: 1em; |
244 | } |
245 | |
246 | .message-confirm { |
247 | background: #fff; |
248 | } |
249 | |
250 | /* searchprompt */ |
251 | |
252 | .searchprompt { |
253 | width: 250px; |
254 | margin-left: 10px; |
255 | margin-bottom: 5px; |
256 | } |
257 | |
258 | a { |
259 | color: #333; |
260 | } |
261 | |
262 | a:hover { |
263 | color: #000; |
264 | } |
265 | |
266 | /* TextNodeSearcher highlights */ |
267 | |
268 | highlight { |
269 | background: yellow; |
270 | } |
271 | |
272 |
Built with git-ssb-web