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