git ssb

1
body {
2
  font-family: sans-serif;
3
}
4
5
.screen {
6
  position: absolute;
7
  top: 0px; bottom: 0px;
8
  left: 0px; right: 0px;
9
  overflow-y: hidden;
10
}
11
12
.column {
13
  display: flex;
14
  flex-direction: column;
15
  min-height: 0px;
16
}
17
18
.row {
19
  display: flex;
20
  flex-direction: row;
21
}
22
23
.wrap {
24
  display: flex;
25
  flex-direction: row;
26
  flex-wrap: wrap;
27
}
28
29
.scroll-y {
30
  overflow-y: auto;
31
}
32
33
.scroll-x {
34
  overflow-x: auto;
35
}
36
37
pre {
38
  white-space: pre-wrap;
39
  word-wrap: break-word;
40
}
41
42
.wide {
43
  width: 100%;
44
}
45
46
p {
47
  margin-top: .35ex;
48
}
49
50
hr {
51
  border: solid #eee;
52
  clear: both;
53
  border-width: 1px 0 0;
54
  height: 0;
55
  margin-bottom: .9em;
56
}
57
58
input, textarea {
59
  border: 1px solid #eee;
60
}
61
62
/* scrolling feeds, threads */
63
64
.scroller {
65
  width: 100%;
66
}
67
68
.scroller__wrapper {
69
  flex: 1;
70
  max-width: 600px;
71
  margin-left: auto;
72
  margin-right: auto;
73
}
74
75
/* --- hypertabs ------- */
76
77
.hypertabs__tabs {
78
  overflow-y: hide;
79
}
80
81
.hypertabs > .row {
82
  flex-grow: 0; 
83
  flex-shrink: 0;
84
  margin: 0;
85
}
86
87
.hypertabs__tabs > * {
88
  max-width: 4em;
89
  overflow-x: hidden;
90
  margin-right: .5ex;
91
  padding-top: .1ex;
92
}
93
94
.hypertabs--selected {
95
  max-width: 4em;
96
  background: yellow;
97
  padding-left: .5ex;
98
  padding-right: .5ex;
99
}
100
101
/* compose */
102
103
.compose {
104
  width: 100%;
105
}
106
107
/* messages */
108
109
.message {
110
  display: block;
111
  flex-basis: 0;
112
  word-wrap: break-word; 
113
  display: inline-block;
114
  border: 1px solid #eee;
115
}
116
117
.message_meta input {
118
  font-size: .8em;
119
}
120
121
.message_meta {
122
  margin-left: auto;
123
}
124
125
.message_meta > * {
126
  margin-left: .5ex;
127
}
128
129
.message_actions {
130
  float: right;
131
  margin-right: .5ex;
132
  margin-bottom: .5ex;
133
}
134
135
.title {
136
  padding: .5ex;
137
}
138
139
.message img {
140
  max-width: 100%;
141
}
142
143
.actions > * {
144
  padding-left: 5px;
145
  margin-left: 1px;
146
}
147
148
.actions > :not(:last-child) {
149
  border-right: 2px solid #eee;
150
  padding-right: 5px;
151
}
152
153
.message > .title > .avatar {
154
  margin-left: 0;
155
}
156
157
.message_content {
158
  padding: .5ex;
159
}
160
161
/* -- suggest box */
162
163
.suggest-box > * {
164
  margin: .5ex;
165
}
166
167
.suggest-box {
168
  width: 5em;
169
}
170
171
.suggest-box ul {
172
  list-style-type: none;
173
  padding-left: -2em;
174
}
175
176
.suggest-box .selected {
177
  background: yellow;
178
}
179
180
/* avatar */
181
182
.avatar {
183
  display: flex;
184
  flex-direction: row;
185
}
186
187
.avatar--large {
188
  width: 10em;
189
  height: 10em;
190
}
191
192
.avatar--thumbnail {
193
  width: 2.5em;
194
  height: 2.5em;
195
  margin-right: .5ex;
196
}
197
198
.avatar--fullsize {
199
  width: 100%;
200
}
201
202
.profile {
203
  padding: .5ex;
204
  overflow: auto;
205
}
206
207
.profile input {
208
  width: 100%;
209
}
210
211
.profile__info {
212
  margin-left: .5em;
213
}
214
215
/* lightbox - used in message-confirm */
216
217
.lightbox {
218
  overflow: auto;
219
  padding: 1em;
220
  background: white;
221
}
222
223
/* searchprompt */
224
225
.searchprompt {
226
  width: 17em;
227
  margin-left: .5ex;
228
  margin-bottom: .5ex;
229
}
230
231
/* TextNodeSearcher highlights */
232
233
.highlight {
234
  background: yellow;
235
}
236
237
/* --- network status --- */
238
239
.status {
240
  width: 20px;
241
  height: 20px;
242
  background: green;
243
}
244
245
.menu {
246
  position: fixed;
247
  right: 10px;
248
  top: 10px;
249
}
250
251
.error {
252
  background: red;
253
}
254
255
/* avatar editor */
256
257
.hypercrop__canvas {
258
  width: 100%;
259
}
260
261
/* gitssb */
262
263
.git-table-wrapper {
264
  max-height: 12em;
265
  overflow: auto;
266
  word-break: break-all;
267
  margin: 1em 0;
268
}
269
270
.git-table-wrapper table {
271
  width: 100%;
272
}
273
274
/* --- network status --- */
275
276
.status {
277
  width: .7em;
278
  height: .7em;
279
  position: fixed;
280
  right: .8em;
281
  top: .8em;
282
  border-radius: 100%;
283
  background: green;
284
}
285
286
.error {
287
  background: red;
288
}
289
290
/* invite codes */
291
292
.hyperprogress__liquid {
293
  height: 1ex;
294
  background: blue;
295
}
296
297
/* themes */
298
299
.theme {
300
  margin-left: 1ex;
301
}
302
303
.themes__form {
304
  margin: 1ex;
305
}
306
307
308
309
/* progress */
310
311
.hyperprogress__bar {
312
  background: darkgrey;
313
}
314
.hyperprogress__liquid {
315
  background: lightblue;
316
}
317