0001-miribel-new-theme-64542.patch
static/miribel/_custom.scss | ||
---|---|---|
1 |
%red-caret { |
|
2 |
padding-left: nth($title-padding, 2) * 2; |
|
3 |
&::before { |
|
4 |
content: "\f0da"; |
|
5 |
font-family: "fontawesome"; |
|
6 |
color: $red; |
|
7 |
font-size: $fz-3; |
|
8 |
position: absolute; |
|
9 |
left: nth($title-padding, 2); |
|
10 |
width: 1em; |
|
11 |
} |
|
12 |
} |
|
13 | ||
14 |
%button { |
|
15 |
display: inline-block; |
|
16 |
text-transform: uppercase; |
|
17 |
font-weight: bold; |
|
18 |
box-shadow: none; |
|
19 | ||
20 |
&:hover { |
|
21 |
box-shadow: none; |
|
22 |
} |
|
23 |
} |
|
24 | ||
25 |
%red-caret-button { |
|
26 |
@extend %button; |
|
27 |
@extend %red-caret; |
|
28 |
margin-right: 0; |
|
29 |
text-align: left; |
|
30 |
&:hover { |
|
31 |
background-color: $blue; |
|
32 |
color: $blue-xdark; |
|
33 |
} |
|
34 |
} |
|
35 | ||
36 |
%gray-button { |
|
37 |
background-color: $gray; |
|
38 |
&:hover { |
|
39 |
background-color: $red; |
|
40 |
} |
|
41 |
} |
|
42 | ||
43 |
%blue-button { |
|
44 |
background-color: $blue; |
|
45 |
} |
|
46 | ||
47 |
%white-button { |
|
48 | ||
49 |
} |
|
50 | ||
51 | ||
52 |
.page-title { |
|
53 |
font-family: $serif; |
|
54 |
font-size: 35em / $base-font; |
|
55 |
line-height: 1; |
|
56 |
font-style: italic; |
|
57 |
@media ($min-desktop-viewport) { |
|
58 |
font-size: 40em / $base-font; |
|
59 |
} |
|
60 |
} |
|
61 | ||
62 |
h1 { |
|
63 |
@extend .page-title; |
|
64 |
} |
|
65 | ||
66 |
h2 { |
|
67 |
@extend h1; |
|
68 |
color: $blue; |
|
69 |
} |
|
70 | ||
71 |
h3 { |
|
72 |
font-size: $fz-3; |
|
73 |
color: $blue; |
|
74 |
text-transform: uppercase; |
|
75 |
} |
|
76 | ||
77 |
h4 { |
|
78 |
font-size: $fz-4; |
|
79 |
text-transform: uppercase; |
|
80 |
} |
|
81 | ||
82 |
label { |
|
83 |
font-weight: bold; |
|
84 |
} |
|
85 | ||
86 |
%title { |
|
87 |
line-height: 1.1; |
|
88 |
} |
|
89 | ||
90 |
#page { |
|
91 |
padding-top: 2em; |
|
92 |
/* big M background */ |
|
93 |
background: url(img/big-m.svg) no-repeat transparent; |
|
94 |
background-size: 500px auto; |
|
95 |
background-position: top -50px center; |
|
96 | ||
97 |
@media ($min-desktop-viewport) { |
|
98 |
background-size: 900px auto; |
|
99 |
background-position: top -50px right -250px; |
|
100 |
} |
|
101 |
} |
|
102 | ||
103 |
// |
|
104 |
// HEADER |
|
105 |
// |
|
106 | ||
107 |
.site-header { |
|
108 |
padding-bottom: 1.5em; |
|
109 |
} |
|
110 | ||
111 |
h1#logo.has-logo { |
|
112 |
@extend .page-title; |
|
113 |
> a { |
|
114 |
min-height: $logo-height; |
|
115 |
min-width: $logo-width; |
|
116 |
max-width: 15em; |
|
117 |
padding-left: calc(#{$logo-width} + 2rem); |
|
118 |
background-size: $logo-width $logo-height; |
|
119 |
@media ($min-desktop-viewport) { |
|
120 |
text-indent: 0; |
|
121 |
} |
|
122 |
} |
|
123 |
} |
|
124 | ||
125 |
#toplinks { |
|
126 |
a { |
|
127 |
color: $font-color; |
|
128 |
font-size: $fz-small; |
|
129 |
text-transform: uppercase; |
|
130 |
text-decoration: underline; |
|
131 | ||
132 |
&:hover { |
|
133 |
color: $red; |
|
134 |
} |
|
135 |
} |
|
136 | ||
137 |
@media ($max-mobile-viewport) { |
|
138 |
max-width: calc(100vw - #{$logo-width} - 2.4em - #{$nav-menu-side}) |
|
139 |
} |
|
140 |
} |
|
141 | ||
142 |
// |
|
143 |
// NAV |
|
144 |
// |
|
145 | ||
146 |
div.gru-nav { |
|
147 |
padding: 0 0.7rem ; |
|
148 |
> ul { |
|
149 |
margin: 0; |
|
150 | ||
151 |
> li { |
|
152 |
> a { |
|
153 |
@extend %button; |
|
154 |
margin-right: 0; |
|
155 |
} |
|
156 |
} |
|
157 |
//subnav |
|
158 |
ul { |
|
159 |
@media ($min-desktop-viewport) { |
|
160 |
// add space between item menu & submenu |
|
161 |
&::before { |
|
162 |
content: ""; |
|
163 |
display: block; |
|
164 |
height: 1em; |
|
165 |
background: transparent; |
|
166 |
} |
|
167 |
li { |
|
168 |
background-color: $blue-xdark; |
|
169 |
&:first-child { |
|
170 |
border-top-left-radius: $button-border-radius; |
|
171 |
border-top-right-radius: $button-border-radius; |
|
172 |
} |
|
173 |
&:last-child { |
|
174 |
border-bottom-left-radius: $button-border-radius; |
|
175 |
border-bottom-right-radius: $button-border-radius; |
|
176 |
} |
|
177 |
} |
|
178 |
} |
|
179 |
li a { |
|
180 |
text-transform: lowercase; |
|
181 |
font-weight: normal; |
|
182 |
text-align: left; |
|
183 |
&:hover { |
|
184 |
background-color: $blue-xdark; |
|
185 |
color: $blue; |
|
186 |
} |
|
187 |
} |
|
188 |
} |
|
189 |
} |
|
190 |
} |
|
191 | ||
192 |
// right-to-left adaptation |
|
193 |
@if $responsive-menu == left-to-right { |
|
194 |
@media ($max-mobile-viewport) { |
|
195 |
body { |
|
196 |
border-left: none; |
|
197 |
} |
|
198 |
div#header { |
|
199 |
width: auto; |
|
200 |
margin-right: calc(#{$nav-menu-side} + 1em); |
|
201 | ||
202 |
h1 { |
|
203 |
padding-left: 0; |
|
204 |
} |
|
205 |
} |
|
206 |
div.gru-nav .gru-nav-button { |
|
207 |
border: 5px solid transparent; |
|
208 |
left: auto; |
|
209 |
right: 0; |
|
210 |
top: 0; |
|
211 | ||
212 |
+ ul { |
|
213 |
transform: translateX(100%); |
|
214 |
left: auto; |
|
215 |
right: 0; |
|
216 |
width: auto; |
|
217 | ||
218 |
a { |
|
219 |
text-align: left; |
|
220 |
} |
|
221 |
ul a { |
|
222 |
padding-top: 0; |
|
223 |
padding-bottom: 0.5em; |
|
224 |
} |
|
225 |
} |
|
226 |
} |
|
227 |
} |
|
228 |
} |
|
229 | ||
230 |
// |
|
231 |
// MAIN |
|
232 |
// |
|
233 | ||
234 |
main { |
|
235 |
padding-top: 1.75em; |
|
236 |
background-color: $blue-fade; |
|
237 |
} |
|
238 | ||
239 |
#main-content { |
|
240 |
padding: 0 0.7rem; |
|
241 |
} |
|
242 | ||
243 |
// |
|
244 |
// cells |
|
245 |
// |
|
246 | ||
247 |
// ajust cell padding on $title-padding |
|
248 |
.column div.a2-block, |
|
249 |
.gru-content div.cell, |
|
250 |
.block { |
|
251 |
& h2 + div, |
|
252 |
.cell--body { |
|
253 |
padding: $title-padding; |
|
254 |
} |
|
255 |
} |
|
256 |
.gru-content .cell.wcsformsofcategorycell { |
|
257 |
h2 ~ div.intro { |
|
258 |
padding: $title-padding; |
|
259 |
} |
|
260 |
} |
|
261 |
.a2-block { |
|
262 |
& form, & p { |
|
263 |
padding: $title-padding; |
|
264 |
margin: 0; |
|
265 |
} |
|
266 |
} |
|
267 |
%cell-links-list { |
|
268 |
& > li { |
|
269 |
> a { |
|
270 |
padding: $title-padding; |
|
271 |
} |
|
272 |
div.description { |
|
273 |
padding-left: nth($title-padding, 2); |
|
274 |
padding-right: nth($title-padding, 2); |
|
275 |
} |
|
276 |
} |
|
277 |
} |
|
278 |
div.textcell { |
|
279 |
p, h1, h2, h3, h4, h5 { |
|
280 |
margin-left: nth($title-padding, 2); |
|
281 |
margin-right: nth($title-padding, 2); |
|
282 |
} |
|
283 |
} |
|
284 |
div.searchcell { |
|
285 |
form { |
|
286 |
padding: $title-padding; |
|
287 |
} |
|
288 |
.search-service-label { |
|
289 |
padding-left: nth($title-padding, 2); |
|
290 |
padding-right: nth($title-padding, 2); |
|
291 |
} |
|
292 |
} |
|
293 | ||
294 |
// default cell |
|
295 |
%cell { |
|
296 |
padding-top: 0.5rem; |
|
297 |
padding-bottom: 0.5rem; |
|
298 |
div.gru-content & { |
|
299 |
margin-bottom: 2rem; |
|
300 |
} |
|
301 |
} |
|
302 | ||
303 |
// cell image |
|
304 |
.cell-img { |
|
305 |
display: block; |
|
306 |
margin-top: nth($title-padding, 1); |
|
307 |
width: $cell-img-width; |
|
308 |
height: $cell-img-height; |
|
309 |
// if img is img tag |
|
310 |
object-fit: scale-down; |
|
311 |
object-position: left center; |
|
312 |
// if img is bg image |
|
313 |
background-repeat: no-repeat; |
|
314 |
background-size: contain; |
|
315 |
background-position: left center; |
|
316 |
} |
|
317 |
.gru-content div.link-list-cell.has-asset-picture, |
|
318 |
.gru-content div.wcsformsofcategorycell.has-asset-picture { |
|
319 |
picture { |
|
320 |
img { |
|
321 |
@extend .cell-img; |
|
322 |
} |
|
323 |
} |
|
324 |
} |
|
325 | ||
326 |
// Foldable option |
|
327 |
div.cell.foldable > div > h2:first-child { |
|
328 |
&:hover { |
|
329 |
color: $blue; |
|
330 |
} |
|
331 |
&::after { |
|
332 |
color: $red; |
|
333 |
} |
|
334 |
} |
|
335 | ||
336 |
// Links list |
|
337 |
%cell-links-list { |
|
338 |
.gru-content & > li:not(.add-more-items) a { |
|
339 |
text-transform: uppercase; |
|
340 |
@extend %red-caret; |
|
341 |
} |
|
342 |
} |
|
343 | ||
344 |
// Custom cells |
|
345 |
.dark-cell { |
|
346 |
.gru-content &.cell { |
|
347 |
background-color: $blue-xdark; |
|
348 |
color: white; |
|
349 |
.links-list { |
|
350 |
ul > li a { |
|
351 |
color: inherit; |
|
352 |
padding-left: nth($title-padding, 2); |
|
353 |
&::before { |
|
354 |
content: ""; |
|
355 |
} |
|
356 |
&:hover { |
|
357 |
color: $blue-light; |
|
358 |
} |
|
359 |
} |
|
360 |
} |
|
361 |
} |
|
362 |
} |
|
363 | ||
364 |
.blue-light-cell { |
|
365 |
.gru-content &.cell { |
|
366 |
background-color: $blue-light; |
|
367 |
border: 1px solid; |
|
368 |
.links-list { |
|
369 |
ul > li { |
|
370 |
border-color: $blue-xdark; |
|
371 |
a { |
|
372 |
&::before { |
|
373 |
color: $blue; |
|
374 |
} |
|
375 |
} |
|
376 |
} |
|
377 |
} |
|
378 |
} |
|
379 |
} |
|
380 | ||
381 |
.link-cell, |
|
382 |
.wcs-form-cell { |
|
383 |
.gru-content &.cell { |
|
384 |
background-color: transparent; |
|
385 |
padding-top: 0; |
|
386 |
padding-bottom: 0; |
|
387 | ||
388 |
a { |
|
389 |
@extend %red-caret-button; |
|
390 |
display: block; |
|
391 |
} |
|
392 |
} |
|
393 |
} |
|
394 | ||
395 |
// link-cell template option |
|
396 |
.btn-with-icon { |
|
397 |
.gru-content &.cell { |
|
398 |
.btn-with-icon { |
|
399 |
&--link { |
|
400 |
padding-left: 0; |
|
401 |
padding-right: 0; |
|
402 |
background-color: $blue; |
|
403 |
&:hover { |
|
404 |
background-color: $blue-xdark; |
|
405 |
color: $blue; |
|
406 |
} |
|
407 |
&::before { |
|
408 |
content: none; |
|
409 |
} |
|
410 |
} |
|
411 |
&--icon { |
|
412 |
@extend .cell-img; |
|
413 |
} |
|
414 |
&--label { |
|
415 |
@extend %title; |
|
416 |
display: block; |
|
417 |
} |
|
418 |
} |
|
419 |
} |
|
420 |
} |
|
421 | ||
422 |
.tracking-code-input-cell { |
|
423 |
.gru-content &.cell { |
|
424 |
background-color: $red; |
|
425 |
color: white; |
|
426 | ||
427 |
input { |
|
428 |
width: 100%; |
|
429 |
margin-bottom: 0.5em; |
|
430 |
} |
|
431 |
button { |
|
432 |
@extend %inverted-button; |
|
433 |
} |
|
434 |
} |
|
435 |
} |
|
436 | ||
437 |
// |
|
438 |
// WCS |
|
439 |
// |
|
440 | ||
441 |
div#tracking-code { |
|
442 |
color: $red; |
|
443 |
h3 { |
|
444 |
padding-bottom: 0; |
|
445 |
padding-left: 0; |
|
446 |
} |
|
447 |
a { |
|
448 |
padding-left: 0; |
|
449 |
text-decoration: underline; |
|
450 |
color: inherit; |
|
451 |
} |
|
452 | ||
453 |
} |
|
454 | ||
455 |
div#rub_service { |
|
456 |
padding: 1rem; |
|
457 |
border-radius: 5px; |
|
458 |
margin-bottom: 4rem !important; |
|
459 |
@media ($min-desktop-viewport) { |
|
460 |
padding: 3rem; |
|
461 |
} |
|
462 |
} |
|
463 | ||
464 |
.wcs-steps { |
|
465 |
font-weight: bold; |
|
466 |
} |
|
467 | ||
468 |
.wcs-step { |
|
469 |
&--label { |
|
470 |
font-size: 1rem; |
|
471 |
} |
|
472 |
&--marker { |
|
473 |
border: 2px solid; |
|
474 |
span { |
|
475 |
@mixin desktop-vertical-steps() { |
|
476 |
transform: translateY(-0.05em); |
|
477 |
} |
|
478 |
} |
|
479 |
} |
|
480 |
&.current { |
|
481 |
.wcs-step--marker { |
|
482 |
border: none; |
|
483 |
} |
|
484 |
} |
|
485 |
} |
|
486 | ||
487 |
.form-content--title { |
|
488 |
@extend .page-title; |
|
489 |
padding-left: 0; |
|
490 |
@media ($min-desktop-viewport) { |
|
491 |
padding-left: calc(#{$form-sidebar-width} + #{$form-sidebar-gutter}); |
|
492 |
background: url(img/vague.svg) no-repeat left bottom 0.5em; |
|
493 |
} |
|
494 |
} |
|
495 | ||
496 |
.widget-with-error .error { |
|
497 |
color: $red; |
|
498 |
background-position: center left; |
|
499 |
} |
|
500 | ||
501 |
.form-content--body .form-previous{ |
|
502 |
@extend %blue-button; |
|
503 |
} |
|
504 | ||
505 |
@media (max-width: $very-small-limit) { |
|
506 |
.form-content--body .buttons { |
|
507 |
column-gap: 1.5rem; |
|
508 |
> * { |
|
509 |
flex: 1 0 30%; |
|
510 |
.content, .content button { |
|
511 |
width: 100%; |
|
512 |
margin-right: 0; |
|
513 |
} |
|
514 |
&.submit-button { |
|
515 |
flex-basis: 100%; |
|
516 |
} |
|
517 |
} |
|
518 |
} |
|
519 |
} |
|
520 | ||
521 |
// |
|
522 |
// PWA |
|
523 |
// |
|
524 | ||
525 |
.pwa-navigation div > ul li a { |
|
526 |
background-size: auto 40%; |
|
527 |
display: flex; |
|
528 |
span { |
|
529 |
font-size: $fz-xsmall; |
|
530 |
margin: auto; |
|
531 |
height: auto; |
|
532 |
} |
|
533 |
} |
|
534 | ||
535 |
// |
|
536 |
// FOOTER |
|
537 |
// |
|
538 | ||
539 |
#footer-wrapper { |
|
540 |
padding-top: 3.5em; |
|
541 |
margin-top: 0; |
|
542 |
position: relative; |
|
543 |
&::before { |
|
544 |
content: ""; |
|
545 |
position: absolute; |
|
546 |
left: 0; |
|
547 |
right: 0; |
|
548 |
bottom: 100%; |
|
549 |
height: 20px; |
|
550 |
background: url(img/vague-footer.svg) repeat-x left bottom; |
|
551 |
background-size: auto 20px; |
|
552 |
} |
|
553 |
} |
|
554 | ||
555 |
#footer .menucell li a { |
|
556 |
color: $font-color; |
|
557 |
} |
static/miribel/_vars.scss | ||
---|---|---|
1 |
// Colors |
|
2 |
$blue: hsl(193,61%,59%); |
|
3 |
$blue-fade: hsla(193, 61%, 59%, 0.3); |
|
4 |
$blue-light: #cceaf3; |
|
5 |
$blue-xdark: #353D55; |
|
6 |
$gray-blue: hsl(223,17%,34%); |
|
7 |
$gray-blue-fade: hsla(223, 17%, 34%, 0.4); |
|
8 |
$gray: #c1c1c1; |
|
9 |
$red: #EF4B51; |
|
10 | ||
11 |
// Fonts |
|
12 |
$base-font: 16; |
|
13 |
$fz-1: 30em / $base-font; |
|
14 |
$fz-2: 24em / $base-font; |
|
15 |
$fz-3: 21em / $base-font; |
|
16 |
$fz-4: 18em / $base-font; |
|
17 |
$fz-small: 14em / $base-font; |
|
18 |
$fz-xsmall: 11em / $base-font; |
|
19 | ||
20 |
$ss-serif: Mundial, sans-serif; |
|
21 |
$serif: "bree-serif", serif; |
|
22 | ||
23 |
// Img |
|
24 |
$cell-img-width: 60%; |
|
25 |
$cell-img-height: 100px; |
|
26 | ||
27 | ||
28 |
//Logo |
|
29 |
$logo-width: 160px; |
|
30 |
$logo-height: 90px; |
|
31 | ||
32 |
// Core vars |
|
33 |
$width: 1200em / $base-font; |
|
34 |
$mobile-limit: 64em; |
|
35 |
$very-small-limit: 35em; |
|
36 |
$mobile-width: 50em; |
|
37 |
$columns-gutter: 2rem; |
|
38 |
$sidebar-width: calc(33% + 1rem); |
|
39 | ||
40 |
$primary-color: $blue; |
|
41 |
$link-color: $red; |
|
42 |
$font-size: 100%; |
|
43 |
$font-family: $ss-serif; |
|
44 |
$font-color: $gray-blue; |
|
45 | ||
46 |
$toplinks-style: none; |
|
47 | ||
48 |
$nav-background: linear-gradient(to bottom, transparent 50%, $blue-fade 50%); |
|
49 |
$nav-full-width-background: true; |
|
50 |
$nav-after-image: false; |
|
51 |
$nav-item-spacing: 1rem; |
|
52 |
$nav-item-selected-background: $red; |
|
53 |
$nav-submenu-background: transparent; |
|
54 |
$responsive-menu: left-to-right; // right-to-left adaptation |
|
55 |
$nav-mobile-menu-background: $blue-xdark; |
|
56 |
$nav-mobile-menu-item-color: white; |
|
57 |
$nav-mobile-menu-item-hover-background: $blue-xdark; |
|
58 |
$nav-mobile-menu-item-hover-color: $blue; |
|
59 |
$nav-menu-side: 40px; |
|
60 |
$nav-button-background: $blue-xdark; |
|
61 |
$nav-button-bar-height: 3px; |
|
62 |
$nav-border-color: white; // used to change button toggled color |
|
63 | ||
64 |
$nav-mobile-bottom-bar-background: $blue-xdark; |
|
65 |
$nav-mobile-bottom-bar-color: white; |
|
66 |
$nav-mobile-bottom-bar-item-hover-background: $nav-mobile-bottom-bar-background; |
|
67 |
$nav-mobile-bottom-bar-item-hover-color: $blue; |
|
68 | ||
69 |
$title-background: transparent; |
|
70 |
$title-color: inherit; |
|
71 |
$title-font-family: $serif; |
|
72 |
$title-font-size: $fz-1; |
|
73 |
$title-weight: 700; |
|
74 |
$title-padding: 0.75rem 1.5rem; |
|
75 | ||
76 |
$button-background: $blue-xdark; |
|
77 |
$button-color: white; |
|
78 |
$button-hover-background: $red; |
|
79 |
$button-border-radius: 4px; |
|
80 | ||
81 |
$cell-title-cover-border: fasle; |
|
82 |
$cell-border: none; |
|
83 |
$cell-entry-color: $blue-xdark; |
|
84 |
$cell-entry-hover-color: $red; |
|
85 |
$cell-entry-hover-background: transparent; |
|
86 |
$cell-entry-border: 1px solid $blue-light; |
|
87 |
$cell-image-position: top; |
|
88 |
$cell-image-padding: 0; |
|
89 |
$cell-border-radius: 5px; |
|
90 | ||
91 |
$form-sidebar-width: 25%; |
|
92 |
$form-sidebar-gutter: 2rem; |
|
93 |
$widget-border: 1px solid $gray-blue-fade; |
|
94 |
$widget-focus-border: 1px solid $gray-blue; |
|
95 |
$widget-border-radius: 4px; |
|
96 |
$widget-unique-checkbox-position: left; |
|
97 | ||
98 |
$cancel-button-style: '%gray-button'; |
|
99 |
$buttons-order: previous, cancel (grow), submit; |
|
100 | ||
101 |
$wcs-steps-spacing: 1rem; |
|
102 |
$wcs-step-color: $font-color; |
|
103 |
$wcs-step-current-color: $wcs-step-color; |
|
104 |
$wcs-step-border-bottom: 1px solid $primary-color; |
|
105 |
$wcs-step-current-border-bottom: $wcs-step-border-bottom; |
|
106 |
$wcs-step-marker-type: disc; |
|
107 |
$wcs-step-current-marker-color: white; |
|
108 |
$wcs-step-current-marker-background: $primary-color; |
|
109 |
$wcs-steps-small-layout-limit: $mobile-limit; |
|
110 | ||
111 |
$or-separator: false; |
|
112 | ||
113 |
$footer-background: white; |
|
114 |
$footer-color: $font-color; |
static/miribel/config.json | ||
---|---|---|
1 |
{ |
|
2 |
"label": "miribel", |
|
3 |
"variables": { |
|
4 |
"pwa_display": "standalone", |
|
5 |
"theme_color": "#57BCD7", |
|
6 |
"email_header_asset": "emails:logo" |
|
7 |
}, |
|
8 |
"settings": { |
|
9 |
"combo": { |
|
10 |
"COMBO_ASSET_SLOTS.update": { |
|
11 |
"header:logo": { "label": "Têtière : logo" }, |
|
12 |
"emails:logo": {"label": "Emails : logo"} |
|
13 |
}, |
|
14 |
"COMBO_CELL_TEMPLATES.update" : { |
|
15 |
"data_linkcell" : { |
|
16 |
"big-btn-icon" : { |
|
17 |
"extra-css-classes" : "btn-with-icon", |
|
18 |
"label" : "bouton avec image (grand)", |
|
19 |
"template" : "combo/cells/big-btn-with-icon/link-cell.html" |
|
20 |
} |
|
21 |
} |
|
22 |
}, |
|
23 |
"COMBO_CELL_ASSET_SLOTS.update": { |
|
24 |
"data_linkcell": { |
|
25 |
"picture": {"prefix": "Icône"} |
|
26 |
} |
|
27 |
} |
|
28 |
} |
|
29 |
} |
|
30 |
} |
static/miribel/img/big-m.svg | ||
---|---|---|
1 |
<?xml version="1.0" encoding="UTF-8"?> |
|
2 |
<svg width="94" height="60" version="1.1" viewBox="139 36.903 94 60" xmlns="http://www.w3.org/2000/svg" xmlns:cc="http://creativecommons.org/ns#" xmlns:dc="http://purl.org/dc/elements/1.1/" xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#"> |
|
3 |
<metadata> |
|
4 |
<rdf:RDF> |
|
5 |
<cc:Work rdf:about=""> |
|
6 |
<dc:format>image/svg+xml</dc:format> |
|
7 |
<dc:type rdf:resource="http://purl.org/dc/dcmitype/StillImage"/> |
|
8 |
<dc:title/> |
|
9 |
</cc:Work> |
|
10 |
</rdf:RDF> |
|
11 |
</metadata> |
|
12 |
<g data-name="Groupe 36"> |
|
13 |
<g transform="translate(139,36.903)" clip-path="url(#g)" data-name="Groupe 33"> |
|
14 |
<g data-name="Groupe 32"> |
|
15 |
<path d="m10.1 21.978-6e-3 -0.12c-0.11-2.48-0.993-3.74-1.415-3.837-0.33-0.064-2.05 0.517-4.346 4.817a2.302 2.302 0 0 1-3.115 0.945 2.295 2.295 0 0 1-1.125-1.383 2.291 2.291 0 0 1 0.18-1.73 27.455 27.455 0 0 1 1.439-2.41c3.045-4.516 5.872-5.149 7.85-4.755a5.238 5.238 0 0 1 0.133 0.028 5.54 5.54 0 0 1 3.421 2.535c0.515 0.796 0.917 1.75 1.19 2.833a13.521 13.521 0 0 1 0.357 2.23 37.115 37.115 0 0 1 0-3e-3 100.96 100.96 0 0 1 0.304-0.807 51.593 51.593 0 0 1 2.291-5.187c3.049-5.915 6.469-8.913 9.89-8.57a5.368 5.368 0 0 1 0.28 0.037c2.387 0.368 5.24 2.458 6.67 9.628a39.37 39.37 0 0 1 0.431 2.666 65.47 65.47 0 0 1 1.23-3.995 43.4 43.4 0 0 1 0.812-2.167c3.259-8.013 7.914-12.733 12.412-12.733a6.365 6.365 0 0 1 1.308 0.136 6.415 6.415 0 0 1 0.922 0.268c2.35 0.875 6.208 3.806 5.542 13.503a35.023 35.023 0 0 1-2e-3 0.036 314.68 314.68 0 0 0-0.278 4.407c-1.329 23.872 1.325 30.814 5.365 33.955a16.593 16.593 0 0 0 3.57 1.991 14.544 14.544 0 0 0 5.94 1.197c7.427 0 15.061-4.77 17.53-8.19a7.045 7.045 0 0 0 0.24-0.354 2.291 2.291 0 0 1 1.348-0.99c0.6-0.162 1.263-0.08 1.83 0.278a2.291 2.291 0 0 1 0.99 1.348c0.16 0.6 0.08 1.263-0.28 1.83a12.473 12.473 0 0 1-0.899 1.234c-3.68 4.479-12.012 9.238-20.43 9.24a28.885 28.885 0 0 1-3.004-0.148 17.898 17.898 0 0 1-5.34-1.335 17.03 17.03 0 0 1-10.362-11.926c-1.886-6.597-1.973-16.254-0.953-30.835a450.55 450.55 0 0 1 0.13-1.82 24.762 24.762 0 0 0 0.05-0.892c0.2-5.276-1.471-8.002-2.85-8.291a1.547 1.547 0 0 0-0.31-0.03c-1.64 0-4.803 2.229-7.654 8.567a39.096 39.096 0 0 0-0.551 1.29 43.324 43.324 0 0 0-1.342 3.873c-1.657 5.536-2.83 12.385-3.59 17.41a348.68 348.68 0 0 0-0.395 2.694 178.74 178.74 0 0 1-0.175 1.046c-0.73 4.269-0.995 4.627-1.667 4.986a8.71 8.71 0 0 1-0.112 0.058 2.307 2.307 0 0 1-1.006 0.255h-0.048a2.3 2.3 0 0 1-1.308-0.408 2.305 2.305 0 0 1-0.995-1.897 2.319 2.319 0 0 1 0.015-0.256c0.026-0.213 0.232-0.658 0.526-4.033 0.322-3.718 0.23-6.555-0.114-12.525a1608.4 1608.4 0 0 0-0.17-2.88 49.38 49.38 0 0 0-0.205-2.445c-0.717-6.522-2.463-8.683-3.29-9.115a0.762 0.762 0 0 0-0.23-0.082c-0.804-0.102-3.933 1.587-7.46 10.814a99.044 99.044 0 0 0-0.748 2.031c-2.731 7.638-5.886 18.817-5.922 18.94a2.303 2.303 0 0 1-2.214 1.678 2.29 2.29 0 0 1-0.579-0.075 2.301 2.301 0 0 1-1.724-2.226c0-0.165 0.018-0.333 0.055-0.501a2.345 2.345 0 0 1 8e-3 -0.034c2.4-10.097 2.244-13.543 1.957-19.799z" fill="#57bcd7" fill-opacity=".3" fill-rule="evenodd" data-name="Tracé 36"/> |
|
16 |
</g> |
|
17 |
</g> |
|
18 |
</g> |
|
19 |
<defs> |
|
20 |
<clipPath id="g"> |
|
21 |
<path transform="translate(0,86.518)" d="m0 4.507h162v-91.025h-162z" data-name="Tracé 37"/> |
|
22 |
</clipPath> |
|
23 |
</defs> |
|
24 |
</svg> |
static/miribel/img/vague-footer.svg | ||
---|---|---|
1 |
<?xml version="1.0" encoding="UTF-8"?> |
|
2 |
<svg width="80" height="20" version="1.1" viewBox="138.98 254.98 80 20" xmlns="http://www.w3.org/2000/svg" xmlns:cc="http://creativecommons.org/ns#" xmlns:dc="http://purl.org/dc/elements/1.1/" xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#"> |
|
3 |
<metadata> |
|
4 |
<rdf:RDF> |
|
5 |
<cc:Work rdf:about=""> |
|
6 |
<dc:format>image/svg+xml</dc:format> |
|
7 |
<dc:type rdf:resource="http://purl.org/dc/dcmitype/StillImage"/> |
|
8 |
<dc:title/> |
|
9 |
</cc:Work> |
|
10 |
</rdf:RDF> |
|
11 |
</metadata> |
|
12 |
<path d="m138.98 274.77c0.5319 0.0337 1.0647 0.0511 1.5976 0.0522h0.0433c9.2346 0 13.806-4.6292 18.654-9.5351l0.50087-0.50656c4.8506-4.8989 10.02-9.7986 19.967-9.7986 0.0216-3e-5 0.0431-3e-5 0.0646 0 10.021 0.021 15.183 4.9706 20.041 9.9201l0.46363 0.47228c4.5337 4.6222 8.8317 9.0083 16.999 9.5515 0.55564 0.0366 1.669 0.0561 1.669 0.0561z" fill="#fff" fill-rule="evenodd" stroke-width=".76963" data-name="Tracé 1197"/> |
|
13 |
</svg> |
static/miribel/img/vague.svg | ||
---|---|---|
1 |
<svg xmlns="http://www.w3.org/2000/svg" width="258.017" height="29.533" viewBox="138.983 254.983 258.017 29.533"><path d="m139 258.432.01-3.432a34.256 34.256 0 0 1 8.166.946c8.12 2 13.275 6.874 18.193 11.748a883.881 883.881 0 0 1 .637.632 527.27 527.27 0 0 0 1.032 1.024c5.63 5.565 11.259 10.62 21.449 11.248a35.216 35.216 0 0 0 2.11.065 37.372 37.372 0 0 0 .085 0c11.472 0 17.479-5.301 23.486-11.187a521.965 521.965 0 0 0 1.065-1.048c6.598-6.495 13.42-13.223 26.978-13.223a41.067 41.067 0 0 1 .084 0c13.606.028 20.404 6.789 26.978 13.326a514.641 514.641 0 0 0 1.058 1.05c5.62 5.555 11.242 10.59 21.412 11.22a35.248 35.248 0 0 0 2.102.067 37.44 37.44 0 0 0 .057 0c12.15 0 18.165-5.94 24.543-12.235a821.01 821.01 0 0 1 .659-.65c6.382-6.286 13.183-12.573 26.271-12.573a40.959 40.959 0 0 1 .085 0c13.185.027 19.977 6.378 26.368 12.729a843.55 843.55 0 0 1 .61.606c5.965 5.931 11.62 11.559 22.366 12.256a35.157 35.157 0 0 0 2.196.072l-.01 3.423a34.14 34.14 0 0 1-8.15-.94c-8.106-1.995-13.254-6.863-18.167-11.731a927.799 927.799 0 0 1-.66-.655c-5.982-5.956-11.651-11.599-22.455-12.263a35.213 35.213 0 0 0-2.108-.065 37.258 37.258 0 0 0-.085 0c-12.13 0-18.142 5.946-24.514 12.225-6.58 6.505-13.391 13.233-26.931 13.233a40.939 40.939 0 0 1-.085 0c-13.605-.028-20.403-6.789-26.977-13.335a542.294 542.294 0 0 0-1.058-1.048c-5.997-5.92-11.994-11.263-23.514-11.28-11.543-.027-17.574 5.3-23.605 11.21a520.57 520.57 0 0 0-1.042 1.024 823 823 0 0 1-.66.651c-6.404 6.3-13.23 12.6-26.392 12.573a34.256 34.256 0 0 1-8.166-.947c-8.47-2.086-13.715-7.3-18.83-12.38-5.992-5.955-11.67-11.606-22.481-12.271a35.216 35.216 0 0 0-2.11-.065Z" fill="#485065" fill-rule="evenodd" data-name="Tracé 1197"/></svg> |
static/miribel/style.scss | ||
---|---|---|
1 |
@charset "UTF-8"; |
|
2 |
@import url("https://use.typekit.net/bav6lse.css"); |
|
3 | ||
4 |
@import 'vars'; |
|
5 |
@import '../includes/publik'; |
|
6 |
@import 'custom'; |
templates/variants/miribel/combo/cells/big-btn-with-icon/link-cell.html | ||
---|---|---|
1 |
{% load assets %} |
|
2 |
{% get_asset cell=cell type='picture' as asset %} |
|
3 |
<a class="btn-with-icon--link" href="{{url}}"> |
|
4 |
{% if asset %} |
|
5 |
<span |
|
6 |
class="btn-with-icon--icon" |
|
7 |
style="background-image: url({{asset.asset.url}})" |
|
8 |
></span> |
|
9 |
{% endif %} |
|
10 |
<span class="btn-with-icon--label">{{ title }}</span> |
|
11 |
{% if description %} |
|
12 |
<div class="description"> |
|
13 |
{{ description }} |
|
14 |
</div> |
|
15 |
{% endif %} |
|
16 |
</a> |
|
0 |
- |