##// END OF EJS Templates
style: bring back bold font style.
marcink -
r3186:3a350ddc default
parent child Browse files
Show More
@@ -1,1247 +1,1249 b''
1 // Default styles
1 // Default styles
2
2
3 .diff-collapse {
3 .diff-collapse {
4 margin: @padding 0;
4 margin: @padding 0;
5 text-align: right;
5 text-align: right;
6 }
6 }
7
7
8 .diff-container {
8 .diff-container {
9 margin-bottom: @space;
9 margin-bottom: @space;
10
10
11 .diffblock {
11 .diffblock {
12 margin-bottom: @space;
12 margin-bottom: @space;
13 }
13 }
14
14
15 &.hidden {
15 &.hidden {
16 display: none;
16 display: none;
17 overflow: hidden;
17 overflow: hidden;
18 }
18 }
19 }
19 }
20
20
21
21
22 div.diffblock .sidebyside {
22 div.diffblock .sidebyside {
23 background: #ffffff;
23 background: #ffffff;
24 }
24 }
25
25
26 div.diffblock {
26 div.diffblock {
27 overflow-x: auto;
27 overflow-x: auto;
28 overflow-y: hidden;
28 overflow-y: hidden;
29 clear: both;
29 clear: both;
30 padding: 0px;
30 padding: 0px;
31 background: @grey6;
31 background: @grey6;
32 border: @border-thickness solid @grey5;
32 border: @border-thickness solid @grey5;
33 -webkit-border-radius: @border-radius @border-radius 0px 0px;
33 -webkit-border-radius: @border-radius @border-radius 0px 0px;
34 border-radius: @border-radius @border-radius 0px 0px;
34 border-radius: @border-radius @border-radius 0px 0px;
35
35
36
36
37 .comments-number {
37 .comments-number {
38 float: right;
38 float: right;
39 }
39 }
40
40
41 // BEGIN CODE-HEADER STYLES
41 // BEGIN CODE-HEADER STYLES
42
42
43 .code-header {
43 .code-header {
44 background: @grey6;
44 background: @grey6;
45 padding: 10px 0 10px 0;
45 padding: 10px 0 10px 0;
46 height: auto;
46 height: auto;
47 width: 100%;
47 width: 100%;
48
48
49 .hash {
49 .hash {
50 float: left;
50 float: left;
51 padding: 2px 0 0 2px;
51 padding: 2px 0 0 2px;
52 }
52 }
53
53
54 .date {
54 .date {
55 float: left;
55 float: left;
56 text-transform: uppercase;
56 text-transform: uppercase;
57 padding: 4px 0px 0px 2px;
57 padding: 4px 0px 0px 2px;
58 }
58 }
59
59
60 div {
60 div {
61 margin-left: 4px;
61 margin-left: 4px;
62 }
62 }
63
63
64 div.compare_header {
64 div.compare_header {
65 min-height: 40px;
65 min-height: 40px;
66 margin: 0;
66 margin: 0;
67 padding: 0 @padding;
67 padding: 0 @padding;
68
68
69 .drop-menu {
69 .drop-menu {
70 float:left;
70 float:left;
71 display: block;
71 display: block;
72 margin:0 0 @padding 0;
72 margin:0 0 @padding 0;
73 }
73 }
74
74
75 .compare-label {
75 .compare-label {
76 float: left;
76 float: left;
77 clear: both;
77 clear: both;
78 display: inline-block;
78 display: inline-block;
79 min-width: 5em;
79 min-width: 5em;
80 margin: 0;
80 margin: 0;
81 padding: @button-padding @button-padding @button-padding 0;
81 padding: @button-padding @button-padding @button-padding 0;
82 font-weight: @text-semibold-weight;
82 font-family: @text-semibold;
83 font-family: @text-semibold;
83 }
84 }
84
85
85 .compare-buttons {
86 .compare-buttons {
86 float: left;
87 float: left;
87 margin: 0;
88 margin: 0;
88 padding: 0 0 @padding;
89 padding: 0 0 @padding;
89
90
90 .btn {
91 .btn {
91 margin: 0 @padding 0 0;
92 margin: 0 @padding 0 0;
92 }
93 }
93 }
94 }
94 }
95 }
95
96
96 }
97 }
97
98
98 .parents {
99 .parents {
99 float: left;
100 float: left;
100 width: 100px;
101 width: 100px;
101 font-weight: 400;
102 font-weight: 400;
102 vertical-align: middle;
103 vertical-align: middle;
103 padding: 0px 2px 0px 2px;
104 padding: 0px 2px 0px 2px;
104 background-color: @grey6;
105 background-color: @grey6;
105
106
106 #parent_link {
107 #parent_link {
107 margin: 00px 2px;
108 margin: 00px 2px;
108
109
109 &.double {
110 &.double {
110 margin: 0px 2px;
111 margin: 0px 2px;
111 }
112 }
112
113
113 &.disabled{
114 &.disabled{
114 margin-right: @padding;
115 margin-right: @padding;
115 }
116 }
116 }
117 }
117 }
118 }
118
119
119 .children {
120 .children {
120 float: right;
121 float: right;
121 width: 100px;
122 width: 100px;
122 font-weight: 400;
123 font-weight: 400;
123 vertical-align: middle;
124 vertical-align: middle;
124 text-align: right;
125 text-align: right;
125 padding: 0px 2px 0px 2px;
126 padding: 0px 2px 0px 2px;
126 background-color: @grey6;
127 background-color: @grey6;
127
128
128 #child_link {
129 #child_link {
129 margin: 0px 2px;
130 margin: 0px 2px;
130
131
131 &.double {
132 &.double {
132 margin: 0px 2px;
133 margin: 0px 2px;
133 }
134 }
134
135
135 &.disabled{
136 &.disabled{
136 margin-right: @padding;
137 margin-right: @padding;
137 }
138 }
138 }
139 }
139 }
140 }
140
141
141 .changeset_header {
142 .changeset_header {
142 height: 16px;
143 height: 16px;
143
144
144 & > div{
145 & > div{
145 margin-right: @padding;
146 margin-right: @padding;
146 }
147 }
147 }
148 }
148
149
149 .changeset_file {
150 .changeset_file {
150 text-align: left;
151 text-align: left;
151 float: left;
152 float: left;
152 padding: 0;
153 padding: 0;
153
154
154 a{
155 a{
155 display: inline-block;
156 display: inline-block;
156 margin-right: 0.5em;
157 margin-right: 0.5em;
157 }
158 }
158
159
159 #selected_mode{
160 #selected_mode{
160 margin-left: 0;
161 margin-left: 0;
161 }
162 }
162 }
163 }
163
164
164 .diff-menu-wrapper {
165 .diff-menu-wrapper {
165 float: left;
166 float: left;
166 }
167 }
167
168
168 .diff-menu {
169 .diff-menu {
169 position: absolute;
170 position: absolute;
170 background: none repeat scroll 0 0 #FFFFFF;
171 background: none repeat scroll 0 0 #FFFFFF;
171 border-color: #003367 @grey3 @grey3;
172 border-color: #003367 @grey3 @grey3;
172 border-right: 1px solid @grey3;
173 border-right: 1px solid @grey3;
173 border-style: solid solid solid;
174 border-style: solid solid solid;
174 border-width: @border-thickness;
175 border-width: @border-thickness;
175 box-shadow: 2px 8px 4px rgba(0, 0, 0, 0.2);
176 box-shadow: 2px 8px 4px rgba(0, 0, 0, 0.2);
176 margin-top: 5px;
177 margin-top: 5px;
177 margin-left: 1px;
178 margin-left: 1px;
178 }
179 }
179
180
180 .diff-actions, .editor-actions {
181 .diff-actions, .editor-actions {
181 float: left;
182 float: left;
182
183
183 input{
184 input{
184 margin: 0 0.5em 0 0;
185 margin: 0 0.5em 0 0;
185 }
186 }
186 }
187 }
187
188
188 // END CODE-HEADER STYLES
189 // END CODE-HEADER STYLES
189
190
190 // BEGIN CODE-BODY STYLES
191 // BEGIN CODE-BODY STYLES
191
192
192 .code-body {
193 .code-body {
193 padding: 0;
194 padding: 0;
194 background-color: #ffffff;
195 background-color: #ffffff;
195 position: relative;
196 position: relative;
196 max-width: none;
197 max-width: none;
197 box-sizing: border-box;
198 box-sizing: border-box;
198 // TODO: johbo: Parent has overflow: auto, this forces the child here
199 // TODO: johbo: Parent has overflow: auto, this forces the child here
199 // to have the intended size and to scroll. Should be simplified.
200 // to have the intended size and to scroll. Should be simplified.
200 width: 100%;
201 width: 100%;
201 overflow-x: auto;
202 overflow-x: auto;
202 }
203 }
203
204
204 pre.raw {
205 pre.raw {
205 background: white;
206 background: white;
206 color: @grey1;
207 color: @grey1;
207 }
208 }
208 // END CODE-BODY STYLES
209 // END CODE-BODY STYLES
209
210
210 }
211 }
211
212
212
213
213 table.code-difftable {
214 table.code-difftable {
214 border-collapse: collapse;
215 border-collapse: collapse;
215 width: 99%;
216 width: 99%;
216 border-radius: 0px !important;
217 border-radius: 0px !important;
217
218
218 td {
219 td {
219 padding: 0 !important;
220 padding: 0 !important;
220 background: none !important;
221 background: none !important;
221 border: 0 !important;
222 border: 0 !important;
222 }
223 }
223
224
224 .context {
225 .context {
225 background: none repeat scroll 0 0 #DDE7EF;
226 background: none repeat scroll 0 0 #DDE7EF;
226 }
227 }
227
228
228 .add {
229 .add {
229 background: none repeat scroll 0 0 #DDFFDD;
230 background: none repeat scroll 0 0 #DDFFDD;
230
231
231 ins {
232 ins {
232 background: none repeat scroll 0 0 #AAFFAA;
233 background: none repeat scroll 0 0 #AAFFAA;
233 text-decoration: none;
234 text-decoration: none;
234 }
235 }
235 }
236 }
236
237
237 .del {
238 .del {
238 background: none repeat scroll 0 0 #FFDDDD;
239 background: none repeat scroll 0 0 #FFDDDD;
239
240
240 del {
241 del {
241 background: none repeat scroll 0 0 #FFAAAA;
242 background: none repeat scroll 0 0 #FFAAAA;
242 text-decoration: none;
243 text-decoration: none;
243 }
244 }
244 }
245 }
245
246
246 /** LINE NUMBERS **/
247 /** LINE NUMBERS **/
247 .lineno {
248 .lineno {
248 padding-left: 2px !important;
249 padding-left: 2px !important;
249 padding-right: 2px;
250 padding-right: 2px;
250 text-align: right;
251 text-align: right;
251 width: 32px;
252 width: 32px;
252 -moz-user-select: none;
253 -moz-user-select: none;
253 -webkit-user-select: none;
254 -webkit-user-select: none;
254 border-right: @border-thickness solid @grey5 !important;
255 border-right: @border-thickness solid @grey5 !important;
255 border-left: 0px solid #CCC !important;
256 border-left: 0px solid #CCC !important;
256 border-top: 0px solid #CCC !important;
257 border-top: 0px solid #CCC !important;
257 border-bottom: none !important;
258 border-bottom: none !important;
258
259
259 a {
260 a {
260 &:extend(pre);
261 &:extend(pre);
261 text-align: right;
262 text-align: right;
262 padding-right: 2px;
263 padding-right: 2px;
263 cursor: pointer;
264 cursor: pointer;
264 display: block;
265 display: block;
265 width: 32px;
266 width: 32px;
266 }
267 }
267 }
268 }
268
269
269 .context {
270 .context {
270 cursor: auto;
271 cursor: auto;
271 &:extend(pre);
272 &:extend(pre);
272 }
273 }
273
274
274 .lineno-inline {
275 .lineno-inline {
275 background: none repeat scroll 0 0 #FFF !important;
276 background: none repeat scroll 0 0 #FFF !important;
276 padding-left: 2px;
277 padding-left: 2px;
277 padding-right: 2px;
278 padding-right: 2px;
278 text-align: right;
279 text-align: right;
279 width: 30px;
280 width: 30px;
280 -moz-user-select: none;
281 -moz-user-select: none;
281 -webkit-user-select: none;
282 -webkit-user-select: none;
282 }
283 }
283
284
284 /** CODE **/
285 /** CODE **/
285 .code {
286 .code {
286 display: block;
287 display: block;
287 width: 100%;
288 width: 100%;
288
289
289 td {
290 td {
290 margin: 0;
291 margin: 0;
291 padding: 0;
292 padding: 0;
292 }
293 }
293
294
294 pre {
295 pre {
295 margin: 0;
296 margin: 0;
296 padding: 0;
297 padding: 0;
297 margin-left: .5em;
298 margin-left: .5em;
298 }
299 }
299 }
300 }
300 }
301 }
301
302
302
303
303 // Comments
304 // Comments
304
305
305 div.comment:target {
306 div.comment:target {
306 border-left: 6px solid @comment-highlight-color !important;
307 border-left: 6px solid @comment-highlight-color !important;
307 padding-left: 3px;
308 padding-left: 3px;
308 margin-left: -9px;
309 margin-left: -9px;
309 }
310 }
310
311
311 //TODO: anderson: can't get an absolute number out of anything, so had to put the
312 //TODO: anderson: can't get an absolute number out of anything, so had to put the
312 //current values that might change. But to make it clear I put as a calculation
313 //current values that might change. But to make it clear I put as a calculation
313 @comment-max-width: 1065px;
314 @comment-max-width: 1065px;
314 @pr-extra-margin: 34px;
315 @pr-extra-margin: 34px;
315 @pr-border-spacing: 4px;
316 @pr-border-spacing: 4px;
316 @pr-comment-width: @comment-max-width - @pr-extra-margin - @pr-border-spacing;
317 @pr-comment-width: @comment-max-width - @pr-extra-margin - @pr-border-spacing;
317
318
318 // Pull Request
319 // Pull Request
319 .cs_files .code-difftable {
320 .cs_files .code-difftable {
320 border: @border-thickness solid @grey5; //borders only on PRs
321 border: @border-thickness solid @grey5; //borders only on PRs
321
322
322 .comment-inline-form,
323 .comment-inline-form,
323 div.comment {
324 div.comment {
324 width: @pr-comment-width;
325 width: @pr-comment-width;
325 }
326 }
326 }
327 }
327
328
328 // Changeset
329 // Changeset
329 .code-difftable {
330 .code-difftable {
330 .comment-inline-form,
331 .comment-inline-form,
331 div.comment {
332 div.comment {
332 width: @comment-max-width;
333 width: @comment-max-width;
333 }
334 }
334 }
335 }
335
336
336 //Style page
337 //Style page
337 @style-extra-margin: @sidebar-width + (@sidebarpadding * 3) + @padding;
338 @style-extra-margin: @sidebar-width + (@sidebarpadding * 3) + @padding;
338 #style-page .code-difftable{
339 #style-page .code-difftable{
339 .comment-inline-form,
340 .comment-inline-form,
340 div.comment {
341 div.comment {
341 width: @comment-max-width - @style-extra-margin;
342 width: @comment-max-width - @style-extra-margin;
342 }
343 }
343 }
344 }
344
345
345 #context-bar > h2 {
346 #context-bar > h2 {
346 font-size: 20px;
347 font-size: 20px;
347 }
348 }
348
349
349 #context-bar > h2> a {
350 #context-bar > h2> a {
350 font-size: 20px;
351 font-size: 20px;
351 }
352 }
352 // end of defaults
353 // end of defaults
353
354
354 .file_diff_buttons {
355 .file_diff_buttons {
355 padding: 0 0 @padding;
356 padding: 0 0 @padding;
356
357
357 .drop-menu {
358 .drop-menu {
358 float: left;
359 float: left;
359 margin: 0 @padding 0 0;
360 margin: 0 @padding 0 0;
360 }
361 }
361 .btn {
362 .btn {
362 margin: 0 @padding 0 0;
363 margin: 0 @padding 0 0;
363 }
364 }
364 }
365 }
365
366
366 .code-body.textarea.editor {
367 .code-body.textarea.editor {
367 max-width: none;
368 max-width: none;
368 padding: 15px;
369 padding: 15px;
369 }
370 }
370
371
371 td.injected_diff{
372 td.injected_diff{
372 max-width: 1178px;
373 max-width: 1178px;
373 overflow-x: auto;
374 overflow-x: auto;
374 overflow-y: hidden;
375 overflow-y: hidden;
375
376
376 div.diff-container,
377 div.diff-container,
377 div.diffblock{
378 div.diffblock{
378 max-width: 100%;
379 max-width: 100%;
379 }
380 }
380
381
381 div.code-body {
382 div.code-body {
382 max-width: 1124px;
383 max-width: 1124px;
383 overflow-x: auto;
384 overflow-x: auto;
384 overflow-y: hidden;
385 overflow-y: hidden;
385 padding: 0;
386 padding: 0;
386 }
387 }
387 div.diffblock {
388 div.diffblock {
388 border: none;
389 border: none;
389 }
390 }
390
391
391 &.inline-form {
392 &.inline-form {
392 width: 99%
393 width: 99%
393 }
394 }
394 }
395 }
395
396
396
397
397 table.code-difftable {
398 table.code-difftable {
398 width: 100%;
399 width: 100%;
399 }
400 }
400
401
401 /** PYGMENTS COLORING **/
402 /** PYGMENTS COLORING **/
402 div.codeblock {
403 div.codeblock {
403
404
404 // TODO: johbo: Added interim to get rid of the margin around
405 // TODO: johbo: Added interim to get rid of the margin around
405 // Select2 widgets. This needs further cleanup.
406 // Select2 widgets. This needs further cleanup.
406 margin-top: @padding;
407 margin-top: @padding;
407
408
408 overflow: auto;
409 overflow: auto;
409 padding: 0px;
410 padding: 0px;
410 border: @border-thickness solid @grey5;
411 border: @border-thickness solid @grey5;
411 background: @grey6;
412 background: @grey6;
412 .border-radius(@border-radius);
413 .border-radius(@border-radius);
413
414
414 #remove_gist {
415 #remove_gist {
415 float: right;
416 float: right;
416 }
417 }
417
418
418 .gist_url {
419 .gist_url {
419 padding: 0px 0px 10px 0px;
420 padding: 0px 0px 10px 0px;
420 }
421 }
421
422
422 .author {
423 .author {
423 clear: both;
424 clear: both;
424 vertical-align: middle;
425 vertical-align: middle;
426 font-weight: @text-bold-weight;
425 font-family: @text-bold;
427 font-family: @text-bold;
426 }
428 }
427
429
428 .btn-mini {
430 .btn-mini {
429 float: left;
431 float: left;
430 margin: 0 5px 0 0;
432 margin: 0 5px 0 0;
431 }
433 }
432
434
433 .code-header {
435 .code-header {
434 padding: @padding;
436 padding: @padding;
435 border-bottom: @border-thickness solid @grey5;
437 border-bottom: @border-thickness solid @grey5;
436
438
437 .rc-user {
439 .rc-user {
438 min-width: 0;
440 min-width: 0;
439 margin-right: .5em;
441 margin-right: .5em;
440 }
442 }
441
443
442 .stats {
444 .stats {
443 clear: both;
445 clear: both;
444 margin: 0 0 @padding 0;
446 margin: 0 0 @padding 0;
445 padding: 0;
447 padding: 0;
446 .left {
448 .left {
447 float: left;
449 float: left;
448 clear: left;
450 clear: left;
449 max-width: 75%;
451 max-width: 75%;
450 margin: 0 0 @padding 0;
452 margin: 0 0 @padding 0;
451
453
452 &.item {
454 &.item {
453 margin-right: @padding;
455 margin-right: @padding;
454 &.last { border-right: none; }
456 &.last { border-right: none; }
455 }
457 }
456 }
458 }
457 .buttons { float: right; }
459 .buttons { float: right; }
458 .author {
460 .author {
459 height: 25px; margin-left: 15px; font-weight: bold;
461 height: 25px; margin-left: 15px; font-weight: bold;
460 }
462 }
461 }
463 }
462
464
463 .commit {
465 .commit {
464 margin: 5px 0 0 26px;
466 margin: 5px 0 0 26px;
465 font-weight: normal;
467 font-weight: normal;
466 white-space: pre-wrap;
468 white-space: pre-wrap;
467 }
469 }
468 }
470 }
469
471
470 .message {
472 .message {
471 position: relative;
473 position: relative;
472 margin: @padding;
474 margin: @padding;
473
475
474 .codeblock-label {
476 .codeblock-label {
475 margin: 0 0 1em 0;
477 margin: 0 0 1em 0;
476 }
478 }
477 }
479 }
478
480
479 .code-body {
481 .code-body {
480 padding: @padding;
482 padding: @padding;
481 background-color: #ffffff;
483 background-color: #ffffff;
482 min-width: 100%;
484 min-width: 100%;
483 box-sizing: border-box;
485 box-sizing: border-box;
484 // TODO: johbo: Parent has overflow: auto, this forces the child here
486 // TODO: johbo: Parent has overflow: auto, this forces the child here
485 // to have the intended size and to scroll. Should be simplified.
487 // to have the intended size and to scroll. Should be simplified.
486 width: 100%;
488 width: 100%;
487 overflow-x: auto;
489 overflow-x: auto;
488
490
489 img.rendered-binary {
491 img.rendered-binary {
490 height: auto;
492 height: auto;
491 width: 100%;
493 width: 100%;
492 }
494 }
493 }
495 }
494 }
496 }
495
497
496 .code-highlighttable,
498 .code-highlighttable,
497 div.codeblock {
499 div.codeblock {
498
500
499 &.readme {
501 &.readme {
500 background-color: white;
502 background-color: white;
501 }
503 }
502
504
503 .markdown-block table {
505 .markdown-block table {
504 border-collapse: collapse;
506 border-collapse: collapse;
505
507
506 th,
508 th,
507 td {
509 td {
508 padding: .5em;
510 padding: .5em;
509 border: @border-thickness solid @border-default-color;
511 border: @border-thickness solid @border-default-color;
510 }
512 }
511 }
513 }
512
514
513 table {
515 table {
514 border: 0px;
516 border: 0px;
515 margin: 0;
517 margin: 0;
516 letter-spacing: normal;
518 letter-spacing: normal;
517
519
518
520
519 td {
521 td {
520 border: 0px;
522 border: 0px;
521 vertical-align: top;
523 vertical-align: top;
522 }
524 }
523 }
525 }
524 }
526 }
525
527
526 div.codeblock .code-header .search-path { padding: 0 0 0 10px; }
528 div.codeblock .code-header .search-path { padding: 0 0 0 10px; }
527 div.search-code-body {
529 div.search-code-body {
528 background-color: #ffffff; padding: 5px 0 5px 10px;
530 background-color: #ffffff; padding: 5px 0 5px 10px;
529 pre {
531 pre {
530 .match { background-color: #faffa6;}
532 .match { background-color: #faffa6;}
531 .break { display: block; width: 100%; background-color: #DDE7EF; color: #747474; }
533 .break { display: block; width: 100%; background-color: #DDE7EF; color: #747474; }
532 }
534 }
533 .code-highlighttable {
535 .code-highlighttable {
534 border-collapse: collapse;
536 border-collapse: collapse;
535
537
536 tr:hover {
538 tr:hover {
537 background: #fafafa;
539 background: #fafafa;
538 }
540 }
539 td.code {
541 td.code {
540 padding-left: 10px;
542 padding-left: 10px;
541 }
543 }
542 td.line {
544 td.line {
543 border-right: 1px solid #ccc !important;
545 border-right: 1px solid #ccc !important;
544 padding-right: 10px;
546 padding-right: 10px;
545 text-align: right;
547 text-align: right;
546 font-family: @text-monospace;
548 font-family: @text-monospace;
547 span {
549 span {
548 white-space: pre-wrap;
550 white-space: pre-wrap;
549 color: #666666;
551 color: #666666;
550 }
552 }
551 }
553 }
552 }
554 }
553 }
555 }
554
556
555 div.annotatediv { margin-left: 2px; margin-right: 4px; }
557 div.annotatediv { margin-left: 2px; margin-right: 4px; }
556 .code-highlight {
558 .code-highlight {
557 margin: 0; padding: 0; border-left: @border-thickness solid @grey5;
559 margin: 0; padding: 0; border-left: @border-thickness solid @grey5;
558 pre, .linenodiv pre { padding: 0 5px; margin: 0; }
560 pre, .linenodiv pre { padding: 0 5px; margin: 0; }
559 pre div:target {background-color: @comment-highlight-color !important;}
561 pre div:target {background-color: @comment-highlight-color !important;}
560 }
562 }
561
563
562 .linenos a { text-decoration: none; }
564 .linenos a { text-decoration: none; }
563
565
564 .CodeMirror-selected { background: @rchighlightblue; }
566 .CodeMirror-selected { background: @rchighlightblue; }
565 .CodeMirror-focused .CodeMirror-selected { background: @rchighlightblue; }
567 .CodeMirror-focused .CodeMirror-selected { background: @rchighlightblue; }
566 .CodeMirror ::selection { background: @rchighlightblue; }
568 .CodeMirror ::selection { background: @rchighlightblue; }
567 .CodeMirror ::-moz-selection { background: @rchighlightblue; }
569 .CodeMirror ::-moz-selection { background: @rchighlightblue; }
568
570
569 .code { display: block; border:0px !important; }
571 .code { display: block; border:0px !important; }
570 .code-highlight, /* TODO: dan: merge codehilite into code-highlight */
572 .code-highlight, /* TODO: dan: merge codehilite into code-highlight */
571 .codehilite {
573 .codehilite {
572 .hll { background-color: #ffffcc }
574 .hll { background-color: #ffffcc }
573 .c { color: #408080; font-style: italic } /* Comment */
575 .c { color: #408080; font-style: italic } /* Comment */
574 .err, .codehilite .err { border: none } /* Error */
576 .err, .codehilite .err { border: none } /* Error */
575 .k { color: #008000; font-weight: bold } /* Keyword */
577 .k { color: #008000; font-weight: bold } /* Keyword */
576 .o { color: #666666 } /* Operator */
578 .o { color: #666666 } /* Operator */
577 .cm { color: #408080; font-style: italic } /* Comment.Multiline */
579 .cm { color: #408080; font-style: italic } /* Comment.Multiline */
578 .cp { color: #BC7A00 } /* Comment.Preproc */
580 .cp { color: #BC7A00 } /* Comment.Preproc */
579 .c1 { color: #408080; font-style: italic } /* Comment.Single */
581 .c1 { color: #408080; font-style: italic } /* Comment.Single */
580 .cs { color: #408080; font-style: italic } /* Comment.Special */
582 .cs { color: #408080; font-style: italic } /* Comment.Special */
581 .gd { color: #A00000 } /* Generic.Deleted */
583 .gd { color: #A00000 } /* Generic.Deleted */
582 .ge { font-style: italic } /* Generic.Emph */
584 .ge { font-style: italic } /* Generic.Emph */
583 .gr { color: #FF0000 } /* Generic.Error */
585 .gr { color: #FF0000 } /* Generic.Error */
584 .gh { color: #000080; font-weight: bold } /* Generic.Heading */
586 .gh { color: #000080; font-weight: bold } /* Generic.Heading */
585 .gi { color: #00A000 } /* Generic.Inserted */
587 .gi { color: #00A000 } /* Generic.Inserted */
586 .go { color: #808080 } /* Generic.Output */
588 .go { color: #808080 } /* Generic.Output */
587 .gp { color: #000080; font-weight: bold } /* Generic.Prompt */
589 .gp { color: #000080; font-weight: bold } /* Generic.Prompt */
588 .gs { font-weight: bold } /* Generic.Strong */
590 .gs { font-weight: bold } /* Generic.Strong */
589 .gu { color: #800080; font-weight: bold } /* Generic.Subheading */
591 .gu { color: #800080; font-weight: bold } /* Generic.Subheading */
590 .gt { color: #0040D0 } /* Generic.Traceback */
592 .gt { color: #0040D0 } /* Generic.Traceback */
591 .kc { color: #008000; font-weight: bold } /* Keyword.Constant */
593 .kc { color: #008000; font-weight: bold } /* Keyword.Constant */
592 .kd { color: #008000; font-weight: bold } /* Keyword.Declaration */
594 .kd { color: #008000; font-weight: bold } /* Keyword.Declaration */
593 .kn { color: #008000; font-weight: bold } /* Keyword.Namespace */
595 .kn { color: #008000; font-weight: bold } /* Keyword.Namespace */
594 .kp { color: #008000 } /* Keyword.Pseudo */
596 .kp { color: #008000 } /* Keyword.Pseudo */
595 .kr { color: #008000; font-weight: bold } /* Keyword.Reserved */
597 .kr { color: #008000; font-weight: bold } /* Keyword.Reserved */
596 .kt { color: #B00040 } /* Keyword.Type */
598 .kt { color: #B00040 } /* Keyword.Type */
597 .m { color: #666666 } /* Literal.Number */
599 .m { color: #666666 } /* Literal.Number */
598 .s { color: #BA2121 } /* Literal.String */
600 .s { color: #BA2121 } /* Literal.String */
599 .na { color: #7D9029 } /* Name.Attribute */
601 .na { color: #7D9029 } /* Name.Attribute */
600 .nb { color: #008000 } /* Name.Builtin */
602 .nb { color: #008000 } /* Name.Builtin */
601 .nc { color: #0000FF; font-weight: bold } /* Name.Class */
603 .nc { color: #0000FF; font-weight: bold } /* Name.Class */
602 .no { color: #880000 } /* Name.Constant */
604 .no { color: #880000 } /* Name.Constant */
603 .nd { color: #AA22FF } /* Name.Decorator */
605 .nd { color: #AA22FF } /* Name.Decorator */
604 .ni { color: #999999; font-weight: bold } /* Name.Entity */
606 .ni { color: #999999; font-weight: bold } /* Name.Entity */
605 .ne { color: #D2413A; font-weight: bold } /* Name.Exception */
607 .ne { color: #D2413A; font-weight: bold } /* Name.Exception */
606 .nf { color: #0000FF } /* Name.Function */
608 .nf { color: #0000FF } /* Name.Function */
607 .nl { color: #A0A000 } /* Name.Label */
609 .nl { color: #A0A000 } /* Name.Label */
608 .nn { color: #0000FF; font-weight: bold } /* Name.Namespace */
610 .nn { color: #0000FF; font-weight: bold } /* Name.Namespace */
609 .nt { color: #008000; font-weight: bold } /* Name.Tag */
611 .nt { color: #008000; font-weight: bold } /* Name.Tag */
610 .nv { color: #19177C } /* Name.Variable */
612 .nv { color: #19177C } /* Name.Variable */
611 .ow { color: #AA22FF; font-weight: bold } /* Operator.Word */
613 .ow { color: #AA22FF; font-weight: bold } /* Operator.Word */
612 .w { color: #bbbbbb } /* Text.Whitespace */
614 .w { color: #bbbbbb } /* Text.Whitespace */
613 .mf { color: #666666 } /* Literal.Number.Float */
615 .mf { color: #666666 } /* Literal.Number.Float */
614 .mh { color: #666666 } /* Literal.Number.Hex */
616 .mh { color: #666666 } /* Literal.Number.Hex */
615 .mi { color: #666666 } /* Literal.Number.Integer */
617 .mi { color: #666666 } /* Literal.Number.Integer */
616 .mo { color: #666666 } /* Literal.Number.Oct */
618 .mo { color: #666666 } /* Literal.Number.Oct */
617 .sb { color: #BA2121 } /* Literal.String.Backtick */
619 .sb { color: #BA2121 } /* Literal.String.Backtick */
618 .sc { color: #BA2121 } /* Literal.String.Char */
620 .sc { color: #BA2121 } /* Literal.String.Char */
619 .sd { color: #BA2121; font-style: italic } /* Literal.String.Doc */
621 .sd { color: #BA2121; font-style: italic } /* Literal.String.Doc */
620 .s2 { color: #BA2121 } /* Literal.String.Double */
622 .s2 { color: #BA2121 } /* Literal.String.Double */
621 .se { color: #BB6622; font-weight: bold } /* Literal.String.Escape */
623 .se { color: #BB6622; font-weight: bold } /* Literal.String.Escape */
622 .sh { color: #BA2121 } /* Literal.String.Heredoc */
624 .sh { color: #BA2121 } /* Literal.String.Heredoc */
623 .si { color: #BB6688; font-weight: bold } /* Literal.String.Interpol */
625 .si { color: #BB6688; font-weight: bold } /* Literal.String.Interpol */
624 .sx { color: #008000 } /* Literal.String.Other */
626 .sx { color: #008000 } /* Literal.String.Other */
625 .sr { color: #BB6688 } /* Literal.String.Regex */
627 .sr { color: #BB6688 } /* Literal.String.Regex */
626 .s1 { color: #BA2121 } /* Literal.String.Single */
628 .s1 { color: #BA2121 } /* Literal.String.Single */
627 .ss { color: #19177C } /* Literal.String.Symbol */
629 .ss { color: #19177C } /* Literal.String.Symbol */
628 .bp { color: #008000 } /* Name.Builtin.Pseudo */
630 .bp { color: #008000 } /* Name.Builtin.Pseudo */
629 .vc { color: #19177C } /* Name.Variable.Class */
631 .vc { color: #19177C } /* Name.Variable.Class */
630 .vg { color: #19177C } /* Name.Variable.Global */
632 .vg { color: #19177C } /* Name.Variable.Global */
631 .vi { color: #19177C } /* Name.Variable.Instance */
633 .vi { color: #19177C } /* Name.Variable.Instance */
632 .il { color: #666666 } /* Literal.Number.Integer.Long */
634 .il { color: #666666 } /* Literal.Number.Integer.Long */
633 }
635 }
634
636
635 /* customized pre blocks for markdown/rst */
637 /* customized pre blocks for markdown/rst */
636 pre.literal-block, .codehilite pre{
638 pre.literal-block, .codehilite pre{
637 padding: @padding;
639 padding: @padding;
638 border: 1px solid @grey6;
640 border: 1px solid @grey6;
639 .border-radius(@border-radius);
641 .border-radius(@border-radius);
640 background-color: @grey7;
642 background-color: @grey7;
641 }
643 }
642
644
643
645
644 /* START NEW CODE BLOCK CSS */
646 /* START NEW CODE BLOCK CSS */
645
647
646 @cb-line-height: 18px;
648 @cb-line-height: 18px;
647 @cb-line-code-padding: 10px;
649 @cb-line-code-padding: 10px;
648 @cb-text-padding: 5px;
650 @cb-text-padding: 5px;
649
651
650 @pill-padding: 2px 7px;
652 @pill-padding: 2px 7px;
651 @pill-padding-small: 2px 2px 1px 2px;
653 @pill-padding-small: 2px 2px 1px 2px;
652
654
653 input.filediff-collapse-state {
655 input.filediff-collapse-state {
654 display: none;
656 display: none;
655
657
656 &:checked + .filediff { /* file diff is collapsed */
658 &:checked + .filediff { /* file diff is collapsed */
657 .cb {
659 .cb {
658 display: none
660 display: none
659 }
661 }
660 .filediff-collapse-indicator {
662 .filediff-collapse-indicator {
661 width: 0;
663 width: 0;
662 height: 0;
664 height: 0;
663 border-style: solid;
665 border-style: solid;
664 border-width: 4.5px 0 4.5px 9.3px;
666 border-width: 4.5px 0 4.5px 9.3px;
665 border-color: transparent transparent transparent #aaa;
667 border-color: transparent transparent transparent #aaa;
666 margin: 6px 0px;
668 margin: 6px 0px;
667 }
669 }
668 .filediff-menu {
670 .filediff-menu {
669 display: none;
671 display: none;
670 }
672 }
671
673
672 }
674 }
673
675
674 &+ .filediff { /* file diff is expanded */
676 &+ .filediff { /* file diff is expanded */
675 .filediff-collapse-indicator {
677 .filediff-collapse-indicator {
676 width: 0;
678 width: 0;
677 height: 0;
679 height: 0;
678 border-style: solid;
680 border-style: solid;
679 border-width: 9.3px 4.5px 0 4.5px;
681 border-width: 9.3px 4.5px 0 4.5px;
680 border-color: #aaa transparent transparent transparent;
682 border-color: #aaa transparent transparent transparent;
681 margin: 6px 0px;
683 margin: 6px 0px;
682
684
683 }
685 }
684 .filediff-menu {
686 .filediff-menu {
685 display: block;
687 display: block;
686 }
688 }
687 margin: 10px 0;
689 margin: 10px 0;
688 &:nth-child(2) {
690 &:nth-child(2) {
689 margin: 0;
691 margin: 0;
690 }
692 }
691 }
693 }
692 }
694 }
693
695
694 .filediffs .anchor {
696 .filediffs .anchor {
695 display: block;
697 display: block;
696 height: 40px;
698 height: 40px;
697 margin-top: -40px;
699 margin-top: -40px;
698 visibility: hidden;
700 visibility: hidden;
699 }
701 }
700
702
701 .filediffs .anchor:nth-of-type(1) {
703 .filediffs .anchor:nth-of-type(1) {
702 display: block;
704 display: block;
703 height: 80px;
705 height: 80px;
704 margin-top: -80px;
706 margin-top: -80px;
705 visibility: hidden;
707 visibility: hidden;
706 }
708 }
707
709
708 .cs_files {
710 .cs_files {
709 clear: both;
711 clear: both;
710 }
712 }
711
713
712 #diff-file-sticky{
714 #diff-file-sticky{
713 will-change: min-height;
715 will-change: min-height;
714 }
716 }
715
717
716 .sidebar__inner{
718 .sidebar__inner{
717 transform: translate(0, 0); /* For browsers don't support translate3d. */
719 transform: translate(0, 0); /* For browsers don't support translate3d. */
718 transform: translate3d(0, 0, 0);
720 transform: translate3d(0, 0, 0);
719 will-change: position, transform;
721 will-change: position, transform;
720 height: 70px;
722 height: 70px;
721 z-index: 30;
723 z-index: 30;
722 background-color: #fff;
724 background-color: #fff;
723 padding: 5px 0px;
725 padding: 5px 0px;
724 }
726 }
725
727
726 .sidebar__bar {
728 .sidebar__bar {
727 padding: 5px 0px 0px 0px
729 padding: 5px 0px 0px 0px
728 }
730 }
729
731
730 .fpath-placeholder {
732 .fpath-placeholder {
731 clear: both;
733 clear: both;
732 visibility: hidden
734 visibility: hidden
733 }
735 }
734
736
735 .is-affixed {
737 .is-affixed {
736 .sidebar_inner_shadow {
738 .sidebar_inner_shadow {
737 position: fixed;
739 position: fixed;
738 top: 75px;
740 top: 75px;
739 right: -100%;
741 right: -100%;
740 left: -100%;
742 left: -100%;
741 z-index: 28;
743 z-index: 28;
742 display: block;
744 display: block;
743 height: 5px;
745 height: 5px;
744 content: "";
746 content: "";
745 background: linear-gradient(rgba(0, 0, 0, 0.075), rgba(0, 0, 0, 0.001)) repeat-x 0 0;
747 background: linear-gradient(rgba(0, 0, 0, 0.075), rgba(0, 0, 0, 0.001)) repeat-x 0 0;
746 border-top: 1px solid rgba(0, 0, 0, 0.15);
748 border-top: 1px solid rgba(0, 0, 0, 0.15);
747 }
749 }
748 .fpath-placeholder {
750 .fpath-placeholder {
749 visibility: visible !important;
751 visibility: visible !important;
750 }
752 }
751 }
753 }
752
754
753 .diffset-menu {
755 .diffset-menu {
754 margin-bottom: 20px;
756 margin-bottom: 20px;
755 }
757 }
756 .diffset {
758 .diffset {
757 margin: 20px auto;
759 margin: 20px auto;
758 .diffset-heading {
760 .diffset-heading {
759 border: 1px solid @grey5;
761 border: 1px solid @grey5;
760 margin-bottom: -1px;
762 margin-bottom: -1px;
761 // margin-top: 20px;
763 // margin-top: 20px;
762 h2 {
764 h2 {
763 margin: 0;
765 margin: 0;
764 line-height: 38px;
766 line-height: 38px;
765 padding-left: 10px;
767 padding-left: 10px;
766 }
768 }
767 .btn {
769 .btn {
768 margin: 0;
770 margin: 0;
769 }
771 }
770 background: @grey6;
772 background: @grey6;
771 display: block;
773 display: block;
772 padding: 5px;
774 padding: 5px;
773 }
775 }
774 .diffset-heading-warning {
776 .diffset-heading-warning {
775 background: @alert3-inner;
777 background: @alert3-inner;
776 border: 1px solid @alert3;
778 border: 1px solid @alert3;
777 }
779 }
778 &.diffset-comments-disabled {
780 &.diffset-comments-disabled {
779 .cb-comment-box-opener, .comment-inline-form, .cb-comment-add-button {
781 .cb-comment-box-opener, .comment-inline-form, .cb-comment-add-button {
780 display: none !important;
782 display: none !important;
781 }
783 }
782 }
784 }
783 }
785 }
784
786
785 .filelist {
787 .filelist {
786 .pill {
788 .pill {
787 display: block;
789 display: block;
788 float: left;
790 float: left;
789 padding: @pill-padding-small;
791 padding: @pill-padding-small;
790 }
792 }
791 }
793 }
792
794
793 .pill {
795 .pill {
794 display: block;
796 display: block;
795 float: left;
797 float: left;
796 padding: @pill-padding;
798 padding: @pill-padding;
797 }
799 }
798
800
799 .pill-group {
801 .pill-group {
800 .pill {
802 .pill {
801 opacity: .8;
803 opacity: .8;
802 margin-right: 3px;
804 margin-right: 3px;
803 font-size: 12px;
805 font-size: 12px;
804 font-weight: normal;
806 font-weight: normal;
805
807
806 &:first-child {
808 &:first-child {
807 border-radius: @border-radius 0 0 @border-radius;
809 border-radius: @border-radius 0 0 @border-radius;
808 }
810 }
809 &:last-child {
811 &:last-child {
810 border-radius: 0 @border-radius @border-radius 0;
812 border-radius: 0 @border-radius @border-radius 0;
811 }
813 }
812 &:only-child {
814 &:only-child {
813 border-radius: @border-radius;
815 border-radius: @border-radius;
814 margin-right: 0;
816 margin-right: 0;
815 }
817 }
816 }
818 }
817 }
819 }
818
820
819 /* Main comments*/
821 /* Main comments*/
820 #comments {
822 #comments {
821 .comment-selected {
823 .comment-selected {
822 border-left: 6px solid @comment-highlight-color;
824 border-left: 6px solid @comment-highlight-color;
823 padding-left: 3px;
825 padding-left: 3px;
824 margin-left: -9px;
826 margin-left: -9px;
825 }
827 }
826 }
828 }
827
829
828 .filediff {
830 .filediff {
829 border: 1px solid @grey5;
831 border: 1px solid @grey5;
830
832
831 /* START OVERRIDES */
833 /* START OVERRIDES */
832 .code-highlight {
834 .code-highlight {
833 border: none; // TODO: remove this border from the global
835 border: none; // TODO: remove this border from the global
834 // .code-highlight, it doesn't belong there
836 // .code-highlight, it doesn't belong there
835 }
837 }
836 label {
838 label {
837 margin: 0; // TODO: remove this margin definition from global label
839 margin: 0; // TODO: remove this margin definition from global label
838 // it doesn't belong there - if margin on labels
840 // it doesn't belong there - if margin on labels
839 // are needed for a form they should be defined
841 // are needed for a form they should be defined
840 // in the form's class
842 // in the form's class
841 }
843 }
842 /* END OVERRIDES */
844 /* END OVERRIDES */
843
845
844 * {
846 * {
845 box-sizing: border-box;
847 box-sizing: border-box;
846 }
848 }
847 .filediff-anchor {
849 .filediff-anchor {
848 visibility: hidden;
850 visibility: hidden;
849 }
851 }
850 &:hover {
852 &:hover {
851 .filediff-anchor {
853 .filediff-anchor {
852 visibility: visible;
854 visibility: visible;
853 }
855 }
854 }
856 }
855
857
856 .filediff-collapse-indicator {
858 .filediff-collapse-indicator {
857 border-style: solid;
859 border-style: solid;
858 float: left;
860 float: left;
859 margin: 4px 0px 0 0;
861 margin: 4px 0px 0 0;
860 cursor: pointer;
862 cursor: pointer;
861 }
863 }
862
864
863 .filediff-heading {
865 .filediff-heading {
864 background: @grey7;
866 background: @grey7;
865 cursor: pointer;
867 cursor: pointer;
866 display: block;
868 display: block;
867 padding: 5px 10px;
869 padding: 5px 10px;
868 }
870 }
869 .filediff-heading:after {
871 .filediff-heading:after {
870 content: "";
872 content: "";
871 display: table;
873 display: table;
872 clear: both;
874 clear: both;
873 }
875 }
874 .filediff-heading:hover {
876 .filediff-heading:hover {
875 background: #e1e9f4 !important;
877 background: #e1e9f4 !important;
876 }
878 }
877
879
878 .filediff-menu {
880 .filediff-menu {
879 float: right;
881 float: right;
880 text-align: right;
882 text-align: right;
881 padding: 5px 5px 5px 0px;
883 padding: 5px 5px 5px 0px;
882
884
883 &> a,
885 &> a,
884 &> span {
886 &> span {
885 padding: 1px;
887 padding: 1px;
886 }
888 }
887 }
889 }
888
890
889 .filediff-collapse-button, .filediff-expand-button {
891 .filediff-collapse-button, .filediff-expand-button {
890 cursor: pointer;
892 cursor: pointer;
891 }
893 }
892 .filediff-collapse-button {
894 .filediff-collapse-button {
893 display: inline;
895 display: inline;
894 }
896 }
895 .filediff-expand-button {
897 .filediff-expand-button {
896 display: none;
898 display: none;
897 }
899 }
898 .filediff-collapsed .filediff-collapse-button {
900 .filediff-collapsed .filediff-collapse-button {
899 display: none;
901 display: none;
900 }
902 }
901 .filediff-collapsed .filediff-expand-button {
903 .filediff-collapsed .filediff-expand-button {
902 display: inline;
904 display: inline;
903 }
905 }
904
906
905 /**** COMMENTS ****/
907 /**** COMMENTS ****/
906
908
907 .filediff-menu {
909 .filediff-menu {
908 .show-comment-button {
910 .show-comment-button {
909 display: none;
911 display: none;
910 }
912 }
911 }
913 }
912 &.hide-comments {
914 &.hide-comments {
913 .inline-comments {
915 .inline-comments {
914 display: none;
916 display: none;
915 }
917 }
916 .filediff-menu {
918 .filediff-menu {
917 .show-comment-button {
919 .show-comment-button {
918 display: inline;
920 display: inline;
919 }
921 }
920 .hide-comment-button {
922 .hide-comment-button {
921 display: none;
923 display: none;
922 }
924 }
923 }
925 }
924 }
926 }
925
927
926 .hide-line-comments {
928 .hide-line-comments {
927 .inline-comments {
929 .inline-comments {
928 display: none;
930 display: none;
929 }
931 }
930 }
932 }
931
933
932 /**** END COMMENTS ****/
934 /**** END COMMENTS ****/
933
935
934 }
936 }
935
937
936
938
937
939
938 .filediff, .filelist {
940 .filediff, .filelist {
939 .pill {
941 .pill {
940 &[op="name"] {
942 &[op="name"] {
941 background: none;
943 background: none;
942 opacity: 1;
944 opacity: 1;
943 color: white;
945 color: white;
944 }
946 }
945 &[op="limited"] {
947 &[op="limited"] {
946 background: @grey2;
948 background: @grey2;
947 color: white;
949 color: white;
948 }
950 }
949 &[op="binary"] {
951 &[op="binary"] {
950 background: @color7;
952 background: @color7;
951 color: white;
953 color: white;
952 }
954 }
953 &[op="modified"] {
955 &[op="modified"] {
954 background: @alert1;
956 background: @alert1;
955 color: white;
957 color: white;
956 }
958 }
957 &[op="renamed"] {
959 &[op="renamed"] {
958 background: @color4;
960 background: @color4;
959 color: white;
961 color: white;
960 }
962 }
961 &[op="copied"] {
963 &[op="copied"] {
962 background: @color4;
964 background: @color4;
963 color: white;
965 color: white;
964 }
966 }
965 &[op="mode"] {
967 &[op="mode"] {
966 background: @grey3;
968 background: @grey3;
967 color: white;
969 color: white;
968 }
970 }
969 &[op="symlink"] {
971 &[op="symlink"] {
970 background: @color8;
972 background: @color8;
971 color: white;
973 color: white;
972 }
974 }
973
975
974 &[op="added"] { /* added lines */
976 &[op="added"] { /* added lines */
975 background: @alert1;
977 background: @alert1;
976 color: white;
978 color: white;
977 }
979 }
978 &[op="deleted"] { /* deleted lines */
980 &[op="deleted"] { /* deleted lines */
979 background: @alert2;
981 background: @alert2;
980 color: white;
982 color: white;
981 }
983 }
982
984
983 &[op="created"] { /* created file */
985 &[op="created"] { /* created file */
984 background: @alert1;
986 background: @alert1;
985 color: white;
987 color: white;
986 }
988 }
987 &[op="removed"] { /* deleted file */
989 &[op="removed"] { /* deleted file */
988 background: @color5;
990 background: @color5;
989 color: white;
991 color: white;
990 }
992 }
991 }
993 }
992 }
994 }
993
995
994
996
995 .filediff-outdated {
997 .filediff-outdated {
996 padding: 8px 0;
998 padding: 8px 0;
997
999
998 .filediff-heading {
1000 .filediff-heading {
999 opacity: .5;
1001 opacity: .5;
1000 }
1002 }
1001 }
1003 }
1002
1004
1003 table.cb {
1005 table.cb {
1004 width: 100%;
1006 width: 100%;
1005 border-collapse: collapse;
1007 border-collapse: collapse;
1006
1008
1007 .cb-text {
1009 .cb-text {
1008 padding: @cb-text-padding;
1010 padding: @cb-text-padding;
1009 }
1011 }
1010 .cb-hunk {
1012 .cb-hunk {
1011 padding: @cb-text-padding;
1013 padding: @cb-text-padding;
1012 }
1014 }
1013 .cb-expand {
1015 .cb-expand {
1014 display: none;
1016 display: none;
1015 }
1017 }
1016 .cb-collapse {
1018 .cb-collapse {
1017 display: inline;
1019 display: inline;
1018 }
1020 }
1019 &.cb-collapsed {
1021 &.cb-collapsed {
1020 .cb-line {
1022 .cb-line {
1021 display: none;
1023 display: none;
1022 }
1024 }
1023 .cb-expand {
1025 .cb-expand {
1024 display: inline;
1026 display: inline;
1025 }
1027 }
1026 .cb-collapse {
1028 .cb-collapse {
1027 display: none;
1029 display: none;
1028 }
1030 }
1029 .cb-hunk {
1031 .cb-hunk {
1030 display: none;
1032 display: none;
1031 }
1033 }
1032 }
1034 }
1033
1035
1034 /* intentionally general selector since .cb-line-selected must override it
1036 /* intentionally general selector since .cb-line-selected must override it
1035 and they both use !important since the td itself may have a random color
1037 and they both use !important since the td itself may have a random color
1036 generated by annotation blocks. TLDR: if you change it, make sure
1038 generated by annotation blocks. TLDR: if you change it, make sure
1037 annotated block selection and line selection in file view still work */
1039 annotated block selection and line selection in file view still work */
1038 .cb-line-fresh .cb-content {
1040 .cb-line-fresh .cb-content {
1039 background: white !important;
1041 background: white !important;
1040 }
1042 }
1041 .cb-warning {
1043 .cb-warning {
1042 background: #fff4dd;
1044 background: #fff4dd;
1043 }
1045 }
1044
1046
1045 &.cb-diff-sideside {
1047 &.cb-diff-sideside {
1046 td {
1048 td {
1047 &.cb-content {
1049 &.cb-content {
1048 width: 50%;
1050 width: 50%;
1049 }
1051 }
1050 }
1052 }
1051 }
1053 }
1052
1054
1053 tr {
1055 tr {
1054 &.cb-annotate {
1056 &.cb-annotate {
1055 border-top: 1px solid #eee;
1057 border-top: 1px solid #eee;
1056 }
1058 }
1057
1059
1058 &.cb-comment-info {
1060 &.cb-comment-info {
1059 border-top: 1px solid #eee;
1061 border-top: 1px solid #eee;
1060 color: rgba(0, 0, 0, 0.3);
1062 color: rgba(0, 0, 0, 0.3);
1061 background: #edf2f9;
1063 background: #edf2f9;
1062
1064
1063 td {
1065 td {
1064
1066
1065 }
1067 }
1066 }
1068 }
1067
1069
1068 &.cb-hunk {
1070 &.cb-hunk {
1069 font-family: @text-monospace;
1071 font-family: @text-monospace;
1070 color: rgba(0, 0, 0, 0.3);
1072 color: rgba(0, 0, 0, 0.3);
1071
1073
1072 td {
1074 td {
1073 &:first-child {
1075 &:first-child {
1074 background: #edf2f9;
1076 background: #edf2f9;
1075 }
1077 }
1076 &:last-child {
1078 &:last-child {
1077 background: #f4f7fb;
1079 background: #f4f7fb;
1078 }
1080 }
1079 }
1081 }
1080 }
1082 }
1081 }
1083 }
1082
1084
1083
1085
1084 td {
1086 td {
1085 vertical-align: top;
1087 vertical-align: top;
1086 padding: 0;
1088 padding: 0;
1087
1089
1088 &.cb-content {
1090 &.cb-content {
1089 font-size: 12.35px;
1091 font-size: 12.35px;
1090
1092
1091 &.cb-line-selected .cb-code {
1093 &.cb-line-selected .cb-code {
1092 background: @comment-highlight-color !important;
1094 background: @comment-highlight-color !important;
1093 }
1095 }
1094
1096
1095 span.cb-code {
1097 span.cb-code {
1096 line-height: @cb-line-height;
1098 line-height: @cb-line-height;
1097 padding-left: @cb-line-code-padding;
1099 padding-left: @cb-line-code-padding;
1098 padding-right: @cb-line-code-padding;
1100 padding-right: @cb-line-code-padding;
1099 display: block;
1101 display: block;
1100 white-space: pre-wrap;
1102 white-space: pre-wrap;
1101 font-family: @text-monospace;
1103 font-family: @text-monospace;
1102 word-break: break-all;
1104 word-break: break-all;
1103 .nonl {
1105 .nonl {
1104 color: @color5;
1106 color: @color5;
1105 }
1107 }
1106 .cb-action {
1108 .cb-action {
1107 &:before {
1109 &:before {
1108 content: " ";
1110 content: " ";
1109 }
1111 }
1110 &.cb-deletion:before {
1112 &.cb-deletion:before {
1111 content: "- ";
1113 content: "- ";
1112 }
1114 }
1113 &.cb-addition:before {
1115 &.cb-addition:before {
1114 content: "+ ";
1116 content: "+ ";
1115 }
1117 }
1116 }
1118 }
1117 }
1119 }
1118
1120
1119 &> button.cb-comment-box-opener {
1121 &> button.cb-comment-box-opener {
1120
1122
1121 padding: 2px 2px 1px 3px;
1123 padding: 2px 2px 1px 3px;
1122 margin-left: -6px;
1124 margin-left: -6px;
1123 margin-top: -1px;
1125 margin-top: -1px;
1124
1126
1125 border-radius: @border-radius;
1127 border-radius: @border-radius;
1126 position: absolute;
1128 position: absolute;
1127 display: none;
1129 display: none;
1128 }
1130 }
1129 .cb-comment {
1131 .cb-comment {
1130 margin-top: 10px;
1132 margin-top: 10px;
1131 white-space: normal;
1133 white-space: normal;
1132 }
1134 }
1133 }
1135 }
1134 &:hover {
1136 &:hover {
1135 button.cb-comment-box-opener {
1137 button.cb-comment-box-opener {
1136 display: block;
1138 display: block;
1137 }
1139 }
1138 &+ td button.cb-comment-box-opener {
1140 &+ td button.cb-comment-box-opener {
1139 display: block
1141 display: block
1140 }
1142 }
1141 }
1143 }
1142
1144
1143 &.cb-data {
1145 &.cb-data {
1144 text-align: right;
1146 text-align: right;
1145 width: 30px;
1147 width: 30px;
1146 font-family: @text-monospace;
1148 font-family: @text-monospace;
1147
1149
1148 .icon-comment {
1150 .icon-comment {
1149 cursor: pointer;
1151 cursor: pointer;
1150 }
1152 }
1151 &.cb-line-selected {
1153 &.cb-line-selected {
1152 background: @comment-highlight-color !important;
1154 background: @comment-highlight-color !important;
1153 }
1155 }
1154 &.cb-line-selected > div {
1156 &.cb-line-selected > div {
1155 display: block;
1157 display: block;
1156 background: @comment-highlight-color !important;
1158 background: @comment-highlight-color !important;
1157 line-height: @cb-line-height;
1159 line-height: @cb-line-height;
1158 color: rgba(0, 0, 0, 0.3);
1160 color: rgba(0, 0, 0, 0.3);
1159 }
1161 }
1160 }
1162 }
1161
1163
1162 &.cb-lineno {
1164 &.cb-lineno {
1163 padding: 0;
1165 padding: 0;
1164 width: 50px;
1166 width: 50px;
1165 color: rgba(0, 0, 0, 0.3);
1167 color: rgba(0, 0, 0, 0.3);
1166 text-align: right;
1168 text-align: right;
1167 border-right: 1px solid #eee;
1169 border-right: 1px solid #eee;
1168 font-family: @text-monospace;
1170 font-family: @text-monospace;
1169 -webkit-user-select: none;
1171 -webkit-user-select: none;
1170 -moz-user-select: none;
1172 -moz-user-select: none;
1171 user-select: none;
1173 user-select: none;
1172
1174
1173 a::before {
1175 a::before {
1174 content: attr(data-line-no);
1176 content: attr(data-line-no);
1175 }
1177 }
1176 &.cb-line-selected {
1178 &.cb-line-selected {
1177 background: @comment-highlight-color !important;
1179 background: @comment-highlight-color !important;
1178 }
1180 }
1179
1181
1180 a {
1182 a {
1181 display: block;
1183 display: block;
1182 padding-right: @cb-line-code-padding;
1184 padding-right: @cb-line-code-padding;
1183 padding-left: @cb-line-code-padding;
1185 padding-left: @cb-line-code-padding;
1184 line-height: @cb-line-height;
1186 line-height: @cb-line-height;
1185 color: rgba(0, 0, 0, 0.3);
1187 color: rgba(0, 0, 0, 0.3);
1186 }
1188 }
1187 }
1189 }
1188
1190
1189 &.cb-empty {
1191 &.cb-empty {
1190 background: @grey7;
1192 background: @grey7;
1191 }
1193 }
1192
1194
1193 ins {
1195 ins {
1194 color: black;
1196 color: black;
1195 background: #a6f3a6;
1197 background: #a6f3a6;
1196 text-decoration: none;
1198 text-decoration: none;
1197 }
1199 }
1198 del {
1200 del {
1199 color: black;
1201 color: black;
1200 background: #f8cbcb;
1202 background: #f8cbcb;
1201 text-decoration: none;
1203 text-decoration: none;
1202 }
1204 }
1203 &.cb-addition {
1205 &.cb-addition {
1204 background: #ecffec;
1206 background: #ecffec;
1205
1207
1206 &.blob-lineno {
1208 &.blob-lineno {
1207 background: #ddffdd;
1209 background: #ddffdd;
1208 }
1210 }
1209 }
1211 }
1210 &.cb-deletion {
1212 &.cb-deletion {
1211 background: #ffecec;
1213 background: #ffecec;
1212
1214
1213 &.blob-lineno {
1215 &.blob-lineno {
1214 background: #ffdddd;
1216 background: #ffdddd;
1215 }
1217 }
1216 }
1218 }
1217 &.cb-annotate-message-spacer {
1219 &.cb-annotate-message-spacer {
1218 width:8px;
1220 width:8px;
1219 padding: 1px 0px 0px 3px;
1221 padding: 1px 0px 0px 3px;
1220 }
1222 }
1221 &.cb-annotate-info {
1223 &.cb-annotate-info {
1222 width: 320px;
1224 width: 320px;
1223 min-width: 320px;
1225 min-width: 320px;
1224 max-width: 320px;
1226 max-width: 320px;
1225 padding: 5px 2px;
1227 padding: 5px 2px;
1226 font-size: 13px;
1228 font-size: 13px;
1227
1229
1228 .cb-annotate-message {
1230 .cb-annotate-message {
1229 padding: 2px 0px 0px 0px;
1231 padding: 2px 0px 0px 0px;
1230 white-space: pre-line;
1232 white-space: pre-line;
1231 overflow: hidden;
1233 overflow: hidden;
1232 }
1234 }
1233 .rc-user {
1235 .rc-user {
1234 float: none;
1236 float: none;
1235 padding: 0 6px 0 17px;
1237 padding: 0 6px 0 17px;
1236 min-width: unset;
1238 min-width: unset;
1237 min-height: unset;
1239 min-height: unset;
1238 }
1240 }
1239 }
1241 }
1240
1242
1241 &.cb-annotate-revision {
1243 &.cb-annotate-revision {
1242 cursor: pointer;
1244 cursor: pointer;
1243 text-align: right;
1245 text-align: right;
1244 padding: 1px 3px 0px 3px;
1246 padding: 1px 3px 0px 3px;
1245 }
1247 }
1246 }
1248 }
1247 }
1249 }
@@ -1,575 +1,579 b''
1 // comments.less
1 // comments.less
2 // For use in RhodeCode applications;
2 // For use in RhodeCode applications;
3 // see style guide documentation for guidelines.
3 // see style guide documentation for guidelines.
4
4
5
5
6 // Comments
6 // Comments
7 @comment-outdated-opacity: 0.6;
7 @comment-outdated-opacity: 0.6;
8
8
9 .comments {
9 .comments {
10 width: 100%;
10 width: 100%;
11 }
11 }
12
12
13 tr.inline-comments div {
13 tr.inline-comments div {
14 max-width: 100%;
14 max-width: 100%;
15
15
16 p {
16 p {
17 white-space: normal;
17 white-space: normal;
18 }
18 }
19
19
20 code, pre, .code, dd {
20 code, pre, .code, dd {
21 overflow-x: auto;
21 overflow-x: auto;
22 width: 1062px;
22 width: 1062px;
23 }
23 }
24
24
25 dd {
25 dd {
26 width: auto;
26 width: auto;
27 }
27 }
28 }
28 }
29
29
30 #injected_page_comments {
30 #injected_page_comments {
31 .comment-previous-link,
31 .comment-previous-link,
32 .comment-next-link,
32 .comment-next-link,
33 .comment-links-divider {
33 .comment-links-divider {
34 display: none;
34 display: none;
35 }
35 }
36 }
36 }
37
37
38 .add-comment {
38 .add-comment {
39 margin-bottom: 10px;
39 margin-bottom: 10px;
40 }
40 }
41 .hide-comment-button .add-comment {
41 .hide-comment-button .add-comment {
42 display: none;
42 display: none;
43 }
43 }
44
44
45 .comment-bubble {
45 .comment-bubble {
46 color: @grey4;
46 color: @grey4;
47 margin-top: 4px;
47 margin-top: 4px;
48 margin-right: 30px;
48 margin-right: 30px;
49 visibility: hidden;
49 visibility: hidden;
50 }
50 }
51
51
52 .comment-label {
52 .comment-label {
53 float: left;
53 float: left;
54
54
55 padding: 0.4em 0.4em;
55 padding: 0.4em 0.4em;
56 margin: 3px 5px 0px -10px;
56 margin: 3px 5px 0px -10px;
57 display: inline-block;
57 display: inline-block;
58 min-height: 0;
58 min-height: 0;
59
59
60 text-align: center;
60 text-align: center;
61 font-size: 10px;
61 font-size: 10px;
62 line-height: .8em;
62 line-height: .8em;
63
63
64 font-family: @text-italic;
64 font-family: @text-italic;
65 font-style: italic;
65 background: #fff none;
66 background: #fff none;
66 color: @grey4;
67 color: @grey4;
67 border: 1px solid @grey4;
68 border: 1px solid @grey4;
68 white-space: nowrap;
69 white-space: nowrap;
69
70
70 text-transform: uppercase;
71 text-transform: uppercase;
71 min-width: 40px;
72 min-width: 40px;
72
73
73 &.todo {
74 &.todo {
74 color: @color5;
75 color: @color5;
76 font-style: italic;
77 font-weight: @text-bold-italic-weight;
75 font-family: @text-bold-italic;
78 font-family: @text-bold-italic;
76 }
79 }
77
80
78 .resolve {
81 .resolve {
79 cursor: pointer;
82 cursor: pointer;
80 text-decoration: underline;
83 text-decoration: underline;
81 }
84 }
82
85
83 .resolved {
86 .resolved {
84 text-decoration: line-through;
87 text-decoration: line-through;
85 color: @color1;
88 color: @color1;
86 }
89 }
87 .resolved a {
90 .resolved a {
88 text-decoration: line-through;
91 text-decoration: line-through;
89 color: @color1;
92 color: @color1;
90 }
93 }
91 .resolve-text {
94 .resolve-text {
92 color: @color1;
95 color: @color1;
93 margin: 2px 8px;
96 margin: 2px 8px;
94 font-family: @text-italic;
97 font-family: @text-italic;
98 font-style: italic;
95 }
99 }
96 }
100 }
97
101
98 .has-spacer-after {
102 .has-spacer-after {
99 &:after {
103 &:after {
100 content: ' | ';
104 content: ' | ';
101 color: @grey5;
105 color: @grey5;
102 }
106 }
103 }
107 }
104
108
105 .has-spacer-before {
109 .has-spacer-before {
106 &:before {
110 &:before {
107 content: ' | ';
111 content: ' | ';
108 color: @grey5;
112 color: @grey5;
109 }
113 }
110 }
114 }
111
115
112 .comment {
116 .comment {
113
117
114 &.comment-general {
118 &.comment-general {
115 border: 1px solid @grey5;
119 border: 1px solid @grey5;
116 padding: 5px 5px 5px 5px;
120 padding: 5px 5px 5px 5px;
117 }
121 }
118
122
119 margin: @padding 0;
123 margin: @padding 0;
120 padding: 4px 0 0 0;
124 padding: 4px 0 0 0;
121 line-height: 1em;
125 line-height: 1em;
122
126
123 .rc-user {
127 .rc-user {
124 min-width: 0;
128 min-width: 0;
125 margin: 0px .5em 0 0;
129 margin: 0px .5em 0 0;
126
130
127 .user {
131 .user {
128 display: inline;
132 display: inline;
129 }
133 }
130 }
134 }
131
135
132 .meta {
136 .meta {
133 position: relative;
137 position: relative;
134 width: 100%;
138 width: 100%;
135 border-bottom: 1px solid @grey5;
139 border-bottom: 1px solid @grey5;
136 margin: -5px 0px;
140 margin: -5px 0px;
137 line-height: 24px;
141 line-height: 24px;
138
142
139 &:hover .permalink {
143 &:hover .permalink {
140 visibility: visible;
144 visibility: visible;
141 color: @rcblue;
145 color: @rcblue;
142 }
146 }
143 }
147 }
144
148
145 .author,
149 .author,
146 .date {
150 .date {
147 display: inline;
151 display: inline;
148
152
149 &:after {
153 &:after {
150 content: ' | ';
154 content: ' | ';
151 color: @grey5;
155 color: @grey5;
152 }
156 }
153 }
157 }
154
158
155 .author-general img {
159 .author-general img {
156 top: 3px;
160 top: 3px;
157 }
161 }
158 .author-inline img {
162 .author-inline img {
159 top: 3px;
163 top: 3px;
160 }
164 }
161
165
162 .status-change,
166 .status-change,
163 .permalink,
167 .permalink,
164 .changeset-status-lbl {
168 .changeset-status-lbl {
165 display: inline;
169 display: inline;
166 }
170 }
167
171
168 .permalink {
172 .permalink {
169 visibility: hidden;
173 visibility: hidden;
170 }
174 }
171
175
172 .comment-links-divider {
176 .comment-links-divider {
173 display: inline;
177 display: inline;
174 }
178 }
175
179
176 .comment-links-block {
180 .comment-links-block {
177 float:right;
181 float:right;
178 text-align: right;
182 text-align: right;
179 min-width: 85px;
183 min-width: 85px;
180
184
181 [class^="icon-"]:before,
185 [class^="icon-"]:before,
182 [class*=" icon-"]:before {
186 [class*=" icon-"]:before {
183 margin-left: 0;
187 margin-left: 0;
184 margin-right: 0;
188 margin-right: 0;
185 }
189 }
186 }
190 }
187
191
188 .comment-previous-link {
192 .comment-previous-link {
189 display: inline-block;
193 display: inline-block;
190
194
191 .arrow_comment_link{
195 .arrow_comment_link{
192 cursor: pointer;
196 cursor: pointer;
193 i {
197 i {
194 font-size:10px;
198 font-size:10px;
195 }
199 }
196 }
200 }
197 .arrow_comment_link.disabled {
201 .arrow_comment_link.disabled {
198 cursor: default;
202 cursor: default;
199 color: @grey5;
203 color: @grey5;
200 }
204 }
201 }
205 }
202
206
203 .comment-next-link {
207 .comment-next-link {
204 display: inline-block;
208 display: inline-block;
205
209
206 .arrow_comment_link{
210 .arrow_comment_link{
207 cursor: pointer;
211 cursor: pointer;
208 i {
212 i {
209 font-size:10px;
213 font-size:10px;
210 }
214 }
211 }
215 }
212 .arrow_comment_link.disabled {
216 .arrow_comment_link.disabled {
213 cursor: default;
217 cursor: default;
214 color: @grey5;
218 color: @grey5;
215 }
219 }
216 }
220 }
217
221
218 .flag_status {
222 .flag_status {
219 display: inline-block;
223 display: inline-block;
220 margin: -2px .5em 0 .25em
224 margin: -2px .5em 0 .25em
221 }
225 }
222
226
223 .delete-comment {
227 .delete-comment {
224 display: inline-block;
228 display: inline-block;
225 color: @rcblue;
229 color: @rcblue;
226
230
227 &:hover {
231 &:hover {
228 cursor: pointer;
232 cursor: pointer;
229 }
233 }
230 }
234 }
231
235
232 .text {
236 .text {
233 clear: both;
237 clear: both;
234 .border-radius(@border-radius);
238 .border-radius(@border-radius);
235 .box-sizing(border-box);
239 .box-sizing(border-box);
236
240
237 .markdown-block p,
241 .markdown-block p,
238 .rst-block p {
242 .rst-block p {
239 margin: .5em 0 !important;
243 margin: .5em 0 !important;
240 // TODO: lisa: This is needed because of other rst !important rules :[
244 // TODO: lisa: This is needed because of other rst !important rules :[
241 }
245 }
242 }
246 }
243
247
244 .pr-version {
248 .pr-version {
245 float: left;
249 float: left;
246 margin: 0px 4px;
250 margin: 0px 4px;
247 }
251 }
248 .pr-version-inline {
252 .pr-version-inline {
249 float: left;
253 float: left;
250 margin: 0px 4px;
254 margin: 0px 4px;
251 }
255 }
252 .pr-version-num {
256 .pr-version-num {
253 font-size: 10px;
257 font-size: 10px;
254 }
258 }
255 }
259 }
256
260
257 @comment-padding: 5px;
261 @comment-padding: 5px;
258
262
259 .general-comments {
263 .general-comments {
260 .comment-outdated {
264 .comment-outdated {
261 opacity: @comment-outdated-opacity;
265 opacity: @comment-outdated-opacity;
262 }
266 }
263 }
267 }
264
268
265 .inline-comments {
269 .inline-comments {
266 border-radius: @border-radius;
270 border-radius: @border-radius;
267 .comment {
271 .comment {
268 margin: 0;
272 margin: 0;
269 border-radius: @border-radius;
273 border-radius: @border-radius;
270 }
274 }
271 .comment-outdated {
275 .comment-outdated {
272 opacity: @comment-outdated-opacity;
276 opacity: @comment-outdated-opacity;
273 }
277 }
274
278
275 .comment-inline {
279 .comment-inline {
276 background: white;
280 background: white;
277 padding: @comment-padding @comment-padding;
281 padding: @comment-padding @comment-padding;
278 border: @comment-padding solid @grey6;
282 border: @comment-padding solid @grey6;
279
283
280 .text {
284 .text {
281 border: none;
285 border: none;
282 }
286 }
283 .meta {
287 .meta {
284 border-bottom: 1px solid @grey6;
288 border-bottom: 1px solid @grey6;
285 margin: -5px 0px;
289 margin: -5px 0px;
286 line-height: 24px;
290 line-height: 24px;
287 }
291 }
288 }
292 }
289 .comment-selected {
293 .comment-selected {
290 border-left: 6px solid @comment-highlight-color;
294 border-left: 6px solid @comment-highlight-color;
291 }
295 }
292 .comment-inline-form {
296 .comment-inline-form {
293 padding: @comment-padding;
297 padding: @comment-padding;
294 display: none;
298 display: none;
295 }
299 }
296 .cb-comment-add-button {
300 .cb-comment-add-button {
297 margin: @comment-padding;
301 margin: @comment-padding;
298 }
302 }
299 /* hide add comment button when form is open */
303 /* hide add comment button when form is open */
300 .comment-inline-form-open ~ .cb-comment-add-button {
304 .comment-inline-form-open ~ .cb-comment-add-button {
301 display: none;
305 display: none;
302 }
306 }
303 .comment-inline-form-open {
307 .comment-inline-form-open {
304 display: block;
308 display: block;
305 }
309 }
306 /* hide add comment button when form but no comments */
310 /* hide add comment button when form but no comments */
307 .comment-inline-form:first-child + .cb-comment-add-button {
311 .comment-inline-form:first-child + .cb-comment-add-button {
308 display: none;
312 display: none;
309 }
313 }
310 /* hide add comment button when no comments or form */
314 /* hide add comment button when no comments or form */
311 .cb-comment-add-button:first-child {
315 .cb-comment-add-button:first-child {
312 display: none;
316 display: none;
313 }
317 }
314 /* hide add comment button when only comment is being deleted */
318 /* hide add comment button when only comment is being deleted */
315 .comment-deleting:first-child + .cb-comment-add-button {
319 .comment-deleting:first-child + .cb-comment-add-button {
316 display: none;
320 display: none;
317 }
321 }
318 }
322 }
319
323
320
324
321 .show-outdated-comments {
325 .show-outdated-comments {
322 display: inline;
326 display: inline;
323 color: @rcblue;
327 color: @rcblue;
324 }
328 }
325
329
326 // Comment Form
330 // Comment Form
327 div.comment-form {
331 div.comment-form {
328 margin-top: 20px;
332 margin-top: 20px;
329 }
333 }
330
334
331 .comment-form strong {
335 .comment-form strong {
332 display: block;
336 display: block;
333 margin-bottom: 15px;
337 margin-bottom: 15px;
334 }
338 }
335
339
336 .comment-form textarea {
340 .comment-form textarea {
337 width: 100%;
341 width: 100%;
338 height: 100px;
342 height: 100px;
339 font-family: @text-monospace;
343 font-family: @text-monospace;
340 }
344 }
341
345
342 form.comment-form {
346 form.comment-form {
343 margin-top: 10px;
347 margin-top: 10px;
344 margin-left: 10px;
348 margin-left: 10px;
345 }
349 }
346
350
347 .comment-inline-form .comment-block-ta,
351 .comment-inline-form .comment-block-ta,
348 .comment-form .comment-block-ta,
352 .comment-form .comment-block-ta,
349 .comment-form .preview-box {
353 .comment-form .preview-box {
350 .border-radius(@border-radius);
354 .border-radius(@border-radius);
351 .box-sizing(border-box);
355 .box-sizing(border-box);
352 background-color: white;
356 background-color: white;
353 }
357 }
354
358
355 .comment-form-submit {
359 .comment-form-submit {
356 margin-top: 5px;
360 margin-top: 5px;
357 margin-left: 525px;
361 margin-left: 525px;
358 }
362 }
359
363
360 .file-comments {
364 .file-comments {
361 display: none;
365 display: none;
362 }
366 }
363
367
364 .comment-form .preview-box.unloaded,
368 .comment-form .preview-box.unloaded,
365 .comment-inline-form .preview-box.unloaded {
369 .comment-inline-form .preview-box.unloaded {
366 height: 50px;
370 height: 50px;
367 text-align: center;
371 text-align: center;
368 padding: 20px;
372 padding: 20px;
369 background-color: white;
373 background-color: white;
370 }
374 }
371
375
372 .comment-footer {
376 .comment-footer {
373 position: relative;
377 position: relative;
374 width: 100%;
378 width: 100%;
375 min-height: 42px;
379 min-height: 42px;
376
380
377 .status_box,
381 .status_box,
378 .cancel-button {
382 .cancel-button {
379 float: left;
383 float: left;
380 display: inline-block;
384 display: inline-block;
381 }
385 }
382
386
383 .action-buttons {
387 .action-buttons {
384 float: right;
388 float: right;
385 display: inline-block;
389 display: inline-block;
386 }
390 }
387
391
388 .action-buttons-extra {
392 .action-buttons-extra {
389 display: inline-block;
393 display: inline-block;
390 }
394 }
391 }
395 }
392
396
393 .comment-form {
397 .comment-form {
394
398
395 .comment {
399 .comment {
396 margin-left: 10px;
400 margin-left: 10px;
397 }
401 }
398
402
399 .comment-help {
403 .comment-help {
400 color: @grey4;
404 color: @grey4;
401 padding: 5px 0 5px 0;
405 padding: 5px 0 5px 0;
402 }
406 }
403
407
404 .comment-title {
408 .comment-title {
405 padding: 5px 0 5px 0;
409 padding: 5px 0 5px 0;
406 }
410 }
407
411
408 .comment-button {
412 .comment-button {
409 display: inline-block;
413 display: inline-block;
410 }
414 }
411
415
412 .comment-button-input {
416 .comment-button-input {
413 margin-right: 0;
417 margin-right: 0;
414 }
418 }
415
419
416 .comment-footer {
420 .comment-footer {
417 margin-bottom: 110px;
421 margin-bottom: 110px;
418 margin-top: 10px;
422 margin-top: 10px;
419 }
423 }
420 }
424 }
421
425
422
426
423 .comment-form-login {
427 .comment-form-login {
424 .comment-help {
428 .comment-help {
425 padding: 0.9em; //same as the button
429 padding: 0.9em; //same as the button
426 }
430 }
427
431
428 div.clearfix {
432 div.clearfix {
429 clear: both;
433 clear: both;
430 width: 100%;
434 width: 100%;
431 display: block;
435 display: block;
432 }
436 }
433 }
437 }
434
438
435 .comment-type {
439 .comment-type {
436 margin: 0px;
440 margin: 0px;
437 border-radius: inherit;
441 border-radius: inherit;
438 border-color: @grey6;
442 border-color: @grey6;
439 }
443 }
440
444
441 .preview-box {
445 .preview-box {
442 min-height: 105px;
446 min-height: 105px;
443 margin-bottom: 15px;
447 margin-bottom: 15px;
444 background-color: white;
448 background-color: white;
445 .border-radius(@border-radius);
449 .border-radius(@border-radius);
446 .box-sizing(border-box);
450 .box-sizing(border-box);
447 }
451 }
448
452
449 .add-another-button {
453 .add-another-button {
450 margin-left: 10px;
454 margin-left: 10px;
451 margin-top: 10px;
455 margin-top: 10px;
452 margin-bottom: 10px;
456 margin-bottom: 10px;
453 }
457 }
454
458
455 .comment .buttons {
459 .comment .buttons {
456 float: right;
460 float: right;
457 margin: -1px 0px 0px 0px;
461 margin: -1px 0px 0px 0px;
458 }
462 }
459
463
460 // Inline Comment Form
464 // Inline Comment Form
461 .injected_diff .comment-inline-form,
465 .injected_diff .comment-inline-form,
462 .comment-inline-form {
466 .comment-inline-form {
463 background-color: white;
467 background-color: white;
464 margin-top: 10px;
468 margin-top: 10px;
465 margin-bottom: 20px;
469 margin-bottom: 20px;
466 }
470 }
467
471
468 .inline-form {
472 .inline-form {
469 padding: 10px 7px;
473 padding: 10px 7px;
470 }
474 }
471
475
472 .inline-form div {
476 .inline-form div {
473 max-width: 100%;
477 max-width: 100%;
474 }
478 }
475
479
476 .overlay {
480 .overlay {
477 display: none;
481 display: none;
478 position: absolute;
482 position: absolute;
479 width: 100%;
483 width: 100%;
480 text-align: center;
484 text-align: center;
481 vertical-align: middle;
485 vertical-align: middle;
482 font-size: 16px;
486 font-size: 16px;
483 background: none repeat scroll 0 0 white;
487 background: none repeat scroll 0 0 white;
484
488
485 &.submitting {
489 &.submitting {
486 display: block;
490 display: block;
487 opacity: 0.5;
491 opacity: 0.5;
488 z-index: 100;
492 z-index: 100;
489 }
493 }
490 }
494 }
491 .comment-inline-form .overlay.submitting .overlay-text {
495 .comment-inline-form .overlay.submitting .overlay-text {
492 margin-top: 5%;
496 margin-top: 5%;
493 }
497 }
494
498
495 .comment-inline-form .clearfix,
499 .comment-inline-form .clearfix,
496 .comment-form .clearfix {
500 .comment-form .clearfix {
497 .border-radius(@border-radius);
501 .border-radius(@border-radius);
498 margin: 0px;
502 margin: 0px;
499 }
503 }
500
504
501 .comment-inline-form .comment-footer {
505 .comment-inline-form .comment-footer {
502 margin: 10px 0px 0px 0px;
506 margin: 10px 0px 0px 0px;
503 }
507 }
504
508
505 .hide-inline-form-button {
509 .hide-inline-form-button {
506 margin-left: 5px;
510 margin-left: 5px;
507 }
511 }
508 .comment-button .hide-inline-form {
512 .comment-button .hide-inline-form {
509 background: white;
513 background: white;
510 }
514 }
511
515
512 .comment-area {
516 .comment-area {
513 padding: 8px 12px;
517 padding: 8px 12px;
514 border: 1px solid @grey5;
518 border: 1px solid @grey5;
515 .border-radius(@border-radius);
519 .border-radius(@border-radius);
516
520
517 .resolve-action {
521 .resolve-action {
518 padding: 1px 0px 0px 6px;
522 padding: 1px 0px 0px 6px;
519 }
523 }
520
524
521 }
525 }
522
526
523 .comment-area-header .nav-links {
527 .comment-area-header .nav-links {
524 display: flex;
528 display: flex;
525 flex-flow: row wrap;
529 flex-flow: row wrap;
526 -webkit-flex-flow: row wrap;
530 -webkit-flex-flow: row wrap;
527 width: 100%;
531 width: 100%;
528 }
532 }
529
533
530 .comment-area-footer {
534 .comment-area-footer {
531 display: flex;
535 display: flex;
532 }
536 }
533
537
534 .comment-footer .toolbar {
538 .comment-footer .toolbar {
535
539
536 }
540 }
537
541
538 .nav-links {
542 .nav-links {
539 padding: 0;
543 padding: 0;
540 margin: 0;
544 margin: 0;
541 list-style: none;
545 list-style: none;
542 height: auto;
546 height: auto;
543 border-bottom: 1px solid @grey5;
547 border-bottom: 1px solid @grey5;
544 }
548 }
545 .nav-links li {
549 .nav-links li {
546 display: inline-block;
550 display: inline-block;
547 }
551 }
548 .nav-links li:before {
552 .nav-links li:before {
549 content: "";
553 content: "";
550 }
554 }
551 .nav-links li a.disabled {
555 .nav-links li a.disabled {
552 cursor: not-allowed;
556 cursor: not-allowed;
553 }
557 }
554
558
555 .nav-links li.active a {
559 .nav-links li.active a {
556 border-bottom: 2px solid @rcblue;
560 border-bottom: 2px solid @rcblue;
557 color: #000;
561 color: #000;
558 font-weight: 600;
562 font-weight: 600;
559 }
563 }
560 .nav-links li a {
564 .nav-links li a {
561 display: inline-block;
565 display: inline-block;
562 padding: 0px 10px 5px 10px;
566 padding: 0px 10px 5px 10px;
563 margin-bottom: -1px;
567 margin-bottom: -1px;
564 font-size: 14px;
568 font-size: 14px;
565 line-height: 28px;
569 line-height: 28px;
566 color: #8f8f8f;
570 color: #8f8f8f;
567 border-bottom: 2px solid transparent;
571 border-bottom: 2px solid transparent;
568 }
572 }
569
573
570 .toolbar-text {
574 .toolbar-text {
571 float: left;
575 float: left;
572 margin: -5px 0px 0px 0px;
576 margin: -5px 0px 0px 0px;
573 font-size: 12px;
577 font-size: 12px;
574 }
578 }
575
579
@@ -1,100 +1,101 b''
1 div.diffblock .code-header .changeset_header > div {
1 div.diffblock .code-header .changeset_header > div {
2 margin: 0 @padding;
2 margin: 0 @padding;
3 }
3 }
4
4
5
5
6 // Line select and comment
6 // Line select and comment
7 div.diffblock.margined.comm tr {
7 div.diffblock.margined.comm tr {
8 td {
8 td {
9 // IMPORTANT - never position:relative this as it causes insanely
9 // IMPORTANT - never position:relative this as it causes insanely
10 // slow rendering
10 // slow rendering
11 }
11 }
12
12
13 .add-comment-line {
13 .add-comment-line {
14 // Force td width for Firefox
14 // Force td width for Firefox
15 width: 20px;
15 width: 20px;
16
16
17 // TODO: anderson: fixing mouse-over bug.
17 // TODO: anderson: fixing mouse-over bug.
18 // why was it vertical-align baseline in first place??
18 // why was it vertical-align baseline in first place??
19 vertical-align: top !important;
19 vertical-align: top !important;
20 // Force width and display for IE 9
20 // Force width and display for IE 9
21 .add-comment-content {
21 .add-comment-content {
22 display: inline-block;
22 display: inline-block;
23 width: 20px;
23 width: 20px;
24
24
25 a {
25 a {
26 display: none;
26 display: none;
27 margin-top: 2px;
27 margin-top: 2px;
28 margin-left: 2px;
28 margin-left: 2px;
29 color: @grey3;
29 color: @grey3;
30 }
30 }
31 }
31 }
32 }
32 }
33
33
34 .comment-toggle {
34 .comment-toggle {
35 position: relative;
35 position: relative;
36 min-width: 20px;
36 min-width: 20px;
37 width: 20px;
37 width: 20px;
38 color: @rcblue;
38 color: @rcblue;
39
39
40 .icon-comment {
40 .icon-comment {
41 position: absolute;
41 position: absolute;
42 top: 2px;
42 top: 2px;
43 left: 0;
43 left: 0;
44 z-index: 100;
44 z-index: 100;
45 visibility: hidden;
45 visibility: hidden;
46 }
46 }
47
47
48 &.active {
48 &.active {
49 .icon-comment{
49 .icon-comment{
50 visibility: visible;
50 visibility: visible;
51 }
51 }
52 cursor: pointer;
52 cursor: pointer;
53 }
53 }
54 }
54 }
55
55
56 &.line {
56 &.line {
57 &:hover, &.hover{
57 &:hover, &.hover{
58 .add-comment-line a{
58 .add-comment-line a{
59 display: inline;
59 display: inline;
60 }
60 }
61 }
61 }
62
62
63 &.hover, &.selected {
63 &.hover, &.selected {
64 &, del, ins {
64 &, del, ins {
65 background-color: lighten(@alert3, 10%) !important;
65 background-color: lighten(@alert3, 10%) !important;
66 }
66 }
67 }
67 }
68
68
69 &.commenting {
69 &.commenting {
70 &, del, ins {
70 &, del, ins {
71 background-image: none !important;
71 background-image: none !important;
72 background-color: lighten(@alert4, 10%) !important;
72 background-color: lighten(@alert4, 10%) !important;
73 }
73 }
74 }
74 }
75 }
75 }
76 }
76 }
77
77
78 .compare-header {
78 .compare-header {
79 overflow-x: auto;
79 overflow-x: auto;
80 overflow-y: hidden;
80 overflow-y: hidden;
81 clear: both;
81 clear: both;
82 padding: @padding;
82 padding: @padding;
83 background: @grey6;
83 background: @grey6;
84 border: @border-thickness solid @border-default-color;
84 border: @border-thickness solid @border-default-color;
85 .border-radius(@border-radius);
85 .border-radius(@border-radius);
86
86
87 .compare-value,
87 .compare-value,
88 .compare-label {
88 .compare-label {
89 float: left;
89 float: left;
90 display: inline-block;
90 display: inline-block;
91 min-width: 5em;
91 min-width: 5em;
92 margin: 0;
92 margin: 0;
93 padding: 0.9em 0.9em 0.9em 0;
93 padding: 0.9em 0.9em 0.9em 0;
94 }
94 }
95
95
96 .compare-label {
96 .compare-label {
97 clear: both;
97 clear: both;
98 font-weight: @text-semibold-weight;
98 font-family: @text-semibold;
99 font-family: @text-semibold;
99 }
100 }
100 }
101 }
@@ -1,2468 +1,2475 b''
1 //Primary CSS
1 //Primary CSS
2
2
3 //--- IMPORTS ------------------//
3 //--- IMPORTS ------------------//
4
4
5 @import 'helpers';
5 @import 'helpers';
6 @import 'mixins';
6 @import 'mixins';
7 @import 'rcicons';
7 @import 'rcicons';
8 @import 'variables';
8 @import 'variables';
9 @import 'bootstrap-variables';
9 @import 'bootstrap-variables';
10 @import 'form-bootstrap';
10 @import 'form-bootstrap';
11 @import 'codemirror';
11 @import 'codemirror';
12 @import 'legacy_code_styles';
12 @import 'legacy_code_styles';
13 @import 'readme-box';
13 @import 'readme-box';
14 @import 'progress-bar';
14 @import 'progress-bar';
15
15
16 @import 'type';
16 @import 'type';
17 @import 'alerts';
17 @import 'alerts';
18 @import 'buttons';
18 @import 'buttons';
19 @import 'tags';
19 @import 'tags';
20 @import 'code-block';
20 @import 'code-block';
21 @import 'examples';
21 @import 'examples';
22 @import 'login';
22 @import 'login';
23 @import 'main-content';
23 @import 'main-content';
24 @import 'select2';
24 @import 'select2';
25 @import 'comments';
25 @import 'comments';
26 @import 'panels-bootstrap';
26 @import 'panels-bootstrap';
27 @import 'panels';
27 @import 'panels';
28 @import 'deform';
28 @import 'deform';
29
29
30 //--- BASE ------------------//
30 //--- BASE ------------------//
31 .noscript-error {
31 .noscript-error {
32 top: 0;
32 top: 0;
33 left: 0;
33 left: 0;
34 width: 100%;
34 width: 100%;
35 z-index: 101;
35 z-index: 101;
36 text-align: center;
36 text-align: center;
37 font-family: @text-semibold;
38 font-size: 120%;
37 font-size: 120%;
39 color: white;
38 color: white;
40 background-color: @alert2;
39 background-color: @alert2;
41 padding: 5px 0 5px 0;
40 padding: 5px 0 5px 0;
41 font-weight: @text-semibold-weight;
42 font-family: @text-semibold;
42 }
43 }
43
44
44 html {
45 html {
45 display: table;
46 display: table;
46 height: 100%;
47 height: 100%;
47 width: 100%;
48 width: 100%;
48 }
49 }
49
50
50 body {
51 body {
51 display: table-cell;
52 display: table-cell;
52 width: 100%;
53 width: 100%;
53 }
54 }
54
55
55 //--- LAYOUT ------------------//
56 //--- LAYOUT ------------------//
56
57
57 .hidden{
58 .hidden{
58 display: none !important;
59 display: none !important;
59 }
60 }
60
61
61 .box{
62 .box{
62 float: left;
63 float: left;
63 width: 100%;
64 width: 100%;
64 }
65 }
65
66
66 .browser-header {
67 .browser-header {
67 clear: both;
68 clear: both;
68 }
69 }
69 .main {
70 .main {
70 clear: both;
71 clear: both;
71 padding:0 0 @pagepadding;
72 padding:0 0 @pagepadding;
72 height: auto;
73 height: auto;
73
74
74 &:after { //clearfix
75 &:after { //clearfix
75 content:"";
76 content:"";
76 clear:both;
77 clear:both;
77 width:100%;
78 width:100%;
78 display:block;
79 display:block;
79 }
80 }
80 }
81 }
81
82
82 .action-link{
83 .action-link{
83 margin-left: @padding;
84 margin-left: @padding;
84 padding-left: @padding;
85 padding-left: @padding;
85 border-left: @border-thickness solid @border-default-color;
86 border-left: @border-thickness solid @border-default-color;
86 }
87 }
87
88
88 input + .action-link, .action-link.first{
89 input + .action-link, .action-link.first{
89 border-left: none;
90 border-left: none;
90 }
91 }
91
92
92 .action-link.last{
93 .action-link.last{
93 margin-right: @padding;
94 margin-right: @padding;
94 padding-right: @padding;
95 padding-right: @padding;
95 }
96 }
96
97
97 .action-link.active,
98 .action-link.active,
98 .action-link.active a{
99 .action-link.active a{
99 color: @grey4;
100 color: @grey4;
100 }
101 }
101
102
102 .action-link.disabled {
103 .action-link.disabled {
103 color: @grey4;
104 color: @grey4;
104 cursor: inherit;
105 cursor: inherit;
105 }
106 }
106
107
107 .clipboard-action {
108 .clipboard-action {
108 cursor: pointer;
109 cursor: pointer;
109 }
110 }
110
111
111 ul.simple-list{
112 ul.simple-list{
112 list-style: none;
113 list-style: none;
113 margin: 0;
114 margin: 0;
114 padding: 0;
115 padding: 0;
115 }
116 }
116
117
117 .main-content {
118 .main-content {
118 padding-bottom: @pagepadding;
119 padding-bottom: @pagepadding;
119 }
120 }
120
121
121 .wide-mode-wrapper {
122 .wide-mode-wrapper {
122 max-width:4000px !important;
123 max-width:4000px !important;
123 }
124 }
124
125
125 .wrapper {
126 .wrapper {
126 position: relative;
127 position: relative;
127 max-width: @wrapper-maxwidth;
128 max-width: @wrapper-maxwidth;
128 margin: 0 auto;
129 margin: 0 auto;
129 }
130 }
130
131
131 #content {
132 #content {
132 clear: both;
133 clear: both;
133 padding: 0 @contentpadding;
134 padding: 0 @contentpadding;
134 }
135 }
135
136
136 .advanced-settings-fields{
137 .advanced-settings-fields{
137 input{
138 input{
138 margin-left: @textmargin;
139 margin-left: @textmargin;
139 margin-right: @padding/2;
140 margin-right: @padding/2;
140 }
141 }
141 }
142 }
142
143
143 .cs_files_title {
144 .cs_files_title {
144 margin: @pagepadding 0 0;
145 margin: @pagepadding 0 0;
145 }
146 }
146
147
147 input.inline[type="file"] {
148 input.inline[type="file"] {
148 display: inline;
149 display: inline;
149 }
150 }
150
151
151 .error_page {
152 .error_page {
152 margin: 10% auto;
153 margin: 10% auto;
153
154
154 h1 {
155 h1 {
155 color: @grey2;
156 color: @grey2;
156 }
157 }
157
158
158 .alert {
159 .alert {
159 margin: @padding 0;
160 margin: @padding 0;
160 }
161 }
161
162
162 .error-branding {
163 .error-branding {
164 color: @grey4;
165 font-weight: @text-semibold-weight;
163 font-family: @text-semibold;
166 font-family: @text-semibold;
164 color: @grey4;
165 }
167 }
166
168
167 .error_message {
169 .error_message {
168 font-family: @text-regular;
170 font-family: @text-regular;
169 }
171 }
170
172
171 .sidebar {
173 .sidebar {
172 min-height: 275px;
174 min-height: 275px;
173 margin: 0;
175 margin: 0;
174 padding: 0 0 @sidebarpadding @sidebarpadding;
176 padding: 0 0 @sidebarpadding @sidebarpadding;
175 border: none;
177 border: none;
176 }
178 }
177
179
178 .main-content {
180 .main-content {
179 position: relative;
181 position: relative;
180 margin: 0 @sidebarpadding @sidebarpadding;
182 margin: 0 @sidebarpadding @sidebarpadding;
181 padding: 0 0 0 @sidebarpadding;
183 padding: 0 0 0 @sidebarpadding;
182 border-left: @border-thickness solid @grey5;
184 border-left: @border-thickness solid @grey5;
183
185
184 @media (max-width:767px) {
186 @media (max-width:767px) {
185 clear: both;
187 clear: both;
186 width: 100%;
188 width: 100%;
187 margin: 0;
189 margin: 0;
188 border: none;
190 border: none;
189 }
191 }
190 }
192 }
191
193
192 .inner-column {
194 .inner-column {
193 float: left;
195 float: left;
194 width: 29.75%;
196 width: 29.75%;
195 min-height: 150px;
197 min-height: 150px;
196 margin: @sidebarpadding 2% 0 0;
198 margin: @sidebarpadding 2% 0 0;
197 padding: 0 2% 0 0;
199 padding: 0 2% 0 0;
198 border-right: @border-thickness solid @grey5;
200 border-right: @border-thickness solid @grey5;
199
201
200 @media (max-width:767px) {
202 @media (max-width:767px) {
201 clear: both;
203 clear: both;
202 width: 100%;
204 width: 100%;
203 border: none;
205 border: none;
204 }
206 }
205
207
206 ul {
208 ul {
207 padding-left: 1.25em;
209 padding-left: 1.25em;
208 }
210 }
209
211
210 &:last-child {
212 &:last-child {
211 margin: @sidebarpadding 0 0;
213 margin: @sidebarpadding 0 0;
212 border: none;
214 border: none;
213 }
215 }
214
216
215 h4 {
217 h4 {
216 margin: 0 0 @padding;
218 margin: 0 0 @padding;
219 font-weight: @text-semibold-weight;
217 font-family: @text-semibold;
220 font-family: @text-semibold;
218 }
221 }
219 }
222 }
220 }
223 }
221 .error-page-logo {
224 .error-page-logo {
222 width: 130px;
225 width: 130px;
223 height: 160px;
226 height: 160px;
224 }
227 }
225
228
226 // HEADER
229 // HEADER
227 .header {
230 .header {
228
231
229 // TODO: johbo: Fix login pages, so that they work without a min-height
232 // TODO: johbo: Fix login pages, so that they work without a min-height
230 // for the header and then remove the min-height. I chose a smaller value
233 // for the header and then remove the min-height. I chose a smaller value
231 // intentionally here to avoid rendering issues in the main navigation.
234 // intentionally here to avoid rendering issues in the main navigation.
232 min-height: 49px;
235 min-height: 49px;
233
236
234 position: relative;
237 position: relative;
235 vertical-align: bottom;
238 vertical-align: bottom;
236 padding: 0 @header-padding;
239 padding: 0 @header-padding;
237 background-color: @grey2;
240 background-color: @grey2;
238 color: @grey5;
241 color: @grey5;
239
242
240 .title {
243 .title {
241 overflow: visible;
244 overflow: visible;
242 }
245 }
243
246
244 &:before,
247 &:before,
245 &:after {
248 &:after {
246 content: "";
249 content: "";
247 clear: both;
250 clear: both;
248 width: 100%;
251 width: 100%;
249 }
252 }
250
253
251 // TODO: johbo: Avoids breaking "Repositories" chooser
254 // TODO: johbo: Avoids breaking "Repositories" chooser
252 .select2-container .select2-choice .select2-arrow {
255 .select2-container .select2-choice .select2-arrow {
253 display: none;
256 display: none;
254 }
257 }
255 }
258 }
256
259
257 #header-inner {
260 #header-inner {
258 &.title {
261 &.title {
259 margin: 0;
262 margin: 0;
260 }
263 }
261 &:before,
264 &:before,
262 &:after {
265 &:after {
263 content: "";
266 content: "";
264 clear: both;
267 clear: both;
265 }
268 }
266 }
269 }
267
270
268 // Gists
271 // Gists
269 #files_data {
272 #files_data {
270 clear: both; //for firefox
273 clear: both; //for firefox
271 }
274 }
272 #gistid {
275 #gistid {
273 margin-right: @padding;
276 margin-right: @padding;
274 }
277 }
275
278
276 // Global Settings Editor
279 // Global Settings Editor
277 .textarea.editor {
280 .textarea.editor {
278 float: left;
281 float: left;
279 position: relative;
282 position: relative;
280 max-width: @texteditor-width;
283 max-width: @texteditor-width;
281
284
282 select {
285 select {
283 position: absolute;
286 position: absolute;
284 top:10px;
287 top:10px;
285 right:0;
288 right:0;
286 }
289 }
287
290
288 .CodeMirror {
291 .CodeMirror {
289 margin: 0;
292 margin: 0;
290 }
293 }
291
294
292 .help-block {
295 .help-block {
293 margin: 0 0 @padding;
296 margin: 0 0 @padding;
294 padding:.5em;
297 padding:.5em;
295 background-color: @grey6;
298 background-color: @grey6;
296 &.pre-formatting {
299 &.pre-formatting {
297 white-space: pre;
300 white-space: pre;
298 }
301 }
299 }
302 }
300 }
303 }
301
304
302 ul.auth_plugins {
305 ul.auth_plugins {
303 margin: @padding 0 @padding @legend-width;
306 margin: @padding 0 @padding @legend-width;
304 padding: 0;
307 padding: 0;
305
308
306 li {
309 li {
307 margin-bottom: @padding;
310 margin-bottom: @padding;
308 line-height: 1em;
311 line-height: 1em;
309 list-style-type: none;
312 list-style-type: none;
310
313
311 .auth_buttons .btn {
314 .auth_buttons .btn {
312 margin-right: @padding;
315 margin-right: @padding;
313 }
316 }
314
317
315 &:before { content: none; }
318 &:before { content: none; }
316 }
319 }
317 }
320 }
318
321
319
322
320 // My Account PR list
323 // My Account PR list
321
324
322 #show_closed {
325 #show_closed {
323 margin: 0 1em 0 0;
326 margin: 0 1em 0 0;
324 }
327 }
325
328
326 .pullrequestlist {
329 .pullrequestlist {
327 .closed {
330 .closed {
328 background-color: @grey6;
331 background-color: @grey6;
329 }
332 }
330 .td-status {
333 .td-status {
331 padding-left: .5em;
334 padding-left: .5em;
332 }
335 }
333 .log-container .truncate {
336 .log-container .truncate {
334 height: 2.75em;
337 height: 2.75em;
335 white-space: pre-line;
338 white-space: pre-line;
336 }
339 }
337 table.rctable .user {
340 table.rctable .user {
338 padding-left: 0;
341 padding-left: 0;
339 }
342 }
340 table.rctable {
343 table.rctable {
341 td.td-description,
344 td.td-description,
342 .rc-user {
345 .rc-user {
343 min-width: auto;
346 min-width: auto;
344 }
347 }
345 }
348 }
346 }
349 }
347
350
348 // Pull Requests
351 // Pull Requests
349
352
350 .pullrequests_section_head {
353 .pullrequests_section_head {
351 display: block;
354 display: block;
352 clear: both;
355 clear: both;
353 margin: @padding 0;
356 margin: @padding 0;
357 font-weight: @text-bold-weight;
354 font-family: @text-bold;
358 font-family: @text-bold;
355 }
359 }
356
360
357 .pr-origininfo, .pr-targetinfo {
361 .pr-origininfo, .pr-targetinfo {
358 position: relative;
362 position: relative;
359
363
360 .tag {
364 .tag {
361 display: inline-block;
365 display: inline-block;
362 margin: 0 1em .5em 0;
366 margin: 0 1em .5em 0;
363 }
367 }
364
368
365 .clone-url {
369 .clone-url {
366 display: inline-block;
370 display: inline-block;
367 margin: 0 0 .5em 0;
371 margin: 0 0 .5em 0;
368 padding: 0;
372 padding: 0;
369 line-height: 1.2em;
373 line-height: 1.2em;
370 }
374 }
371 }
375 }
372
376
373 .pr-mergeinfo {
377 .pr-mergeinfo {
374 min-width: 95% !important;
378 min-width: 95% !important;
375 padding: 0 !important;
379 padding: 0 !important;
376 border: 0;
380 border: 0;
377 }
381 }
378 .pr-mergeinfo-copy {
382 .pr-mergeinfo-copy {
379 padding: 0 0;
383 padding: 0 0;
380 }
384 }
381
385
382 .pr-pullinfo {
386 .pr-pullinfo {
383 min-width: 95% !important;
387 min-width: 95% !important;
384 padding: 0 !important;
388 padding: 0 !important;
385 border: 0;
389 border: 0;
386 }
390 }
387 .pr-pullinfo-copy {
391 .pr-pullinfo-copy {
388 padding: 0 0;
392 padding: 0 0;
389 }
393 }
390
394
391
395
392 #pr-title-input {
396 #pr-title-input {
393 width: 72%;
397 width: 72%;
394 font-size: 1em;
398 font-size: 1em;
395 font-family: @text-bold;
396 margin: 0;
399 margin: 0;
397 padding: 0 0 0 @padding/4;
400 padding: 0 0 0 @padding/4;
398 line-height: 1.7em;
401 line-height: 1.7em;
399 color: @text-color;
402 color: @text-color;
400 letter-spacing: .02em;
403 letter-spacing: .02em;
404 font-weight: @text-bold-weight;
405 font-family: @text-bold;
401 }
406 }
402
407
403 #pullrequest_title {
408 #pullrequest_title {
404 width: 100%;
409 width: 100%;
405 box-sizing: border-box;
410 box-sizing: border-box;
406 }
411 }
407
412
408 #pr_open_message {
413 #pr_open_message {
409 border: @border-thickness solid #fff;
414 border: @border-thickness solid #fff;
410 border-radius: @border-radius;
415 border-radius: @border-radius;
411 padding: @padding-large-vertical @padding-large-vertical @padding-large-vertical 0;
416 padding: @padding-large-vertical @padding-large-vertical @padding-large-vertical 0;
412 text-align: left;
417 text-align: left;
413 overflow: hidden;
418 overflow: hidden;
414 }
419 }
415
420
416 .pr-submit-button {
421 .pr-submit-button {
417 float: right;
422 float: right;
418 margin: 0 0 0 5px;
423 margin: 0 0 0 5px;
419 }
424 }
420
425
421 .pr-spacing-container {
426 .pr-spacing-container {
422 padding: 20px;
427 padding: 20px;
423 clear: both
428 clear: both
424 }
429 }
425
430
426 #pr-description-input {
431 #pr-description-input {
427 margin-bottom: 0;
432 margin-bottom: 0;
428 }
433 }
429
434
430 .pr-description-label {
435 .pr-description-label {
431 vertical-align: top;
436 vertical-align: top;
432 }
437 }
433
438
434 .perms_section_head {
439 .perms_section_head {
435 min-width: 625px;
440 min-width: 625px;
436
441
437 h2 {
442 h2 {
438 margin-bottom: 0;
443 margin-bottom: 0;
439 }
444 }
440
445
441 .label-checkbox {
446 .label-checkbox {
442 float: left;
447 float: left;
443 }
448 }
444
449
445 &.field {
450 &.field {
446 margin: @space 0 @padding;
451 margin: @space 0 @padding;
447 }
452 }
448
453
449 &:first-child.field {
454 &:first-child.field {
450 margin-top: 0;
455 margin-top: 0;
451
456
452 .label {
457 .label {
453 margin-top: 0;
458 margin-top: 0;
454 padding-top: 0;
459 padding-top: 0;
455 }
460 }
456
461
457 .radios {
462 .radios {
458 padding-top: 0;
463 padding-top: 0;
459 }
464 }
460 }
465 }
461
466
462 .radios {
467 .radios {
463 position: relative;
468 position: relative;
464 width: 505px;
469 width: 505px;
465 }
470 }
466 }
471 }
467
472
468 //--- MODULES ------------------//
473 //--- MODULES ------------------//
469
474
470
475
471 // Server Announcement
476 // Server Announcement
472 #server-announcement {
477 #server-announcement {
473 width: 95%;
478 width: 95%;
474 margin: @padding auto;
479 margin: @padding auto;
475 padding: @padding;
480 padding: @padding;
476 border-width: 2px;
481 border-width: 2px;
477 border-style: solid;
482 border-style: solid;
478 .border-radius(2px);
483 .border-radius(2px);
484 font-weight: @text-bold-weight;
479 font-family: @text-bold;
485 font-family: @text-bold;
480
486
481 &.info { border-color: @alert4; background-color: @alert4-inner; }
487 &.info { border-color: @alert4; background-color: @alert4-inner; }
482 &.warning { border-color: @alert3; background-color: @alert3-inner; }
488 &.warning { border-color: @alert3; background-color: @alert3-inner; }
483 &.error { border-color: @alert2; background-color: @alert2-inner; }
489 &.error { border-color: @alert2; background-color: @alert2-inner; }
484 &.success { border-color: @alert1; background-color: @alert1-inner; }
490 &.success { border-color: @alert1; background-color: @alert1-inner; }
485 &.neutral { border-color: @grey3; background-color: @grey6; }
491 &.neutral { border-color: @grey3; background-color: @grey6; }
486 }
492 }
487
493
488 // Fixed Sidebar Column
494 // Fixed Sidebar Column
489 .sidebar-col-wrapper {
495 .sidebar-col-wrapper {
490 padding-left: @sidebar-all-width;
496 padding-left: @sidebar-all-width;
491
497
492 .sidebar {
498 .sidebar {
493 width: @sidebar-width;
499 width: @sidebar-width;
494 margin-left: -@sidebar-all-width;
500 margin-left: -@sidebar-all-width;
495 }
501 }
496 }
502 }
497
503
498 .sidebar-col-wrapper.scw-small {
504 .sidebar-col-wrapper.scw-small {
499 padding-left: @sidebar-small-all-width;
505 padding-left: @sidebar-small-all-width;
500
506
501 .sidebar {
507 .sidebar {
502 width: @sidebar-small-width;
508 width: @sidebar-small-width;
503 margin-left: -@sidebar-small-all-width;
509 margin-left: -@sidebar-small-all-width;
504 }
510 }
505 }
511 }
506
512
507
513
508 // FOOTER
514 // FOOTER
509 #footer {
515 #footer {
510 padding: 0;
516 padding: 0;
511 text-align: center;
517 text-align: center;
512 vertical-align: middle;
518 vertical-align: middle;
513 color: @grey2;
519 color: @grey2;
514 background-color: @grey6;
520 background-color: @grey6;
515
521
516 p {
522 p {
517 margin: 0;
523 margin: 0;
518 padding: 1em;
524 padding: 1em;
519 line-height: 1em;
525 line-height: 1em;
520 }
526 }
521
527
522 .server-instance { //server instance
528 .server-instance { //server instance
523 display: none;
529 display: none;
524 }
530 }
525
531
526 .title {
532 .title {
527 float: none;
533 float: none;
528 margin: 0 auto;
534 margin: 0 auto;
529 }
535 }
530 }
536 }
531
537
532 button.close {
538 button.close {
533 padding: 0;
539 padding: 0;
534 cursor: pointer;
540 cursor: pointer;
535 background: transparent;
541 background: transparent;
536 border: 0;
542 border: 0;
537 .box-shadow(none);
543 .box-shadow(none);
538 -webkit-appearance: none;
544 -webkit-appearance: none;
539 }
545 }
540
546
541 .close {
547 .close {
542 float: right;
548 float: right;
543 font-size: 21px;
549 font-size: 21px;
544 font-family: @text-bootstrap;
550 font-family: @text-bootstrap;
545 line-height: 1em;
551 line-height: 1em;
546 font-weight: bold;
552 font-weight: bold;
547 color: @grey2;
553 color: @grey2;
548
554
549 &:hover,
555 &:hover,
550 &:focus {
556 &:focus {
551 color: @grey1;
557 color: @grey1;
552 text-decoration: none;
558 text-decoration: none;
553 cursor: pointer;
559 cursor: pointer;
554 }
560 }
555 }
561 }
556
562
557 // GRID
563 // GRID
558 .sorting,
564 .sorting,
559 .sorting_desc,
565 .sorting_desc,
560 .sorting_asc {
566 .sorting_asc {
561 cursor: pointer;
567 cursor: pointer;
562 }
568 }
563 .sorting_desc:after {
569 .sorting_desc:after {
564 content: "\00A0\25B2";
570 content: "\00A0\25B2";
565 font-size: .75em;
571 font-size: .75em;
566 }
572 }
567 .sorting_asc:after {
573 .sorting_asc:after {
568 content: "\00A0\25BC";
574 content: "\00A0\25BC";
569 font-size: .68em;
575 font-size: .68em;
570 }
576 }
571
577
572
578
573 .user_auth_tokens {
579 .user_auth_tokens {
574
580
575 &.truncate {
581 &.truncate {
576 white-space: nowrap;
582 white-space: nowrap;
577 overflow: hidden;
583 overflow: hidden;
578 text-overflow: ellipsis;
584 text-overflow: ellipsis;
579 }
585 }
580
586
581 .fields .field .input {
587 .fields .field .input {
582 margin: 0;
588 margin: 0;
583 }
589 }
584
590
585 input#description {
591 input#description {
586 width: 100px;
592 width: 100px;
587 margin: 0;
593 margin: 0;
588 }
594 }
589
595
590 .drop-menu {
596 .drop-menu {
591 // TODO: johbo: Remove this, should work out of the box when
597 // TODO: johbo: Remove this, should work out of the box when
592 // having multiple inputs inline
598 // having multiple inputs inline
593 margin: 0 0 0 5px;
599 margin: 0 0 0 5px;
594 }
600 }
595 }
601 }
596 #user_list_table {
602 #user_list_table {
597 .closed {
603 .closed {
598 background-color: @grey6;
604 background-color: @grey6;
599 }
605 }
600 }
606 }
601
607
602
608
603 input {
609 input {
604 &.disabled {
610 &.disabled {
605 opacity: .5;
611 opacity: .5;
606 }
612 }
607 }
613 }
608
614
609 // remove extra padding in firefox
615 // remove extra padding in firefox
610 input::-moz-focus-inner { border:0; padding:0 }
616 input::-moz-focus-inner { border:0; padding:0 }
611
617
612 .adjacent input {
618 .adjacent input {
613 margin-bottom: @padding;
619 margin-bottom: @padding;
614 }
620 }
615
621
616 .permissions_boxes {
622 .permissions_boxes {
617 display: block;
623 display: block;
618 }
624 }
619
625
620 //TODO: lisa: this should be in tables
626 //TODO: lisa: this should be in tables
621 .show_more_col {
627 .show_more_col {
622 width: 20px;
628 width: 20px;
623 }
629 }
624
630
625 //FORMS
631 //FORMS
626
632
627 .medium-inline,
633 .medium-inline,
628 input#description.medium-inline {
634 input#description.medium-inline {
629 display: inline;
635 display: inline;
630 width: @medium-inline-input-width;
636 width: @medium-inline-input-width;
631 min-width: 100px;
637 min-width: 100px;
632 }
638 }
633
639
634 select {
640 select {
635 //reset
641 //reset
636 -webkit-appearance: none;
642 -webkit-appearance: none;
637 -moz-appearance: none;
643 -moz-appearance: none;
638
644
639 display: inline-block;
645 display: inline-block;
640 height: 28px;
646 height: 28px;
641 width: auto;
647 width: auto;
642 margin: 0 @padding @padding 0;
648 margin: 0 @padding @padding 0;
643 padding: 0 18px 0 8px;
649 padding: 0 18px 0 8px;
644 line-height:1em;
650 line-height:1em;
645 font-size: @basefontsize;
651 font-size: @basefontsize;
646 border: @border-thickness solid @rcblue;
652 border: @border-thickness solid @rcblue;
647 background:white url("../images/dt-arrow-dn.png") no-repeat 100% 50%;
653 background:white url("../images/dt-arrow-dn.png") no-repeat 100% 50%;
648 color: @rcblue;
654 color: @rcblue;
649
655
650 &:after {
656 &:after {
651 content: "\00A0\25BE";
657 content: "\00A0\25BE";
652 }
658 }
653
659
654 &:focus {
660 &:focus {
655 outline: none;
661 outline: none;
656 }
662 }
657 }
663 }
658
664
659 option {
665 option {
660 &:focus {
666 &:focus {
661 outline: none;
667 outline: none;
662 }
668 }
663 }
669 }
664
670
665 input,
671 input,
666 textarea {
672 textarea {
667 padding: @input-padding;
673 padding: @input-padding;
668 border: @input-border-thickness solid @border-highlight-color;
674 border: @input-border-thickness solid @border-highlight-color;
669 .border-radius (@border-radius);
675 .border-radius (@border-radius);
670 font-family: @text-light;
676 font-family: @text-light;
671 font-size: @basefontsize;
677 font-size: @basefontsize;
672
678
673 &.input-sm {
679 &.input-sm {
674 padding: 5px;
680 padding: 5px;
675 }
681 }
676
682
677 &#description {
683 &#description {
678 min-width: @input-description-minwidth;
684 min-width: @input-description-minwidth;
679 min-height: 1em;
685 min-height: 1em;
680 padding: 10px;
686 padding: 10px;
681 }
687 }
682 }
688 }
683
689
684 .field-sm {
690 .field-sm {
685 input,
691 input,
686 textarea {
692 textarea {
687 padding: 5px;
693 padding: 5px;
688 }
694 }
689 }
695 }
690
696
691 textarea {
697 textarea {
692 display: block;
698 display: block;
693 clear: both;
699 clear: both;
694 width: 100%;
700 width: 100%;
695 min-height: 100px;
701 min-height: 100px;
696 margin-bottom: @padding;
702 margin-bottom: @padding;
697 .box-sizing(border-box);
703 .box-sizing(border-box);
698 overflow: auto;
704 overflow: auto;
699 }
705 }
700
706
701 label {
707 label {
702 font-family: @text-light;
708 font-family: @text-light;
703 }
709 }
704
710
705 // GRAVATARS
711 // GRAVATARS
706 // centers gravatar on username to the right
712 // centers gravatar on username to the right
707
713
708 .gravatar {
714 .gravatar {
709 display: inline;
715 display: inline;
710 min-width: 16px;
716 min-width: 16px;
711 min-height: 16px;
717 min-height: 16px;
712 margin: -5px 0;
718 margin: -5px 0;
713 padding: 0;
719 padding: 0;
714 line-height: 1em;
720 line-height: 1em;
715 border: 1px solid @grey4;
721 border: 1px solid @grey4;
716 box-sizing: content-box;
722 box-sizing: content-box;
717
723
718 &.gravatar-large {
724 &.gravatar-large {
719 margin: -0.5em .25em -0.5em 0;
725 margin: -0.5em .25em -0.5em 0;
720 }
726 }
721
727
722 & + .user {
728 & + .user {
723 display: inline;
729 display: inline;
724 margin: 0;
730 margin: 0;
725 padding: 0 0 0 .17em;
731 padding: 0 0 0 .17em;
726 line-height: 1em;
732 line-height: 1em;
727 }
733 }
728 }
734 }
729
735
730 .user-inline-data {
736 .user-inline-data {
731 display: inline-block;
737 display: inline-block;
732 float: left;
738 float: left;
733 padding-left: .5em;
739 padding-left: .5em;
734 line-height: 1.3em;
740 line-height: 1.3em;
735 }
741 }
736
742
737 .rc-user { // gravatar + user wrapper
743 .rc-user { // gravatar + user wrapper
738 float: left;
744 float: left;
739 position: relative;
745 position: relative;
740 min-width: 100px;
746 min-width: 100px;
741 max-width: 200px;
747 max-width: 200px;
742 min-height: (@gravatar-size + @border-thickness * 2); // account for border
748 min-height: (@gravatar-size + @border-thickness * 2); // account for border
743 display: block;
749 display: block;
744 padding: 0 0 0 (@gravatar-size + @basefontsize/2 + @border-thickness * 2);
750 padding: 0 0 0 (@gravatar-size + @basefontsize/2 + @border-thickness * 2);
745
751
746
752
747 .gravatar {
753 .gravatar {
748 display: block;
754 display: block;
749 position: absolute;
755 position: absolute;
750 top: 0;
756 top: 0;
751 left: 0;
757 left: 0;
752 min-width: @gravatar-size;
758 min-width: @gravatar-size;
753 min-height: @gravatar-size;
759 min-height: @gravatar-size;
754 margin: 0;
760 margin: 0;
755 }
761 }
756
762
757 .user {
763 .user {
758 display: block;
764 display: block;
759 max-width: 175px;
765 max-width: 175px;
760 padding-top: 2px;
766 padding-top: 2px;
761 overflow: hidden;
767 overflow: hidden;
762 text-overflow: ellipsis;
768 text-overflow: ellipsis;
763 }
769 }
764 }
770 }
765
771
766 .gist-gravatar,
772 .gist-gravatar,
767 .journal_container {
773 .journal_container {
768 .gravatar-large {
774 .gravatar-large {
769 margin: 0 .5em -10px 0;
775 margin: 0 .5em -10px 0;
770 }
776 }
771 }
777 }
772
778
773
779
774 // ADMIN SETTINGS
780 // ADMIN SETTINGS
775
781
776 // Tag Patterns
782 // Tag Patterns
777 .tag_patterns {
783 .tag_patterns {
778 .tag_input {
784 .tag_input {
779 margin-bottom: @padding;
785 margin-bottom: @padding;
780 }
786 }
781 }
787 }
782
788
783 .locked_input {
789 .locked_input {
784 position: relative;
790 position: relative;
785
791
786 input {
792 input {
787 display: inline;
793 display: inline;
788 margin: 3px 5px 0px 0px;
794 margin: 3px 5px 0px 0px;
789 }
795 }
790
796
791 br {
797 br {
792 display: none;
798 display: none;
793 }
799 }
794
800
795 .error-message {
801 .error-message {
796 float: left;
802 float: left;
797 width: 100%;
803 width: 100%;
798 }
804 }
799
805
800 .lock_input_button {
806 .lock_input_button {
801 display: inline;
807 display: inline;
802 }
808 }
803
809
804 .help-block {
810 .help-block {
805 clear: both;
811 clear: both;
806 }
812 }
807 }
813 }
808
814
809 // Notifications
815 // Notifications
810
816
811 .notifications_buttons {
817 .notifications_buttons {
812 margin: 0 0 @space 0;
818 margin: 0 0 @space 0;
813 padding: 0;
819 padding: 0;
814
820
815 .btn {
821 .btn {
816 display: inline-block;
822 display: inline-block;
817 }
823 }
818 }
824 }
819
825
820 .notification-list {
826 .notification-list {
821
827
822 div {
828 div {
823 display: inline-block;
829 display: inline-block;
824 vertical-align: middle;
830 vertical-align: middle;
825 }
831 }
826
832
827 .container {
833 .container {
828 display: block;
834 display: block;
829 margin: 0 0 @padding 0;
835 margin: 0 0 @padding 0;
830 }
836 }
831
837
832 .delete-notifications {
838 .delete-notifications {
833 margin-left: @padding;
839 margin-left: @padding;
834 text-align: right;
840 text-align: right;
835 cursor: pointer;
841 cursor: pointer;
836 }
842 }
837
843
838 .read-notifications {
844 .read-notifications {
839 margin-left: @padding/2;
845 margin-left: @padding/2;
840 text-align: right;
846 text-align: right;
841 width: 35px;
847 width: 35px;
842 cursor: pointer;
848 cursor: pointer;
843 }
849 }
844
850
845 .icon-minus-sign {
851 .icon-minus-sign {
846 color: @alert2;
852 color: @alert2;
847 }
853 }
848
854
849 .icon-ok-sign {
855 .icon-ok-sign {
850 color: @alert1;
856 color: @alert1;
851 }
857 }
852 }
858 }
853
859
854 .user_settings {
860 .user_settings {
855 float: left;
861 float: left;
856 clear: both;
862 clear: both;
857 display: block;
863 display: block;
858 width: 100%;
864 width: 100%;
859
865
860 .gravatar_box {
866 .gravatar_box {
861 margin-bottom: @padding;
867 margin-bottom: @padding;
862
868
863 &:after {
869 &:after {
864 content: " ";
870 content: " ";
865 clear: both;
871 clear: both;
866 width: 100%;
872 width: 100%;
867 }
873 }
868 }
874 }
869
875
870 .fields .field {
876 .fields .field {
871 clear: both;
877 clear: both;
872 }
878 }
873 }
879 }
874
880
875 .advanced_settings {
881 .advanced_settings {
876 margin-bottom: @space;
882 margin-bottom: @space;
877
883
878 .help-block {
884 .help-block {
879 margin-left: 0;
885 margin-left: 0;
880 }
886 }
881
887
882 button + .help-block {
888 button + .help-block {
883 margin-top: @padding;
889 margin-top: @padding;
884 }
890 }
885 }
891 }
886
892
887 // admin settings radio buttons and labels
893 // admin settings radio buttons and labels
888 .label-2 {
894 .label-2 {
889 float: left;
895 float: left;
890 width: @label2-width;
896 width: @label2-width;
891
897
892 label {
898 label {
893 color: @grey1;
899 color: @grey1;
894 }
900 }
895 }
901 }
896 .checkboxes {
902 .checkboxes {
897 float: left;
903 float: left;
898 width: @checkboxes-width;
904 width: @checkboxes-width;
899 margin-bottom: @padding;
905 margin-bottom: @padding;
900
906
901 .checkbox {
907 .checkbox {
902 width: 100%;
908 width: 100%;
903
909
904 label {
910 label {
905 margin: 0;
911 margin: 0;
906 padding: 0;
912 padding: 0;
907 }
913 }
908 }
914 }
909
915
910 .checkbox + .checkbox {
916 .checkbox + .checkbox {
911 display: inline-block;
917 display: inline-block;
912 }
918 }
913
919
914 label {
920 label {
915 margin-right: 1em;
921 margin-right: 1em;
916 }
922 }
917 }
923 }
918
924
919 // CHANGELOG
925 // CHANGELOG
920 .container_header {
926 .container_header {
921 float: left;
927 float: left;
922 display: block;
928 display: block;
923 width: 100%;
929 width: 100%;
924 margin: @padding 0 @padding;
930 margin: @padding 0 @padding;
925
931
926 #filter_changelog {
932 #filter_changelog {
927 float: left;
933 float: left;
928 margin-right: @padding;
934 margin-right: @padding;
929 }
935 }
930
936
931 .breadcrumbs_light {
937 .breadcrumbs_light {
932 display: inline-block;
938 display: inline-block;
933 }
939 }
934 }
940 }
935
941
936 .info_box {
942 .info_box {
937 float: right;
943 float: right;
938 }
944 }
939
945
940
946
941 #graph_nodes {
947 #graph_nodes {
942 padding-top: 43px;
948 padding-top: 43px;
943 }
949 }
944
950
945 #graph_content{
951 #graph_content{
946
952
947 // adjust for table headers so that graph renders properly
953 // adjust for table headers so that graph renders properly
948 // #graph_nodes padding - table cell padding
954 // #graph_nodes padding - table cell padding
949 padding-top: (@space - (@basefontsize * 2.4));
955 padding-top: (@space - (@basefontsize * 2.4));
950
956
951 &.graph_full_width {
957 &.graph_full_width {
952 width: 100%;
958 width: 100%;
953 max-width: 100%;
959 max-width: 100%;
954 }
960 }
955 }
961 }
956
962
957 #graph {
963 #graph {
958 .flag_status {
964 .flag_status {
959 margin: 0;
965 margin: 0;
960 }
966 }
961
967
962 .pagination-left {
968 .pagination-left {
963 float: left;
969 float: left;
964 clear: both;
970 clear: both;
965 }
971 }
966
972
967 .log-container {
973 .log-container {
968 max-width: 345px;
974 max-width: 345px;
969
975
970 .message{
976 .message{
971 max-width: 340px;
977 max-width: 340px;
972 }
978 }
973 }
979 }
974
980
975 .graph-col-wrapper {
981 .graph-col-wrapper {
976 padding-left: 110px;
982 padding-left: 110px;
977
983
978 #graph_nodes {
984 #graph_nodes {
979 width: 100px;
985 width: 100px;
980 margin-left: -110px;
986 margin-left: -110px;
981 float: left;
987 float: left;
982 clear: left;
988 clear: left;
983 }
989 }
984 }
990 }
985
991
986 .load-more-commits {
992 .load-more-commits {
987 text-align: center;
993 text-align: center;
988 }
994 }
989 .load-more-commits:hover {
995 .load-more-commits:hover {
990 background-color: @grey7;
996 background-color: @grey7;
991 }
997 }
992 .load-more-commits {
998 .load-more-commits {
993 a {
999 a {
994 display: block;
1000 display: block;
995 }
1001 }
996 }
1002 }
997 }
1003 }
998
1004
999 #filter_changelog {
1005 #filter_changelog {
1000 float: left;
1006 float: left;
1001 }
1007 }
1002
1008
1003
1009
1004 //--- THEME ------------------//
1010 //--- THEME ------------------//
1005
1011
1006 #logo {
1012 #logo {
1007 float: left;
1013 float: left;
1008 margin: 9px 0 0 0;
1014 margin: 9px 0 0 0;
1009
1015
1010 .header {
1016 .header {
1011 background-color: transparent;
1017 background-color: transparent;
1012 }
1018 }
1013
1019
1014 a {
1020 a {
1015 display: inline-block;
1021 display: inline-block;
1016 }
1022 }
1017
1023
1018 img {
1024 img {
1019 height:30px;
1025 height:30px;
1020 }
1026 }
1021 }
1027 }
1022
1028
1023 .logo-wrapper {
1029 .logo-wrapper {
1024 float:left;
1030 float:left;
1025 }
1031 }
1026
1032
1027 .branding{
1033 .branding{
1028 float: left;
1034 float: left;
1029 padding: 9px 2px;
1035 padding: 9px 2px;
1030 line-height: 1em;
1036 line-height: 1em;
1031 font-size: @navigation-fontsize;
1037 font-size: @navigation-fontsize;
1032 }
1038 }
1033
1039
1034 img {
1040 img {
1035 border: none;
1041 border: none;
1036 outline: none;
1042 outline: none;
1037 }
1043 }
1038 user-profile-header
1044 user-profile-header
1039 label {
1045 label {
1040
1046
1041 input[type="checkbox"] {
1047 input[type="checkbox"] {
1042 margin-right: 1em;
1048 margin-right: 1em;
1043 }
1049 }
1044 input[type="radio"] {
1050 input[type="radio"] {
1045 margin-right: 1em;
1051 margin-right: 1em;
1046 }
1052 }
1047 }
1053 }
1048
1054
1049 .flag_status {
1055 .flag_status {
1050 margin: 2px 8px 6px 2px;
1056 margin: 2px 8px 6px 2px;
1051 &.under_review {
1057 &.under_review {
1052 .circle(5px, @alert3);
1058 .circle(5px, @alert3);
1053 }
1059 }
1054 &.approved {
1060 &.approved {
1055 .circle(5px, @alert1);
1061 .circle(5px, @alert1);
1056 }
1062 }
1057 &.rejected,
1063 &.rejected,
1058 &.forced_closed{
1064 &.forced_closed{
1059 .circle(5px, @alert2);
1065 .circle(5px, @alert2);
1060 }
1066 }
1061 &.not_reviewed {
1067 &.not_reviewed {
1062 .circle(5px, @grey5);
1068 .circle(5px, @grey5);
1063 }
1069 }
1064 }
1070 }
1065
1071
1066 .flag_status_comment_box {
1072 .flag_status_comment_box {
1067 margin: 5px 6px 0px 2px;
1073 margin: 5px 6px 0px 2px;
1068 }
1074 }
1069 .test_pattern_preview {
1075 .test_pattern_preview {
1070 margin: @space 0;
1076 margin: @space 0;
1071
1077
1072 p {
1078 p {
1073 margin-bottom: 0;
1079 margin-bottom: 0;
1074 border-bottom: @border-thickness solid @border-default-color;
1080 border-bottom: @border-thickness solid @border-default-color;
1075 color: @grey3;
1081 color: @grey3;
1076 }
1082 }
1077
1083
1078 .btn {
1084 .btn {
1079 margin-bottom: @padding;
1085 margin-bottom: @padding;
1080 }
1086 }
1081 }
1087 }
1082 #test_pattern_result {
1088 #test_pattern_result {
1083 display: none;
1089 display: none;
1084 &:extend(pre);
1090 &:extend(pre);
1085 padding: .9em;
1091 padding: .9em;
1086 color: @grey3;
1092 color: @grey3;
1087 background-color: @grey7;
1093 background-color: @grey7;
1088 border-right: @border-thickness solid @border-default-color;
1094 border-right: @border-thickness solid @border-default-color;
1089 border-bottom: @border-thickness solid @border-default-color;
1095 border-bottom: @border-thickness solid @border-default-color;
1090 border-left: @border-thickness solid @border-default-color;
1096 border-left: @border-thickness solid @border-default-color;
1091 }
1097 }
1092
1098
1093 #repo_vcs_settings {
1099 #repo_vcs_settings {
1094 #inherit_overlay_vcs_default {
1100 #inherit_overlay_vcs_default {
1095 display: none;
1101 display: none;
1096 }
1102 }
1097 #inherit_overlay_vcs_custom {
1103 #inherit_overlay_vcs_custom {
1098 display: custom;
1104 display: custom;
1099 }
1105 }
1100 &.inherited {
1106 &.inherited {
1101 #inherit_overlay_vcs_default {
1107 #inherit_overlay_vcs_default {
1102 display: block;
1108 display: block;
1103 }
1109 }
1104 #inherit_overlay_vcs_custom {
1110 #inherit_overlay_vcs_custom {
1105 display: none;
1111 display: none;
1106 }
1112 }
1107 }
1113 }
1108 }
1114 }
1109
1115
1110 .issue-tracker-link {
1116 .issue-tracker-link {
1111 color: @rcblue;
1117 color: @rcblue;
1112 }
1118 }
1113
1119
1114 // Issue Tracker Table Show/Hide
1120 // Issue Tracker Table Show/Hide
1115 #repo_issue_tracker {
1121 #repo_issue_tracker {
1116 #inherit_overlay {
1122 #inherit_overlay {
1117 display: none;
1123 display: none;
1118 }
1124 }
1119 #custom_overlay {
1125 #custom_overlay {
1120 display: custom;
1126 display: custom;
1121 }
1127 }
1122 &.inherited {
1128 &.inherited {
1123 #inherit_overlay {
1129 #inherit_overlay {
1124 display: block;
1130 display: block;
1125 }
1131 }
1126 #custom_overlay {
1132 #custom_overlay {
1127 display: none;
1133 display: none;
1128 }
1134 }
1129 }
1135 }
1130 }
1136 }
1131 table.issuetracker {
1137 table.issuetracker {
1132 &.readonly {
1138 &.readonly {
1133 tr, td {
1139 tr, td {
1134 color: @grey3;
1140 color: @grey3;
1135 }
1141 }
1136 }
1142 }
1137 .edit {
1143 .edit {
1138 display: none;
1144 display: none;
1139 }
1145 }
1140 .editopen {
1146 .editopen {
1141 .edit {
1147 .edit {
1142 display: inline;
1148 display: inline;
1143 }
1149 }
1144 .entry {
1150 .entry {
1145 display: none;
1151 display: none;
1146 }
1152 }
1147 }
1153 }
1148 tr td.td-action {
1154 tr td.td-action {
1149 min-width: 117px;
1155 min-width: 117px;
1150 }
1156 }
1151 td input {
1157 td input {
1152 max-width: none;
1158 max-width: none;
1153 min-width: 30px;
1159 min-width: 30px;
1154 width: 80%;
1160 width: 80%;
1155 }
1161 }
1156 .issuetracker_pref input {
1162 .issuetracker_pref input {
1157 width: 40%;
1163 width: 40%;
1158 }
1164 }
1159 input.edit_issuetracker_update {
1165 input.edit_issuetracker_update {
1160 margin-right: 0;
1166 margin-right: 0;
1161 width: auto;
1167 width: auto;
1162 }
1168 }
1163 }
1169 }
1164
1170
1165 table.integrations {
1171 table.integrations {
1166 .td-icon {
1172 .td-icon {
1167 width: 20px;
1173 width: 20px;
1168 .integration-icon {
1174 .integration-icon {
1169 height: 20px;
1175 height: 20px;
1170 width: 20px;
1176 width: 20px;
1171 }
1177 }
1172 }
1178 }
1173 }
1179 }
1174
1180
1175 .integrations {
1181 .integrations {
1176 a.integration-box {
1182 a.integration-box {
1177 color: @text-color;
1183 color: @text-color;
1178 &:hover {
1184 &:hover {
1179 .panel {
1185 .panel {
1180 background: #fbfbfb;
1186 background: #fbfbfb;
1181 }
1187 }
1182 }
1188 }
1183 .integration-icon {
1189 .integration-icon {
1184 width: 30px;
1190 width: 30px;
1185 height: 30px;
1191 height: 30px;
1186 margin-right: 20px;
1192 margin-right: 20px;
1187 float: left;
1193 float: left;
1188 }
1194 }
1189
1195
1190 .panel-body {
1196 .panel-body {
1191 padding: 10px;
1197 padding: 10px;
1192 }
1198 }
1193 .panel {
1199 .panel {
1194 margin-bottom: 10px;
1200 margin-bottom: 10px;
1195 }
1201 }
1196 h2 {
1202 h2 {
1197 display: inline-block;
1203 display: inline-block;
1198 margin: 0;
1204 margin: 0;
1199 min-width: 140px;
1205 min-width: 140px;
1200 }
1206 }
1201 }
1207 }
1202 a.integration-box.dummy-integration {
1208 a.integration-box.dummy-integration {
1203 color: @grey4
1209 color: @grey4
1204 }
1210 }
1205 }
1211 }
1206
1212
1207 //Permissions Settings
1213 //Permissions Settings
1208 #add_perm {
1214 #add_perm {
1209 margin: 0 0 @padding;
1215 margin: 0 0 @padding;
1210 cursor: pointer;
1216 cursor: pointer;
1211 }
1217 }
1212
1218
1213 .perm_ac {
1219 .perm_ac {
1214 input {
1220 input {
1215 width: 95%;
1221 width: 95%;
1216 }
1222 }
1217 }
1223 }
1218
1224
1219 .autocomplete-suggestions {
1225 .autocomplete-suggestions {
1220 width: auto !important; // overrides autocomplete.js
1226 width: auto !important; // overrides autocomplete.js
1221 margin: 0;
1227 margin: 0;
1222 border: @border-thickness solid @rcblue;
1228 border: @border-thickness solid @rcblue;
1223 border-radius: @border-radius;
1229 border-radius: @border-radius;
1224 color: @rcblue;
1230 color: @rcblue;
1225 background-color: white;
1231 background-color: white;
1226 }
1232 }
1227 .autocomplete-selected {
1233 .autocomplete-selected {
1228 background: #F0F0F0;
1234 background: #F0F0F0;
1229 }
1235 }
1230 .ac-container-wrap {
1236 .ac-container-wrap {
1231 margin: 0;
1237 margin: 0;
1232 padding: 8px;
1238 padding: 8px;
1233 border-bottom: @border-thickness solid @rclightblue;
1239 border-bottom: @border-thickness solid @rclightblue;
1234 list-style-type: none;
1240 list-style-type: none;
1235 cursor: pointer;
1241 cursor: pointer;
1236
1242
1237 &:hover {
1243 &:hover {
1238 background-color: @rclightblue;
1244 background-color: @rclightblue;
1239 }
1245 }
1240
1246
1241 img {
1247 img {
1242 height: @gravatar-size;
1248 height: @gravatar-size;
1243 width: @gravatar-size;
1249 width: @gravatar-size;
1244 margin-right: 1em;
1250 margin-right: 1em;
1245 }
1251 }
1246
1252
1247 strong {
1253 strong {
1248 font-weight: normal;
1254 font-weight: normal;
1249 }
1255 }
1250 }
1256 }
1251
1257
1252 // Settings Dropdown
1258 // Settings Dropdown
1253 .user-menu .container {
1259 .user-menu .container {
1254 padding: 0 4px;
1260 padding: 0 4px;
1255 margin: 0;
1261 margin: 0;
1256 }
1262 }
1257
1263
1258 .user-menu .gravatar {
1264 .user-menu .gravatar {
1259 cursor: pointer;
1265 cursor: pointer;
1260 }
1266 }
1261
1267
1262 .codeblock {
1268 .codeblock {
1263 margin-bottom: @padding;
1269 margin-bottom: @padding;
1264 clear: both;
1270 clear: both;
1265
1271
1266 .stats{
1272 .stats{
1267 overflow: hidden;
1273 overflow: hidden;
1268 }
1274 }
1269
1275
1270 .message{
1276 .message{
1271 textarea{
1277 textarea{
1272 margin: 0;
1278 margin: 0;
1273 }
1279 }
1274 }
1280 }
1275
1281
1276 .code-header {
1282 .code-header {
1277 .stats {
1283 .stats {
1278 line-height: 2em;
1284 line-height: 2em;
1279
1285
1280 .revision_id {
1286 .revision_id {
1281 margin-left: 0;
1287 margin-left: 0;
1282 }
1288 }
1283 .buttons {
1289 .buttons {
1284 padding-right: 0;
1290 padding-right: 0;
1285 }
1291 }
1286 }
1292 }
1287
1293
1288 .item{
1294 .item{
1289 margin-right: 0.5em;
1295 margin-right: 0.5em;
1290 }
1296 }
1291 }
1297 }
1292
1298
1293 #editor_container{
1299 #editor_container{
1294 position: relative;
1300 position: relative;
1295 margin: @padding;
1301 margin: @padding;
1296 }
1302 }
1297 }
1303 }
1298
1304
1299 #file_history_container {
1305 #file_history_container {
1300 display: none;
1306 display: none;
1301 }
1307 }
1302
1308
1303 .file-history-inner {
1309 .file-history-inner {
1304 margin-bottom: 10px;
1310 margin-bottom: 10px;
1305 }
1311 }
1306
1312
1307 // Pull Requests
1313 // Pull Requests
1308 .summary-details {
1314 .summary-details {
1309 width: 72%;
1315 width: 72%;
1310 }
1316 }
1311 .pr-summary {
1317 .pr-summary {
1312 border-bottom: @border-thickness solid @grey5;
1318 border-bottom: @border-thickness solid @grey5;
1313 margin-bottom: @space;
1319 margin-bottom: @space;
1314 }
1320 }
1315 .reviewers-title {
1321 .reviewers-title {
1316 width: 25%;
1322 width: 25%;
1317 min-width: 200px;
1323 min-width: 200px;
1318 }
1324 }
1319 .reviewers {
1325 .reviewers {
1320 width: 25%;
1326 width: 25%;
1321 min-width: 200px;
1327 min-width: 200px;
1322 }
1328 }
1323 .reviewers ul li {
1329 .reviewers ul li {
1324 position: relative;
1330 position: relative;
1325 width: 100%;
1331 width: 100%;
1326 padding-bottom: 8px;
1332 padding-bottom: 8px;
1327 }
1333 }
1328
1334
1329 .reviewer_entry {
1335 .reviewer_entry {
1330 min-height: 55px;
1336 min-height: 55px;
1331 }
1337 }
1332
1338
1333 .reviewers_member {
1339 .reviewers_member {
1334 width: 100%;
1340 width: 100%;
1335 overflow: auto;
1341 overflow: auto;
1336 }
1342 }
1337 .reviewer_reason {
1343 .reviewer_reason {
1338 padding-left: 20px;
1344 padding-left: 20px;
1339 line-height: 1.5em;
1345 line-height: 1.5em;
1340 }
1346 }
1341 .reviewer_status {
1347 .reviewer_status {
1342 display: inline-block;
1348 display: inline-block;
1343 vertical-align: top;
1349 vertical-align: top;
1344 width: 25px;
1350 width: 25px;
1345 min-width: 25px;
1351 min-width: 25px;
1346 height: 1.2em;
1352 height: 1.2em;
1347 margin-top: 3px;
1353 margin-top: 3px;
1348 line-height: 1em;
1354 line-height: 1em;
1349 }
1355 }
1350
1356
1351 .reviewer_name {
1357 .reviewer_name {
1352 display: inline-block;
1358 display: inline-block;
1353 max-width: 83%;
1359 max-width: 83%;
1354 padding-right: 20px;
1360 padding-right: 20px;
1355 vertical-align: middle;
1361 vertical-align: middle;
1356 line-height: 1;
1362 line-height: 1;
1357
1363
1358 .rc-user {
1364 .rc-user {
1359 min-width: 0;
1365 min-width: 0;
1360 margin: -2px 1em 0 0;
1366 margin: -2px 1em 0 0;
1361 }
1367 }
1362
1368
1363 .reviewer {
1369 .reviewer {
1364 float: left;
1370 float: left;
1365 }
1371 }
1366 }
1372 }
1367
1373
1368 .reviewer_member_mandatory {
1374 .reviewer_member_mandatory {
1369 position: absolute;
1375 position: absolute;
1370 left: 15px;
1376 left: 15px;
1371 top: 8px;
1377 top: 8px;
1372 width: 16px;
1378 width: 16px;
1373 font-size: 11px;
1379 font-size: 11px;
1374 margin: 0;
1380 margin: 0;
1375 padding: 0;
1381 padding: 0;
1376 color: black;
1382 color: black;
1377 }
1383 }
1378
1384
1379 .reviewer_member_mandatory_remove,
1385 .reviewer_member_mandatory_remove,
1380 .reviewer_member_remove {
1386 .reviewer_member_remove {
1381 position: absolute;
1387 position: absolute;
1382 right: 0;
1388 right: 0;
1383 top: 0;
1389 top: 0;
1384 width: 16px;
1390 width: 16px;
1385 margin-bottom: 10px;
1391 margin-bottom: 10px;
1386 padding: 0;
1392 padding: 0;
1387 color: black;
1393 color: black;
1388 }
1394 }
1389
1395
1390 .reviewer_member_mandatory_remove {
1396 .reviewer_member_mandatory_remove {
1391 color: @grey4;
1397 color: @grey4;
1392 }
1398 }
1393
1399
1394 .reviewer_member_status {
1400 .reviewer_member_status {
1395 margin-top: 5px;
1401 margin-top: 5px;
1396 }
1402 }
1397 .pr-summary #summary{
1403 .pr-summary #summary{
1398 width: 100%;
1404 width: 100%;
1399 }
1405 }
1400 .pr-summary .action_button:hover {
1406 .pr-summary .action_button:hover {
1401 border: 0;
1407 border: 0;
1402 cursor: pointer;
1408 cursor: pointer;
1403 }
1409 }
1404 .pr-details-title {
1410 .pr-details-title {
1405 padding-bottom: 8px;
1411 padding-bottom: 8px;
1406 border-bottom: @border-thickness solid @grey5;
1412 border-bottom: @border-thickness solid @grey5;
1407
1413
1408 .action_button.disabled {
1414 .action_button.disabled {
1409 color: @grey4;
1415 color: @grey4;
1410 cursor: inherit;
1416 cursor: inherit;
1411 }
1417 }
1412 .action_button {
1418 .action_button {
1413 color: @rcblue;
1419 color: @rcblue;
1414 }
1420 }
1415 }
1421 }
1416 .pr-details-content {
1422 .pr-details-content {
1417 margin-top: @textmargin;
1423 margin-top: @textmargin;
1418 margin-bottom: @textmargin;
1424 margin-bottom: @textmargin;
1419 }
1425 }
1420
1426
1421 .pr-reviewer-rules {
1427 .pr-reviewer-rules {
1422 padding: 10px 0px 20px 0px;
1428 padding: 10px 0px 20px 0px;
1423 }
1429 }
1424
1430
1425 .group_members {
1431 .group_members {
1426 margin-top: 0;
1432 margin-top: 0;
1427 padding: 0;
1433 padding: 0;
1428 list-style: outside none none;
1434 list-style: outside none none;
1429
1435
1430 img {
1436 img {
1431 height: @gravatar-size;
1437 height: @gravatar-size;
1432 width: @gravatar-size;
1438 width: @gravatar-size;
1433 margin-right: .5em;
1439 margin-right: .5em;
1434 margin-left: 3px;
1440 margin-left: 3px;
1435 }
1441 }
1436
1442
1437 .to-delete {
1443 .to-delete {
1438 .user {
1444 .user {
1439 text-decoration: line-through;
1445 text-decoration: line-through;
1440 }
1446 }
1441 }
1447 }
1442 }
1448 }
1443
1449
1444 .compare_view_commits_title {
1450 .compare_view_commits_title {
1445 .disabled {
1451 .disabled {
1446 cursor: inherit;
1452 cursor: inherit;
1447 &:hover{
1453 &:hover{
1448 background-color: inherit;
1454 background-color: inherit;
1449 color: inherit;
1455 color: inherit;
1450 }
1456 }
1451 }
1457 }
1452 }
1458 }
1453
1459
1454 .subtitle-compare {
1460 .subtitle-compare {
1455 margin: -15px 0px 0px 0px;
1461 margin: -15px 0px 0px 0px;
1456 }
1462 }
1457
1463
1458 .comments-summary-td {
1464 .comments-summary-td {
1459 border-top: 1px dashed @grey5;
1465 border-top: 1px dashed @grey5;
1460 }
1466 }
1461
1467
1462 // new entry in group_members
1468 // new entry in group_members
1463 .td-author-new-entry {
1469 .td-author-new-entry {
1464 background-color: rgba(red(@alert1), green(@alert1), blue(@alert1), 0.3);
1470 background-color: rgba(red(@alert1), green(@alert1), blue(@alert1), 0.3);
1465 }
1471 }
1466
1472
1467 .usergroup_member_remove {
1473 .usergroup_member_remove {
1468 width: 16px;
1474 width: 16px;
1469 margin-bottom: 10px;
1475 margin-bottom: 10px;
1470 padding: 0;
1476 padding: 0;
1471 color: black !important;
1477 color: black !important;
1472 cursor: pointer;
1478 cursor: pointer;
1473 }
1479 }
1474
1480
1475 .reviewer_ac .ac-input {
1481 .reviewer_ac .ac-input {
1476 width: 92%;
1482 width: 92%;
1477 margin-bottom: 1em;
1483 margin-bottom: 1em;
1478 }
1484 }
1479
1485
1480 .compare_view_commits tr{
1486 .compare_view_commits tr{
1481 height: 20px;
1487 height: 20px;
1482 }
1488 }
1483 .compare_view_commits td {
1489 .compare_view_commits td {
1484 vertical-align: top;
1490 vertical-align: top;
1485 padding-top: 10px;
1491 padding-top: 10px;
1486 }
1492 }
1487 .compare_view_commits .author {
1493 .compare_view_commits .author {
1488 margin-left: 5px;
1494 margin-left: 5px;
1489 }
1495 }
1490
1496
1491 .compare_view_commits {
1497 .compare_view_commits {
1492 .color-a {
1498 .color-a {
1493 color: @alert1;
1499 color: @alert1;
1494 }
1500 }
1495
1501
1496 .color-c {
1502 .color-c {
1497 color: @color3;
1503 color: @color3;
1498 }
1504 }
1499
1505
1500 .color-r {
1506 .color-r {
1501 color: @color5;
1507 color: @color5;
1502 }
1508 }
1503
1509
1504 .color-a-bg {
1510 .color-a-bg {
1505 background-color: @alert1;
1511 background-color: @alert1;
1506 }
1512 }
1507
1513
1508 .color-c-bg {
1514 .color-c-bg {
1509 background-color: @alert3;
1515 background-color: @alert3;
1510 }
1516 }
1511
1517
1512 .color-r-bg {
1518 .color-r-bg {
1513 background-color: @alert2;
1519 background-color: @alert2;
1514 }
1520 }
1515
1521
1516 .color-a-border {
1522 .color-a-border {
1517 border: 1px solid @alert1;
1523 border: 1px solid @alert1;
1518 }
1524 }
1519
1525
1520 .color-c-border {
1526 .color-c-border {
1521 border: 1px solid @alert3;
1527 border: 1px solid @alert3;
1522 }
1528 }
1523
1529
1524 .color-r-border {
1530 .color-r-border {
1525 border: 1px solid @alert2;
1531 border: 1px solid @alert2;
1526 }
1532 }
1527
1533
1528 .commit-change-indicator {
1534 .commit-change-indicator {
1529 width: 15px;
1535 width: 15px;
1530 height: 15px;
1536 height: 15px;
1531 position: relative;
1537 position: relative;
1532 left: 15px;
1538 left: 15px;
1533 }
1539 }
1534
1540
1535 .commit-change-content {
1541 .commit-change-content {
1536 text-align: center;
1542 text-align: center;
1537 vertical-align: middle;
1543 vertical-align: middle;
1538 line-height: 15px;
1544 line-height: 15px;
1539 }
1545 }
1540 }
1546 }
1541
1547
1542 .compare_view_filepath {
1548 .compare_view_filepath {
1543 color: @grey1;
1549 color: @grey1;
1544 }
1550 }
1545
1551
1546 .show_more {
1552 .show_more {
1547 display: inline-block;
1553 display: inline-block;
1548 width: 0;
1554 width: 0;
1549 height: 0;
1555 height: 0;
1550 vertical-align: middle;
1556 vertical-align: middle;
1551 content: "";
1557 content: "";
1552 border: 4px solid;
1558 border: 4px solid;
1553 border-right-color: transparent;
1559 border-right-color: transparent;
1554 border-bottom-color: transparent;
1560 border-bottom-color: transparent;
1555 border-left-color: transparent;
1561 border-left-color: transparent;
1556 font-size: 0;
1562 font-size: 0;
1557 }
1563 }
1558
1564
1559 .journal_more .show_more {
1565 .journal_more .show_more {
1560 display: inline;
1566 display: inline;
1561
1567
1562 &:after {
1568 &:after {
1563 content: none;
1569 content: none;
1564 }
1570 }
1565 }
1571 }
1566
1572
1567 .compare_view_commits .collapse_commit:after {
1573 .compare_view_commits .collapse_commit:after {
1568 cursor: pointer;
1574 cursor: pointer;
1569 content: "\00A0\25B4";
1575 content: "\00A0\25B4";
1570 margin-left: -3px;
1576 margin-left: -3px;
1571 font-size: 17px;
1577 font-size: 17px;
1572 color: @grey4;
1578 color: @grey4;
1573 }
1579 }
1574
1580
1575 .diff_links {
1581 .diff_links {
1576 margin-left: 8px;
1582 margin-left: 8px;
1577 }
1583 }
1578
1584
1579 div.ancestor {
1585 div.ancestor {
1580 margin: -30px 0px;
1586 margin: -30px 0px;
1581 }
1587 }
1582
1588
1583 .cs_icon_td input[type="checkbox"] {
1589 .cs_icon_td input[type="checkbox"] {
1584 display: none;
1590 display: none;
1585 }
1591 }
1586
1592
1587 .cs_icon_td .expand_file_icon:after {
1593 .cs_icon_td .expand_file_icon:after {
1588 cursor: pointer;
1594 cursor: pointer;
1589 content: "\00A0\25B6";
1595 content: "\00A0\25B6";
1590 font-size: 12px;
1596 font-size: 12px;
1591 color: @grey4;
1597 color: @grey4;
1592 }
1598 }
1593
1599
1594 .cs_icon_td .collapse_file_icon:after {
1600 .cs_icon_td .collapse_file_icon:after {
1595 cursor: pointer;
1601 cursor: pointer;
1596 content: "\00A0\25BC";
1602 content: "\00A0\25BC";
1597 font-size: 12px;
1603 font-size: 12px;
1598 color: @grey4;
1604 color: @grey4;
1599 }
1605 }
1600
1606
1601 /*new binary
1607 /*new binary
1602 NEW_FILENODE = 1
1608 NEW_FILENODE = 1
1603 DEL_FILENODE = 2
1609 DEL_FILENODE = 2
1604 MOD_FILENODE = 3
1610 MOD_FILENODE = 3
1605 RENAMED_FILENODE = 4
1611 RENAMED_FILENODE = 4
1606 COPIED_FILENODE = 5
1612 COPIED_FILENODE = 5
1607 CHMOD_FILENODE = 6
1613 CHMOD_FILENODE = 6
1608 BIN_FILENODE = 7
1614 BIN_FILENODE = 7
1609 */
1615 */
1610 .cs_files_expand {
1616 .cs_files_expand {
1611 font-size: @basefontsize + 5px;
1617 font-size: @basefontsize + 5px;
1612 line-height: 1.8em;
1618 line-height: 1.8em;
1613 float: right;
1619 float: right;
1614 }
1620 }
1615
1621
1616 .cs_files_expand span{
1622 .cs_files_expand span{
1617 color: @rcblue;
1623 color: @rcblue;
1618 cursor: pointer;
1624 cursor: pointer;
1619 }
1625 }
1620 .cs_files {
1626 .cs_files {
1621 clear: both;
1627 clear: both;
1622 padding-bottom: @padding;
1628 padding-bottom: @padding;
1623
1629
1624 .cur_cs {
1630 .cur_cs {
1625 margin: 10px 2px;
1631 margin: 10px 2px;
1626 font-weight: bold;
1632 font-weight: bold;
1627 }
1633 }
1628
1634
1629 .node {
1635 .node {
1630 float: left;
1636 float: left;
1631 }
1637 }
1632
1638
1633 .changes {
1639 .changes {
1634 float: right;
1640 float: right;
1635 color: white;
1641 color: white;
1636 font-size: @basefontsize - 4px;
1642 font-size: @basefontsize - 4px;
1637 margin-top: 4px;
1643 margin-top: 4px;
1638 opacity: 0.6;
1644 opacity: 0.6;
1639 filter: Alpha(opacity=60); /* IE8 and earlier */
1645 filter: Alpha(opacity=60); /* IE8 and earlier */
1640
1646
1641 .added {
1647 .added {
1642 background-color: @alert1;
1648 background-color: @alert1;
1643 float: left;
1649 float: left;
1644 text-align: center;
1650 text-align: center;
1645 }
1651 }
1646
1652
1647 .deleted {
1653 .deleted {
1648 background-color: @alert2;
1654 background-color: @alert2;
1649 float: left;
1655 float: left;
1650 text-align: center;
1656 text-align: center;
1651 }
1657 }
1652
1658
1653 .bin {
1659 .bin {
1654 background-color: @alert1;
1660 background-color: @alert1;
1655 text-align: center;
1661 text-align: center;
1656 }
1662 }
1657
1663
1658 /*new binary*/
1664 /*new binary*/
1659 .bin.bin1 {
1665 .bin.bin1 {
1660 background-color: @alert1;
1666 background-color: @alert1;
1661 text-align: center;
1667 text-align: center;
1662 }
1668 }
1663
1669
1664 /*deleted binary*/
1670 /*deleted binary*/
1665 .bin.bin2 {
1671 .bin.bin2 {
1666 background-color: @alert2;
1672 background-color: @alert2;
1667 text-align: center;
1673 text-align: center;
1668 }
1674 }
1669
1675
1670 /*mod binary*/
1676 /*mod binary*/
1671 .bin.bin3 {
1677 .bin.bin3 {
1672 background-color: @grey2;
1678 background-color: @grey2;
1673 text-align: center;
1679 text-align: center;
1674 }
1680 }
1675
1681
1676 /*rename file*/
1682 /*rename file*/
1677 .bin.bin4 {
1683 .bin.bin4 {
1678 background-color: @alert4;
1684 background-color: @alert4;
1679 text-align: center;
1685 text-align: center;
1680 }
1686 }
1681
1687
1682 /*copied file*/
1688 /*copied file*/
1683 .bin.bin5 {
1689 .bin.bin5 {
1684 background-color: @alert4;
1690 background-color: @alert4;
1685 text-align: center;
1691 text-align: center;
1686 }
1692 }
1687
1693
1688 /*chmod file*/
1694 /*chmod file*/
1689 .bin.bin6 {
1695 .bin.bin6 {
1690 background-color: @grey2;
1696 background-color: @grey2;
1691 text-align: center;
1697 text-align: center;
1692 }
1698 }
1693 }
1699 }
1694 }
1700 }
1695
1701
1696 .cs_files .cs_added, .cs_files .cs_A,
1702 .cs_files .cs_added, .cs_files .cs_A,
1697 .cs_files .cs_added, .cs_files .cs_M,
1703 .cs_files .cs_added, .cs_files .cs_M,
1698 .cs_files .cs_added, .cs_files .cs_D {
1704 .cs_files .cs_added, .cs_files .cs_D {
1699 height: 16px;
1705 height: 16px;
1700 padding-right: 10px;
1706 padding-right: 10px;
1701 margin-top: 7px;
1707 margin-top: 7px;
1702 text-align: left;
1708 text-align: left;
1703 }
1709 }
1704
1710
1705 .cs_icon_td {
1711 .cs_icon_td {
1706 min-width: 16px;
1712 min-width: 16px;
1707 width: 16px;
1713 width: 16px;
1708 }
1714 }
1709
1715
1710 .pull-request-merge {
1716 .pull-request-merge {
1711 border: 1px solid @grey5;
1717 border: 1px solid @grey5;
1712 padding: 10px 0px 20px;
1718 padding: 10px 0px 20px;
1713 margin-top: 10px;
1719 margin-top: 10px;
1714 margin-bottom: 20px;
1720 margin-bottom: 20px;
1715 }
1721 }
1716
1722
1717 .pull-request-merge ul {
1723 .pull-request-merge ul {
1718 padding: 0px 0px;
1724 padding: 0px 0px;
1719 }
1725 }
1720
1726
1721 .pull-request-merge li:before{
1727 .pull-request-merge li:before{
1722 content:none;
1728 content:none;
1723 }
1729 }
1724
1730
1725 .pull-request-merge .pull-request-wrap {
1731 .pull-request-merge .pull-request-wrap {
1726 height: auto;
1732 height: auto;
1727 padding: 0px 0px;
1733 padding: 0px 0px;
1728 text-align: right;
1734 text-align: right;
1729 }
1735 }
1730
1736
1731 .pull-request-merge span {
1737 .pull-request-merge span {
1732 margin-right: 5px;
1738 margin-right: 5px;
1733 }
1739 }
1734
1740
1735 .pull-request-merge-actions {
1741 .pull-request-merge-actions {
1736 min-height: 30px;
1742 min-height: 30px;
1737 padding: 0px 0px;
1743 padding: 0px 0px;
1738 }
1744 }
1739
1745
1740 .pull-request-merge-info {
1746 .pull-request-merge-info {
1741 padding: 0px 5px 5px 0px;
1747 padding: 0px 5px 5px 0px;
1742 }
1748 }
1743
1749
1744 .merge-status {
1750 .merge-status {
1745 margin-right: 5px;
1751 margin-right: 5px;
1746 }
1752 }
1747
1753
1748 .merge-message {
1754 .merge-message {
1749 font-size: 1.2em
1755 font-size: 1.2em
1750 }
1756 }
1751
1757
1752 .merge-message.success i,
1758 .merge-message.success i,
1753 .merge-icon.success i {
1759 .merge-icon.success i {
1754 color:@alert1;
1760 color:@alert1;
1755 }
1761 }
1756
1762
1757 .merge-message.warning i,
1763 .merge-message.warning i,
1758 .merge-icon.warning i {
1764 .merge-icon.warning i {
1759 color: @alert3;
1765 color: @alert3;
1760 }
1766 }
1761
1767
1762 .merge-message.error i,
1768 .merge-message.error i,
1763 .merge-icon.error i {
1769 .merge-icon.error i {
1764 color:@alert2;
1770 color:@alert2;
1765 }
1771 }
1766
1772
1767 .pr-versions {
1773 .pr-versions {
1768 font-size: 1.1em;
1774 font-size: 1.1em;
1769
1775
1770 table {
1776 table {
1771 padding: 0px 5px;
1777 padding: 0px 5px;
1772 }
1778 }
1773
1779
1774 td {
1780 td {
1775 line-height: 15px;
1781 line-height: 15px;
1776 }
1782 }
1777
1783
1778 .flag_status {
1784 .flag_status {
1779 margin: 0;
1785 margin: 0;
1780 }
1786 }
1781
1787
1782 .compare-radio-button {
1788 .compare-radio-button {
1783 position: relative;
1789 position: relative;
1784 top: -3px;
1790 top: -3px;
1785 }
1791 }
1786 }
1792 }
1787
1793
1788
1794
1789 #close_pull_request {
1795 #close_pull_request {
1790 margin-right: 0px;
1796 margin-right: 0px;
1791 }
1797 }
1792
1798
1793 .empty_data {
1799 .empty_data {
1794 color: @grey4;
1800 color: @grey4;
1795 }
1801 }
1796
1802
1797 #changeset_compare_view_content {
1803 #changeset_compare_view_content {
1798 margin-bottom: @space;
1804 margin-bottom: @space;
1799 clear: both;
1805 clear: both;
1800 width: 100%;
1806 width: 100%;
1801 box-sizing: border-box;
1807 box-sizing: border-box;
1802 .border-radius(@border-radius);
1808 .border-radius(@border-radius);
1803
1809
1804 .help-block {
1810 .help-block {
1805 margin: @padding 0;
1811 margin: @padding 0;
1806 color: @text-color;
1812 color: @text-color;
1807 &.pre-formatting {
1813 &.pre-formatting {
1808 white-space: pre;
1814 white-space: pre;
1809 }
1815 }
1810 }
1816 }
1811
1817
1812 .empty_data {
1818 .empty_data {
1813 margin: @padding 0;
1819 margin: @padding 0;
1814 }
1820 }
1815
1821
1816 .alert {
1822 .alert {
1817 margin-bottom: @space;
1823 margin-bottom: @space;
1818 }
1824 }
1819 }
1825 }
1820
1826
1821 .table_disp {
1827 .table_disp {
1822 .status {
1828 .status {
1823 width: auto;
1829 width: auto;
1824
1830
1825 .flag_status {
1831 .flag_status {
1826 float: left;
1832 float: left;
1827 }
1833 }
1828 }
1834 }
1829 }
1835 }
1830
1836
1831
1837
1832 .creation_in_progress {
1838 .creation_in_progress {
1833 color: @grey4
1839 color: @grey4
1834 }
1840 }
1835
1841
1836 .status_box_menu {
1842 .status_box_menu {
1837 margin: 0;
1843 margin: 0;
1838 }
1844 }
1839
1845
1840 .notification-table{
1846 .notification-table{
1841 margin-bottom: @space;
1847 margin-bottom: @space;
1842 display: table;
1848 display: table;
1843 width: 100%;
1849 width: 100%;
1844
1850
1845 .container{
1851 .container{
1846 display: table-row;
1852 display: table-row;
1847
1853
1848 .notification-header{
1854 .notification-header{
1849 border-bottom: @border-thickness solid @border-default-color;
1855 border-bottom: @border-thickness solid @border-default-color;
1850 }
1856 }
1851
1857
1852 .notification-subject{
1858 .notification-subject{
1853 display: table-cell;
1859 display: table-cell;
1854 }
1860 }
1855 }
1861 }
1856 }
1862 }
1857
1863
1858 // Notifications
1864 // Notifications
1859 .notification-header{
1865 .notification-header{
1860 display: table;
1866 display: table;
1861 width: 100%;
1867 width: 100%;
1862 padding: floor(@basefontsize/2) 0;
1868 padding: floor(@basefontsize/2) 0;
1863 line-height: 1em;
1869 line-height: 1em;
1864
1870
1865 .desc, .delete-notifications, .read-notifications{
1871 .desc, .delete-notifications, .read-notifications{
1866 display: table-cell;
1872 display: table-cell;
1867 text-align: left;
1873 text-align: left;
1868 }
1874 }
1869
1875
1870 .desc{
1876 .desc{
1871 width: 1163px;
1877 width: 1163px;
1872 }
1878 }
1873
1879
1874 .delete-notifications, .read-notifications{
1880 .delete-notifications, .read-notifications{
1875 width: 35px;
1881 width: 35px;
1876 min-width: 35px; //fixes when only one button is displayed
1882 min-width: 35px; //fixes when only one button is displayed
1877 }
1883 }
1878 }
1884 }
1879
1885
1880 .notification-body {
1886 .notification-body {
1881 .markdown-block,
1887 .markdown-block,
1882 .rst-block {
1888 .rst-block {
1883 padding: @padding 0;
1889 padding: @padding 0;
1884 }
1890 }
1885
1891
1886 .notification-subject {
1892 .notification-subject {
1887 padding: @textmargin 0;
1893 padding: @textmargin 0;
1888 border-bottom: @border-thickness solid @border-default-color;
1894 border-bottom: @border-thickness solid @border-default-color;
1889 }
1895 }
1890 }
1896 }
1891
1897
1892
1898
1893 .notifications_buttons{
1899 .notifications_buttons{
1894 float: right;
1900 float: right;
1895 }
1901 }
1896
1902
1897 #notification-status{
1903 #notification-status{
1898 display: inline;
1904 display: inline;
1899 }
1905 }
1900
1906
1901 // Repositories
1907 // Repositories
1902
1908
1903 #summary.fields{
1909 #summary.fields{
1904 display: table;
1910 display: table;
1905
1911
1906 .field{
1912 .field{
1907 display: table-row;
1913 display: table-row;
1908
1914
1909 .label-summary{
1915 .label-summary{
1910 display: table-cell;
1916 display: table-cell;
1911 min-width: @label-summary-minwidth;
1917 min-width: @label-summary-minwidth;
1912 padding-top: @padding/2;
1918 padding-top: @padding/2;
1913 padding-bottom: @padding/2;
1919 padding-bottom: @padding/2;
1914 padding-right: @padding/2;
1920 padding-right: @padding/2;
1915 }
1921 }
1916
1922
1917 .input{
1923 .input{
1918 display: table-cell;
1924 display: table-cell;
1919 padding: @padding/2;
1925 padding: @padding/2;
1920
1926
1921 input{
1927 input{
1922 min-width: 29em;
1928 min-width: 29em;
1923 padding: @padding/4;
1929 padding: @padding/4;
1924 }
1930 }
1925 }
1931 }
1926 .statistics, .downloads{
1932 .statistics, .downloads{
1927 .disabled{
1933 .disabled{
1928 color: @grey4;
1934 color: @grey4;
1929 }
1935 }
1930 }
1936 }
1931 }
1937 }
1932 }
1938 }
1933
1939
1934 #summary{
1940 #summary{
1935 width: 70%;
1941 width: 70%;
1936 }
1942 }
1937
1943
1938
1944
1939 // Journal
1945 // Journal
1940 .journal.title {
1946 .journal.title {
1941 h5 {
1947 h5 {
1942 float: left;
1948 float: left;
1943 margin: 0;
1949 margin: 0;
1944 width: 70%;
1950 width: 70%;
1945 }
1951 }
1946
1952
1947 ul {
1953 ul {
1948 float: right;
1954 float: right;
1949 display: inline-block;
1955 display: inline-block;
1950 margin: 0;
1956 margin: 0;
1951 width: 30%;
1957 width: 30%;
1952 text-align: right;
1958 text-align: right;
1953
1959
1954 li {
1960 li {
1955 display: inline;
1961 display: inline;
1956 font-size: @journal-fontsize;
1962 font-size: @journal-fontsize;
1957 line-height: 1em;
1963 line-height: 1em;
1958
1964
1959 &:before { content: none; }
1965 &:before { content: none; }
1960 }
1966 }
1961 }
1967 }
1962 }
1968 }
1963
1969
1964 .filterexample {
1970 .filterexample {
1965 position: absolute;
1971 position: absolute;
1966 top: 95px;
1972 top: 95px;
1967 left: @contentpadding;
1973 left: @contentpadding;
1968 color: @rcblue;
1974 color: @rcblue;
1969 font-size: 11px;
1975 font-size: 11px;
1970 font-family: @text-regular;
1976 font-family: @text-regular;
1971 cursor: help;
1977 cursor: help;
1972
1978
1973 &:hover {
1979 &:hover {
1974 color: @rcdarkblue;
1980 color: @rcdarkblue;
1975 }
1981 }
1976
1982
1977 @media (max-width:768px) {
1983 @media (max-width:768px) {
1978 position: relative;
1984 position: relative;
1979 top: auto;
1985 top: auto;
1980 left: auto;
1986 left: auto;
1981 display: block;
1987 display: block;
1982 }
1988 }
1983 }
1989 }
1984
1990
1985
1991
1986 #journal{
1992 #journal{
1987 margin-bottom: @space;
1993 margin-bottom: @space;
1988
1994
1989 .journal_day{
1995 .journal_day{
1990 margin-bottom: @textmargin/2;
1996 margin-bottom: @textmargin/2;
1991 padding-bottom: @textmargin/2;
1997 padding-bottom: @textmargin/2;
1992 font-size: @journal-fontsize;
1998 font-size: @journal-fontsize;
1993 border-bottom: @border-thickness solid @border-default-color;
1999 border-bottom: @border-thickness solid @border-default-color;
1994 }
2000 }
1995
2001
1996 .journal_container{
2002 .journal_container{
1997 margin-bottom: @space;
2003 margin-bottom: @space;
1998
2004
1999 .journal_user{
2005 .journal_user{
2000 display: inline-block;
2006 display: inline-block;
2001 }
2007 }
2002 .journal_action_container{
2008 .journal_action_container{
2003 display: block;
2009 display: block;
2004 margin-top: @textmargin;
2010 margin-top: @textmargin;
2005
2011
2006 div{
2012 div{
2007 display: inline;
2013 display: inline;
2008 }
2014 }
2009
2015
2010 div.journal_action_params{
2016 div.journal_action_params{
2011 display: block;
2017 display: block;
2012 }
2018 }
2013
2019
2014 div.journal_repo:after{
2020 div.journal_repo:after{
2015 content: "\A";
2021 content: "\A";
2016 white-space: pre;
2022 white-space: pre;
2017 }
2023 }
2018
2024
2019 div.date{
2025 div.date{
2020 display: block;
2026 display: block;
2021 margin-bottom: @textmargin;
2027 margin-bottom: @textmargin;
2022 }
2028 }
2023 }
2029 }
2024 }
2030 }
2025 }
2031 }
2026
2032
2027 // Files
2033 // Files
2028 .edit-file-title {
2034 .edit-file-title {
2029 border-bottom: @border-thickness solid @border-default-color;
2035 border-bottom: @border-thickness solid @border-default-color;
2030
2036
2031 .breadcrumbs {
2037 .breadcrumbs {
2032 margin-bottom: 0;
2038 margin-bottom: 0;
2033 }
2039 }
2034 }
2040 }
2035
2041
2036 .edit-file-fieldset {
2042 .edit-file-fieldset {
2037 margin-top: @sidebarpadding;
2043 margin-top: @sidebarpadding;
2038
2044
2039 .fieldset {
2045 .fieldset {
2040 .left-label {
2046 .left-label {
2041 width: 13%;
2047 width: 13%;
2042 }
2048 }
2043 .right-content {
2049 .right-content {
2044 width: 87%;
2050 width: 87%;
2045 max-width: 100%;
2051 max-width: 100%;
2046 }
2052 }
2047 .filename-label {
2053 .filename-label {
2048 margin-top: 13px;
2054 margin-top: 13px;
2049 }
2055 }
2050 .commit-message-label {
2056 .commit-message-label {
2051 margin-top: 4px;
2057 margin-top: 4px;
2052 }
2058 }
2053 .file-upload-input {
2059 .file-upload-input {
2054 input {
2060 input {
2055 display: none;
2061 display: none;
2056 }
2062 }
2057 margin-top: 10px;
2063 margin-top: 10px;
2058 }
2064 }
2059 .file-upload-label {
2065 .file-upload-label {
2060 margin-top: 10px;
2066 margin-top: 10px;
2061 }
2067 }
2062 p {
2068 p {
2063 margin-top: 5px;
2069 margin-top: 5px;
2064 }
2070 }
2065
2071
2066 }
2072 }
2067 .custom-path-link {
2073 .custom-path-link {
2068 margin-left: 5px;
2074 margin-left: 5px;
2069 }
2075 }
2070 #commit {
2076 #commit {
2071 resize: vertical;
2077 resize: vertical;
2072 }
2078 }
2073 }
2079 }
2074
2080
2075 .delete-file-preview {
2081 .delete-file-preview {
2076 max-height: 250px;
2082 max-height: 250px;
2077 }
2083 }
2078
2084
2079 .new-file,
2085 .new-file,
2080 #filter_activate,
2086 #filter_activate,
2081 #filter_deactivate {
2087 #filter_deactivate {
2082 float: left;
2088 float: left;
2083 margin: 0 0 0 15px;
2089 margin: 0 0 0 15px;
2084 }
2090 }
2085
2091
2086 h3.files_location{
2092 h3.files_location{
2087 line-height: 2.4em;
2093 line-height: 2.4em;
2088 }
2094 }
2089
2095
2090 .browser-nav {
2096 .browser-nav {
2091 display: table;
2097 display: table;
2092 margin-bottom: @space;
2098 margin-bottom: @space;
2093
2099
2094
2100
2095 .info_box {
2101 .info_box {
2096 display: inline-table;
2102 display: inline-table;
2097 height: 2.5em;
2103 height: 2.5em;
2098
2104
2099 .browser-cur-rev, .info_box_elem {
2105 .browser-cur-rev, .info_box_elem {
2100 display: table-cell;
2106 display: table-cell;
2101 vertical-align: middle;
2107 vertical-align: middle;
2102 }
2108 }
2103
2109
2104 .info_box_elem {
2110 .info_box_elem {
2105 border-top: @border-thickness solid @rcblue;
2111 border-top: @border-thickness solid @rcblue;
2106 border-bottom: @border-thickness solid @rcblue;
2112 border-bottom: @border-thickness solid @rcblue;
2107
2113
2108 #at_rev, a {
2114 #at_rev, a {
2109 padding: 0.6em 0.9em;
2115 padding: 0.6em 0.9em;
2110 margin: 0;
2116 margin: 0;
2111 .box-shadow(none);
2117 .box-shadow(none);
2112 border: 0;
2118 border: 0;
2113 height: 12px;
2119 height: 12px;
2114 }
2120 }
2115
2121
2116 input#at_rev {
2122 input#at_rev {
2117 max-width: 50px;
2123 max-width: 50px;
2118 text-align: right;
2124 text-align: right;
2119 }
2125 }
2120
2126
2121 &.previous {
2127 &.previous {
2122 border: @border-thickness solid @rcblue;
2128 border: @border-thickness solid @rcblue;
2123 .disabled {
2129 .disabled {
2124 color: @grey4;
2130 color: @grey4;
2125 cursor: not-allowed;
2131 cursor: not-allowed;
2126 }
2132 }
2127 }
2133 }
2128
2134
2129 &.next {
2135 &.next {
2130 border: @border-thickness solid @rcblue;
2136 border: @border-thickness solid @rcblue;
2131 .disabled {
2137 .disabled {
2132 color: @grey4;
2138 color: @grey4;
2133 cursor: not-allowed;
2139 cursor: not-allowed;
2134 }
2140 }
2135 }
2141 }
2136 }
2142 }
2137
2143
2138 .browser-cur-rev {
2144 .browser-cur-rev {
2139
2145
2140 span{
2146 span{
2141 margin: 0;
2147 margin: 0;
2142 color: @rcblue;
2148 color: @rcblue;
2143 height: 12px;
2149 height: 12px;
2144 display: inline-block;
2150 display: inline-block;
2145 padding: 0.7em 1em ;
2151 padding: 0.7em 1em ;
2146 border: @border-thickness solid @rcblue;
2152 border: @border-thickness solid @rcblue;
2147 margin-right: @padding;
2153 margin-right: @padding;
2148 }
2154 }
2149 }
2155 }
2150 }
2156 }
2151
2157
2152 .search_activate {
2158 .search_activate {
2153 display: table-cell;
2159 display: table-cell;
2154 vertical-align: middle;
2160 vertical-align: middle;
2155
2161
2156 input, label{
2162 input, label{
2157 margin: 0;
2163 margin: 0;
2158 padding: 0;
2164 padding: 0;
2159 }
2165 }
2160
2166
2161 input{
2167 input{
2162 margin-left: @textmargin;
2168 margin-left: @textmargin;
2163 }
2169 }
2164
2170
2165 }
2171 }
2166 }
2172 }
2167
2173
2168 .browser-cur-rev{
2174 .browser-cur-rev{
2169 margin-bottom: @textmargin;
2175 margin-bottom: @textmargin;
2170 }
2176 }
2171
2177
2172 #node_filter_box_loading{
2178 #node_filter_box_loading{
2173 .info_text;
2179 .info_text;
2174 }
2180 }
2175
2181
2176 .browser-search {
2182 .browser-search {
2177 margin: -25px 0px 5px 0px;
2183 margin: -25px 0px 5px 0px;
2178 }
2184 }
2179
2185
2180 .node-filter {
2186 .node-filter {
2181 font-size: @repo-title-fontsize;
2187 font-size: @repo-title-fontsize;
2182 padding: 4px 0px 0px 0px;
2188 padding: 4px 0px 0px 0px;
2183
2189
2184 .node-filter-path {
2190 .node-filter-path {
2185 float: left;
2191 float: left;
2186 color: @grey4;
2192 color: @grey4;
2187 }
2193 }
2188 .node-filter-input {
2194 .node-filter-input {
2189 float: left;
2195 float: left;
2190 margin: -2px 0px 0px 2px;
2196 margin: -2px 0px 0px 2px;
2191 input {
2197 input {
2192 padding: 2px;
2198 padding: 2px;
2193 border: none;
2199 border: none;
2194 font-size: @repo-title-fontsize;
2200 font-size: @repo-title-fontsize;
2195 }
2201 }
2196 }
2202 }
2197 }
2203 }
2198
2204
2199
2205
2200 .browser-result{
2206 .browser-result{
2201 td a{
2207 td a{
2202 margin-left: 0.5em;
2208 margin-left: 0.5em;
2203 display: inline-block;
2209 display: inline-block;
2204
2210
2205 em{
2211 em {
2212 font-weight: @text-bold-weight;
2206 font-family: @text-bold;
2213 font-family: @text-bold;
2207 }
2214 }
2208 }
2215 }
2209 }
2216 }
2210
2217
2211 .browser-highlight{
2218 .browser-highlight{
2212 background-color: @grey5-alpha;
2219 background-color: @grey5-alpha;
2213 }
2220 }
2214
2221
2215
2222
2216 // Search
2223 // Search
2217
2224
2218 .search-form{
2225 .search-form{
2219 #q {
2226 #q {
2220 width: @search-form-width;
2227 width: @search-form-width;
2221 }
2228 }
2222 .fields{
2229 .fields{
2223 margin: 0 0 @space;
2230 margin: 0 0 @space;
2224 }
2231 }
2225
2232
2226 label{
2233 label{
2227 display: inline-block;
2234 display: inline-block;
2228 margin-right: @textmargin;
2235 margin-right: @textmargin;
2229 padding-top: 0.25em;
2236 padding-top: 0.25em;
2230 }
2237 }
2231
2238
2232
2239
2233 .results{
2240 .results{
2234 clear: both;
2241 clear: both;
2235 margin: 0 0 @padding;
2242 margin: 0 0 @padding;
2236 }
2243 }
2237 }
2244 }
2238
2245
2239 div.search-feedback-items {
2246 div.search-feedback-items {
2240 display: inline-block;
2247 display: inline-block;
2241 }
2248 }
2242
2249
2243 div.search-code-body {
2250 div.search-code-body {
2244 background-color: #ffffff; padding: 5px 0 5px 10px;
2251 background-color: #ffffff; padding: 5px 0 5px 10px;
2245 pre {
2252 pre {
2246 .match { background-color: #faffa6;}
2253 .match { background-color: #faffa6;}
2247 .break { display: block; width: 100%; background-color: #DDE7EF; color: #747474; }
2254 .break { display: block; width: 100%; background-color: #DDE7EF; color: #747474; }
2248 }
2255 }
2249 }
2256 }
2250
2257
2251 .expand_commit.search {
2258 .expand_commit.search {
2252 .show_more.open {
2259 .show_more.open {
2253 height: auto;
2260 height: auto;
2254 max-height: none;
2261 max-height: none;
2255 }
2262 }
2256 }
2263 }
2257
2264
2258 .search-results {
2265 .search-results {
2259
2266
2260 h2 {
2267 h2 {
2261 margin-bottom: 0;
2268 margin-bottom: 0;
2262 }
2269 }
2263 .codeblock {
2270 .codeblock {
2264 border: none;
2271 border: none;
2265 background: transparent;
2272 background: transparent;
2266 }
2273 }
2267
2274
2268 .codeblock-header {
2275 .codeblock-header {
2269 border: none;
2276 border: none;
2270 background: transparent;
2277 background: transparent;
2271 }
2278 }
2272
2279
2273 .code-body {
2280 .code-body {
2274 border: @border-thickness solid @border-default-color;
2281 border: @border-thickness solid @border-default-color;
2275 .border-radius(@border-radius);
2282 .border-radius(@border-radius);
2276 }
2283 }
2277
2284
2278 .td-commit {
2285 .td-commit {
2279 &:extend(pre);
2286 &:extend(pre);
2280 border-bottom: @border-thickness solid @border-default-color;
2287 border-bottom: @border-thickness solid @border-default-color;
2281 }
2288 }
2282
2289
2283 .message {
2290 .message {
2284 height: auto;
2291 height: auto;
2285 max-width: 350px;
2292 max-width: 350px;
2286 white-space: normal;
2293 white-space: normal;
2287 text-overflow: initial;
2294 text-overflow: initial;
2288 overflow: visible;
2295 overflow: visible;
2289
2296
2290 .match { background-color: #faffa6;}
2297 .match { background-color: #faffa6;}
2291 .break { background-color: #DDE7EF; width: 100%; color: #747474; display: block; }
2298 .break { background-color: #DDE7EF; width: 100%; color: #747474; display: block; }
2292 }
2299 }
2293
2300
2294 }
2301 }
2295
2302
2296 table.rctable td.td-search-results div {
2303 table.rctable td.td-search-results div {
2297 max-width: 100%;
2304 max-width: 100%;
2298 }
2305 }
2299
2306
2300 #tip-box, .tip-box{
2307 #tip-box, .tip-box{
2301 padding: @menupadding/2;
2308 padding: @menupadding/2;
2302 display: block;
2309 display: block;
2303 border: @border-thickness solid @border-highlight-color;
2310 border: @border-thickness solid @border-highlight-color;
2304 .border-radius(@border-radius);
2311 .border-radius(@border-radius);
2305 background-color: white;
2312 background-color: white;
2306 z-index: 99;
2313 z-index: 99;
2307 white-space: pre-wrap;
2314 white-space: pre-wrap;
2308 }
2315 }
2309
2316
2310 #linktt {
2317 #linktt {
2311 width: 79px;
2318 width: 79px;
2312 }
2319 }
2313
2320
2314 #help_kb .modal-content{
2321 #help_kb .modal-content{
2315 max-width: 750px;
2322 max-width: 750px;
2316 margin: 10% auto;
2323 margin: 10% auto;
2317
2324
2318 table{
2325 table{
2319 td,th{
2326 td,th{
2320 border-bottom: none;
2327 border-bottom: none;
2321 line-height: 2.5em;
2328 line-height: 2.5em;
2322 }
2329 }
2323 th{
2330 th{
2324 padding-bottom: @textmargin/2;
2331 padding-bottom: @textmargin/2;
2325 }
2332 }
2326 td.keys{
2333 td.keys{
2327 text-align: center;
2334 text-align: center;
2328 }
2335 }
2329 }
2336 }
2330
2337
2331 .block-left{
2338 .block-left{
2332 width: 45%;
2339 width: 45%;
2333 margin-right: 5%;
2340 margin-right: 5%;
2334 }
2341 }
2335 .modal-footer{
2342 .modal-footer{
2336 clear: both;
2343 clear: both;
2337 }
2344 }
2338 .key.tag{
2345 .key.tag{
2339 padding: 0.5em;
2346 padding: 0.5em;
2340 background-color: @rcblue;
2347 background-color: @rcblue;
2341 color: white;
2348 color: white;
2342 border-color: @rcblue;
2349 border-color: @rcblue;
2343 .box-shadow(none);
2350 .box-shadow(none);
2344 }
2351 }
2345 }
2352 }
2346
2353
2347
2354
2348
2355
2349 //--- IMPORTS FOR REFACTORED STYLES ------------------//
2356 //--- IMPORTS FOR REFACTORED STYLES ------------------//
2350
2357
2351 @import 'statistics-graph';
2358 @import 'statistics-graph';
2352 @import 'tables';
2359 @import 'tables';
2353 @import 'forms';
2360 @import 'forms';
2354 @import 'diff';
2361 @import 'diff';
2355 @import 'summary';
2362 @import 'summary';
2356 @import 'navigation';
2363 @import 'navigation';
2357
2364
2358 //--- SHOW/HIDE SECTIONS --//
2365 //--- SHOW/HIDE SECTIONS --//
2359
2366
2360 .btn-collapse {
2367 .btn-collapse {
2361 float: right;
2368 float: right;
2362 text-align: right;
2369 text-align: right;
2363 font-family: @text-light;
2370 font-family: @text-light;
2364 font-size: @basefontsize;
2371 font-size: @basefontsize;
2365 cursor: pointer;
2372 cursor: pointer;
2366 border: none;
2373 border: none;
2367 color: @rcblue;
2374 color: @rcblue;
2368 }
2375 }
2369
2376
2370 table.rctable,
2377 table.rctable,
2371 table.dataTable {
2378 table.dataTable {
2372 .btn-collapse {
2379 .btn-collapse {
2373 float: right;
2380 float: right;
2374 text-align: right;
2381 text-align: right;
2375 }
2382 }
2376 }
2383 }
2377
2384
2378 table.rctable {
2385 table.rctable {
2379 &.permissions {
2386 &.permissions {
2380
2387
2381 th.td-owner {
2388 th.td-owner {
2382 padding: 0;
2389 padding: 0;
2383 }
2390 }
2384
2391
2385 th {
2392 th {
2386 font-weight: normal;
2393 font-weight: normal;
2387 padding: 0 5px;
2394 padding: 0 5px;
2388 }
2395 }
2389
2396
2390 }
2397 }
2391 }
2398 }
2392
2399
2393
2400
2394 // TODO: johbo: Fix for IE10, this avoids that we see a border
2401 // TODO: johbo: Fix for IE10, this avoids that we see a border
2395 // and padding around checkboxes and radio boxes. Move to the right place,
2402 // and padding around checkboxes and radio boxes. Move to the right place,
2396 // or better: Remove this once we did the form refactoring.
2403 // or better: Remove this once we did the form refactoring.
2397 input[type=checkbox],
2404 input[type=checkbox],
2398 input[type=radio] {
2405 input[type=radio] {
2399 padding: 0;
2406 padding: 0;
2400 border: none;
2407 border: none;
2401 }
2408 }
2402
2409
2403 .toggle-ajax-spinner{
2410 .toggle-ajax-spinner{
2404 height: 16px;
2411 height: 16px;
2405 width: 16px;
2412 width: 16px;
2406 }
2413 }
2407
2414
2408
2415
2409 .markup-form .clearfix {
2416 .markup-form .clearfix {
2410 .border-radius(@border-radius);
2417 .border-radius(@border-radius);
2411 margin: 0px;
2418 margin: 0px;
2412 }
2419 }
2413
2420
2414 .markup-form-area {
2421 .markup-form-area {
2415 padding: 8px 12px;
2422 padding: 8px 12px;
2416 border: 1px solid @grey4;
2423 border: 1px solid @grey4;
2417 .border-radius(@border-radius);
2424 .border-radius(@border-radius);
2418 }
2425 }
2419
2426
2420 .markup-form-area-header .nav-links {
2427 .markup-form-area-header .nav-links {
2421 display: flex;
2428 display: flex;
2422 flex-flow: row wrap;
2429 flex-flow: row wrap;
2423 -webkit-flex-flow: row wrap;
2430 -webkit-flex-flow: row wrap;
2424 width: 100%;
2431 width: 100%;
2425 }
2432 }
2426
2433
2427 .markup-form-area-footer {
2434 .markup-form-area-footer {
2428 display: flex;
2435 display: flex;
2429 }
2436 }
2430
2437
2431 .markup-form-area-footer .toolbar {
2438 .markup-form-area-footer .toolbar {
2432
2439
2433 }
2440 }
2434
2441
2435 // markup Form
2442 // markup Form
2436 div.markup-form {
2443 div.markup-form {
2437 margin-top: 20px;
2444 margin-top: 20px;
2438 }
2445 }
2439
2446
2440 .markup-form strong {
2447 .markup-form strong {
2441 display: block;
2448 display: block;
2442 margin-bottom: 15px;
2449 margin-bottom: 15px;
2443 }
2450 }
2444
2451
2445 .markup-form textarea {
2452 .markup-form textarea {
2446 width: 100%;
2453 width: 100%;
2447 height: 100px;
2454 height: 100px;
2448 font-family: @text-monospace;
2455 font-family: @text-monospace;
2449 }
2456 }
2450
2457
2451 form.markup-form {
2458 form.markup-form {
2452 margin-top: 10px;
2459 margin-top: 10px;
2453 margin-left: 10px;
2460 margin-left: 10px;
2454 }
2461 }
2455
2462
2456 .markup-form .comment-block-ta,
2463 .markup-form .comment-block-ta,
2457 .markup-form .preview-box {
2464 .markup-form .preview-box {
2458 .border-radius(@border-radius);
2465 .border-radius(@border-radius);
2459 .box-sizing(border-box);
2466 .box-sizing(border-box);
2460 background-color: white;
2467 background-color: white;
2461 }
2468 }
2462
2469
2463 .markup-form .preview-box.unloaded {
2470 .markup-form .preview-box.unloaded {
2464 height: 50px;
2471 height: 50px;
2465 text-align: center;
2472 text-align: center;
2466 padding: 20px;
2473 padding: 20px;
2467 background-color: white;
2474 background-color: white;
2468 }
2475 }
@@ -1,222 +1,223 b''
1 // select2.less
1 // select2.less
2 // For use in RhodeCode application drop down select boxes;
2 // For use in RhodeCode application drop down select boxes;
3 // see style guide documentation for guidelines.
3 // see style guide documentation for guidelines.
4
4
5
5
6 // SELECT2 DROPDOWN MENUS
6 // SELECT2 DROPDOWN MENUS
7
7
8 //Select2 Dropdown
8 //Select2 Dropdown
9 .select2-results{
9 .select2-results{
10 .box-sizing(border-box);
10 .box-sizing(border-box);
11 overflow-y: scroll;
11 overflow-y: scroll;
12 }
12 }
13
13
14 .select2-container{margin: 0; position: relative; display: inline-block; zoom: 1;}
14 .select2-container{margin: 0; position: relative; display: inline-block; zoom: 1;}
15 .select2-container,
15 .select2-container,
16 .select2-drop,
16 .select2-drop,
17 .select2-search,
17 .select2-search,
18 .select2-search input {.box-sizing(border-box);}
18 .select2-search input {.box-sizing(border-box);}
19 .select2-container .select2-choice{display:block; line-height:1em; -webkit-touch-callout:none;-moz-user-select:none;-ms-user-select:none;user-select:none; }
19 .select2-container .select2-choice{display:block; line-height:1em; -webkit-touch-callout:none;-moz-user-select:none;-ms-user-select:none;user-select:none; }
20 .main .select2-container .select2-choice { background-color: white; }
20 .main .select2-container .select2-choice { background-color: white; }
21 .select2-container .select2-choice abbr { display: none; width: 12px; height: 12px; position: absolute; right: 24px; top: 8px; font-size: 1px; text-decoration: none; border: 0; background: url('../images/select2.png') right top no-repeat; cursor: pointer; outline: 0; }
21 .select2-container .select2-choice abbr { display: none; width: 12px; height: 12px; position: absolute; right: 24px; top: 8px; font-size: 1px; text-decoration: none; border: 0; background: url('../images/select2.png') right top no-repeat; cursor: pointer; outline: 0; }
22 .select2-container.select2-allowclear .select2-choice abbr {display: inline-block;}
22 .select2-container.select2-allowclear .select2-choice abbr {display: inline-block;}
23 .select2-container .select2-choice abbr:hover { background-position: right -11px; cursor: pointer; }
23 .select2-container .select2-choice abbr:hover { background-position: right -11px; cursor: pointer; }
24 .select2-drop-mask { border: 0; margin: 0; padding: 0; position: fixed; left: 0; top: 0; min-height: 100%; min-width: 100%; height: auto; width: auto; opacity: 0; z-index: 998; background-color: #fff; filter: alpha(opacity=0); }
24 .select2-drop-mask { border: 0; margin: 0; padding: 0; position: fixed; left: 0; top: 0; min-height: 100%; min-width: 100%; height: auto; width: auto; opacity: 0; z-index: 998; background-color: #fff; filter: alpha(opacity=0); }
25 .select2-drop { width: 100%; margin-top: -1px; position: absolute; z-index: 999; top: 100%; background: #fff; color: #000; border: @border-thickness solid @rcblue; border-top: 0; border-radius: 0 0 @border-radius @border-radius; }
25 .select2-drop { width: 100%; margin-top: -1px; position: absolute; z-index: 999; top: 100%; background: #fff; color: #000; border: @border-thickness solid @rcblue; border-top: 0; border-radius: 0 0 @border-radius @border-radius; }
26 .select2-drop.select2-drop-above { margin-top: 1px; border-top: @border-thickness solid @rclightblue; border-bottom: 0; border-radius: @border-radius @border-radius 0 0; }
26 .select2-drop.select2-drop-above { margin-top: 1px; border-top: @border-thickness solid @rclightblue; border-bottom: 0; border-radius: @border-radius @border-radius 0 0; }
27 .select2-drop-active { border: @border-thickness solid #5897fb; border-top: none; }
27 .select2-drop-active { border: @border-thickness solid #5897fb; border-top: none; }
28 .select2-drop.select2-drop-above.select2-drop-active {border-top: @border-thickness solid #5897fb;}
28 .select2-drop.select2-drop-above.select2-drop-active {border-top: @border-thickness solid #5897fb;}
29 .select2-drop-auto-width { border-top: @border-thickness solid #aaa; width: auto; }
29 .select2-drop-auto-width { border-top: @border-thickness solid #aaa; width: auto; }
30 .select2-drop-auto-width .select2-search {padding-top: 4px;}
30 .select2-drop-auto-width .select2-search {padding-top: 4px;}
31 html[dir="rtl"] .select2-container .select2-choice .select2-arrow { left: 0; right: auto; border-left: none; border-right: @border-thickness solid @grey5; border-radius: @border-radius 0 0 @border-radius; }
31 html[dir="rtl"] .select2-container .select2-choice .select2-arrow { left: 0; right: auto; border-left: none; border-right: @border-thickness solid @grey5; border-radius: @border-radius 0 0 @border-radius; }
32 html[dir="rtl"] .select2-container .select2-choice .select2-arrow b {background-position: 2px 1px;}
32 html[dir="rtl"] .select2-container .select2-choice .select2-arrow b {background-position: 2px 1px;}
33 .select2-search { display: inline-block; width: 100%; min-height: 26px; margin: 0; padding-left: 4px; padding-right: 4px; position: relative; z-index: 1000; white-space: nowrap; }
33 .select2-search { display: inline-block; width: 100%; min-height: 26px; margin: 0; padding-left: 4px; padding-right: 4px; position: relative; z-index: 1000; white-space: nowrap; }
34 .select2-search input { width: 100%; height: auto !important; min-height: 26px; padding: 4px 20px 4px 5px; margin: 0; outline: 0; }
34 .select2-search input { width: 100%; height: auto !important; min-height: 26px; padding: 4px 20px 4px 5px; margin: 0; outline: 0; }
35 html[dir="rtl"] .select2-search input { padding: 4px 5px 4px 20px; background: #fff url('../images/select2.png') no-repeat -37px -22px; }
35 html[dir="rtl"] .select2-search input { padding: 4px 5px 4px 20px; background: #fff url('../images/select2.png') no-repeat -37px -22px; }
36 .select2-drop.select2-drop-above .select2-search input {margin-top: 4px;}
36 .select2-drop.select2-drop-above .select2-search input {margin-top: 4px;}
37 .select2-dropdown-open .select2-choice .select2-arrow { background: transparent; border-left: none; filter: none; }
37 .select2-dropdown-open .select2-choice .select2-arrow { background: transparent; border-left: none; filter: none; }
38 html[dir="rtl"] .select2-dropdown-open .select2-choice .select2-arrow {border-right: none;}
38 html[dir="rtl"] .select2-dropdown-open .select2-choice .select2-arrow {border-right: none;}
39 .select2-hidden-accessible { border: 0; clip: rect(0 0 0 0); height: 1px; margin: -1px; overflow: hidden; padding: 0; position: absolute; width: 1px; }
39 .select2-hidden-accessible { border: 0; clip: rect(0 0 0 0); height: 1px; margin: -1px; overflow: hidden; padding: 0; position: absolute; width: 1px; }
40 /* results */
40 /* results */
41 .select2-results { max-height: 200px; padding: 0 0 0 4px; margin: 4px 4px 4px 0; position: relative; overflow-x: hidden; overflow-y: auto; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); }
41 .select2-results { max-height: 200px; padding: 0 0 0 4px; margin: 4px 4px 4px 0; position: relative; overflow-x: hidden; overflow-y: auto; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); }
42 html[dir="rtl"] .select2-results { padding: 0 4px 0 0; margin: 4px 0 4px 4px; }
42 html[dir="rtl"] .select2-results { padding: 0 4px 0 0; margin: 4px 0 4px 4px; }
43 .select2-results .select2-disabled{background:@grey6;display:list-item;cursor:default}
43 .select2-results .select2-disabled{background:@grey6;display:list-item;cursor:default}
44 .select2-results .select2-selected{display:none}
44 .select2-results .select2-selected{display:none}
45 .select2-more-results.select2-active{background:#f4f4f4 url('../images/select2-spinner.gif') no-repeat 100%}
45 .select2-more-results.select2-active{background:#f4f4f4 url('../images/select2-spinner.gif') no-repeat 100%}
46 .select2-container.select2-container-disabled .select2-choice abbr{display:none}
46 .select2-container.select2-container-disabled .select2-choice abbr{display:none}
47 .select2-container.select2-container-disabled {background:@grey6;cursor:default}
47 .select2-container.select2-container-disabled {background:@grey6;cursor:default}
48 .select2-container.select2-container-disabled .select2-choice {background:@grey6;cursor:default}
48 .select2-container.select2-container-disabled .select2-choice {background:@grey6;cursor:default}
49 .select2-container-multi .select2-choices li{float:left;list-style:none}
49 .select2-container-multi .select2-choices li{float:left;list-style:none}
50 .select2-container-multi .select2-choices .select2-search-field{margin:0;padding:0;white-space:nowrap}
50 .select2-container-multi .select2-choices .select2-search-field{margin:0;padding:0;white-space:nowrap}
51 .select2-container-multi .select2-choices .select2-search-choice .select2-chosen{cursor:default}
51 .select2-container-multi .select2-choices .select2-search-choice .select2-chosen{cursor:default}
52 .select2-search-choice-close{display:block;width:12px;height:13px;position:absolute;right:3px;top:4px;font-size:1px;outline:none;background:url('../images/select2.png') right top no-repeat}
52 .select2-search-choice-close{display:block;width:12px;height:13px;position:absolute;right:3px;top:4px;font-size:1px;outline:none;background:url('../images/select2.png') right top no-repeat}
53 .select2-container-multi .select2-search-choice-close{left:3px}
53 .select2-container-multi .select2-search-choice-close{left:3px}
54 .select2-container-multi .select2-choices .select2-search-choice .select2-search-choice-close:hover{background-position:right -11px}
54 .select2-container-multi .select2-choices .select2-search-choice .select2-search-choice-close:hover{background-position:right -11px}
55 .select2-container-multi .select2-choices .select2-search-choice-focus .select2-search-choice-close{background-position:right -11px}
55 .select2-container-multi .select2-choices .select2-search-choice-focus .select2-search-choice-close{background-position:right -11px}
56 .select2-container-multi.select2-container-disabled .select2-choices .select2-search-choice .select2-search-choice-close{display:none;background:none}
56 .select2-container-multi.select2-container-disabled .select2-choices .select2-search-choice .select2-search-choice-close{display:none;background:none}
57 .select2-offscreen,.select2-offscreen:focus{clip:rect(0 0 0 0) !important;width:1px !important;height:1px !important;
57 .select2-offscreen,.select2-offscreen:focus{clip:rect(0 0 0 0) !important;width:1px !important;height:1px !important;
58 border:0 !important;margin:0 !important;padding:0 !important;overflow:hidden !important;
58 border:0 !important;margin:0 !important;padding:0 !important;overflow:hidden !important;
59 position: absolute !important;outline:0 !important;left:0 !important;top:0 !important}
59 position: absolute !important;outline:0 !important;left:0 !important;top:0 !important}
60 .select2-display-none,
60 .select2-display-none,
61 .select2-search-hidden {display:none}
61 .select2-search-hidden {display:none}
62 .select2-search input { border-color: @rclightblue; }
62 .select2-search input { border-color: @rclightblue; }
63
63
64 .select2-measure-scrollbar{position:absolute;top:-10000px;left:-10000px;width:100px;height:100px;overflow:scroll}
64 .select2-measure-scrollbar{position:absolute;top:-10000px;left:-10000px;width:100px;height:100px;overflow:scroll}
65 @media only screen and (-webkit-min-device-pixel-ratio:1.5),
65 @media only screen and (-webkit-min-device-pixel-ratio:1.5),
66 only screen and (min-resolution:144dpi){
66 only screen and (min-resolution:144dpi){
67 .select2-search input,
67 .select2-search input,
68 .select2-search-choice-close,
68 .select2-search-choice-close,
69 .select2-container .select2-choice abbr,
69 .select2-container .select2-choice abbr,
70 .select2-container .select2-choice .select2-arrow b{background-image:url('../images/select2x2.png');background-repeat:no-repeat;background-size:60px 40px;}
70 .select2-container .select2-choice .select2-arrow b{background-image:url('../images/select2x2.png');background-repeat:no-repeat;background-size:60px 40px;}
71 .select2-search input{background-position:100% -21px}
71 .select2-search input{background-position:100% -21px}
72 }
72 }
73 [class^="input-"] [class^="select2-choice"]>div{display:none}
73 [class^="input-"] [class^="select2-choice"]>div{display:none}
74 [class^="input-"] .select2-offscreen{position:absolute}
74 [class^="input-"] .select2-offscreen{position:absolute}
75 select.select2{height:28px;visibility:hidden}
75 select.select2{height:28px;visibility:hidden}
76 .autocomplete-suggestions{overflow:auto}
76 .autocomplete-suggestions{overflow:auto}
77 .autocomplete-suggestion{white-space:nowrap;overflow:hidden}
77 .autocomplete-suggestion{white-space:nowrap;overflow:hidden}
78
78
79 /* Retina-ize icons */
79 /* Retina-ize icons */
80 @media only screen and (-webkit-min-device-pixel-ratio:1.5),
80 @media only screen and (-webkit-min-device-pixel-ratio:1.5),
81 only screen and (min-resolution:144dpi){
81 only screen and (min-resolution:144dpi){
82 .select2-search input,
82 .select2-search input,
83 .select2-search-choice-close,
83 .select2-search-choice-close,
84 .select2-container .select2-choice abbr,
84 .select2-container .select2-choice abbr,
85 .select2-container .select2-choice .select2-arrow b{background-image:url('../images/select2x2.png');background-repeat:no-repeat;background-size:60px 40px;}
85 .select2-container .select2-choice .select2-arrow b{background-image:url('../images/select2x2.png');background-repeat:no-repeat;background-size:60px 40px;}
86 .select2-search input{background-position:100% -21px}
86 .select2-search input{background-position:100% -21px}
87 }
87 }
88
88
89 //Internal Select2 Dropdown Menus
89 //Internal Select2 Dropdown Menus
90
90
91 .drop-menu-core {
91 .drop-menu-core {
92 min-width: 160px;
92 min-width: 160px;
93 margin: 0 @padding 0 0;
93 margin: 0 @padding 0 0;
94 padding: 0;
94 padding: 0;
95 border: @border-thickness solid @rcblue;
95 border: @border-thickness solid @rcblue;
96 border-radius: @border-radius;
96 border-radius: @border-radius;
97 color: @rcblue;
97 color: @rcblue;
98 background-color: white;
98 background-color: white;
99 }
99 }
100
100
101 .drop-menu-dropdown {
101 .drop-menu-dropdown {
102 .drop-menu-core;
102 .drop-menu-core;
103
103
104 .flag_status {
104 .flag_status {
105 margin-top: 0;
105 margin-top: 0;
106 }
106 }
107 }
107 }
108
108
109 .drop-menu-base {
109 .drop-menu-base {
110 .drop-menu-core;
110 .drop-menu-core;
111 position: relative;
111 position: relative;
112 display: inline-block;
112 display: inline-block;
113 line-height: 1em;
113 line-height: 1em;
114 z-index: 2;
114 z-index: 2;
115 cursor: pointer;
115 cursor: pointer;
116
116
117 .flag_status {
117 .flag_status {
118 margin-top: 0;
118 margin-top: 0;
119 }
119 }
120
120
121 a {
121 a {
122 display:block;
122 display:block;
123 padding: .9em;
123 padding: .9em;
124 padding-right: 2em;
124 padding-right: 2em;
125 position: relative;
125 position: relative;
126
126
127 &:after {
127 &:after {
128 position: absolute;
128 position: absolute;
129 content: "\00A0\25BE";
129 content: "\00A0\25BE";
130 right: .1em;
130 right: .1em;
131 line-height: 1em;
131 line-height: 1em;
132 top: 0.4em;
132 top: 0.4em;
133 width: 1em;
133 width: 1em;
134 font-size: 20px;
134 font-size: 20px;
135 }
135 }
136 }
136 }
137 }
137 }
138
138
139 .drop-menu {
139 .drop-menu {
140 .drop-menu-base;
140 .drop-menu-base;
141 width: auto !important;
141 width: auto !important;
142 }
142 }
143
143
144 .drop-menu-no-width {
144 .drop-menu-no-width {
145 .drop-menu-base;
145 .drop-menu-base;
146 width: auto;
146 width: auto;
147 }
147 }
148
148
149 .field-sm .drop-menu {
149 .field-sm .drop-menu {
150 padding: 1px 0 0 0;
150 padding: 1px 0 0 0;
151 a {
151 a {
152 padding: 6px;
152 padding: 6px;
153 };
153 };
154 }
154 }
155
155
156 .select2-search input {
156 .select2-search input {
157 width: 100%;
157 width: 100%;
158 margin: .5em 0;
158 margin: .5em 0;
159 padding: .5em;
159 padding: .5em;
160 }
160 }
161
161
162 .select2-no-results {
162 .select2-no-results {
163 padding: .5em;
163 padding: .5em;
164 }
164 }
165
165
166 .drop-menu-dropdown ul {
166 .drop-menu-dropdown ul {
167 width: auto;
167 width: auto;
168 margin: 0;
168 margin: 0;
169 padding: 0;
169 padding: 0;
170 z-index: 50;
170 z-index: 50;
171
171
172 li {
172 li {
173 margin: 0;
173 margin: 0;
174 line-height: 1em;
174 line-height: 1em;
175 list-style-type: none;
175 list-style-type: none;
176
176
177 &:before { content: none; }
177 &:before { content: none; }
178
178
179 &:hover,
179 &:hover,
180 &.select2-highlighted {
180 &.select2-highlighted {
181 background-color: @rclightblue;
181 background-color: @rclightblue;
182 }
182 }
183
183
184 &.select2-result-with-children {
184 &.select2-result-with-children {
185 &:hover {
185 &:hover {
186 background-color: white;
186 background-color: white;
187 }
187 }
188 }
188 }
189
189
190 .select2-result-label {
190 .select2-result-label {
191 display:block;
191 display:block;
192 padding: 8px;
192 padding: 8px;
193 font-family: @text-regular;
193 font-family: @text-regular;
194 border-bottom: @border-thickness solid @rclightblue;
194 border-bottom: @border-thickness solid @rclightblue;
195 color: @rcblue;
195 color: @rcblue;
196 cursor: pointer;
196 cursor: pointer;
197 }
197 }
198 &.select2-result-with-children {
198 &.select2-result-with-children {
199
199
200 .select2-result-label {
200 .select2-result-label {
201 font-family: @text-semibold;
202 color: @rcdarkblue;
201 color: @rcdarkblue;
203 cursor: default;
202 cursor: default;
203 font-weight: @text-semibold-weight;
204 font-family: @text-semibold;
204 }
205 }
205
206
206 ul.select2-result-sub li .select2-result-label {
207 ul.select2-result-sub li .select2-result-label {
207 padding-left: 16px;
208 padding-left: 16px;
208 font-family: @text-regular;
209 font-family: @text-regular;
209 color: @rcblue;
210 color: @rcblue;
210 cursor: pointer;
211 cursor: pointer;
211 }
212 }
212 }
213 }
213 }
214 }
214 }
215 }
215
216
216 .side-by-side-selector {
217 .side-by-side-selector {
217 .left-group,
218 .left-group,
218 .middle-group,
219 .middle-group,
219 .right-group {
220 .right-group {
220 margin-bottom: @padding;
221 margin-bottom: @padding;
221 }
222 }
222 }
223 }
@@ -1,289 +1,291 b''
1 // summary.less
1 // summary.less
2 // For use in RhodeCode applications;
2 // For use in RhodeCode applications;
3 // Used for headers and file detail summary screens.
3 // Used for headers and file detail summary screens.
4
4
5 .summary {
5 .summary {
6 float: left;
6 float: left;
7 position: relative;
7 position: relative;
8 width: 100%;
8 width: 100%;
9 margin: 0;
9 margin: 0;
10 padding: 0;
10 padding: 0;
11
11
12 .summary-detail-header {
12 .summary-detail-header {
13 float: left;
13 float: left;
14 display: block;
14 display: block;
15 width: 100%;
15 width: 100%;
16 margin-bottom: @textmargin;
16 margin-bottom: @textmargin;
17 padding: 0 0 .5em 0;
17 padding: 0 0 .5em 0;
18 border-bottom: @border-thickness solid @border-default-color;
18 border-bottom: @border-thickness solid @border-default-color;
19
19
20 .breadcrumbs {
20 .breadcrumbs {
21 float: left;
21 float: left;
22 display: inline;
22 display: inline;
23 margin: 0;
23 margin: 0;
24 padding: 0;
24 padding: 0;
25 }
25 }
26 h4 {
26 h4 {
27 float: left;
27 float: left;
28 margin: 0 1em 0 0;
28 margin: 0 1em 0 0;
29 padding: 0;
29 padding: 0;
30 line-height: 1.2em;
30 line-height: 1.2em;
31 font-size: @basefontsize;
31 font-size: @basefontsize;
32 }
32 }
33
33
34 .action_link {
34 .action_link {
35 float: right;
35 float: right;
36 }
36 }
37
37
38 .new-file {
38 .new-file {
39 float: right;
39 float: right;
40 margin-top: -1.5em;
40 margin-top: -1.5em;
41 }
41 }
42 }
42 }
43
43
44 .summary-detail {
44 .summary-detail {
45 float: left;
45 float: left;
46 position: relative;
46 position: relative;
47 width: 73%;
47 width: 73%;
48 margin: 0 3% @space 0;
48 margin: 0 3% @space 0;
49 padding: 0;
49 padding: 0;
50
50
51 .file_diff_buttons {
51 .file_diff_buttons {
52 margin-top: @space;
52 margin-top: @space;
53 }
53 }
54
54
55 // commit message
55 // commit message
56 .commit {
56 .commit {
57 white-space: pre-wrap;
57 white-space: pre-wrap;
58 }
58 }
59
59
60 .left-clone {
60 .left-clone {
61 float: left;
61 float: left;
62 height: 30px;
62 height: 30px;
63 margin: 0;
63 margin: 0;
64 padding: 0;
64 padding: 0;
65 font-weight: @text-semibold-weight;
65 font-family: @text-semibold;
66 font-family: @text-semibold;
66 }
67 }
67
68
68 .right-clone {
69 .right-clone {
69 float: right;
70 float: right;
70 width: 83%;
71 width: 83%;
71 }
72 }
72
73
73 .clone_url_input {
74 .clone_url_input {
74 width: ~"calc(100% - 35px)";
75 width: ~"calc(100% - 35px)";
75 padding: 5px;
76 padding: 5px;
76 }
77 }
77
78
78 &.directory {
79 &.directory {
79 margin-bottom: 0;
80 margin-bottom: 0;
80 }
81 }
81
82
82 .desc {
83 .desc {
83 white-space: pre-wrap;
84 white-space: pre-wrap;
84 }
85 }
85 .disabled {
86 .disabled {
86 opacity: .5;
87 opacity: .5;
87 cursor: inherit;
88 cursor: inherit;
88 }
89 }
89 .help-block {
90 .help-block {
90 color: inherit;
91 color: inherit;
91 margin: 0;
92 margin: 0;
92 }
93 }
93 }
94 }
94
95
95 .sidebar-right {
96 .sidebar-right {
96 float: left;
97 float: left;
97 width: 24%;
98 width: 24%;
98 margin: 0;
99 margin: 0;
99 padding: 0;
100 padding: 0;
100
101
101 ul {
102 ul {
102 margin-left: 0;
103 margin-left: 0;
103 padding-left: 0;
104 padding-left: 0;
104
105
105 li {
106 li {
106
107
107 &:before {
108 &:before {
108 content: none;
109 content: none;
109 width: 0;
110 width: 0;
110 }
111 }
111 }
112 }
112 }
113 }
113 }
114 }
114
115
115 #clone_by_name, #clone_by_id{
116 #clone_by_name, #clone_by_id{
116 display: inline-block;
117 display: inline-block;
117 margin-left: 0px;
118 margin-left: 0px;
118 }
119 }
119
120
120 .codeblock {
121 .codeblock {
121 border: none;
122 border: none;
122 background-color: transparent;
123 background-color: transparent;
123 }
124 }
124
125
125 .code-body {
126 .code-body {
126 border: @border-thickness solid @border-default-color;
127 border: @border-thickness solid @border-default-color;
127 .border-radius(@border-radius);
128 .border-radius(@border-radius);
128 }
129 }
129 }
130 }
130
131
131 // this is used outside of just the summary
132 // this is used outside of just the summary
132 .fieldset, // similar to form fieldset
133 .fieldset, // similar to form fieldset
133 .summary .sidebar-right-content { // these have to match
134 .summary .sidebar-right-content { // these have to match
134 clear: both;
135 clear: both;
135 float: left;
136 float: left;
136 position: relative;
137 position: relative;
137 display:block;
138 display:block;
138 width: 100%;
139 width: 100%;
139 min-height: 1em;
140 min-height: 1em;
140 margin-bottom: @textmargin;
141 margin-bottom: @textmargin;
141 padding: 0;
142 padding: 0;
142 line-height: 1.2em;
143 line-height: 1.2em;
143
144
144 &:after { // clearfix
145 &:after { // clearfix
145 content: "";
146 content: "";
146 clear: both;
147 clear: both;
147 width: 100%;
148 width: 100%;
148 height: 1em;
149 height: 1em;
149 }
150 }
150 }
151 }
151
152
152 .summary .sidebar-right-content {
153 .summary .sidebar-right-content {
153 margin-bottom: @space;
154 margin-bottom: @space;
154
155
155 .rc-user {
156 .rc-user {
156 min-width: 0;
157 min-width: 0;
157 }
158 }
158 }
159 }
159
160
160 .fieldset {
161 .fieldset {
161
162
162 .left-label { // similar to form legend
163 .left-label { // similar to form legend
163 float: left;
164 float: left;
164 display: block;
165 display: block;
165 width: 25%;
166 width: 25%;
166 margin: 0;
167 margin: 0;
167 padding: 0;
168 padding: 0;
169 font-weight: @text-semibold-weight;
168 font-family: @text-semibold;
170 font-family: @text-semibold;
169 }
171 }
170
172
171 .left-label-summary {
173 .left-label-summary {
172 .left-label;
174 .left-label;
173 width: 150px;
175 width: 150px;
174 }
176 }
175
177
176 .right-content { // similar to form fields
178 .right-content { // similar to form fields
177 float: left;
179 float: left;
178 display: block;
180 display: block;
179 width: 75%;
181 width: 75%;
180 margin: 0 0 0 -15%;
182 margin: 0 0 0 -15%;
181 padding: 0 0 0 15%;
183 padding: 0 0 0 15%;
182
184
183 .truncate-wrap,
185 .truncate-wrap,
184 .truncate {
186 .truncate {
185 max-width: 100%;
187 max-width: 100%;
186 width: 100%;
188 width: 100%;
187 }
189 }
188
190
189 .commit-long {
191 .commit-long {
190 overflow-x: auto;
192 overflow-x: auto;
191 }
193 }
192 }
194 }
193 .commit.truncate-wrap {
195 .commit.truncate-wrap {
194 overflow:hidden;
196 overflow:hidden;
195 text-overflow: ellipsis;
197 text-overflow: ellipsis;
196 }
198 }
197 }
199 }
198
200
199 // expand commit message
201 // expand commit message
200 #message_expand {
202 #message_expand {
201 clear: both;
203 clear: both;
202 display: block;
204 display: block;
203 color: @rcblue;
205 color: @rcblue;
204 cursor: pointer;
206 cursor: pointer;
205 }
207 }
206
208
207 #trimmed_message_box {
209 #trimmed_message_box {
208 max-height: floor(2 * @basefontsize * 1.2); // 2 lines * line-height
210 max-height: floor(2 * @basefontsize * 1.2); // 2 lines * line-height
209 overflow: hidden;
211 overflow: hidden;
210 }
212 }
211
213
212 // show/hide comments button
214 // show/hide comments button
213 .show-inline-comments {
215 .show-inline-comments {
214 display: inline;
216 display: inline;
215 cursor: pointer;
217 cursor: pointer;
216
218
217 .comments-show { display: inline; }
219 .comments-show { display: inline; }
218 .comments-hide { display: none; }
220 .comments-hide { display: none; }
219
221
220 &.comments-visible {
222 &.comments-visible {
221 .comments-show { display: none; }
223 .comments-show { display: none; }
222 .comments-hide { display: inline; }
224 .comments-hide { display: inline; }
223 }
225 }
224 }
226 }
225
227
226 // Quick Start section
228 // Quick Start section
227 .quick_start {
229 .quick_start {
228 float: left;
230 float: left;
229 display: block;
231 display: block;
230 position: relative;
232 position: relative;
231 width: 100%;
233 width: 100%;
232
234
233 // adds some space to make copy and paste easier
235 // adds some space to make copy and paste easier
234 .left-label,
236 .left-label,
235 .right-content {
237 .right-content {
236 line-height: 1.6em;
238 line-height: 1.6em;
237 }
239 }
238 }
240 }
239
241
240 .submodule {
242 .submodule {
241 .summary-detail {
243 .summary-detail {
242 width: 100%;
244 width: 100%;
243
245
244 .btn-collapse {
246 .btn-collapse {
245 display: none;
247 display: none;
246 }
248 }
247 }
249 }
248 }
250 }
249
251
250 .codeblock-header {
252 .codeblock-header {
251 float: left;
253 float: left;
252 display: block;
254 display: block;
253 width: 100%;
255 width: 100%;
254 margin: 0;
256 margin: 0;
255 padding: @space 0 10px 0;
257 padding: @space 0 10px 0;
256 border-top: @border-thickness solid @border-default-color;
258 border-top: @border-thickness solid @border-default-color;
257
259
258 .stats {
260 .stats {
259 float: left;
261 float: left;
260 width: 50%;
262 width: 50%;
261 }
263 }
262 .stats-filename {
264 .stats-filename {
263 font-size: 120%;
265 font-size: 120%;
264 }
266 }
265 .stats-first-item {
267 .stats-first-item {
266 padding: 0px 0px 0px 3px;
268 padding: 0px 0px 0px 3px;
267 }
269 }
268
270
269 .buttons {
271 .buttons {
270 float: right;
272 float: right;
271 width: 50%;
273 width: 50%;
272 text-align: right;
274 text-align: right;
273 color: @grey4;
275 color: @grey4;
274 }
276 }
275 }
277 }
276
278
277 #summary-menu-stats {
279 #summary-menu-stats {
278
280
279 .stats-bullet {
281 .stats-bullet {
280 color: @grey3;
282 color: @grey3;
281 min-width: 3em;
283 min-width: 3em;
282 }
284 }
283
285
284 .repo-size {
286 .repo-size {
285 margin-bottom: .5em;
287 margin-bottom: .5em;
286 }
288 }
287
289
288 }
290 }
289
291
@@ -1,499 +1,501 b''
1
1
2 // tables.less
2 // tables.less
3 // For use in RhodeCode application tables;
3 // For use in RhodeCode application tables;
4 // see style guide documentation for guidelines.
4 // see style guide documentation for guidelines.
5
5
6 // TABLES
6 // TABLES
7
7
8 .rctable,
8 .rctable,
9 table.rctable,
9 table.rctable,
10 table.dataTable {
10 table.dataTable {
11 clear:both;
11 clear:both;
12 width: 100%;
12 width: 100%;
13 margin: 0 auto @padding;
13 margin: 0 auto @padding;
14 padding: 0;
14 padding: 0;
15 vertical-align: baseline;
15 vertical-align: baseline;
16 line-height:1.5em;
16 line-height:1.5em;
17 border: none;
17 border: none;
18 outline: none;
18 outline: none;
19 border-collapse: collapse;
19 border-collapse: collapse;
20 border-spacing: 0;
20 border-spacing: 0;
21 color: @grey2;
21 color: @grey2;
22
22
23 b {
23 b {
24 font-weight: normal;
24 font-weight: normal;
25 }
25 }
26
26
27 em {
27 em {
28 font-weight: bold;
28 font-weight: bold;
29 font-style: normal;
29 font-style: normal;
30 }
30 }
31
31
32 th,
32 th,
33 td {
33 td {
34 height: auto;
34 height: auto;
35 max-width: 20%;
35 max-width: 20%;
36 padding: .65em 1em .65em 0;
36 padding: .65em 1em .65em 0;
37 vertical-align: middle;
37 vertical-align: middle;
38 border-bottom: @border-thickness solid @grey5;
38 border-bottom: @border-thickness solid @grey5;
39 white-space: normal;
39 white-space: normal;
40
40
41 &.td-radio,
41 &.td-radio,
42 &.td-checkbox {
42 &.td-checkbox {
43 padding-right: 0;
43 padding-right: 0;
44 text-align: center;
44 text-align: center;
45
45
46 input {
46 input {
47 margin: 0 1em;
47 margin: 0 1em;
48 }
48 }
49 }
49 }
50
50
51 &.truncate-wrap {
51 &.truncate-wrap {
52 white-space: nowrap !important;
52 white-space: nowrap !important;
53 }
53 }
54
54
55 pre {
55 pre {
56 margin: 0;
56 margin: 0;
57 }
57 }
58
58
59 .show_more {
59 .show_more {
60 height: inherit;
60 height: inherit;
61 }
61 }
62 }
62 }
63
63
64 .expired td {
64 .expired td {
65 background-color: @grey7;
65 background-color: @grey7;
66 }
66 }
67
67
68 th {
68 th {
69 text-align: left;
69 text-align: left;
70 font-weight: @text-semibold-weight;
70 font-family: @text-semibold;
71 font-family: @text-semibold;
71 }
72 }
72
73
73 .hl {
74 .hl {
74 td {
75 td {
75 background-color: lighten(@alert4,25%);
76 background-color: lighten(@alert4,25%);
76 }
77 }
77 }
78 }
78
79
79 // Special Data Cell Types
80 // Special Data Cell Types
80 // See style guide for desciptions and examples.
81 // See style guide for desciptions and examples.
81
82
82 td {
83 td {
83
84
84 &.user {
85 &.user {
85 padding-left: 1em;
86 padding-left: 1em;
86 }
87 }
87
88
88 &.td-rss {
89 &.td-rss {
89 width: 20px;
90 width: 20px;
90 min-width: 0;
91 min-width: 0;
91 margin: 0;
92 margin: 0;
92 }
93 }
93
94
94 &.quick_repo_menu {
95 &.quick_repo_menu {
95 width: 15px;
96 width: 15px;
96 text-align: center;
97 text-align: center;
97
98
98 &:hover {
99 &:hover {
99 background-color: @grey5;
100 background-color: @grey5;
100 }
101 }
101 }
102 }
102
103
103 &.td-hash {
104 &.td-hash {
104 min-width: 80px;
105 min-width: 80px;
105 width: 200px;
106 width: 200px;
106
107
107 .obsolete {
108 .obsolete {
108 text-decoration: line-through;
109 text-decoration: line-through;
109 color: lighten(@grey2,25%);
110 color: lighten(@grey2,25%);
110 }
111 }
111 }
112 }
112
113
113 &.td-time {
114 &.td-time {
114 width: 160px;
115 width: 160px;
115 white-space: nowrap;
116 white-space: nowrap;
116 }
117 }
117
118
118 &.annotate{
119 &.annotate{
119 padding-right: 0;
120 padding-right: 0;
120
121
121 div.annotatediv{
122 div.annotatediv{
122 margin: 0 0.7em;
123 margin: 0 0.7em;
123 }
124 }
124 }
125 }
125
126
126 &.tags-col {
127 &.tags-col {
127 padding-right: 0;
128 padding-right: 0;
128 }
129 }
129
130
130 &.td-description {
131 &.td-description {
131 min-width: 350px;
132 min-width: 350px;
132
133
133 &.truncate, .truncate-wrap {
134 &.truncate, .truncate-wrap {
134 white-space: nowrap;
135 white-space: nowrap;
135 overflow: hidden;
136 overflow: hidden;
136 text-overflow: ellipsis;
137 text-overflow: ellipsis;
137 max-width: 350px;
138 max-width: 350px;
138 }
139 }
139 }
140 }
140
141
141 &.td-componentname {
142 &.td-componentname {
142 white-space: nowrap;
143 white-space: nowrap;
143 }
144 }
144
145
145 &.td-name {
146 &.td-name {
146
147
147 }
148 }
148
149
149 &.td-journalaction {
150 &.td-journalaction {
150 min-width: 300px;
151 min-width: 300px;
151
152
152 .journal_action_params {
153 .journal_action_params {
153 // waiting for feedback
154 // waiting for feedback
154 }
155 }
155 }
156 }
156
157
157 &.td-active {
158 &.td-active {
158 padding-left: .65em;
159 padding-left: .65em;
159 }
160 }
160
161
161 &.td-url {
162 &.td-url {
162 white-space: nowrap;
163 white-space: nowrap;
163 }
164 }
164
165
165 &.td-comments {
166 &.td-comments {
166 min-width: 3em;
167 min-width: 3em;
167 }
168 }
168
169
169 &.td-buttons {
170 &.td-buttons {
170 padding: .3em 0;
171 padding: .3em 0;
171 }
172 }
172
173
173 &.td-action {
174 &.td-action {
174 // this is for the remove/delete/edit buttons
175 // this is for the remove/delete/edit buttons
175 padding-right: 0;
176 padding-right: 0;
176 min-width: 95px;
177 min-width: 95px;
177 text-transform: capitalize;
178 text-transform: capitalize;
178
179
179 i {
180 i {
180 display: none;
181 display: none;
181 }
182 }
182 }
183 }
183
184
184 // TODO: lisa: this needs to be cleaned up with the buttons
185 // TODO: lisa: this needs to be cleaned up with the buttons
185 .grid_edit,
186 .grid_edit,
186 .grid_delete {
187 .grid_delete {
187 display: inline-block;
188 display: inline-block;
188 margin: 0 @padding/3 0 0;
189 margin: 0 @padding/3 0 0;
189 font-family: @text-light;
190 font-family: @text-light;
190
191
191 i {
192 i {
192 display: none;
193 display: none;
193 }
194 }
194 }
195 }
195
196
196 .grid_edit + .grid_delete {
197 .grid_edit + .grid_delete {
197 border-left: @border-thickness solid @grey5;
198 border-left: @border-thickness solid @grey5;
198 padding-left: @padding/2;
199 padding-left: @padding/2;
199 }
200 }
200
201
201 &.td-compare {
202 &.td-compare {
202
203
203 input {
204 input {
204 margin-right: 1em;
205 margin-right: 1em;
205 }
206 }
206
207
207 .compare-radio-button {
208 .compare-radio-button {
208 margin: 0 1em 0 0;
209 margin: 0 1em 0 0;
209 }
210 }
210
211
211
212
212 }
213 }
213
214
214 &.td-tags {
215 &.td-tags {
215 padding: .5em 1em .5em 0;
216 padding: .5em 1em .5em 0;
216 width: 140px;
217 width: 140px;
217
218
218 .tag {
219 .tag {
219 margin: 1px;
220 margin: 1px;
220 float: left;
221 float: left;
221 }
222 }
222 }
223 }
223
224
224 .icon-svn, .icon-hg, .icon-git {
225 .icon-svn, .icon-hg, .icon-git {
225 font-size: 1.4em;
226 font-size: 1.4em;
226 }
227 }
227
228
228 &.collapse_commit,
229 &.collapse_commit,
229 &.expand_commit {
230 &.expand_commit {
230 padding-right: 0;
231 padding-right: 0;
231 padding-left: 1em;
232 padding-left: 1em;
232 }
233 }
233 }
234 }
234
235
235 .perm_admin_row {
236 .perm_admin_row {
236 color: @grey4;
237 color: @grey4;
237 background-color: @grey6;
238 background-color: @grey6;
238 }
239 }
239
240
240 .noborder {
241 .noborder {
241 border: none;
242 border: none;
242
243
243 td {
244 td {
244 border: none;
245 border: none;
245 }
246 }
246 }
247 }
247 }
248 }
248 .rctable.audit-log {
249 .rctable.audit-log {
249 td {
250 td {
250 vertical-align: top;
251 vertical-align: top;
251 }
252 }
252 }
253 }
253
254
254 // TRUNCATING
255 // TRUNCATING
255 // TODO: lisaq: should this possibly be moved out of tables.less?
256 // TODO: lisaq: should this possibly be moved out of tables.less?
256 // for truncated text
257 // for truncated text
257 // used inside of table cells and in code block headers
258 // used inside of table cells and in code block headers
258 .truncate-wrap {
259 .truncate-wrap {
259 white-space: nowrap !important;
260 white-space: nowrap !important;
260
261
261 //truncated text
262 //truncated text
262 .truncate {
263 .truncate {
263 max-width: 450px;
264 max-width: 450px;
264 width: 300px;
265 width: 300px;
265 overflow: hidden;
266 overflow: hidden;
266 text-overflow: ellipsis;
267 text-overflow: ellipsis;
267 -o-text-overflow: ellipsis;
268 -o-text-overflow: ellipsis;
268 -ms-text-overflow: ellipsis;
269 -ms-text-overflow: ellipsis;
269
270
270 &.autoexpand {
271 &.autoexpand {
271 width: 120px;
272 width: 120px;
272 margin-right: 200px;
273 margin-right: 200px;
273 }
274 }
274 }
275 }
275 &:hover .truncate.autoexpand {
276 &:hover .truncate.autoexpand {
276 overflow: visible;
277 overflow: visible;
277 }
278 }
278
279
279 .tags-truncate {
280 .tags-truncate {
280 width: 150px;
281 width: 150px;
281 height: 22px;
282 height: 22px;
282 overflow: hidden;
283 overflow: hidden;
283
284
284 .tag {
285 .tag {
285 display: inline-block;
286 display: inline-block;
286 }
287 }
287
288
288 &.truncate {
289 &.truncate {
289 height: 22px;
290 height: 22px;
290 max-height:2em;
291 max-height:2em;
291 width: 140px;
292 width: 140px;
292 }
293 }
293 }
294 }
294 }
295 }
295
296
296 .apikeys_wrap {
297 .apikeys_wrap {
297 margin-bottom: @padding;
298 margin-bottom: @padding;
298
299
299 table.rctable td:first-child {
300 table.rctable td:first-child {
300 width: 340px;
301 width: 340px;
301 }
302 }
302 }
303 }
303
304
304
305
305
306
306 // SPECIAL CASES
307 // SPECIAL CASES
307
308
308 // Repository Followers
309 // Repository Followers
309 table.rctable.followers_data {
310 table.rctable.followers_data {
310 width: 75%;
311 width: 75%;
311 margin: 0;
312 margin: 0;
312 }
313 }
313
314
314 // Repository List
315 // Repository List
315 // Group Members List
316 // Group Members List
316 table.rctable.group_members,
317 table.rctable.group_members,
317 table#repo_list_table {
318 table#repo_list_table {
318 min-width: 600px;
319 min-width: 600px;
319 }
320 }
320
321
321 // Keyboard mappings
322 // Keyboard mappings
322 table.keyboard-mappings {
323 table.keyboard-mappings {
323 th {
324 th {
324 text-align: left;
325 text-align: left;
326 font-weight: @text-semibold-weight;
325 font-family: @text-semibold;
327 font-family: @text-semibold;
326 }
328 }
327 }
329 }
328
330
329 // Branches, Tags, and Bookmarks
331 // Branches, Tags, and Bookmarks
330 #obj_list_table.dataTable {
332 #obj_list_table.dataTable {
331 td.td-time {
333 td.td-time {
332 padding-right: 1em;
334 padding-right: 1em;
333 }
335 }
334 }
336 }
335
337
336 // User Admin
338 // User Admin
337 .rctable.useremails,
339 .rctable.useremails,
338 .rctable.account_emails {
340 .rctable.account_emails {
339 .tag,
341 .tag,
340 .btn {
342 .btn {
341 float: right;
343 float: right;
342 }
344 }
343 .btn { //to line up with tags
345 .btn { //to line up with tags
344 margin-right: 1.65em;
346 margin-right: 1.65em;
345 }
347 }
346 }
348 }
347
349
348 // User List
350 // User List
349 #user_list_table {
351 #user_list_table {
350
352
351 td.td-user {
353 td.td-user {
352 min-width: 100px;
354 min-width: 100px;
353 }
355 }
354 }
356 }
355
357
356 // Pull Request List Table
358 // Pull Request List Table
357 #pull_request_list_table.dataTable {
359 #pull_request_list_table.dataTable {
358
360
359 //TODO: lisa: This needs to be removed once the description is adjusted
361 //TODO: lisa: This needs to be removed once the description is adjusted
360 // for using an expand_commit button (see issue 765)
362 // for using an expand_commit button (see issue 765)
361 td {
363 td {
362 vertical-align: middle;
364 vertical-align: middle;
363 }
365 }
364 }
366 }
365
367
366 // Settings (no border)
368 // Settings (no border)
367 table.rctable.dl-settings {
369 table.rctable.dl-settings {
368 td {
370 td {
369 border: none;
371 border: none;
370 vertical-align: baseline;
372 vertical-align: baseline;
371 }
373 }
372 }
374 }
373
375
374
376
375 // Statistics
377 // Statistics
376 table.trending_language_tbl {
378 table.trending_language_tbl {
377 width: 100%;
379 width: 100%;
378 line-height: 1em;
380 line-height: 1em;
379
381
380 td div {
382 td div {
381 overflow: visible;
383 overflow: visible;
382 }
384 }
383 }
385 }
384
386
385 .trending_language_tbl, .trending_language_tbl td {
387 .trending_language_tbl, .trending_language_tbl td {
386 border: 0;
388 border: 0;
387 margin: 0;
389 margin: 0;
388 padding: 0;
390 padding: 0;
389 background: transparent;
391 background: transparent;
390 }
392 }
391
393
392 .trending_language_tbl, .trending_language_tbl tr {
394 .trending_language_tbl, .trending_language_tbl tr {
393 border-spacing: 0 3px;
395 border-spacing: 0 3px;
394 }
396 }
395
397
396 .trending_language {
398 .trending_language {
397 position: relative;
399 position: relative;
398 width: 100%;
400 width: 100%;
399 height: 19px;
401 height: 19px;
400 overflow: hidden;
402 overflow: hidden;
401 background-color: @grey6;
403 background-color: @grey6;
402
404
403 span, b{
405 span, b{
404 position: absolute;
406 position: absolute;
405 display: block;
407 display: block;
406 height: 12px;
408 height: 12px;
407 margin-bottom: 0px;
409 margin-bottom: 0px;
408 white-space: pre;
410 white-space: pre;
409 padding: floor(@basefontsize/4);
411 padding: floor(@basefontsize/4);
410 top: 0;
412 top: 0;
411 left: 0;
413 left: 0;
412 }
414 }
413
415
414 span{
416 span{
415 color: @text-color;
417 color: @text-color;
416 z-index: 0;
418 z-index: 0;
417 min-width: 20px;
419 min-width: 20px;
418 }
420 }
419
421
420 b {
422 b {
421 z-index: 1;
423 z-index: 1;
422 overflow: hidden;
424 overflow: hidden;
423 background-color: @rcblue;
425 background-color: @rcblue;
424 color: #FFF;
426 color: #FFF;
425 text-decoration: none;
427 text-decoration: none;
426 }
428 }
427
429
428 }
430 }
429
431
430 // Changesets
432 // Changesets
431 #changesets.rctable {
433 #changesets.rctable {
432
434
433 // td must be fixed height for graph
435 // td must be fixed height for graph
434 td {
436 td {
435 height: 32px;
437 height: 32px;
436 padding: 0 1em 0 0;
438 padding: 0 1em 0 0;
437 vertical-align: middle;
439 vertical-align: middle;
438 white-space: nowrap;
440 white-space: nowrap;
439
441
440 &.td-description {
442 &.td-description {
441 white-space: normal;
443 white-space: normal;
442 }
444 }
443
445
444 &.expand_commit {
446 &.expand_commit {
445 padding-right: 0;
447 padding-right: 0;
446 }
448 }
447 }
449 }
448 }
450 }
449
451
450 // Compare
452 // Compare
451 table.compare_view_commits {
453 table.compare_view_commits {
452 margin-top: @space;
454 margin-top: @space;
453
455
454 td.td-time {
456 td.td-time {
455 padding-left: .5em;
457 padding-left: .5em;
456 }
458 }
457
459
458 // special case to not show hover actions on hidden indicator
460 // special case to not show hover actions on hidden indicator
459 tr.compare_select_hidden:hover {
461 tr.compare_select_hidden:hover {
460 cursor: inherit;
462 cursor: inherit;
461
463
462 td {
464 td {
463 background-color: inherit;
465 background-color: inherit;
464 }
466 }
465 }
467 }
466
468
467 tr:hover {
469 tr:hover {
468 cursor: pointer;
470 cursor: pointer;
469
471
470 td {
472 td {
471 background-color: lighten(@alert4,25%);
473 background-color: lighten(@alert4,25%);
472 }
474 }
473 }
475 }
474
476
475
477
476 }
478 }
477
479
478 .file_history {
480 .file_history {
479 td.td-actions {
481 td.td-actions {
480 text-align: right;
482 text-align: right;
481 }
483 }
482 }
484 }
483
485
484
486
485 // Gist List
487 // Gist List
486 #gist_list_table {
488 #gist_list_table {
487 td {
489 td {
488 vertical-align: middle;
490 vertical-align: middle;
489
491
490 div{
492 div{
491 display: inline-block;
493 display: inline-block;
492 vertical-align: middle;
494 vertical-align: middle;
493 }
495 }
494
496
495 img{
497 img{
496 vertical-align: middle;
498 vertical-align: middle;
497 }
499 }
498 }
500 }
499 }
501 }
@@ -1,545 +1,550 b''
1 //
1 //
2 // Typography
2 // Typography
3 // modified from Bootstrap
3 // modified from Bootstrap
4 // --------------------------------------------------
4 // --------------------------------------------------
5
5
6 // Base
6 // Base
7 body {
7 body {
8 font-size: @basefontsize;
8 font-size: @basefontsize;
9 font-family: @text-light;
9 font-family: @text-light;
10 letter-spacing: .02em;
10 letter-spacing: .02em;
11 color: @grey2;
11 color: @grey2;
12 }
12 }
13
13
14 #content, label{
14 #content, label{
15 font-size: @basefontsize;
15 font-size: @basefontsize;
16 }
16 }
17
17
18 label {
18 label {
19 color: @grey2;
19 color: @grey2;
20 }
20 }
21
21
22 ::selection { background: @rchighlightblue; }
22 ::selection { background: @rchighlightblue; }
23
23
24 // Headings
24 // Headings
25 // -------------------------
25 // -------------------------
26
26
27 h1, h2, h3, h4, h5, h6,
27 h1, h2, h3, h4, h5, h6,
28 .h1, .h2, .h3, .h4, .h5, .h6 {
28 .h1, .h2, .h3, .h4, .h5, .h6 {
29 margin: 0 0 @textmargin 0;
29 margin: 0 0 @textmargin 0;
30 padding: 0;
30 padding: 0;
31 line-height: 1.8em;
31 line-height: 1.8em;
32 color: @text-color;
32 color: @text-color;
33 a {
33 a {
34 color: @rcblue;
34 color: @rcblue;
35 }
35 }
36 }
36 }
37
37
38 h1, .h1 { font-size: 1.54em; font-family: @text-bold; }
38 h1, .h1 { font-size: 1.54em; font-weight: @text-bold-weight; font-family: @text-bold; }
39 h2, .h2 { font-size: 1.23em; font-family: @text-semibold; }
39 h2, .h2 { font-size: 1.23em; font-weight: @text-semibold-weight; font-family: @text-semibold; }
40 h3, .h3 { font-size: 1.23em; font-family: @text-regular; }
40 h3, .h3 { font-size: 1.23em; font-family: @text-regular; }
41 h4, .h4 { font-size: 1em; font-family: @text-bold; }
41 h4, .h4 { font-size: 1em; font-weight: @text-bold-weight; font-family: @text-bold; }
42 h5, .h5 { font-size: 1em; font-family: @text-bold-italic; }
42 h5, .h5 { font-size: 1em; font-weight: @text-bold-weight; font-family: @text-bold; }
43 h6, .h6 { font-size: 1em; font-family: @text-bold-italic; }
43 h6, .h6 { font-size: 1em; font-weight: @text-bold-weight; font-family: @text-bold; }
44
44
45 // Breadcrumbs
45 // Breadcrumbs
46 .breadcrumbs {
46 .breadcrumbs {
47 font-size: @repo-title-fontsize;
47 font-size: @repo-title-fontsize;
48 margin: 0;
48 margin: 0;
49 }
49 }
50
50
51 .breadcrumbs_light {
51 .breadcrumbs_light {
52 float:left;
52 float:left;
53 font-size: 1.3em;
53 font-size: 1.3em;
54 line-height: 38px;
54 line-height: 38px;
55 }
55 }
56
56
57 // Body text
57 // Body text
58 // -------------------------
58 // -------------------------
59
59
60 p {
60 p {
61 margin: 0 0 @textmargin 0;
61 margin: 0 0 @textmargin 0;
62 padding: 0;
62 padding: 0;
63 line-height: 2em;
63 line-height: 2em;
64 }
64 }
65
65
66 .lead {
66 .lead {
67 margin-bottom: @textmargin;
67 margin-bottom: @textmargin;
68 font-weight: 300;
68 font-weight: 300;
69 line-height: 1.4;
69 line-height: 1.4;
70
70
71 @media (min-width: @screen-sm-min) {
71 @media (min-width: @screen-sm-min) {
72 font-size: (@basefontsize * 1.5);
72 font-size: (@basefontsize * 1.5);
73 }
73 }
74 }
74 }
75
75
76 a,
76 a,
77 .link {
77 .link {
78 color: @rcblue;
78 color: @rcblue;
79 text-decoration: none;
79 text-decoration: none;
80 outline: none;
80 outline: none;
81 cursor: pointer;
81 cursor: pointer;
82
82
83 &:focus {
83 &:focus {
84 outline: none;
84 outline: none;
85 }
85 }
86
86
87 &:hover {
87 &:hover {
88 color: @rcdarkblue;
88 color: @rcdarkblue;
89 }
89 }
90 }
90 }
91
91
92 img {
92 img {
93 border: none;
93 border: none;
94 outline: none;
94 outline: none;
95 }
95 }
96
96
97 strong {
97 strong {
98 font-weight: @text-bold-weight;
98 font-family: @text-bold;
99 font-family: @text-bold;
99 }
100 }
100
101
101 em {
102 em {
102 font-family: @text-italic;
103 font-family: @text-italic;
104 font-style: italic;
103 }
105 }
104
106
105 strong em,
107 strong em,
106 em strong {
108 em strong {
109 font-style: italic;
110 font-weight: @text-bold-italic-weight;
107 font-family: @text-bold-italic;
111 font-family: @text-bold-italic;
108 }
112 }
109
113
110 //TODO: lisa: b and i are depreciated, but we are still using them in places.
114 //TODO: lisa: b and i are depreciated, but we are still using them in places.
111 // Should probably make some decision whether to keep or lose these.
115 // Should probably make some decision whether to keep or lose these.
112 b {
116 b {
113
117
114 }
118 }
115
119
116 i {
120 i {
117 font-style: normal;
121 font-style: normal;
118 }
122 }
119
123
120 label {
124 label {
121 color: @text-color;
125 color: @text-color;
122
126
123 input[type="checkbox"] {
127 input[type="checkbox"] {
124 margin-right: 1em;
128 margin-right: 1em;
125 }
129 }
126 input[type="radio"] {
130 input[type="radio"] {
127 margin-right: 1em;
131 margin-right: 1em;
128 }
132 }
129 }
133 }
130
134
131 code,
135 code,
132 .code {
136 .code {
133 font-size: .95em;
137 font-size: .95em;
134 font-family: @text-code;
138 font-family: @text-code;
135 color: @grey3;
139 color: @grey3;
136
140
137 a {
141 a {
138 color: lighten(@rcblue,10%)
142 color: lighten(@rcblue,10%)
139 }
143 }
140 }
144 }
141
145
142 pre {
146 pre {
143 margin: 0;
147 margin: 0;
144 padding: 0;
148 padding: 0;
145 border: 0;
149 border: 0;
146 outline: 0;
150 outline: 0;
147 font-size: @basefontsize*.95;
151 font-size: @basefontsize*.95;
148 line-height: 1.4em;
152 line-height: 1.4em;
149 font-family: @text-code;
153 font-family: @text-code;
150 color: @grey3;
154 color: @grey3;
151 }
155 }
152
156
153 // Emphasis & misc
157 // Emphasis & misc
154 // -------------------------
158 // -------------------------
155
159
156 small,
160 small,
157 .small {
161 .small {
158 font-size: 75%;
162 font-size: 75%;
159 font-weight: normal;
163 font-weight: normal;
160 line-height: 1em;
164 line-height: 1em;
161 }
165 }
162
166
163 mark,
167 mark,
164 .mark {
168 .mark {
165 background-color: @rclightblue;
169 background-color: @rclightblue;
166 padding: .2em;
170 padding: .2em;
167 }
171 }
168
172
169 // Alignment
173 // Alignment
170 .text-left { text-align: left; }
174 .text-left { text-align: left; }
171 .text-right { text-align: right; }
175 .text-right { text-align: right; }
172 .text-center { text-align: center; }
176 .text-center { text-align: center; }
173 .text-justify { text-align: justify; }
177 .text-justify { text-align: justify; }
174 .text-nowrap { white-space: nowrap; }
178 .text-nowrap { white-space: nowrap; }
175
179
176 // Transformation
180 // Transformation
177 .text-lowercase { text-transform: lowercase; }
181 .text-lowercase { text-transform: lowercase; }
178 .text-uppercase { text-transform: uppercase; }
182 .text-uppercase { text-transform: uppercase; }
179 .text-capitalize { text-transform: capitalize; }
183 .text-capitalize { text-transform: capitalize; }
180
184
181 // Contextual colors
185 // Contextual colors
182 .text-muted {
186 .text-muted {
183 color: @grey4;
187 color: @grey4;
184 }
188 }
185 .text-primary {
189 .text-primary {
186 color: @rcblue;
190 color: @rcblue;
187 }
191 }
188 .text-success {
192 .text-success {
189 color: @alert1;
193 color: @alert1;
190 }
194 }
191 .text-info {
195 .text-info {
192 color: @alert4;
196 color: @alert4;
193 }
197 }
194 .text-warning {
198 .text-warning {
195 color: @alert3;
199 color: @alert3;
196 }
200 }
197 .text-danger {
201 .text-danger {
198 color: @alert2;
202 color: @alert2;
199 }
203 }
200
204
201 // Contextual backgrounds
205 // Contextual backgrounds
202 .bg-primary {
206 .bg-primary {
203 background-color: white;
207 background-color: white;
204 }
208 }
205 .bg-success {
209 .bg-success {
206 background-color: @alert1;
210 background-color: @alert1;
207 }
211 }
208 .bg-info {
212 .bg-info {
209 background-color: @alert4;
213 background-color: @alert4;
210 }
214 }
211 .bg-warning {
215 .bg-warning {
212 background-color: @alert3;
216 background-color: @alert3;
213 }
217 }
214 .bg-danger {
218 .bg-danger {
215 background-color: @alert2;
219 background-color: @alert2;
216 }
220 }
217
221
218
222
219 // Page header
223 // Page header
220 // -------------------------
224 // -------------------------
221
225
222 .page-header {
226 .page-header {
223 margin: @pagepadding 0 @textmargin;
227 margin: @pagepadding 0 @textmargin;
224 border-bottom: @border-thickness solid @grey5;
228 border-bottom: @border-thickness solid @grey5;
225 }
229 }
226
230
227 .title {
231 .title {
228 clear: both;
232 clear: both;
229 float: left;
233 float: left;
230 width: 100%;
234 width: 100%;
231 margin: @pagepadding/2 0 @pagepadding;
235 margin: @pagepadding/2 0 @pagepadding;
232
236
233 .breadcrumbs {
237 .breadcrumbs {
234 float: left;
238 float: left;
235 clear: both;
239 clear: both;
236 width: 700px;
240 width: 700px;
237 margin: 0;
241 margin: 0;
238
242
239 .q_filter_box {
243 .q_filter_box {
240 margin-right: @padding;
244 margin-right: @padding;
241 }
245 }
242 }
246 }
243
247
244 h1 a {
248 h1 a {
245 color: @rcblue;
249 color: @rcblue;
246 }
250 }
247
251
248 input{
252 input{
249 margin-right: @padding;
253 margin-right: @padding;
250 }
254 }
251
255
252 h5, .h5 {
256 h5, .h5 {
253 color: @grey1;
257 color: @grey1;
254 margin-bottom: @space;
258 margin-bottom: @space;
255
259
256 span {
260 span {
257 display: inline-block;
261 display: inline-block;
258 }
262 }
259 }
263 }
260
264
261 p {
265 p {
262 margin-bottom: 0;
266 margin-bottom: 0;
263 }
267 }
264
268
265 .links {
269 .links {
266 float: right;
270 float: right;
267 display: inline;
271 display: inline;
268 margin: 0;
272 margin: 0;
269 padding-left: 0;
273 padding-left: 0;
270 list-style: none;
274 list-style: none;
271 text-align: right;
275 text-align: right;
272
276
273 li:before { content: none; }
277 li:before { content: none; }
274 li { float: right; }
278 li { float: right; }
275 a {
279 a {
276 display: inline-block;
280 display: inline-block;
277 margin-left: @textmargin/2;
281 margin-left: @textmargin/2;
278 }
282 }
279 }
283 }
280
284
281 .title-content {
285 .title-content {
282 float: left;
286 float: left;
283 margin: 0;
287 margin: 0;
284 padding: 0;
288 padding: 0;
285
289
286 & + .breadcrumbs {
290 & + .breadcrumbs {
287 margin-top: @padding;
291 margin-top: @padding;
288 }
292 }
289
293
290 & + .links {
294 & + .links {
291 margin-top: -@button-padding;
295 margin-top: -@button-padding;
292
296
293 & + .breadcrumbs {
297 & + .breadcrumbs {
294 margin-top: @padding;
298 margin-top: @padding;
295 }
299 }
296 }
300 }
297 }
301 }
298
302
299 .title-main {
303 .title-main {
300 font-size: @repo-title-fontsize;
304 font-size: @repo-title-fontsize;
301 }
305 }
302
306
303 .title-description {
307 .title-description {
304 margin-top: .5em;
308 margin-top: .5em;
305 }
309 }
306
310
307 .q_filter_box {
311 .q_filter_box {
308 width: 200px;
312 width: 200px;
309 }
313 }
310
314
311 }
315 }
312
316
313 #readme .title {
317 #readme .title {
314 text-transform: none;
318 text-transform: none;
315 }
319 }
316
320
317 // Lists
321 // Lists
318 // -------------------------
322 // -------------------------
319
323
320 // Unordered and Ordered lists
324 // Unordered and Ordered lists
321 ul,
325 ul,
322 ol {
326 ol {
323 margin-top: 0;
327 margin-top: 0;
324 margin-bottom: @textmargin;
328 margin-bottom: @textmargin;
325 ul,
329 ul,
326 ol {
330 ol {
327 margin-bottom: 0;
331 margin-bottom: 0;
328 }
332 }
329 }
333 }
330
334
331 li {
335 li {
332 line-height: 2em;
336 line-height: 2em;
333 }
337 }
334
338
335 ul li {
339 ul li {
336 position: relative;
340 position: relative;
337 display: block;
341 display: block;
338 list-style-type: none;
342 list-style-type: none;
339
343
340 &:before {
344 &:before {
341 content: "\2014\00A0";
345 content: "\2014\00A0";
342 position: absolute;
346 position: absolute;
343 top: 0;
347 top: 0;
344 left: -1.25em;
348 left: -1.25em;
345 }
349 }
346
350
347 p:first-child {
351 p:first-child {
348 display:inline;
352 display:inline;
349 }
353 }
350 }
354 }
351
355
352 // List options
356 // List options
353
357
354 // Unstyled keeps list items block level, just removes default browser padding and list-style
358 // Unstyled keeps list items block level, just removes default browser padding and list-style
355 .list-unstyled {
359 .list-unstyled {
356 padding-left: 0;
360 padding-left: 0;
357 list-style: none;
361 list-style: none;
358 li:before { content: none; }
362 li:before { content: none; }
359 }
363 }
360
364
361 // Inline turns list items into inline-block
365 // Inline turns list items into inline-block
362 .list-inline {
366 .list-inline {
363 .list-unstyled();
367 .list-unstyled();
364 margin-left: -5px;
368 margin-left: -5px;
365
369
366 > li {
370 > li {
367 display: inline-block;
371 display: inline-block;
368 padding-left: 5px;
372 padding-left: 5px;
369 padding-right: 5px;
373 padding-right: 5px;
370 }
374 }
371 }
375 }
372
376
373 // Description Lists
377 // Description Lists
374
378
375 dl {
379 dl {
376 margin-top: 0; // Remove browser default
380 margin-top: 0; // Remove browser default
377 margin-bottom: @textmargin;
381 margin-bottom: @textmargin;
378 }
382 }
379
383
380 dt,
384 dt,
381 dd {
385 dd {
382 line-height: 1.4em;
386 line-height: 1.4em;
383 }
387 }
384
388
385 dt {
389 dt {
386 margin: @textmargin 0 0 0;
390 margin: @textmargin 0 0 0;
391 font-weight: @text-bold-weight;
387 font-family: @text-bold;
392 font-family: @text-bold;
388 }
393 }
389
394
390 dd {
395 dd {
391 margin-left: 0; // Undo browser default
396 margin-left: 0; // Undo browser default
392 }
397 }
393
398
394 // Horizontal description lists
399 // Horizontal description lists
395 // Defaults to being stacked without any of the below styles applied, until the
400 // Defaults to being stacked without any of the below styles applied, until the
396 // grid breakpoint is reached (default of ~768px).
401 // grid breakpoint is reached (default of ~768px).
397 // These are used in forms as well; see style guide.
402 // These are used in forms as well; see style guide.
398 // TODO: lisa: These should really not be used in forms.
403 // TODO: lisa: These should really not be used in forms.
399
404
400 .dl-horizontal {
405 .dl-horizontal {
401
406
402 overflow: hidden;
407 overflow: hidden;
403 margin-bottom: @space;
408 margin-bottom: @space;
404
409
405 dt, dd {
410 dt, dd {
406 float: left;
411 float: left;
407 margin: 5px 0 5px 0;
412 margin: 5px 0 5px 0;
408 }
413 }
409
414
410 dt {
415 dt {
411 clear: left;
416 clear: left;
412 width: @label-width - @form-vertical-margin;
417 width: @label-width - @form-vertical-margin;
413 }
418 }
414
419
415 dd {
420 dd {
416 &:extend(.clearfix all); // Clear the floated `dt` if an empty `dd` is present
421 &:extend(.clearfix all); // Clear the floated `dt` if an empty `dd` is present
417 margin-left: @form-vertical-margin;
422 margin-left: @form-vertical-margin;
418 max-width: @form-max-width - (@label-width - @form-vertical-margin) - @form-vertical-margin;
423 max-width: @form-max-width - (@label-width - @form-vertical-margin) - @form-vertical-margin;
419 }
424 }
420
425
421 pre {
426 pre {
422 margin: 0;
427 margin: 0;
423 }
428 }
424
429
425 &.settings {
430 &.settings {
426 dt {
431 dt {
427 text-align: left;
432 text-align: left;
428 }
433 }
429 }
434 }
430
435
431 @media (min-width: 768px) {
436 @media (min-width: 768px) {
432 dt {
437 dt {
433 float: left;
438 float: left;
434 width: 180px;
439 width: 180px;
435 clear: left;
440 clear: left;
436 text-align: right;
441 text-align: right;
437 }
442 }
438 dd {
443 dd {
439 margin-left: 20px;
444 margin-left: 20px;
440 }
445 }
441 }
446 }
442 }
447 }
443
448
444
449
445 // Misc
450 // Misc
446 // -------------------------
451 // -------------------------
447
452
448 // Abbreviations and acronyms
453 // Abbreviations and acronyms
449 abbr[title],
454 abbr[title],
450 abbr[data-original-title] {
455 abbr[data-original-title] {
451 cursor: help;
456 cursor: help;
452 border-bottom: @border-thickness dotted @grey4;
457 border-bottom: @border-thickness dotted @grey4;
453 }
458 }
454 .initialism {
459 .initialism {
455 font-size: 90%;
460 font-size: 90%;
456 text-transform: uppercase;
461 text-transform: uppercase;
457 }
462 }
458
463
459 // Blockquotes
464 // Blockquotes
460 blockquote {
465 blockquote {
461 padding: 1em 2em;
466 padding: 1em 2em;
462 margin: 0 0 2em;
467 margin: 0 0 2em;
463 font-size: @basefontsize;
468 font-size: @basefontsize;
464 border-left: 2px solid @grey6;
469 border-left: 2px solid @grey6;
465
470
466 p,
471 p,
467 ul,
472 ul,
468 ol {
473 ol {
469 &:last-child {
474 &:last-child {
470 margin-bottom: 0;
475 margin-bottom: 0;
471 }
476 }
472 }
477 }
473
478
474 footer,
479 footer,
475 small,
480 small,
476 .small {
481 .small {
477 display: block;
482 display: block;
478 font-size: 80%;
483 font-size: 80%;
479
484
480 &:before {
485 &:before {
481 content: '\2014 \00A0'; // em dash, nbsp
486 content: '\2014 \00A0'; // em dash, nbsp
482 }
487 }
483 }
488 }
484 }
489 }
485
490
486 // Opposite alignment of blockquote
491 // Opposite alignment of blockquote
487 //
492 //
488 .blockquote-reverse,
493 .blockquote-reverse,
489 blockquote.pull-right {
494 blockquote.pull-right {
490 padding-right: 15px;
495 padding-right: 15px;
491 padding-left: 0;
496 padding-left: 0;
492 border-right: 5px solid @grey6;
497 border-right: 5px solid @grey6;
493 border-left: 0;
498 border-left: 0;
494 text-align: right;
499 text-align: right;
495
500
496 // Account for citation
501 // Account for citation
497 footer,
502 footer,
498 small,
503 small,
499 .small {
504 .small {
500 &:before { content: ''; }
505 &:before { content: ''; }
501 &:after {
506 &:after {
502 content: '\00A0 \2014'; // nbsp, em dash
507 content: '\00A0 \2014'; // nbsp, em dash
503 }
508 }
504 }
509 }
505 }
510 }
506
511
507 // Addresses
512 // Addresses
508 address {
513 address {
509 margin-bottom: 2em;
514 margin-bottom: 2em;
510 font-style: normal;
515 font-style: normal;
511 line-height: 1.8em;
516 line-height: 1.8em;
512 }
517 }
513
518
514 .error-message {
519 .error-message {
515 display: block;
520 display: block;
516 margin: @padding/3 0;
521 margin: @padding/3 0;
517 color: @alert2;
522 color: @alert2;
518 }
523 }
519
524
520 .issue-tracker-link {
525 .issue-tracker-link {
521 color: @rcblue;
526 color: @rcblue;
522 }
527 }
523
528
524 .info_text{
529 .info_text{
525 font-size: @basefontsize;
530 font-size: @basefontsize;
526 color: @grey4;
531 color: @grey4;
527 font-family: @text-regular;
532 font-family: @text-regular;
528 }
533 }
529
534
530 // help block text
535 // help block text
531 .help-block {
536 .help-block {
532 display: block;
537 display: block;
533 margin: 0 0 @padding;
538 margin: 0 0 @padding;
534 color: @grey4;
539 color: @grey4;
535 font-family: @text-light;
540 font-family: @text-light;
536 &.pre-formatting {
541 &.pre-formatting {
537 white-space: pre;
542 white-space: pre;
538 }
543 }
539 }
544 }
540
545
541 .error-message {
546 .error-message {
542 display: block;
547 display: block;
543 margin: @padding/3 0;
548 margin: @padding/3 0;
544 color: @alert2;
549 color: @alert2;
545 }
550 }
@@ -1,141 +1,148 b''
1 // variables for use in all RhodeCode products
1 // variables for use in all RhodeCode products
2
2
3 // FONTS
3 // FONTS
4 //Primary Colors (brand)
4 //Primary Colors (brand)
5 @rcblue: #427cc9; //RhodeCode blue
5 @rcblue: #427cc9; //RhodeCode blue
6 @rcdarkblue: #305b91; //RhodeCode dark blue
6 @rcdarkblue: #305b91; //RhodeCode dark blue
7 @rclightblue: lighten(@rcblue, 30%);
7 @rclightblue: lighten(@rcblue, 30%);
8 @rchighlightblue: lighten(@rcblue, 35%);
8 @rchighlightblue: lighten(@rcblue, 35%);
9
9
10 // Secondary Colors (greyscale)
10 // Secondary Colors (greyscale)
11 @grey1: #202020; //midnight
11 @grey1: #202020; //midnight
12 @grey2: #323232; //charcoal
12 @grey2: #323232; //charcoal
13 @grey3: #666666; //tungsten
13 @grey3: #666666; //tungsten
14 @grey4: #979797; //light grey
14 @grey4: #979797; //light grey
15 @grey5: #dbd9da; //greyish
15 @grey5: #dbd9da; //greyish
16 @grey6: #eeeeee; //silver
16 @grey6: #eeeeee; //silver
17 @grey7: #f9f9f9; //light silver
17 @grey7: #f9f9f9; //light silver
18
18
19 // special for navigation
19 // special for navigation
20 @nav-grey: #CDCCCD;
20 @nav-grey: #CDCCCD;
21
21
22 @grey5-alpha: rgba(219, 217, 218, 0.3);
22 @grey5-alpha: rgba(219, 217, 218, 0.3);
23
23
24 // Tertiary Colors
24 // Tertiary Colors
25 @color1: #879938; //olive green
25 @color1: #879938; //olive green
26 @color2: #fcc93a; //bright yellow
26 @color2: #fcc93a; //bright yellow
27 @color3: #ff9e07; //orange-yellow
27 @color3: #ff9e07; //orange-yellow
28 @color4: #fc663a; //bright orange
28 @color4: #fc663a; //bright orange
29 @color5: #d63d44; //signal red
29 @color5: #d63d44; //signal red
30 @color6: #99287c; //violet
30 @color6: #99287c; //violet
31 @color7: #682668; //dark purple
31 @color7: #682668; //dark purple
32 @color8: #194f8e; //dark blue
32 @color8: #194f8e; //dark blue
33
33
34 // Alert Colors (bright)
34 // Alert Colors (bright)
35 @alert1: #0ac878; //bright green
35 @alert1: #0ac878; //bright green
36 @alert2: #e85e4d; //soft red
36 @alert2: #e85e4d; //soft red
37 @alert3: #ffc854; //corn yellow
37 @alert3: #ffc854; //corn yellow
38 @alert4: #84a5d2; //light blue
38 @alert4: #84a5d2; //light blue
39
39
40 // Alert Inner Colors
40 // Alert Inner Colors
41 @alert1-inner: #daf7eb; //bright green
41 @alert1-inner: #daf7eb; //bright green
42 @alert2-inner: #fbdfdb; //soft red
42 @alert2-inner: #fbdfdb; //soft red
43 @alert3-inner: #fff4dd; //corn yellow
43 @alert3-inner: #fff4dd; //corn yellow
44 @alert4-inner: #e6edf6; //light blue
44 @alert4-inner: #e6edf6; //light blue
45
45
46 // Highlight color for lines and colors
46 // Highlight color for lines and colors
47 @comment-highlight-color: #ffd887;
47 @comment-highlight-color: #ffd887;
48
48
49 // FONTS
49 // FONTS
50 @basefontsize: 13px;
50 @basefontsize: 13px;
51 @navigation-fontsize: 14px;
51 @navigation-fontsize: 14px;
52 @journal-fontsize: @basefontsize+7px;
52 @journal-fontsize: @basefontsize+7px;
53 @text-color: @grey2;
53 @text-color: @grey2;
54 @repo-title-fontsize: 18px;
54 @repo-title-fontsize: 18px;
55
55
56 @text-regular: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif;
56 @text-regular: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif;
57 @text-monospace: 'Menlo', 'Liberation Mono', 'Consolas', 'DejaVu Sans Mono', 'Ubuntu Mono', 'Courier New', 'andale mono', 'lucida console', monospace;
57 @text-monospace: 'Menlo', 'Liberation Mono', 'Consolas', 'DejaVu Sans Mono', 'Ubuntu Mono', 'Courier New', 'andale mono', 'lucida console', monospace;
58
58
59 @text-italic: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif;
59 @text-italic: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif;
60
60 @text-bold: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif;
61 @text-bold: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif;
62 @text-bold-weight: 600;
63
61 @text-semibold: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif;
64 @text-semibold: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif;
65 @text-semibold-weight: 500;
66
62 @text-bold-italic: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif;
67 @text-bold-italic: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif;
63 @text-code: 'Menlo', 'Liberation Mono', 'Consolas', 'DejaVu Sans Mono', 'Ubuntu Mono', 'Courier New', 'andale mono', 'lucida console', monospace;
68 @text-bold-italic-weight: 600;
64
69
70 @text-code: @text-monospace;
65 @text-light: @text-regular;
71 @text-light: @text-regular;
66 @text-light-italic: @text-italic;
72
73
67 // Used for .close buttons
74 // Used for .close buttons
68 @text-bootstrap: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif;
75 @text-bootstrap: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif;
69
76
70 @panel-title: @basefontsize;
77 @panel-title: @basefontsize;
71 @panel-footer: @basefontsize;
78 @panel-footer: @basefontsize;
72
79
73 // BORDERS
80 // BORDERS
74 @border-thickness: 1px;
81 @border-thickness: 1px;
75 @border-thickness-buttons: 1px;
82 @border-thickness-buttons: 1px;
76 @border-thickness-tags: 1px;
83 @border-thickness-tags: 1px;
77 @border-radius: 2px;
84 @border-radius: 2px;
78 @border-default-color: @grey5;
85 @border-default-color: @grey5;
79 @border-highlight-color: @grey4;
86 @border-highlight-color: @grey4;
80
87
81 // SPACING
88 // SPACING
82 @contentpadding: 15px; //padding on left and right of pages
89 @contentpadding: 15px; //padding on left and right of pages
83 @pagepadding: 40px; //padding on top and bottom of pages
90 @pagepadding: 40px; //padding on top and bottom of pages
84 @menupadding: 12px; //padding for sidebar and content
91 @menupadding: 12px; //padding for sidebar and content
85 @sidebarpadding: 15px; //spacing between sections
92 @sidebarpadding: 15px; //spacing between sections
86 @space: 40px; //spacing between sections
93 @space: 40px; //spacing between sections
87 @padding: 15px; //padding inside modules
94 @padding: 15px; //padding inside modules
88 @textmargin: 20px; //spacing below headers
95 @textmargin: 20px; //spacing below headers
89 @header-padding: 20px;
96 @header-padding: 20px;
90 @panel-padding: @padding;
97 @panel-padding: @padding;
91 @gravatar-size: 16px; // height/width of gravatar w/o border
98 @gravatar-size: 16px; // height/width of gravatar w/o border
92
99
93 // ADMIN
100 // ADMIN
94 @form-max-width: 750px;
101 @form-max-width: 750px;
95
102
96 // FORMS (new)
103 // FORMS (new)
97 @border-thickness-inputs: 1px;
104 @border-thickness-inputs: 1px;
98 @input-padding: @button-padding; //needs to match button padding
105 @input-padding: @button-padding; //needs to match button padding
99 // TODO: johbo: Needed for working computation of paddings around labels etc.
106 // TODO: johbo: Needed for working computation of paddings around labels etc.
100 // Expected to be replaced once we are done with the form refactoring.
107 // Expected to be replaced once we are done with the form refactoring.
101 @input-padding-px: 12px;
108 @input-padding-px: 12px;
102 @legend-width: 220px;
109 @legend-width: 220px;
103 @form-vertical-margin: 20px;
110 @form-vertical-margin: 20px;
104 @form-check-width: 20px;
111 @form-check-width: 20px;
105 @form-radio-width: 10px;
112 @form-radio-width: 10px;
106 @form-textcolor: @grey3;
113 @form-textcolor: @grey3;
107
114
108 // FORMS
115 // FORMS
109 @label-width: 220px;
116 @label-width: 220px;
110 //TODO: lisa: Eventually we don't need both of these; remove
117 //TODO: lisa: Eventually we don't need both of these; remove
111 // label-width when legend-width is no longer used
118 // label-width when legend-width is no longer used
112
119
113 @input-border-thickness: @border-thickness;
120 @input-border-thickness: @border-thickness;
114 @medium-inline-input-width: 115px;
121 @medium-inline-input-width: 115px;
115 @input-description-minwidth: 300px;
122 @input-description-minwidth: 300px;
116 @label2-width: 200px;
123 @label2-width: 200px;
117 @checkboxes-width: 420px;
124 @checkboxes-width: 420px;
118 @label-summary-minwidth: 80px;
125 @label-summary-minwidth: 80px;
119 @search-form-width: 400px;
126 @search-form-width: 400px;
120 @fields-input-m: 400px;
127 @fields-input-m: 400px;
121 @fields-input-l: 800px;
128 @fields-input-l: 800px;
122
129
123 // BUTTONS
130 // BUTTONS
124 @button-padding: .9em;
131 @button-padding: .9em;
125
132
126 // DEFAULT WIDTHS
133 // DEFAULT WIDTHS
127 @wrapper-maxwidth: 1200px;
134 @wrapper-maxwidth: 1200px;
128 @sidebar-width: 145px;
135 @sidebar-width: 145px;
129 @sidebar-all-width: @sidebar-width + 2 * @sidebarpadding;
136 @sidebar-all-width: @sidebar-width + 2 * @sidebarpadding;
130 @sidebar-small-width: 100px;
137 @sidebar-small-width: 100px;
131 @sidebar-small-all-width: @sidebar-small-width + 2 * @sidebarpadding;
138 @sidebar-small-all-width: @sidebar-small-width + 2 * @sidebarpadding;
132 @texteditor-width: 660px;
139 @texteditor-width: 660px;
133 @maincontent-maxwidth: 940px;
140 @maincontent-maxwidth: 940px;
134 @pullrequest-width: 1025px;
141 @pullrequest-width: 1025px;
135 @summary-menu-stats-width: 200px;
142 @summary-menu-stats-width: 200px;
136
143
137 // SCREEN WIDTHS
144 // SCREEN WIDTHS
138 @screen-sm-min: 320px;
145 @screen-sm-min: 320px;
139
146
140 // For Bootstrap
147 // For Bootstrap
141 @panel-border-radius: @border-radius;
148 @panel-border-radius: @border-radius;
General Comments 0
You need to be logged in to leave comments. Login now