##// END OF EJS Templates
style: optimized <code> element fonts.
marcink -
r2129:2dddc507 default
parent child Browse files
Show More
@@ -1,545 +1,545 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-family: @text-bold; }
39 h2, .h2 { font-size: 1.23em; font-family: @text-semibold; }
39 h2, .h2 { font-size: 1.23em; 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-family: @text-bold; }
42 h5, .h5 { font-size: 1em; font-family: @text-bold-italic; }
42 h5, .h5 { font-size: 1em; font-family: @text-bold-italic; }
43 h6, .h6 { font-size: 1em; font-family: @text-bold-italic; }
43 h6, .h6 { font-size: 1em; font-family: @text-bold-italic; }
44
44
45 // Breadcrumbs
45 // Breadcrumbs
46 .breadcrumbs {
46 .breadcrumbs {
47 &:extend(h1);
47 &:extend(h1);
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-family: @text-bold;
98 font-family: @text-bold;
99 }
99 }
100
100
101 em {
101 em {
102 font-family: @text-italic;
102 font-family: @text-italic;
103 }
103 }
104
104
105 strong em,
105 strong em,
106 em strong {
106 em strong {
107 font-family: @text-bold-italic;
107 font-family: @text-bold-italic;
108 }
108 }
109
109
110 //TODO: lisa: b and i are depreciated, but we are still using them in places.
110 //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.
111 // Should probably make some decision whether to keep or lose these.
112 b {
112 b {
113
113
114 }
114 }
115
115
116 i {
116 i {
117 font-style: normal;
117 font-style: normal;
118 }
118 }
119
119
120 label {
120 label {
121 color: @text-color;
121 color: @text-color;
122
122
123 input[type="checkbox"] {
123 input[type="checkbox"] {
124 margin-right: 1em;
124 margin-right: 1em;
125 }
125 }
126 input[type="radio"] {
126 input[type="radio"] {
127 margin-right: 1em;
127 margin-right: 1em;
128 }
128 }
129 }
129 }
130
130
131 code,
131 code,
132 .code {
132 .code {
133 font-size: .95em;
133 font-size: .95em;
134 font-family: "Lucida Console", Monaco, monospace;
134 font-family: @text-code;
135 color: @grey3;
135 color: @grey3;
136
136
137 a {
137 a {
138 color: lighten(@rcblue,10%)
138 color: lighten(@rcblue,10%)
139 }
139 }
140 }
140 }
141
141
142 pre {
142 pre {
143 margin: 0;
143 margin: 0;
144 padding: 0;
144 padding: 0;
145 border: 0;
145 border: 0;
146 outline: 0;
146 outline: 0;
147 font-size: @basefontsize*.95;
147 font-size: @basefontsize*.95;
148 line-height: 1.4em;
148 line-height: 1.4em;
149 font-family: "Lucida Console", Monaco, monospace;
149 font-family: @text-code;
150 color: @grey3;
150 color: @grey3;
151 }
151 }
152
152
153 // Emphasis & misc
153 // Emphasis & misc
154 // -------------------------
154 // -------------------------
155
155
156 small,
156 small,
157 .small {
157 .small {
158 font-size: 75%;
158 font-size: 75%;
159 font-weight: normal;
159 font-weight: normal;
160 line-height: 1em;
160 line-height: 1em;
161 }
161 }
162
162
163 mark,
163 mark,
164 .mark {
164 .mark {
165 background-color: @rclightblue;
165 background-color: @rclightblue;
166 padding: .2em;
166 padding: .2em;
167 }
167 }
168
168
169 // Alignment
169 // Alignment
170 .text-left { text-align: left; }
170 .text-left { text-align: left; }
171 .text-right { text-align: right; }
171 .text-right { text-align: right; }
172 .text-center { text-align: center; }
172 .text-center { text-align: center; }
173 .text-justify { text-align: justify; }
173 .text-justify { text-align: justify; }
174 .text-nowrap { white-space: nowrap; }
174 .text-nowrap { white-space: nowrap; }
175
175
176 // Transformation
176 // Transformation
177 .text-lowercase { text-transform: lowercase; }
177 .text-lowercase { text-transform: lowercase; }
178 .text-uppercase { text-transform: uppercase; }
178 .text-uppercase { text-transform: uppercase; }
179 .text-capitalize { text-transform: capitalize; }
179 .text-capitalize { text-transform: capitalize; }
180
180
181 // Contextual colors
181 // Contextual colors
182 .text-muted {
182 .text-muted {
183 color: @grey4;
183 color: @grey4;
184 }
184 }
185 .text-primary {
185 .text-primary {
186 color: @rcblue;
186 color: @rcblue;
187 }
187 }
188 .text-success {
188 .text-success {
189 color: @alert1;
189 color: @alert1;
190 }
190 }
191 .text-info {
191 .text-info {
192 color: @alert4;
192 color: @alert4;
193 }
193 }
194 .text-warning {
194 .text-warning {
195 color: @alert3;
195 color: @alert3;
196 }
196 }
197 .text-danger {
197 .text-danger {
198 color: @alert2;
198 color: @alert2;
199 }
199 }
200
200
201 // Contextual backgrounds
201 // Contextual backgrounds
202 .bg-primary {
202 .bg-primary {
203 background-color: white;
203 background-color: white;
204 }
204 }
205 .bg-success {
205 .bg-success {
206 background-color: @alert1;
206 background-color: @alert1;
207 }
207 }
208 .bg-info {
208 .bg-info {
209 background-color: @alert4;
209 background-color: @alert4;
210 }
210 }
211 .bg-warning {
211 .bg-warning {
212 background-color: @alert3;
212 background-color: @alert3;
213 }
213 }
214 .bg-danger {
214 .bg-danger {
215 background-color: @alert2;
215 background-color: @alert2;
216 }
216 }
217
217
218
218
219 // Page header
219 // Page header
220 // -------------------------
220 // -------------------------
221
221
222 .page-header {
222 .page-header {
223 margin: @pagepadding 0 @textmargin;
223 margin: @pagepadding 0 @textmargin;
224 border-bottom: @border-thickness solid @grey5;
224 border-bottom: @border-thickness solid @grey5;
225 }
225 }
226
226
227 .title {
227 .title {
228 clear: both;
228 clear: both;
229 float: left;
229 float: left;
230 width: 100%;
230 width: 100%;
231 margin: @pagepadding 0 @pagepadding;
231 margin: @pagepadding 0 @pagepadding;
232
232
233 .breadcrumbs{
233 .breadcrumbs{
234 float: left;
234 float: left;
235 clear: both;
235 clear: both;
236 width: 700px;
236 width: 700px;
237 margin: 0;
237 margin: 0;
238
238
239 .q_filter_box {
239 .q_filter_box {
240 margin-right: @padding;
240 margin-right: @padding;
241 }
241 }
242 }
242 }
243
243
244 h1 a {
244 h1 a {
245 color: @rcblue;
245 color: @rcblue;
246 }
246 }
247
247
248 input{
248 input{
249 margin-right: @padding;
249 margin-right: @padding;
250 }
250 }
251
251
252 h5, .h5 {
252 h5, .h5 {
253 color: @grey1;
253 color: @grey1;
254 margin-bottom: @space;
254 margin-bottom: @space;
255
255
256 span {
256 span {
257 display: inline-block;
257 display: inline-block;
258 }
258 }
259 }
259 }
260
260
261 p {
261 p {
262 margin-bottom: 0;
262 margin-bottom: 0;
263 }
263 }
264
264
265 .links {
265 .links {
266 float: right;
266 float: right;
267 display: inline;
267 display: inline;
268 margin: 0;
268 margin: 0;
269 padding-left: 0;
269 padding-left: 0;
270 list-style: none;
270 list-style: none;
271 text-align: right;
271 text-align: right;
272
272
273 li:before { content: none; }
273 li:before { content: none; }
274 li { float: right; }
274 li { float: right; }
275 a {
275 a {
276 display: inline-block;
276 display: inline-block;
277 margin-left: @textmargin/2;
277 margin-left: @textmargin/2;
278 }
278 }
279 }
279 }
280
280
281 .title-content {
281 .title-content {
282 float: left;
282 float: left;
283 margin: 0;
283 margin: 0;
284 padding: 0;
284 padding: 0;
285
285
286 & + .breadcrumbs {
286 & + .breadcrumbs {
287 margin-top: @padding;
287 margin-top: @padding;
288 }
288 }
289
289
290 & + .links {
290 & + .links {
291 margin-top: -@button-padding;
291 margin-top: -@button-padding;
292
292
293 & + .breadcrumbs {
293 & + .breadcrumbs {
294 margin-top: @padding;
294 margin-top: @padding;
295 }
295 }
296 }
296 }
297 }
297 }
298
298
299 .title-main {
299 .title-main {
300 font-size: @repo-title-fontsize;
300 font-size: @repo-title-fontsize;
301 }
301 }
302
302
303 .title-description {
303 .title-description {
304 margin-top: .5em;
304 margin-top: .5em;
305 }
305 }
306
306
307 .q_filter_box {
307 .q_filter_box {
308 width: 200px;
308 width: 200px;
309 }
309 }
310
310
311 }
311 }
312
312
313 #readme .title {
313 #readme .title {
314 text-transform: none;
314 text-transform: none;
315 }
315 }
316
316
317 // Lists
317 // Lists
318 // -------------------------
318 // -------------------------
319
319
320 // Unordered and Ordered lists
320 // Unordered and Ordered lists
321 ul,
321 ul,
322 ol {
322 ol {
323 margin-top: 0;
323 margin-top: 0;
324 margin-bottom: @textmargin;
324 margin-bottom: @textmargin;
325 ul,
325 ul,
326 ol {
326 ol {
327 margin-bottom: 0;
327 margin-bottom: 0;
328 }
328 }
329 }
329 }
330
330
331 li {
331 li {
332 line-height: 2em;
332 line-height: 2em;
333 }
333 }
334
334
335 ul li {
335 ul li {
336 position: relative;
336 position: relative;
337 display: block;
337 display: block;
338 list-style-type: none;
338 list-style-type: none;
339
339
340 &:before {
340 &:before {
341 content: "\2014\00A0";
341 content: "\2014\00A0";
342 position: absolute;
342 position: absolute;
343 top: 0;
343 top: 0;
344 left: -1.25em;
344 left: -1.25em;
345 }
345 }
346
346
347 p:first-child {
347 p:first-child {
348 display:inline;
348 display:inline;
349 }
349 }
350 }
350 }
351
351
352 // List options
352 // List options
353
353
354 // Unstyled keeps list items block level, just removes default browser padding and list-style
354 // Unstyled keeps list items block level, just removes default browser padding and list-style
355 .list-unstyled {
355 .list-unstyled {
356 padding-left: 0;
356 padding-left: 0;
357 list-style: none;
357 list-style: none;
358 li:before { content: none; }
358 li:before { content: none; }
359 }
359 }
360
360
361 // Inline turns list items into inline-block
361 // Inline turns list items into inline-block
362 .list-inline {
362 .list-inline {
363 .list-unstyled();
363 .list-unstyled();
364 margin-left: -5px;
364 margin-left: -5px;
365
365
366 > li {
366 > li {
367 display: inline-block;
367 display: inline-block;
368 padding-left: 5px;
368 padding-left: 5px;
369 padding-right: 5px;
369 padding-right: 5px;
370 }
370 }
371 }
371 }
372
372
373 // Description Lists
373 // Description Lists
374
374
375 dl {
375 dl {
376 margin-top: 0; // Remove browser default
376 margin-top: 0; // Remove browser default
377 margin-bottom: @textmargin;
377 margin-bottom: @textmargin;
378 }
378 }
379
379
380 dt,
380 dt,
381 dd {
381 dd {
382 line-height: 1.4em;
382 line-height: 1.4em;
383 }
383 }
384
384
385 dt {
385 dt {
386 margin: @textmargin 0 0 0;
386 margin: @textmargin 0 0 0;
387 font-family: @text-bold;
387 font-family: @text-bold;
388 }
388 }
389
389
390 dd {
390 dd {
391 margin-left: 0; // Undo browser default
391 margin-left: 0; // Undo browser default
392 }
392 }
393
393
394 // Horizontal description lists
394 // Horizontal description lists
395 // Defaults to being stacked without any of the below styles applied, until the
395 // Defaults to being stacked without any of the below styles applied, until the
396 // grid breakpoint is reached (default of ~768px).
396 // grid breakpoint is reached (default of ~768px).
397 // These are used in forms as well; see style guide.
397 // These are used in forms as well; see style guide.
398 // TODO: lisa: These should really not be used in forms.
398 // TODO: lisa: These should really not be used in forms.
399
399
400 .dl-horizontal {
400 .dl-horizontal {
401
401
402 overflow: hidden;
402 overflow: hidden;
403 margin-bottom: @space;
403 margin-bottom: @space;
404
404
405 dt, dd {
405 dt, dd {
406 float: left;
406 float: left;
407 margin: 5px 0 5px 0;
407 margin: 5px 0 5px 0;
408 }
408 }
409
409
410 dt {
410 dt {
411 clear: left;
411 clear: left;
412 width: @label-width - @form-vertical-margin;
412 width: @label-width - @form-vertical-margin;
413 }
413 }
414
414
415 dd {
415 dd {
416 &:extend(.clearfix all); // Clear the floated `dt` if an empty `dd` is present
416 &:extend(.clearfix all); // Clear the floated `dt` if an empty `dd` is present
417 margin-left: @form-vertical-margin;
417 margin-left: @form-vertical-margin;
418 max-width: @form-max-width - (@label-width - @form-vertical-margin) - @form-vertical-margin;
418 max-width: @form-max-width - (@label-width - @form-vertical-margin) - @form-vertical-margin;
419 }
419 }
420
420
421 pre {
421 pre {
422 margin: 0;
422 margin: 0;
423 }
423 }
424
424
425 &.settings {
425 &.settings {
426 dt {
426 dt {
427 text-align: left;
427 text-align: left;
428 }
428 }
429 }
429 }
430
430
431 @media (min-width: 768px) {
431 @media (min-width: 768px) {
432 dt {
432 dt {
433 float: left;
433 float: left;
434 width: 180px;
434 width: 180px;
435 clear: left;
435 clear: left;
436 text-align: right;
436 text-align: right;
437 }
437 }
438 dd {
438 dd {
439 margin-left: 20px;
439 margin-left: 20px;
440 }
440 }
441 }
441 }
442 }
442 }
443
443
444
444
445 // Misc
445 // Misc
446 // -------------------------
446 // -------------------------
447
447
448 // Abbreviations and acronyms
448 // Abbreviations and acronyms
449 abbr[title],
449 abbr[title],
450 abbr[data-original-title] {
450 abbr[data-original-title] {
451 cursor: help;
451 cursor: help;
452 border-bottom: @border-thickness dotted @grey4;
452 border-bottom: @border-thickness dotted @grey4;
453 }
453 }
454 .initialism {
454 .initialism {
455 font-size: 90%;
455 font-size: 90%;
456 text-transform: uppercase;
456 text-transform: uppercase;
457 }
457 }
458
458
459 // Blockquotes
459 // Blockquotes
460 blockquote {
460 blockquote {
461 padding: 1em 2em;
461 padding: 1em 2em;
462 margin: 0 0 2em;
462 margin: 0 0 2em;
463 font-size: @basefontsize;
463 font-size: @basefontsize;
464 border-left: 2px solid @grey6;
464 border-left: 2px solid @grey6;
465
465
466 p,
466 p,
467 ul,
467 ul,
468 ol {
468 ol {
469 &:last-child {
469 &:last-child {
470 margin-bottom: 0;
470 margin-bottom: 0;
471 }
471 }
472 }
472 }
473
473
474 footer,
474 footer,
475 small,
475 small,
476 .small {
476 .small {
477 display: block;
477 display: block;
478 font-size: 80%;
478 font-size: 80%;
479
479
480 &:before {
480 &:before {
481 content: '\2014 \00A0'; // em dash, nbsp
481 content: '\2014 \00A0'; // em dash, nbsp
482 }
482 }
483 }
483 }
484 }
484 }
485
485
486 // Opposite alignment of blockquote
486 // Opposite alignment of blockquote
487 //
487 //
488 .blockquote-reverse,
488 .blockquote-reverse,
489 blockquote.pull-right {
489 blockquote.pull-right {
490 padding-right: 15px;
490 padding-right: 15px;
491 padding-left: 0;
491 padding-left: 0;
492 border-right: 5px solid @grey6;
492 border-right: 5px solid @grey6;
493 border-left: 0;
493 border-left: 0;
494 text-align: right;
494 text-align: right;
495
495
496 // Account for citation
496 // Account for citation
497 footer,
497 footer,
498 small,
498 small,
499 .small {
499 .small {
500 &:before { content: ''; }
500 &:before { content: ''; }
501 &:after {
501 &:after {
502 content: '\00A0 \2014'; // nbsp, em dash
502 content: '\00A0 \2014'; // nbsp, em dash
503 }
503 }
504 }
504 }
505 }
505 }
506
506
507 // Addresses
507 // Addresses
508 address {
508 address {
509 margin-bottom: 2em;
509 margin-bottom: 2em;
510 font-style: normal;
510 font-style: normal;
511 line-height: 1.8em;
511 line-height: 1.8em;
512 }
512 }
513
513
514 .error-message {
514 .error-message {
515 display: block;
515 display: block;
516 margin: @padding/3 0;
516 margin: @padding/3 0;
517 color: @alert2;
517 color: @alert2;
518 }
518 }
519
519
520 .issue-tracker-link {
520 .issue-tracker-link {
521 color: @rcblue;
521 color: @rcblue;
522 }
522 }
523
523
524 .info_text{
524 .info_text{
525 font-size: @basefontsize;
525 font-size: @basefontsize;
526 color: @grey4;
526 color: @grey4;
527 font-family: @text-regular;
527 font-family: @text-regular;
528 }
528 }
529
529
530 // help block text
530 // help block text
531 .help-block {
531 .help-block {
532 display: block;
532 display: block;
533 margin: 0 0 @padding;
533 margin: 0 0 @padding;
534 color: @grey4;
534 color: @grey4;
535 font-family: @text-light;
535 font-family: @text-light;
536 &.pre-formatting {
536 &.pre-formatting {
537 white-space: pre;
537 white-space: pre;
538 }
538 }
539 }
539 }
540
540
541 .error-message {
541 .error-message {
542 display: block;
542 display: block;
543 margin: @padding/3 0;
543 margin: @padding/3 0;
544 color: @alert2;
544 color: @alert2;
545 }
545 }
@@ -1,137 +1,138 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: "proximanovaregular","Proxima Nova Regular", "Proxima Nova", sans-serif;
56 @text-regular: "proximanovaregular","Proxima Nova Regular", "Proxima Nova", sans-serif;
57 @text-italic: "proximanovaitalic","Proxima Nova Italic", "Proxima Nova", sans-serif;
57 @text-italic: "proximanovaitalic","Proxima Nova Italic", "Proxima Nova", sans-serif;
58 @text-bold: "proximanovabold","Proxima Nova Bold", "Proxima Nova", sans-serif;
58 @text-bold: "proximanovabold","Proxima Nova Bold", "Proxima Nova", sans-serif;
59 @text-semibold: "proximanovasemibold","Proxima Nova Semibold", "Proxima Nova", sans-serif;
59 @text-semibold: "proximanovasemibold","Proxima Nova Semibold", "Proxima Nova", sans-serif;
60 @text-bold-italic: "proximanovabolditalic","Proxima Nova Bold Italic", "Proxima Nova", sans-serif;
60 @text-bold-italic: "proximanovabolditalic","Proxima Nova Bold Italic", "Proxima Nova", sans-serif;
61 @text-code: "Lucida Console", Menlo, Monaco, monospace;
61 @text-light: @text-regular;
62 @text-light: @text-regular;
62 @text-light-italic: @text-italic;
63 @text-light-italic: @text-italic;
63 // Used for .close buttons
64 // Used for .close buttons
64 @text-bootstrap: "Helvetica Neue", Helvetica, Arial, sans-serif;
65 @text-bootstrap: "Helvetica Neue", Helvetica, Arial, sans-serif;
65
66
66 @panel-title: @basefontsize;
67 @panel-title: @basefontsize;
67 @panel-footer: @basefontsize;
68 @panel-footer: @basefontsize;
68
69
69 // BORDERS
70 // BORDERS
70 @border-thickness: 1px;
71 @border-thickness: 1px;
71 @border-thickness-buttons: 1px;
72 @border-thickness-buttons: 1px;
72 @border-thickness-tags: 1px;
73 @border-thickness-tags: 1px;
73 @border-radius: 2px;
74 @border-radius: 2px;
74 @border-default-color: @grey5;
75 @border-default-color: @grey5;
75 @border-highlight-color: @grey4;
76 @border-highlight-color: @grey4;
76
77
77 // SPACING
78 // SPACING
78 @contentpadding: 15px; //padding on left and right of pages
79 @contentpadding: 15px; //padding on left and right of pages
79 @pagepadding: 40px; //padding on top and bottom of pages
80 @pagepadding: 40px; //padding on top and bottom of pages
80 @menupadding: 12px; //padding for sidebar and content
81 @menupadding: 12px; //padding for sidebar and content
81 @sidebarpadding: 15px; //spacing between sections
82 @sidebarpadding: 15px; //spacing between sections
82 @space: 40px; //spacing between sections
83 @space: 40px; //spacing between sections
83 @padding: 15px; //padding inside modules
84 @padding: 15px; //padding inside modules
84 @textmargin: 20px; //spacing below headers
85 @textmargin: 20px; //spacing below headers
85 @header-padding: 20px;
86 @header-padding: 20px;
86 @panel-padding: @padding;
87 @panel-padding: @padding;
87 @gravatar-size: 16px; // height/width of gravatar w/o border
88 @gravatar-size: 16px; // height/width of gravatar w/o border
88
89
89 // ADMIN
90 // ADMIN
90 @form-max-width: 750px;
91 @form-max-width: 750px;
91
92
92 // FORMS (new)
93 // FORMS (new)
93 @border-thickness-inputs: 1px;
94 @border-thickness-inputs: 1px;
94 @input-padding: @button-padding; //needs to match button padding
95 @input-padding: @button-padding; //needs to match button padding
95 // TODO: johbo: Needed for working computation of paddings around labels etc.
96 // TODO: johbo: Needed for working computation of paddings around labels etc.
96 // Expected to be replaced once we are done with the form refactoring.
97 // Expected to be replaced once we are done with the form refactoring.
97 @input-padding-px: 12px;
98 @input-padding-px: 12px;
98 @legend-width: 220px;
99 @legend-width: 220px;
99 @form-vertical-margin: 20px;
100 @form-vertical-margin: 20px;
100 @form-check-width: 20px;
101 @form-check-width: 20px;
101 @form-radio-width: 10px;
102 @form-radio-width: 10px;
102 @form-textcolor: @grey3;
103 @form-textcolor: @grey3;
103
104
104 // FORMS
105 // FORMS
105 @label-width: 220px;
106 @label-width: 220px;
106 //TODO: lisa: Eventually we don't need both of these; remove
107 //TODO: lisa: Eventually we don't need both of these; remove
107 // label-width when legend-width is no longer used
108 // label-width when legend-width is no longer used
108
109
109 @input-border-thickness: @border-thickness;
110 @input-border-thickness: @border-thickness;
110 @medium-inline-input-width: 115px;
111 @medium-inline-input-width: 115px;
111 @input-description-minwidth: 300px;
112 @input-description-minwidth: 300px;
112 @label2-width: 200px;
113 @label2-width: 200px;
113 @checkboxes-width: 420px;
114 @checkboxes-width: 420px;
114 @label-summary-minwidth: 80px;
115 @label-summary-minwidth: 80px;
115 @search-form-width: 400px;
116 @search-form-width: 400px;
116 @fields-input-m: 400px;
117 @fields-input-m: 400px;
117 @fields-input-l: 800px;
118 @fields-input-l: 800px;
118
119
119 // BUTTONS
120 // BUTTONS
120 @button-padding: .9em;
121 @button-padding: .9em;
121
122
122 // DEFAULT WIDTHS
123 // DEFAULT WIDTHS
123 @wrapper-maxwidth: 1200px;
124 @wrapper-maxwidth: 1200px;
124 @sidebar-width: 145px;
125 @sidebar-width: 145px;
125 @sidebar-all-width: @sidebar-width + 2 * @sidebarpadding;
126 @sidebar-all-width: @sidebar-width + 2 * @sidebarpadding;
126 @sidebar-small-width: 100px;
127 @sidebar-small-width: 100px;
127 @sidebar-small-all-width: @sidebar-small-width + 2 * @sidebarpadding;
128 @sidebar-small-all-width: @sidebar-small-width + 2 * @sidebarpadding;
128 @texteditor-width: 660px;
129 @texteditor-width: 660px;
129 @maincontent-maxwidth: 940px;
130 @maincontent-maxwidth: 940px;
130 @pullrequest-width: 1025px;
131 @pullrequest-width: 1025px;
131 @summary-menu-stats-width: 200px;
132 @summary-menu-stats-width: 200px;
132
133
133 // SCREEN WIDTHS
134 // SCREEN WIDTHS
134 @screen-sm-min: 320px;
135 @screen-sm-min: 320px;
135
136
136 // For Bootstrap
137 // For Bootstrap
137 @panel-border-radius: @border-radius;
138 @panel-border-radius: @border-radius;
@@ -1,352 +1,354 b''
1 ## -*- coding: utf-8 -*-
1 ## -*- coding: utf-8 -*-
2
2
3 <%inherit file="/base/base.mako"/>
3 <%inherit file="/base/base.mako"/>
4 <%namespace name="diff_block" file="/changeset/diff_block.mako"/>
4 <%namespace name="diff_block" file="/changeset/diff_block.mako"/>
5
5
6 <%def name="title()">
6 <%def name="title()">
7 ${_('%s Commit') % c.repo_name} - ${h.show_id(c.commit)}
7 ${_('%s Commit') % c.repo_name} - ${h.show_id(c.commit)}
8 %if c.rhodecode_name:
8 %if c.rhodecode_name:
9 &middot; ${h.branding(c.rhodecode_name)}
9 &middot; ${h.branding(c.rhodecode_name)}
10 %endif
10 %endif
11 </%def>
11 </%def>
12
12
13 <%def name="menu_bar_nav()">
13 <%def name="menu_bar_nav()">
14 ${self.menu_items(active='repositories')}
14 ${self.menu_items(active='repositories')}
15 </%def>
15 </%def>
16
16
17 <%def name="menu_bar_subnav()">
17 <%def name="menu_bar_subnav()">
18 ${self.repo_menu(active='changelog')}
18 ${self.repo_menu(active='changelog')}
19 </%def>
19 </%def>
20
20
21 <%def name="main()">
21 <%def name="main()">
22 <script>
22 <script>
23 // TODO: marcink switch this to pyroutes
23 // TODO: marcink switch this to pyroutes
24 AJAX_COMMENT_DELETE_URL = "${h.route_path('repo_commit_comment_delete',repo_name=c.repo_name,commit_id=c.commit.raw_id,comment_id='__COMMENT_ID__')}";
24 AJAX_COMMENT_DELETE_URL = "${h.route_path('repo_commit_comment_delete',repo_name=c.repo_name,commit_id=c.commit.raw_id,comment_id='__COMMENT_ID__')}";
25 templateContext.commit_data.commit_id = "${c.commit.raw_id}";
25 templateContext.commit_data.commit_id = "${c.commit.raw_id}";
26 </script>
26 </script>
27 <div class="box">
27 <div class="box">
28 <div class="title">
28 <div class="title">
29 ${self.repo_page_title(c.rhodecode_db_repo)}
29 ${self.repo_page_title(c.rhodecode_db_repo)}
30 </div>
30 </div>
31
31
32 <div id="changeset_compare_view_content" class="summary changeset">
32 <div id="changeset_compare_view_content" class="summary changeset">
33 <div class="summary-detail">
33 <div class="summary-detail">
34 <div class="summary-detail-header">
34 <div class="summary-detail-header">
35 <span class="breadcrumbs files_location">
35 <div class="breadcrumbs files_location">
36 <h4>${_('Commit')}
36 <h4>
37 ${_('Commit')}
38
37 <code>
39 <code>
38 ${h.show_id(c.commit)}
40 ${h.show_id(c.commit)}
41 </code>
39 <i class="tooltip icon-clipboard clipboard-action" data-clipboard-text="${c.commit.raw_id}" title="${_('Copy the full commit id')}"></i>
42 <i class="tooltip icon-clipboard clipboard-action" data-clipboard-text="${c.commit.raw_id}" title="${_('Copy the full commit id')}"></i>
40 % if hasattr(c.commit, 'phase'):
43 % if hasattr(c.commit, 'phase'):
41 <span class="tag phase-${c.commit.phase} tooltip" title="${_('Commit phase')}">${c.commit.phase}</span>
44 <span class="tag phase-${c.commit.phase} tooltip" title="${_('Commit phase')}">${c.commit.phase}</span>
42 % endif
45 % endif
43
46
44 ## obsolete commits
47 ## obsolete commits
45 % if hasattr(c.commit, 'obsolete'):
48 % if hasattr(c.commit, 'obsolete'):
46 % if c.commit.obsolete:
49 % if c.commit.obsolete:
47 <span class="tag obsolete-${c.commit.obsolete} tooltip" title="${_('Evolve State')}">${_('obsolete')}</span>
50 <span class="tag obsolete-${c.commit.obsolete} tooltip" title="${_('Evolve State')}">${_('obsolete')}</span>
48 % endif
51 % endif
49 % endif
52 % endif
50
53
51 ## hidden commits
54 ## hidden commits
52 % if hasattr(c.commit, 'hidden'):
55 % if hasattr(c.commit, 'hidden'):
53 % if c.commit.hidden:
56 % if c.commit.hidden:
54 <span class="tag hidden-${c.commit.hidden} tooltip" title="${_('Evolve State')}">${_('hidden')}</span>
57 <span class="tag hidden-${c.commit.hidden} tooltip" title="${_('Evolve State')}">${_('hidden')}</span>
55 % endif
58 % endif
56 % endif
59 % endif
60 </h4>
57
61
58 </code>
62 </div>
59 </h4>
60 </span>
61 <div class="pull-right">
63 <div class="pull-right">
62 <span id="parent_link">
64 <span id="parent_link">
63 <a href="#parentCommit" title="${_('Parent Commit')}">${_('Parent')}</a>
65 <a href="#parentCommit" title="${_('Parent Commit')}">${_('Parent')}</a>
64 </span>
66 </span>
65 |
67 |
66 <span id="child_link">
68 <span id="child_link">
67 <a href="#childCommit" title="${_('Child Commit')}">${_('Child')}</a>
69 <a href="#childCommit" title="${_('Child Commit')}">${_('Child')}</a>
68 </span>
70 </span>
69 </div>
71 </div>
70 </div>
72 </div>
71
73
72 <div class="fieldset">
74 <div class="fieldset">
73 <div class="left-label">
75 <div class="left-label">
74 ${_('Description')}:
76 ${_('Description')}:
75 </div>
77 </div>
76 <div class="right-content">
78 <div class="right-content">
77 <div id="trimmed_message_box" class="commit">${h.urlify_commit_message(c.commit.message,c.repo_name)}</div>
79 <div id="trimmed_message_box" class="commit">${h.urlify_commit_message(c.commit.message,c.repo_name)}</div>
78 <div id="message_expand" style="display:none;">
80 <div id="message_expand" style="display:none;">
79 ${_('Expand')}
81 ${_('Expand')}
80 </div>
82 </div>
81 </div>
83 </div>
82 </div>
84 </div>
83
85
84 %if c.statuses:
86 %if c.statuses:
85 <div class="fieldset">
87 <div class="fieldset">
86 <div class="left-label">
88 <div class="left-label">
87 ${_('Commit status')}:
89 ${_('Commit status')}:
88 </div>
90 </div>
89 <div class="right-content">
91 <div class="right-content">
90 <div class="changeset-status-ico">
92 <div class="changeset-status-ico">
91 <div class="${'flag_status %s' % c.statuses[0]} pull-left"></div>
93 <div class="${'flag_status %s' % c.statuses[0]} pull-left"></div>
92 </div>
94 </div>
93 <div title="${_('Commit status')}" class="changeset-status-lbl">[${h.commit_status_lbl(c.statuses[0])}]</div>
95 <div title="${_('Commit status')}" class="changeset-status-lbl">[${h.commit_status_lbl(c.statuses[0])}]</div>
94 </div>
96 </div>
95 </div>
97 </div>
96 %endif
98 %endif
97
99
98 <div class="fieldset">
100 <div class="fieldset">
99 <div class="left-label">
101 <div class="left-label">
100 ${_('References')}:
102 ${_('References')}:
101 </div>
103 </div>
102 <div class="right-content">
104 <div class="right-content">
103 <div class="tags">
105 <div class="tags">
104
106
105 %if c.commit.merge:
107 %if c.commit.merge:
106 <span class="mergetag tag">
108 <span class="mergetag tag">
107 <i class="icon-merge"></i>${_('merge')}
109 <i class="icon-merge"></i>${_('merge')}
108 </span>
110 </span>
109 %endif
111 %endif
110
112
111 %if h.is_hg(c.rhodecode_repo):
113 %if h.is_hg(c.rhodecode_repo):
112 %for book in c.commit.bookmarks:
114 %for book in c.commit.bookmarks:
113 <span class="booktag tag" title="${h.tooltip(_('Bookmark %s') % book)}">
115 <span class="booktag tag" title="${h.tooltip(_('Bookmark %s') % book)}">
114 <a href="${h.route_path('repo_files:default_path',repo_name=c.repo_name,commit_id=c.commit.raw_id,_query=dict(at=book))}"><i class="icon-bookmark"></i>${h.shorter(book)}</a>
116 <a href="${h.route_path('repo_files:default_path',repo_name=c.repo_name,commit_id=c.commit.raw_id,_query=dict(at=book))}"><i class="icon-bookmark"></i>${h.shorter(book)}</a>
115 </span>
117 </span>
116 %endfor
118 %endfor
117 %endif
119 %endif
118
120
119 %for tag in c.commit.tags:
121 %for tag in c.commit.tags:
120 <span class="tagtag tag" title="${h.tooltip(_('Tag %s') % tag)}">
122 <span class="tagtag tag" title="${h.tooltip(_('Tag %s') % tag)}">
121 <a href="${h.route_path('repo_files:default_path',repo_name=c.repo_name,commit_id=c.commit.raw_id,_query=dict(at=tag))}"><i class="icon-tag"></i>${tag}</a>
123 <a href="${h.route_path('repo_files:default_path',repo_name=c.repo_name,commit_id=c.commit.raw_id,_query=dict(at=tag))}"><i class="icon-tag"></i>${tag}</a>
122 </span>
124 </span>
123 %endfor
125 %endfor
124
126
125 %if c.commit.branch:
127 %if c.commit.branch:
126 <span class="branchtag tag" title="${h.tooltip(_('Branch %s') % c.commit.branch)}">
128 <span class="branchtag tag" title="${h.tooltip(_('Branch %s') % c.commit.branch)}">
127 <a href="${h.route_path('repo_files:default_path',repo_name=c.repo_name,commit_id=c.commit.raw_id,_query=dict(at=c.commit.branch))}"><i class="icon-code-fork"></i>${h.shorter(c.commit.branch)}</a>
129 <a href="${h.route_path('repo_files:default_path',repo_name=c.repo_name,commit_id=c.commit.raw_id,_query=dict(at=c.commit.branch))}"><i class="icon-code-fork"></i>${h.shorter(c.commit.branch)}</a>
128 </span>
130 </span>
129 %endif
131 %endif
130 </div>
132 </div>
131 </div>
133 </div>
132 </div>
134 </div>
133
135
134 <div class="fieldset">
136 <div class="fieldset">
135 <div class="left-label">
137 <div class="left-label">
136 ${_('Diff options')}:
138 ${_('Diff options')}:
137 </div>
139 </div>
138 <div class="right-content">
140 <div class="right-content">
139 <div class="diff-actions">
141 <div class="diff-actions">
140 <a href="${h.route_path('repo_commit_raw',repo_name=c.repo_name,commit_id=c.commit.raw_id)}" class="tooltip" title="${h.tooltip(_('Raw diff'))}">
142 <a href="${h.route_path('repo_commit_raw',repo_name=c.repo_name,commit_id=c.commit.raw_id)}" class="tooltip" title="${h.tooltip(_('Raw diff'))}">
141 ${_('Raw Diff')}
143 ${_('Raw Diff')}
142 </a>
144 </a>
143 |
145 |
144 <a href="${h.route_path('repo_commit_patch',repo_name=c.repo_name,commit_id=c.commit.raw_id)}" class="tooltip" title="${h.tooltip(_('Patch diff'))}">
146 <a href="${h.route_path('repo_commit_patch',repo_name=c.repo_name,commit_id=c.commit.raw_id)}" class="tooltip" title="${h.tooltip(_('Patch diff'))}">
145 ${_('Patch Diff')}
147 ${_('Patch Diff')}
146 </a>
148 </a>
147 |
149 |
148 <a href="${h.route_path('repo_commit_download',repo_name=c.repo_name,commit_id=c.commit.raw_id,_query=dict(diff='download'))}" class="tooltip" title="${h.tooltip(_('Download diff'))}">
150 <a href="${h.route_path('repo_commit_download',repo_name=c.repo_name,commit_id=c.commit.raw_id,_query=dict(diff='download'))}" class="tooltip" title="${h.tooltip(_('Download diff'))}">
149 ${_('Download Diff')}
151 ${_('Download Diff')}
150 </a>
152 </a>
151 |
153 |
152 ${c.ignorews_url(request)}
154 ${c.ignorews_url(request)}
153 |
155 |
154 ${c.context_url(request)}
156 ${c.context_url(request)}
155 </div>
157 </div>
156 </div>
158 </div>
157 </div>
159 </div>
158
160
159 <div class="fieldset">
161 <div class="fieldset">
160 <div class="left-label">
162 <div class="left-label">
161 ${_('Comments')}:
163 ${_('Comments')}:
162 </div>
164 </div>
163 <div class="right-content">
165 <div class="right-content">
164 <div class="comments-number">
166 <div class="comments-number">
165 %if c.comments:
167 %if c.comments:
166 <a href="#comments">${_ungettext("%d Commit comment", "%d Commit comments", len(c.comments)) % len(c.comments)}</a>,
168 <a href="#comments">${_ungettext("%d Commit comment", "%d Commit comments", len(c.comments)) % len(c.comments)}</a>,
167 %else:
169 %else:
168 ${_ungettext("%d Commit comment", "%d Commit comments", len(c.comments)) % len(c.comments)}
170 ${_ungettext("%d Commit comment", "%d Commit comments", len(c.comments)) % len(c.comments)}
169 %endif
171 %endif
170 %if c.inline_cnt:
172 %if c.inline_cnt:
171 <a href="#" onclick="return Rhodecode.comments.nextComment();" id="inline-comments-counter">${_ungettext("%d Inline Comment", "%d Inline Comments", c.inline_cnt) % c.inline_cnt}</a>
173 <a href="#" onclick="return Rhodecode.comments.nextComment();" id="inline-comments-counter">${_ungettext("%d Inline Comment", "%d Inline Comments", c.inline_cnt) % c.inline_cnt}</a>
172 %else:
174 %else:
173 ${_ungettext("%d Inline Comment", "%d Inline Comments", c.inline_cnt) % c.inline_cnt}
175 ${_ungettext("%d Inline Comment", "%d Inline Comments", c.inline_cnt) % c.inline_cnt}
174 %endif
176 %endif
175 </div>
177 </div>
176 </div>
178 </div>
177 </div>
179 </div>
178
180
179 <div class="fieldset">
181 <div class="fieldset">
180 <div class="left-label">
182 <div class="left-label">
181 ${_('Unresolved TODOs')}:
183 ${_('Unresolved TODOs')}:
182 </div>
184 </div>
183 <div class="right-content">
185 <div class="right-content">
184 <div class="comments-number">
186 <div class="comments-number">
185 % if c.unresolved_comments:
187 % if c.unresolved_comments:
186 % for co in c.unresolved_comments:
188 % for co in c.unresolved_comments:
187 <a class="permalink" href="#comment-${co.comment_id}" onclick="Rhodecode.comments.scrollToComment($('#comment-${co.comment_id}'))"> #${co.comment_id}</a>${'' if loop.last else ','}
189 <a class="permalink" href="#comment-${co.comment_id}" onclick="Rhodecode.comments.scrollToComment($('#comment-${co.comment_id}'))"> #${co.comment_id}</a>${'' if loop.last else ','}
188 % endfor
190 % endfor
189 % else:
191 % else:
190 ${_('There are no unresolved TODOs')}
192 ${_('There are no unresolved TODOs')}
191 % endif
193 % endif
192 </div>
194 </div>
193 </div>
195 </div>
194 </div>
196 </div>
195
197
196 </div> <!-- end summary-detail -->
198 </div> <!-- end summary-detail -->
197
199
198 <div id="commit-stats" class="sidebar-right">
200 <div id="commit-stats" class="sidebar-right">
199 <div class="summary-detail-header">
201 <div class="summary-detail-header">
200 <h4 class="item">
202 <h4 class="item">
201 ${_('Author')}
203 ${_('Author')}
202 </h4>
204 </h4>
203 </div>
205 </div>
204 <div class="sidebar-right-content">
206 <div class="sidebar-right-content">
205 ${self.gravatar_with_user(c.commit.author)}
207 ${self.gravatar_with_user(c.commit.author)}
206 <div class="user-inline-data">- ${h.age_component(c.commit.date)}</div>
208 <div class="user-inline-data">- ${h.age_component(c.commit.date)}</div>
207 </div>
209 </div>
208 </div><!-- end sidebar -->
210 </div><!-- end sidebar -->
209 </div> <!-- end summary -->
211 </div> <!-- end summary -->
210 <div class="cs_files">
212 <div class="cs_files">
211 <%namespace name="cbdiffs" file="/codeblocks/diffs.mako"/>
213 <%namespace name="cbdiffs" file="/codeblocks/diffs.mako"/>
212 ${cbdiffs.render_diffset_menu()}
214 ${cbdiffs.render_diffset_menu()}
213 ${cbdiffs.render_diffset(
215 ${cbdiffs.render_diffset(
214 c.changes[c.commit.raw_id], commit=c.commit, use_comments=True)}
216 c.changes[c.commit.raw_id], commit=c.commit, use_comments=True)}
215 </div>
217 </div>
216
218
217 ## template for inline comment form
219 ## template for inline comment form
218 <%namespace name="comment" file="/changeset/changeset_file_comment.mako"/>
220 <%namespace name="comment" file="/changeset/changeset_file_comment.mako"/>
219
221
220 ## render comments
222 ## render comments
221 ${comment.generate_comments(c.comments)}
223 ${comment.generate_comments(c.comments)}
222
224
223 ## main comment form and it status
225 ## main comment form and it status
224 ${comment.comments(h.route_path('repo_commit_comment_create', repo_name=c.repo_name, commit_id=c.commit.raw_id),
226 ${comment.comments(h.route_path('repo_commit_comment_create', repo_name=c.repo_name, commit_id=c.commit.raw_id),
225 h.commit_status(c.rhodecode_db_repo, c.commit.raw_id))}
227 h.commit_status(c.rhodecode_db_repo, c.commit.raw_id))}
226 </div>
228 </div>
227
229
228 ## FORM FOR MAKING JS ACTION AS CHANGESET COMMENTS
230 ## FORM FOR MAKING JS ACTION AS CHANGESET COMMENTS
229 <script type="text/javascript">
231 <script type="text/javascript">
230
232
231 $(document).ready(function() {
233 $(document).ready(function() {
232
234
233 var boxmax = parseInt($('#trimmed_message_box').css('max-height'), 10);
235 var boxmax = parseInt($('#trimmed_message_box').css('max-height'), 10);
234 if($('#trimmed_message_box').height() === boxmax){
236 if($('#trimmed_message_box').height() === boxmax){
235 $('#message_expand').show();
237 $('#message_expand').show();
236 }
238 }
237
239
238 $('#message_expand').on('click', function(e){
240 $('#message_expand').on('click', function(e){
239 $('#trimmed_message_box').css('max-height', 'none');
241 $('#trimmed_message_box').css('max-height', 'none');
240 $(this).hide();
242 $(this).hide();
241 });
243 });
242
244
243 $('.show-inline-comments').on('click', function(e){
245 $('.show-inline-comments').on('click', function(e){
244 var boxid = $(this).attr('data-comment-id');
246 var boxid = $(this).attr('data-comment-id');
245 var button = $(this);
247 var button = $(this);
246
248
247 if(button.hasClass("comments-visible")) {
249 if(button.hasClass("comments-visible")) {
248 $('#{0} .inline-comments'.format(boxid)).each(function(index){
250 $('#{0} .inline-comments'.format(boxid)).each(function(index){
249 $(this).hide();
251 $(this).hide();
250 });
252 });
251 button.removeClass("comments-visible");
253 button.removeClass("comments-visible");
252 } else {
254 } else {
253 $('#{0} .inline-comments'.format(boxid)).each(function(index){
255 $('#{0} .inline-comments'.format(boxid)).each(function(index){
254 $(this).show();
256 $(this).show();
255 });
257 });
256 button.addClass("comments-visible");
258 button.addClass("comments-visible");
257 }
259 }
258 });
260 });
259
261
260
262
261 // next links
263 // next links
262 $('#child_link').on('click', function(e){
264 $('#child_link').on('click', function(e){
263 // fetch via ajax what is going to be the next link, if we have
265 // fetch via ajax what is going to be the next link, if we have
264 // >1 links show them to user to choose
266 // >1 links show them to user to choose
265 if(!$('#child_link').hasClass('disabled')){
267 if(!$('#child_link').hasClass('disabled')){
266 $.ajax({
268 $.ajax({
267 url: '${h.route_path('repo_commit_children',repo_name=c.repo_name, commit_id=c.commit.raw_id)}',
269 url: '${h.route_path('repo_commit_children',repo_name=c.repo_name, commit_id=c.commit.raw_id)}',
268 success: function(data) {
270 success: function(data) {
269 if(data.results.length === 0){
271 if(data.results.length === 0){
270 $('#child_link').html("${_('No Child Commits')}").addClass('disabled');
272 $('#child_link').html("${_('No Child Commits')}").addClass('disabled');
271 }
273 }
272 if(data.results.length === 1){
274 if(data.results.length === 1){
273 var commit = data.results[0];
275 var commit = data.results[0];
274 window.location = pyroutes.url('repo_commit', {'repo_name': '${c.repo_name}','commit_id': commit.raw_id});
276 window.location = pyroutes.url('repo_commit', {'repo_name': '${c.repo_name}','commit_id': commit.raw_id});
275 }
277 }
276 else if(data.results.length === 2){
278 else if(data.results.length === 2){
277 $('#child_link').addClass('disabled');
279 $('#child_link').addClass('disabled');
278 $('#child_link').addClass('double');
280 $('#child_link').addClass('double');
279 var _html = '';
281 var _html = '';
280 _html +='<a title="__title__" href="__url__">__rev__</a> '
282 _html +='<a title="__title__" href="__url__">__rev__</a> '
281 .replace('__rev__','r{0}:{1}'.format(data.results[0].revision, data.results[0].raw_id.substr(0,6)))
283 .replace('__rev__','r{0}:{1}'.format(data.results[0].revision, data.results[0].raw_id.substr(0,6)))
282 .replace('__title__', data.results[0].message)
284 .replace('__title__', data.results[0].message)
283 .replace('__url__', pyroutes.url('repo_commit', {'repo_name': '${c.repo_name}','commit_id': data.results[0].raw_id}));
285 .replace('__url__', pyroutes.url('repo_commit', {'repo_name': '${c.repo_name}','commit_id': data.results[0].raw_id}));
284 _html +=' | ';
286 _html +=' | ';
285 _html +='<a title="__title__" href="__url__">__rev__</a> '
287 _html +='<a title="__title__" href="__url__">__rev__</a> '
286 .replace('__rev__','r{0}:{1}'.format(data.results[1].revision, data.results[1].raw_id.substr(0,6)))
288 .replace('__rev__','r{0}:{1}'.format(data.results[1].revision, data.results[1].raw_id.substr(0,6)))
287 .replace('__title__', data.results[1].message)
289 .replace('__title__', data.results[1].message)
288 .replace('__url__', pyroutes.url('repo_commit', {'repo_name': '${c.repo_name}','commit_id': data.results[1].raw_id}));
290 .replace('__url__', pyroutes.url('repo_commit', {'repo_name': '${c.repo_name}','commit_id': data.results[1].raw_id}));
289 $('#child_link').html(_html);
291 $('#child_link').html(_html);
290 }
292 }
291 }
293 }
292 });
294 });
293 e.preventDefault();
295 e.preventDefault();
294 }
296 }
295 });
297 });
296
298
297 // prev links
299 // prev links
298 $('#parent_link').on('click', function(e){
300 $('#parent_link').on('click', function(e){
299 // fetch via ajax what is going to be the next link, if we have
301 // fetch via ajax what is going to be the next link, if we have
300 // >1 links show them to user to choose
302 // >1 links show them to user to choose
301 if(!$('#parent_link').hasClass('disabled')){
303 if(!$('#parent_link').hasClass('disabled')){
302 $.ajax({
304 $.ajax({
303 url: '${h.route_path("repo_commit_parents",repo_name=c.repo_name, commit_id=c.commit.raw_id)}',
305 url: '${h.route_path("repo_commit_parents",repo_name=c.repo_name, commit_id=c.commit.raw_id)}',
304 success: function(data) {
306 success: function(data) {
305 if(data.results.length === 0){
307 if(data.results.length === 0){
306 $('#parent_link').html('${_('No Parent Commits')}').addClass('disabled');
308 $('#parent_link').html('${_('No Parent Commits')}').addClass('disabled');
307 }
309 }
308 if(data.results.length === 1){
310 if(data.results.length === 1){
309 var commit = data.results[0];
311 var commit = data.results[0];
310 window.location = pyroutes.url('repo_commit', {'repo_name': '${c.repo_name}','commit_id': commit.raw_id});
312 window.location = pyroutes.url('repo_commit', {'repo_name': '${c.repo_name}','commit_id': commit.raw_id});
311 }
313 }
312 else if(data.results.length === 2){
314 else if(data.results.length === 2){
313 $('#parent_link').addClass('disabled');
315 $('#parent_link').addClass('disabled');
314 $('#parent_link').addClass('double');
316 $('#parent_link').addClass('double');
315 var _html = '';
317 var _html = '';
316 _html +='<a title="__title__" href="__url__">Parent __rev__</a>'
318 _html +='<a title="__title__" href="__url__">Parent __rev__</a>'
317 .replace('__rev__','r{0}:{1}'.format(data.results[0].revision, data.results[0].raw_id.substr(0,6)))
319 .replace('__rev__','r{0}:{1}'.format(data.results[0].revision, data.results[0].raw_id.substr(0,6)))
318 .replace('__title__', data.results[0].message)
320 .replace('__title__', data.results[0].message)
319 .replace('__url__', pyroutes.url('repo_commit', {'repo_name': '${c.repo_name}','commit_id': data.results[0].raw_id}));
321 .replace('__url__', pyroutes.url('repo_commit', {'repo_name': '${c.repo_name}','commit_id': data.results[0].raw_id}));
320 _html +=' | ';
322 _html +=' | ';
321 _html +='<a title="__title__" href="__url__">Parent __rev__</a>'
323 _html +='<a title="__title__" href="__url__">Parent __rev__</a>'
322 .replace('__rev__','r{0}:{1}'.format(data.results[1].revision, data.results[1].raw_id.substr(0,6)))
324 .replace('__rev__','r{0}:{1}'.format(data.results[1].revision, data.results[1].raw_id.substr(0,6)))
323 .replace('__title__', data.results[1].message)
325 .replace('__title__', data.results[1].message)
324 .replace('__url__', pyroutes.url('repo_commit', {'repo_name': '${c.repo_name}','commit_id': data.results[1].raw_id}));
326 .replace('__url__', pyroutes.url('repo_commit', {'repo_name': '${c.repo_name}','commit_id': data.results[1].raw_id}));
325 $('#parent_link').html(_html);
327 $('#parent_link').html(_html);
326 }
328 }
327 }
329 }
328 });
330 });
329 e.preventDefault();
331 e.preventDefault();
330 }
332 }
331 });
333 });
332
334
333 if (location.hash) {
335 if (location.hash) {
334 var result = splitDelimitedHash(location.hash);
336 var result = splitDelimitedHash(location.hash);
335 var line = $('html').find(result.loc);
337 var line = $('html').find(result.loc);
336 if (line.length > 0){
338 if (line.length > 0){
337 offsetScroll(line, 70);
339 offsetScroll(line, 70);
338 }
340 }
339 }
341 }
340
342
341 // browse tree @ revision
343 // browse tree @ revision
342 $('#files_link').on('click', function(e){
344 $('#files_link').on('click', function(e){
343 window.location = '${h.route_path('repo_files:default_path',repo_name=c.repo_name, commit_id=c.commit.raw_id)}';
345 window.location = '${h.route_path('repo_files:default_path',repo_name=c.repo_name, commit_id=c.commit.raw_id)}';
344 e.preventDefault();
346 e.preventDefault();
345 });
347 });
346
348
347 // inject comments into their proper positions
349 // inject comments into their proper positions
348 var file_comments = $('.inline-comment-placeholder');
350 var file_comments = $('.inline-comment-placeholder');
349 })
351 })
350 </script>
352 </script>
351
353
352 </%def>
354 </%def>
General Comments 0
You need to be logged in to leave comments. Login now