git ssb

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