git ssb

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