git ssb

1
body {
2
  font-family: sans-serif;
3
  color: #222;
4
}
5
6
h1, h2, h3, h4, h5, h6, p, ul, ol {
7
  margin-top: .35em;
8
}
9
10
h1 { font-size: 1.2em; }
11
h2 { font-size: 1.18em; }
12
h3 { font-size: 1.15em; }
13
h4 { font-size: 1.12em; }
14
h5 { font-size: 1.1em; }
15
h6 { font-size: 1em; }
16
17
* {
18
  word-break: break-word;
19
}
20
21
a:link, a:visited, a:active {
22
  color: #0088cc;
23
  text-decoration: none;
24
}
25
26
a:hover,
27
a:focus {
28
  color: #005580;
29
  text-decoration: underline;
30
}
31
32
.screen {
33
  position: absolute;
34
  top: 0; bottom: 0;
35
  left: 0; right: 0;
36
  overflow-y: hidden;
37
}
38
39
.column {
40
  display: flex;
41
  flex-direction: column;
42
  min-height:0px;
43
}
44
45
.row {
46
  display: flex;
47
  flex-direction: row;
48
  min-height:0px;
49
}
50
51
.end {
52
  justify-content: flex-end;
53
}
54
55
.wrap {
56
  display: flex;
57
  flex-direction: row;
58
  flex-wrap: wrap;
59
}
60
61
.no-shrink {
62
  flex-shrink: 0;
63
}
64
65
.expand {
66
  justify-content: space-between;
67
}
68
69
.scroll-y {
70
  overflow-y: auto;
71
  min-height: 0px;
72
}
73
74
.scroll-x {
75
  overflow-x: auto;
76
  min-width: 0px;
77
}
78
79
pre {
80
  white-space: pre-wrap;
81
  word-wrap: break-word;
82
}
83
84
.wide {
85
  width: 100%;
86
}
87
88
p {
89
  margin-top: .35ex;
90
}
91
92
hr {
93
  border: solid #eee;
94
  clear: both;
95
  border-width: 1px 0 0;
96
  height: 0;
97
  margin-bottom: .9em;
98
}
99
100
input, textarea {
101
  border: none;
102
  border-radius: .2em;
103
  font-family: sans-serif;
104
}
105
106
input:focus, .compose:focus, button:focus {
107
  outline: none;
108
  border-color: #0088cc; 
109
  box-shadow: 0 0 4px #0088cc;
110
}
111
112
textarea {
113
  padding: .5em;
114
  font-size: 1em;
115
}
116
117
textarea:focus {
118
  outline: none;
119
  border-color: none;
120
}
121
122
button {
123
  background: #fff;
124
  color: #666;
125
  border: 1px solid #bbb;
126
  border-radius: .5em;
127
  padding: .7em;
128
  margin: .5em;
129
  cursor: pointer;
130
  text-transform: uppercase;
131
  font-weight: bold;
132
  font-size: .7em;
133
}
134
135
button:hover {
136
  background: #ccc;
137
  border: 1px solid #bbb;
138
}
139
140
.menu {
141
  position: absolute;
142
  top: .5em;
143
  right: .5em;
144
  padding-top: .5em;
145
  padding-bottom: .5em;
146
  padding-right: 1em;
147
  padding-left: 1em;
148
  background: #f5f5f5;
149
  border: 1px solid #eee;
150
  border-radius: .2em;
151
  z-index: 5;
152
}
153
154
/* scrolling feeds, threads */
155
156
.scroller {
157
  width: 100%;
158
}
159
160
.scroller__wrapper {
161
  flex: 1;
162
  max-width: 600px;
163
  margin-left: auto;
164
  margin-right: auto;
165
}
166
167
/* messages */
168
/* is .title used any more? */
169
170
.title {
171
  padding: .5ex;
172
}
173
174
.emoji {
175
  height: 1em;
176
  width: 1em;
177
  vertical-align: top;
178
}
179
180
181
182
/* avatar */
183
184
.avatar--large, 
185
.avatar--thumbnail, 
186
.avatar--fullsize {
187
  border: 1px solid #eee;
188
}
189
190
.avatar--large {
191
  width: 10em;
192
  height: 10em;
193
}
194
195
.avatar--thumbnail {
196
  width: 2.5em;
197
  height: 2.5em;
198
  float: left;
199
  margin: 0 .25ex;
200
}
201
202
.\.meta .avatar--thumbnail {
203
  width: 1.9em;
204
  height: 1.9em;
205
}
206
207
.avatar--fullsize {
208
  width: 50%;
209
}
210
211
.profile {
212
  padding: .5ex;
213
  overflow: auto;
214
}
215
216
.profile input {
217
  width: 100%;
218
}
219
220
.profile__info {
221
  margin-left: .5em;
222
}
223
224
/* lightbox - used in message-confirm */
225
226
.lightbox {
227
  position: fixed;
228
  left: 0px;
229
  right: 0px;
230
  top: 50px;
231
  overflow: auto;
232
  width: 650px;
233
  max-width: 100%;
234
  padding: 25px;
235
  margin: auto;
236
237
  z-index: 2;
238
239
  background: #f5f5f5;
240
  border: 1px solid #eee;
241
  border-radius: .2em;
242
}
243
244
/* searchprompt */
245
246
.searchprompt {
247
  float: left;
248
  width: 85%;
249
  height: 2em;
250
  margin-top: .3em;
251
  border-radius: 1em;
252
  padding-left: .7em;
253
  padding-right: 0.5em;
254
  margin-left: 1em;
255
  margin-right: 1em;
256
}
257
258
/* TextNodeSearcher highlights */
259
260
highlight {
261
  background: #ff8;
262
}
263
264
/* avatar editor */
265
266
.hypercrop__canvas {
267
  width: 100%;
268
}
269
270
/* gitssb */
271
272
.git-table-wrapper {
273
  max-height: 12em;
274
  overflow: auto;
275
  word-break: break-all;
276
  margin: 1em 0;
277
}
278
279
.git-table-wrapper table {
280
  width: 100%;
281
}
282
283
/* --- network status --- */
284
285
.status {
286
  width: .7em;
287
  height: .7em;
288
  margin: .7em;
289
  border-radius: 100%;
290
  background: #08c;
291
}
292
293
.error {
294
  background: red;
295
}
296
297
/* tabs */
298
299
.header {
300
  background: #f5f5f5;
301
  border-bottom: 1px inset;
302
  flex-shrink: 0;
303
}
304
305
.header__tabs {
306
  width: 100%; 
307
  min-width: 0px;
308
}
309
310
/* --- hypertabs ------- */
311
312
.hypertabs__tabs {
313
  min-width: 0px;
314
  width: 100%;
315
}
316
317
.hypertabs__tab {
318
  overflow-x: hidden;
319
  min-width: 0px;
320
  width: 100%;
321
}
322
323
.hypertabs__button {
324
  overflow-x: hidden;
325
  min-width: 0px;
326
  width: 100%;
327
}
328
329
.hypertabs__tab {
330
  color: black;
331
  background: #f5f5f5;
332
  border-top-left-radius: 5px;
333
  margin-left: -3px;
334
  border-bottom: none;
335
  padding-top: .56em;
336
  padding-left: 1em;
337
  border-left: 1px solid #ddd;
338
  width: 100%; 
339
}
340
341
.hypertabs__tab > a {
342
  color: #666;
343
  text-decoration: none;
344
  white-space: nowrap;
345
  font-size: .9em;
346
}
347
348
.hypertabs--selected {
349
  font-weight: bold;
350
  background: #eee;
351
  border-top-right-radius: 5px;
352
  z-index: 1;
353
}
354
355
.hypertabs__x  {
356
  display: none; 
357
  transform: translate(-4px, -3px);
358
}
359
360
.hypertabs--selected .hypertabs__x {
361
  display: block;
362
}
363
364
/* progress bar */
365
366
.hyperprogress__bar {
367
  background: darkgrey;
368
}
369
.hyperprogress__liquid {
370
  background: lightblue;
371
}
372
373
374