0001-armentieres-create-theme-68232.patch
static/armentieres/_custom.scss | ||
---|---|---|
1 |
// |
|
2 |
// Typo |
|
3 |
// |
|
4 |
h1 { |
|
5 |
font-size: $fz-1; |
|
6 |
} |
|
7 | ||
8 |
h2 { |
|
9 |
font-size: $fz-2; |
|
10 |
} |
|
11 | ||
12 |
h3 { |
|
13 |
font-size: $fz-3; |
|
14 |
} |
|
15 | ||
16 |
// |
|
17 |
// Header |
|
18 |
// |
|
19 |
div#top { |
|
20 |
display: flex; |
|
21 |
align-items: center; |
|
22 |
flex-wrap: wrap; |
|
23 |
padding-top: 0.5rem; |
|
24 |
} |
|
25 | ||
26 |
#logo{ |
|
27 |
@media($max-mobile-viewport) { |
|
28 |
padding-left: 0; |
|
29 |
} |
|
30 |
} |
|
31 | ||
32 |
nav.site-nav { |
|
33 |
flex-grow: 1; |
|
34 |
@media($max-mobile-viewport) { |
|
35 |
position: absolute; |
|
36 |
top: 75px; |
|
37 |
right: 10px; |
|
38 |
} |
|
39 |
} |
|
40 | ||
41 |
div.gru-nav > ul { |
|
42 |
margin: 0; |
|
43 |
@media($max-mobile-viewport) { |
|
44 |
position: fixed; |
|
45 |
top: 0; |
|
46 |
right: 0; |
|
47 |
z-index: 10; |
|
48 |
} |
|
49 | ||
50 |
li a { |
|
51 |
font-weight: normal; |
|
52 |
padding: 30px 20px; |
|
53 |
} |
|
54 |
} |
|
55 | ||
56 |
div#header { |
|
57 |
max-width: calc(#{$width} + 100px); |
|
58 |
} |
|
59 | ||
60 |
div#toplinks { |
|
61 |
position: static; |
|
62 |
padding-top: 1rem; |
|
63 |
padding-bottom: 1rem; |
|
64 |
padding-right: 2rem; |
|
65 |
@media($max-mobile-viewport) { |
|
66 |
flex-grow: 1; |
|
67 |
padding-right: 50px; |
|
68 |
} |
|
69 | ||
70 |
.logged-in, .login { |
|
71 |
display: flex; |
|
72 |
flex-wrap: wrap; |
|
73 | ||
74 |
@media($max-mobile-viewport) { |
|
75 |
span { |
|
76 |
display: flex; |
|
77 |
a:first-child { |
|
78 |
flex-grow: 1; |
|
79 |
} |
|
80 |
} |
|
81 |
} |
|
82 | ||
83 |
> * { |
|
84 |
margin: 0 .3rem; |
|
85 |
} |
|
86 | ||
87 |
a { |
|
88 |
color: black; |
|
89 |
font-weight: bold; |
|
90 |
display: flex; |
|
91 |
align-items: center; |
|
92 |
} |
|
93 | ||
94 |
&::before { |
|
95 |
font-family: FontAwesome; |
|
96 |
content: ''; |
|
97 |
width: 1.5rem; |
|
98 |
height: 1.5rem; |
|
99 |
background: url('/assets/profile:icon'); |
|
100 |
margin-right: 0.5rem; |
|
101 |
} |
|
102 |
} |
|
103 |
} |
|
104 | ||
105 |
.arm-page-header { |
|
106 |
background: url('/assets/page-header:background'); |
|
107 |
background-size: cover; |
|
108 |
background-position: center; |
|
109 |
color: white; |
|
110 | ||
111 |
h1 { |
|
112 |
font-size: 48em / $base-font; |
|
113 |
} |
|
114 | ||
115 |
&--default { |
|
116 |
display: none; |
|
117 |
} |
|
118 | ||
119 |
&--content { |
|
120 |
max-width: $width; |
|
121 |
clear: both; |
|
122 |
margin: 0 auto; |
|
123 |
.cell { |
|
124 |
padding: 3rem 0rem; |
|
125 |
} |
|
126 |
} |
|
127 | ||
128 |
@media ($max-mobile-viewport) { |
|
129 |
display: none; |
|
130 |
} |
|
131 |
} |
|
132 | ||
133 |
// |
|
134 |
// Content |
|
135 |
// |
|
136 |
div#main-content-wrapper { |
|
137 |
max-width: none; |
|
138 |
} |
|
139 | ||
140 |
.central-content { |
|
141 |
max-width: $width; |
|
142 |
clear: both; |
|
143 |
margin: 0 auto; |
|
144 |
} |
|
145 | ||
146 |
@media ($min-desktop-viewport) { |
|
147 |
.gru-content { |
|
148 |
padding: 3rem 0.5rem 0 0.5rem; |
|
149 |
} |
|
150 |
} |
|
151 | ||
152 |
div#sidebar { |
|
153 |
div.cell h2:first-child { |
|
154 |
display: flex; |
|
155 |
align-items: center; |
|
156 |
&::after { |
|
157 |
content: ''; |
|
158 |
background: $gray-light; |
|
159 |
flex-grow: 1; |
|
160 |
height: 1px; |
|
161 |
margin-left: 8px; |
|
162 |
} |
|
163 |
} |
|
164 | ||
165 |
@media($max-mobile-viewport) { |
|
166 |
display: none; |
|
167 |
} |
|
168 |
} |
|
169 | ||
170 |
.errornotice, .warningnotice, .successnotice, .infonotice { |
|
171 |
border-radius: $border-radius; |
|
172 |
padding-top: 2rem; |
|
173 |
padding-bottom: 2rem; |
|
174 |
padding-right: 2rem; |
|
175 | ||
176 |
a { |
|
177 |
color: $red; |
|
178 |
} |
|
179 | ||
180 |
&::before { |
|
181 |
top: calc(50% - 1rem); |
|
182 |
} |
|
183 |
} |
|
184 | ||
185 |
.errornotice, .warningnotice { |
|
186 |
&::before { |
|
187 |
color: $red; |
|
188 |
} |
|
189 |
} |
|
190 | ||
191 |
.infonotice::before { |
|
192 |
color: $yellow; |
|
193 |
} |
|
194 | ||
195 |
.successnotice::before { |
|
196 |
color: $green-dark; |
|
197 |
} |
|
198 | ||
199 |
// |
|
200 |
// Footer |
|
201 |
// |
|
202 |
#footer-wrapper { |
|
203 |
padding: 3rem 1.5rem 0; |
|
204 |
#footer { |
|
205 |
position: relative; |
|
206 |
} |
|
207 | ||
208 |
.back-top { |
|
209 |
position: absolute; |
|
210 |
top: -4.5rem; |
|
211 |
right: 0rem; |
|
212 |
background: $primary-color; |
|
213 |
border-radius: $border-radius; |
|
214 |
padding: 0.5rem; |
|
215 | ||
216 |
&--link { |
|
217 |
color: black; |
|
218 | ||
219 |
&:hover { |
|
220 |
text-decoration: none; |
|
221 |
} |
|
222 | ||
223 |
&::before { |
|
224 |
font-size: 1.8rem; |
|
225 |
} |
|
226 |
} |
|
227 | ||
228 |
&--link-label { |
|
229 |
display: none; |
|
230 |
} |
|
231 | ||
232 | ||
233 |
} |
|
234 | ||
235 |
} |
|
236 | ||
237 |
.arm-footer-bottom { |
|
238 |
padding: 1rem; |
|
239 |
background: $gray; |
|
240 |
color: white; |
|
241 |
.menu-cell { |
|
242 |
text-align: center; |
|
243 |
li { |
|
244 |
display: inline-block; |
|
245 |
border: none; |
|
246 |
a { |
|
247 |
border-radius: 0; |
|
248 |
border: none; |
|
249 |
color: white; |
|
250 |
padding: 0.5rem 2rem; |
|
251 |
&:hover { |
|
252 |
color: white; |
|
253 |
} |
|
254 |
} |
|
255 |
} |
|
256 |
} |
|
257 |
} |
|
258 | ||
259 |
// |
|
260 |
// Cells |
|
261 |
// |
|
262 |
%title { |
|
263 |
margin-top: 1rem; |
|
264 |
margin-bottom: 1rem; |
|
265 |
} |
|
266 | ||
267 |
%cell-links-list { |
|
268 |
> li > a { |
|
269 |
padding-left: 0; |
|
270 |
&:hover { |
|
271 |
text-decoration: underline; |
|
272 |
} |
|
273 |
} |
|
274 |
} |
|
275 | ||
276 |
div#rub_service div.category, |
|
277 |
div#services, |
|
278 |
div#account-management, |
|
279 |
#columns div.cell:not(.pk-button,.pk-big-button) div.links-list, |
|
280 |
#columns div.menucell, |
|
281 |
div.wcsformcell, |
|
282 |
div.wcsformsofcategorycell, |
|
283 |
div.wcscurrentdraftscell, |
|
284 |
div.wcscurrentformscell { |
|
285 |
.links-list > ul > li { |
|
286 |
margin: 0.5rem; |
|
287 |
border: 1px solid $gray-light; |
|
288 |
border-radius: $border-radius; |
|
289 |
padding: 0rem 0.8rem; |
|
290 |
a { |
|
291 |
text-decoration: none; |
|
292 |
} |
|
293 | ||
294 |
&:hover { |
|
295 |
box-shadow: $widget-focus-box-shadow; |
|
296 |
} |
|
297 | ||
298 |
&.required-authentication, &.external-link { |
|
299 |
a{ |
|
300 |
padding-right: 2rem; |
|
301 | ||
302 |
&::after { |
|
303 |
content: ''; |
|
304 |
height: 1.3rem; |
|
305 |
width: 1.3rem; |
|
306 |
position: absolute; |
|
307 |
right: 0.7rem; |
|
308 |
} |
|
309 |
} |
|
310 |
} |
|
311 | ||
312 |
&.required-authentication a::after { |
|
313 |
background: center / contain no-repeat url('/assets/authentication-required:icon'); |
|
314 |
} |
|
315 | ||
316 |
&.external-link a::after { |
|
317 |
background: center / contain no-repeat url('/assets/external-link:icon'); |
|
318 |
} |
|
319 | ||
320 |
&:not(:last-child) { |
|
321 |
border-bottom: 1px solid $gray-light; |
|
322 |
} |
|
323 |
} |
|
324 |
} |
|
325 | ||
326 |
.gru-content div.cell { |
|
327 |
h2:first-child:not(:only-child) { |
|
328 |
border-bottom-left-radius: $border-radius; |
|
329 |
border-bottom-right-radius: $border-radius; |
|
330 |
} |
|
331 | ||
332 |
&.foldable > div > h2:first-child { |
|
333 |
background: $yellow; |
|
334 |
border: $yellow solid $gray; |
|
335 |
color: black; |
|
336 |
display: flex; |
|
337 |
font-size: $fz-3; |
|
338 |
align-items: center; |
|
339 |
height: 4rem; |
|
340 |
margin: 0; |
|
341 |
padding-left: 1rem; |
|
342 |
text-transform: none; |
|
343 | ||
344 |
&:hover { |
|
345 |
box-shadow: $widget-focus-box-shadow; |
|
346 |
} |
|
347 |
} |
|
348 | ||
349 |
&.folded > div > h2:first-child { |
|
350 |
border: 1px solid $gray; |
|
351 |
background: transparent; |
|
352 | ||
353 |
&::after { |
|
354 |
color: $gray; |
|
355 |
} |
|
356 |
} |
|
357 | ||
358 |
&.has-asset-picture { |
|
359 |
position: relative; |
|
360 | ||
361 |
> div > h2:first-child { |
|
362 |
padding-left: 6rem; |
|
363 |
} |
|
364 | ||
365 |
picture { |
|
366 |
height: 3rem; |
|
367 |
left: 1.5rem; |
|
368 |
position: absolute; |
|
369 |
top: 0rem; |
|
370 |
width: 3rem; |
|
371 |
} |
|
372 |
} |
|
373 |
} |
|
374 | ||
375 |
.gru-content div.searchcell form { |
|
376 |
padding: 0; |
|
377 |
input[type="search"] { |
|
378 |
background: $gray-xlight; |
|
379 |
border: none; |
|
380 | ||
381 |
&:focus { |
|
382 |
background: $gray-xlight; |
|
383 |
border: none; |
|
384 |
} |
|
385 |
} |
|
386 | ||
387 |
.combo-search--button { |
|
388 |
display: none; |
|
389 |
} |
|
390 |
} |
|
391 | ||
392 |
.gru-content div.tracking-code-input-cell { |
|
393 |
background: right / cover url('/assets/tracking-code-input:background'); |
|
394 |
div.wcs-tracking-code-input { |
|
395 |
padding: 1rem; |
|
396 |
div { |
|
397 |
padding: 0; |
|
398 | ||
399 |
form { |
|
400 |
display: flex; |
|
401 |
flex-wrap: wrap; |
|
402 |
input { |
|
403 |
flex-grow: 99999; |
|
404 |
width: 11rem; |
|
405 |
} |
|
406 |
button { |
|
407 |
flex-grow: 1; |
|
408 |
@extend %black-button; |
|
409 |
margin-right: 0; |
|
410 |
min-width: 10rem; |
|
411 | ||
412 |
&, &:hover { |
|
413 |
color: $primary-color; |
|
414 |
} |
|
415 |
} |
|
416 |
} |
|
417 |
} |
|
418 |
} |
|
419 | ||
420 |
h2:first-child { |
|
421 |
color: black; |
|
422 |
background: transparent; |
|
423 |
font-size: $fz-3; |
|
424 |
margin-bottom: 0.5rem; |
|
425 |
} |
|
426 | ||
427 |
} |
|
428 | ||
429 |
/// WCS |
|
430 |
.arm-form-header { |
|
431 |
background: $gray-xlight; |
|
432 | ||
433 |
&--content { |
|
434 |
max-width: $width; |
|
435 |
margin: 0 auto; |
|
436 |
padding: 1.5rem 0 2.5rem 0; |
|
437 |
} |
|
438 | ||
439 |
&--title { |
|
440 |
margin: 0; |
|
441 |
font-weight: 900; |
|
442 |
max-width: 35rem; |
|
443 |
text-transform: uppercase; |
|
444 |
font-size: 48em / $base-font; |
|
445 |
} |
|
446 | ||
447 |
&--description { |
|
448 |
@media($max-mobile-viewport) { |
|
449 |
display: none; |
|
450 |
} |
|
451 |
margin-top: 4rem; |
|
452 |
} |
|
453 | ||
454 |
@media($max-mobile-viewport) { |
|
455 |
&--content { |
|
456 |
padding: 1rem 0 1rem 0; |
|
457 |
} |
|
458 | ||
459 |
&--title { |
|
460 |
font-size: $fz-1; |
|
461 |
text-align: center; |
|
462 |
} |
|
463 |
} |
|
464 |
} |
|
465 | ||
466 |
div#tracking-code { |
|
467 |
padding: 1rem; |
|
468 |
background: right / cover url('/assets/tracking-code:background'); |
|
469 |
border-radius: $border-radius; |
|
470 |
.tracking-code-part { |
|
471 |
display: flex; |
|
472 |
flex-direction: column; |
|
473 |
h3 { |
|
474 |
background: transparent; |
|
475 |
color: black; |
|
476 |
text-transform: none; |
|
477 |
text-align: center; |
|
478 |
margin-bottom: 0.7rem; |
|
479 |
} |
|
480 |
a { |
|
481 |
text-align:center; |
|
482 |
background: white; |
|
483 |
padding: 0.5rem; |
|
484 |
border-radius: $border-radius; |
|
485 |
font-weight: bold; |
|
486 |
} |
|
487 |
} |
|
488 | ||
489 |
form[action="removedraft"] { |
|
490 |
display: flex; |
|
491 |
justify-content: center; |
|
492 |
.form-discard-draft { |
|
493 |
@extend %black-button; |
|
494 |
margin-right: 0; |
|
495 |
&, &:hover { |
|
496 |
color: $primary-color; |
|
497 |
} |
|
498 |
} |
|
499 |
} |
|
500 |
} |
|
501 | ||
502 |
%button { |
|
503 |
box-shadow: none; |
|
504 |
padding: 0.5rem 1.5rem; |
|
505 |
} |
|
506 | ||
507 |
%black-button { |
|
508 |
@extend %button; |
|
509 |
background: black; |
|
510 |
&:hover { |
|
511 |
background: black; |
|
512 |
} |
|
513 |
} |
|
514 | ||
515 |
%gray-button { |
|
516 |
background: $gray-xlight; |
|
517 |
color: black; |
|
518 |
&:hover { |
|
519 |
background: $gray-xlight; |
|
520 |
} |
|
521 |
} |
|
522 | ||
523 |
.wcs-step { |
|
524 |
border-radius: 0; |
|
525 |
align-items: center; |
|
526 |
&.current { |
|
527 |
font-weight: normal; |
|
528 |
} |
|
529 | ||
530 |
&--marker-nb { |
|
531 |
font-weight: bold; |
|
532 |
} |
|
533 | ||
534 |
@media($min-desktop-viewport) { |
|
535 |
&.step-before::after { |
|
536 |
content: '\f00c'; |
|
537 |
font-family: FontAwesome; |
|
538 |
margin: 0rem 1rem; |
|
539 |
color: $green; |
|
540 |
} |
|
541 |
} |
|
542 |
} |
|
543 | ||
544 |
.field { |
|
545 |
&--label .required { |
|
546 |
margin: 0; |
|
547 |
color: $primary-color; |
|
548 |
} |
|
549 |
} |
|
550 | ||
551 |
input[type=radio], input[type=checkbox] { |
|
552 |
&:focus { |
|
553 |
box-shadow: none; |
|
554 |
} |
|
555 |
} |
|
556 | ||
557 |
input[readonly], select[readonly], textarea[readonly] { |
|
558 |
border-radius: $widget-border-radius; |
|
559 |
background: transparent; |
|
560 |
border: $widget-border; |
|
561 |
} |
|
562 | ||
563 |
input::placeholder { |
|
564 |
font-style: italic; |
|
565 |
} |
|
566 | ||
567 |
@mixin form-button-left($symbol) { |
|
568 |
&::before { |
|
569 |
content: $symbol; |
|
570 |
font-family: FontAwesome; |
|
571 |
font-size: 0.7rem; |
|
572 |
margin-right: 1rem; |
|
573 |
} |
|
574 |
} |
|
575 | ||
576 |
@mixin form-button-right($symbol) { |
|
577 |
&::after { |
|
578 |
content: $symbol; |
|
579 |
font-family: FontAwesome; |
|
580 |
font-size: 0.7rem; |
|
581 |
margin-left: 1rem; |
|
582 |
} |
|
583 |
} |
|
584 | ||
585 |
.form-content { |
|
586 |
&--body .buttons.submit { |
|
587 |
.form-next{ |
|
588 |
@include form-button-right('\f054'); |
|
589 |
} |
|
590 | ||
591 |
.form-previous { |
|
592 |
@include form-button-left('\f053'); |
|
593 |
} |
|
594 | ||
595 |
.form-submit { |
|
596 |
@include form-button-left('\f00c'); |
|
597 |
} |
|
598 | ||
599 |
.form-discard, .cancel { |
|
600 |
@include form-button-left('\f00d'); |
|
601 |
} |
|
602 |
} |
|
603 |
} |
|
604 | ||
605 |
div.form-validation div.page { |
|
606 |
border-radius: $border-radius; |
|
607 |
} |
|
608 | ||
609 |
.back-home-button { |
|
610 |
display: flex; |
|
611 |
justify-content: center; |
|
612 |
a { |
|
613 |
@extend %button; |
|
614 |
&::after { |
|
615 |
content: '\f0e2'; |
|
616 |
font-family: FontAwesome; |
|
617 |
margin-left: 1rem; |
|
618 |
} |
|
619 |
} |
|
620 |
} |
|
621 | ||
622 |
/// |
|
623 |
/// Custom classes |
|
624 |
/// |
|
625 |
.arm-salmon { |
|
626 |
color: $salmon; |
|
627 |
} |
|
628 | ||
629 |
@mixin custom-background-cell($background, $button-color) { |
|
630 |
border: 1px solid transparent; |
|
631 |
background: right / cover no-repeat url($background); |
|
632 |
.pk-button, .pk-big-button { |
|
633 |
@extend %black-button; |
|
634 |
&, &:hover { |
|
635 |
color: $button-color; |
|
636 |
} |
|
637 |
} |
|
638 |
} |
|
639 | ||
640 |
.gru-content .cell { |
|
641 |
&.arm-report { |
|
642 |
@include custom-background-cell('/assets/report:background', $secondary-color); |
|
643 |
font-size: 120%; |
|
644 |
padding: 2rem; |
|
645 |
} |
|
646 | ||
647 |
&.arm-suggest { |
|
648 |
@include custom-background-cell('/assets/suggest:background', $primary-color) |
|
649 |
} |
|
650 | ||
651 |
&.arm-register { |
|
652 |
@include custom-background-cell('/assets/register:background', $primary-color) |
|
653 |
} |
|
654 |
} |
|
655 | ||
656 |
@mixin arm-link-icon($name) { |
|
657 |
& > li.arm-icon-#{$name} { |
|
658 |
display: flex; |
|
659 |
align-items: center; |
|
660 | ||
661 |
&::before { |
|
662 |
content: ''; |
|
663 |
width: 32px; |
|
664 |
height: 32px; |
|
665 |
background: center / cover no-repeat url(img/icon-#{$name}.png); |
|
666 |
margin-right: 0.8rem; |
|
667 |
} |
|
668 |
} |
|
669 |
} |
|
670 | ||
671 |
%cell-links-list { |
|
672 |
@include arm-link-icon('user'); |
|
673 |
} |
static/armentieres/_vars.scss | ||
---|---|---|
1 |
$gray-xlight: #f2f2f2; |
|
2 |
$gray-light: #cccccc; |
|
3 |
$gray: #919191; |
|
4 |
$gray-dark: #333333; |
|
5 |
$salmon: #ec8771; |
|
6 |
$yellow: #ecbe54; |
|
7 |
$yellow-light: #fdf4da; |
|
8 |
$red: #e95f5c; |
|
9 |
$red-light: #fae1db; |
|
10 |
$green-dark: #557c40; |
|
11 |
$green: #9ecf87; |
|
12 |
$green-light: #e6efdf; |
|
13 | ||
14 |
$primary-color: $salmon; |
|
15 |
$secondary-color: $yellow; |
|
16 | ||
17 | ||
18 |
/// Typo |
|
19 |
$font-family: Lato, sans-serif; |
|
20 |
$link-color: $primary-color; |
|
21 |
$link-decoration: none; |
|
22 |
$link-hover-decoration: underline; |
|
23 | ||
24 |
$base-font: 16; |
|
25 |
$fz-1: 30em / $base-font; |
|
26 |
$fz-2: 20em / $base-font; |
|
27 |
$fz-3: 18em / $base-font; |
|
28 |
$fz-4: 14em / $base-font; |
|
29 |
$fz-small: 14em / $base-font; |
|
30 |
$fz-xsmall: 11em / $base-font; |
|
31 | ||
32 |
$font-size: 100% / ( 15 / $base-font ); |
|
33 | ||
34 |
// General |
|
35 |
$border-radius: 5px; |
|
36 |
$notification_error_color: $red-light; |
|
37 |
$notification_warning_color: #e5e5e5; |
|
38 |
$notification_success_color: $green-light; |
|
39 |
$notification_info_color: $yellow-light; |
|
40 |
$sidebar-columns-gutter: 50px; |
|
41 |
$back-top-display: block; |
|
42 |
$back-top-icon-character: "\f062"; |
|
43 | ||
44 |
// Header |
|
45 |
$header-logo-size: 250px 60px; |
|
46 |
$toplinks-style: none; |
|
47 |
$sidebar-width: 30%; |
|
48 |
$nav-after-image: false; |
|
49 | ||
50 |
$nav-color: $gray; |
|
51 |
$nav-submenu-color: $gray; |
|
52 |
$nav-item-hover-background: transparent; |
|
53 |
$nav-item-selected-mode: bottom-border; |
|
54 |
$nav-item-selected-border: $primary-color 3px solid; |
|
55 |
$nav-item-hover-border: $primary-color 3px solid; |
|
56 |
$nav-button-background: transparent; |
|
57 |
$nav-button-color: $primary-color; |
|
58 |
$nav-border-color: transparent; |
|
59 |
$nav-mobile-menu-item-hover-color: black; |
|
60 |
$nav-button-bar-height: 3px; |
|
61 |
$nav-mobile-bottom-bar-item-hover-color: black; |
|
62 |
$nav-mobile-bottom-bar-item-selected-background: $primary-color; |
|
63 |
$nav-mobile-bottom-bar-item-selected-color: black; |
|
64 | ||
65 |
// Title |
|
66 |
$title-padding: 0; |
|
67 |
$title-color: $primary-color; |
|
68 |
$title-font-size: $fz-2; |
|
69 |
$title-transform: uppercase; |
|
70 |
$title-weight: 700; |
|
71 |
$title-background: transparent; |
|
72 | ||
73 |
// Cells |
|
74 |
$cell-border: none; |
|
75 |
$cell-entry-color: black; |
|
76 |
$cell-entry-hover-color: black; |
|
77 |
$cell-entry-font-weight: normal; |
|
78 |
$cell-entry-hover-background: transparent; |
|
79 |
$cell-entry-border: none; |
|
80 | ||
81 |
$widget-focus-box-shadow: 0 0 5px 2px $gray-light; |
|
82 | ||
83 |
// Footer |
|
84 |
$footer-background: $gray-dark; |
|
85 | ||
86 |
// WCS |
|
87 |
$wcs-step-current-label-color: black; |
|
88 |
$wcs-step-color: $gray; |
|
89 |
$wcs-step-border-bottom: 1px solid $gray-light; |
|
90 |
$wcs-step-current-border-bottom: 2px solid $gray-light; |
|
91 |
$form-sidebar-width: 25%; |
|
92 |
$form-sidebar-gutter: 3rem; |
|
93 | ||
94 |
$form-accent-color: $primary-color; |
|
95 |
$widget-border-radius: $border-radius; |
|
96 |
$button-color: black; |
|
97 |
$button-background: $secondary-color; |
|
98 |
$buttons-order: previous (grow), cancel (grow), submit; |
|
99 |
$cancel-button-style: "%gray-button"; |
static/armentieres/config.json | ||
---|---|---|
1 |
{ |
|
2 |
"label": "Armentières", |
|
3 |
"variables": { |
|
4 |
"theme_color": "#e8735f", |
|
5 |
"email_header_asset": "emails:logo" |
|
6 |
}, |
|
7 |
"settings": { |
|
8 |
"combo": { |
|
9 |
"COMBO_ASSET_SLOTS.update": { |
|
10 |
"authentication-required:icon": { "label": "Authentification nécessaire: Icône" }, |
|
11 |
"emails:logo": { "label": "Emails : logo" }, |
|
12 |
"external-link:icon": { "label": "Lien externe: Icône" }, |
|
13 |
"header:logo": { "label": "Têtière : logo" }, |
|
14 |
"page-header:background": { "label": "En-tête de page : fond" }, |
|
15 |
"profile:icon": { "label": "Profil : Icône" }, |
|
16 |
"register:background": { "label": "S'enregistrer: Fond" }, |
|
17 |
"report:background": { "label": "Signaler une anomalie: Fond" }, |
|
18 |
"suggest:background": { "label": "Suggérer une démarche: Fond" }, |
|
19 |
"tracking-code-input:background": { "label": "Entrée du code de suivi: fond" }, |
|
20 |
"tracking-code:background": { "label": "Code de suivi: Fond" } |
|
21 |
} |
|
22 |
} |
|
23 |
} |
|
24 |
} |
static/armentieres/style.scss | ||
---|---|---|
1 |
@charset "UTF-8"; |
|
2 | ||
3 |
@import 'vars'; |
|
4 |
@import '../includes/publik'; |
|
5 |
@import 'custom'; |
templates/variants/armentieres/combo/page_template.html | ||
---|---|---|
1 |
{% extends "combo/page_template.html" %} |
|
2 | ||
3 |
{% block content-pre %} |
|
4 |
<header class="arm-page-header"> |
|
5 |
<div class="arm-page-header--content">{% placeholder "page-header" name="En-tête de la page"%}</div> |
|
6 |
</header> |
|
7 |
{%skeleton_extra_placeholder after-header %} |
|
8 |
{% end_skeleton_extra_placeholder %} |
|
9 |
{% endblock %} |
|
10 | ||
11 |
{% block footer-post %} |
|
12 |
<div class="arm-footer-bottom"> |
|
13 |
{% placeholder "footer-bottom" name="Bas du pied de page" acquired=True optional=True %} |
|
14 |
</div> |
|
15 |
{% endblock %} |
templates/variants/armentieres/theme.html | ||
---|---|---|
1 |
{% extends 'theme.html' %} |
|
2 | ||
3 |
{# move nav #} |
|
4 |
{% block header-content %} |
|
5 |
{% block nav %}{% endblock %} |
|
6 |
{% block top-links %}{% endblock %} |
|
7 |
{% endblock %} |
|
8 | ||
9 |
{% block after-header %} |
|
10 |
{% endblock %} |
|
11 |
templates/variants/armentieres/wcs/base.html | ||
---|---|---|
1 |
{% extends "wcs/base.html" %} |
|
2 | ||
3 |
{% block placeholder-after-header %} |
|
4 |
{% if title %} |
|
5 |
<div class="arm-form-header"> |
|
6 |
<div class="arm-form-header--content"> |
|
7 |
<h1 class="arm-form-header--title">{{ title }}</h1> |
|
8 |
{% if view.formdef.description %} |
|
9 |
<div class="arm-form-header--description"> |
|
10 |
{{ view.formdef.description | safe }} |
|
11 |
</div> |
|
12 |
{% endif %} |
|
13 |
</div> |
|
14 |
</div> |
|
15 |
{% endif %} |
|
16 |
{% endblock %} |
|
17 | ||
18 |
{% block wcs-form-title %}{% endblock %} |
|
19 | ||
0 |
- |