publik-famille-demo: create theme (#61994)
This commit is contained in:
parent
6344f898ca
commit
3d69c43328
|
@ -531,6 +531,17 @@ body {
|
|||
padding-left: 0;
|
||||
}
|
||||
|
||||
.wcs-cards-cell {
|
||||
h2 {
|
||||
font-size: 1rem;
|
||||
}
|
||||
|
||||
a {
|
||||
background-color: $gray-light;
|
||||
border-radius: $border-radius;
|
||||
}
|
||||
}
|
||||
|
||||
div#rub_service {
|
||||
h3 {
|
||||
font-weight: bold;
|
||||
|
|
|
@ -0,0 +1,157 @@
|
|||
.cell + .pf-page-header--default {
|
||||
display: none;
|
||||
}
|
||||
|
||||
.page-template-homepage .gru-content div.cell {
|
||||
margin-top: 2rem;
|
||||
padding-bottom: 2rem;
|
||||
border-radius: 0;
|
||||
|
||||
&:not(:last-child) {
|
||||
border-bottom: 3px solid $orange;
|
||||
}
|
||||
}
|
||||
|
||||
%pf-icon {
|
||||
background: var(--pf-icon-picture) no-repeat bottom left;
|
||||
background-size: contain;
|
||||
content: var(--pf-icon-content);
|
||||
display: flex;
|
||||
align-items: start;
|
||||
color: $orange;
|
||||
font-family: 'FontAwesome';
|
||||
}
|
||||
|
||||
// Links
|
||||
%cell-links-list {
|
||||
& > li {
|
||||
margin: 0 1em;
|
||||
}
|
||||
& > li:not(.add-more-items) > a {
|
||||
font-size: $fz-3;
|
||||
padding-left: 0;
|
||||
padding-right: 0;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
li div.description {
|
||||
padding: 0;
|
||||
|
||||
p {
|
||||
margin-left: 0;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.add-more-items--button {
|
||||
font-size: $fz-2;
|
||||
color: $orange;
|
||||
}
|
||||
|
||||
// Notifications
|
||||
div.cell.notifications-cell {
|
||||
h2:first-child {
|
||||
color: $orange;
|
||||
font-size: $fz-3;
|
||||
&:before {
|
||||
content: '\f0f3';
|
||||
font-family: FontAwesome;
|
||||
margin-right: 2rem;
|
||||
}
|
||||
}
|
||||
|
||||
.links-list {
|
||||
background: $orange;
|
||||
border-radius: $border-radius;
|
||||
|
||||
ul {
|
||||
padding: 2rem 4rem;
|
||||
> li {
|
||||
border: none;
|
||||
padding: 0.3rem 0;
|
||||
|
||||
&:not(:last-child) {
|
||||
border-bottom: 1px solid white;
|
||||
}
|
||||
|
||||
> a {
|
||||
font-size: $font-size;
|
||||
text-decoration: underline;
|
||||
color: white;
|
||||
}
|
||||
|
||||
> div.description {
|
||||
color: white;
|
||||
}
|
||||
}
|
||||
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
// Tracking code
|
||||
div.cell.tracking-code-input-cell {
|
||||
h2:first-child {
|
||||
font-size: $font-size;
|
||||
text-transform: uppercase;
|
||||
border-bottom: 1px solid $gray-dark;
|
||||
border-radius: 0;
|
||||
}
|
||||
}
|
||||
|
||||
// Carrousel
|
||||
div.carrousel-content {
|
||||
background: $green-light;
|
||||
overflow: visible;
|
||||
margin-top:150px;
|
||||
|
||||
@media($min-desktop-viewport) {
|
||||
&::before {
|
||||
background-image: url('img/carrousel-banner.png');
|
||||
background-position:center;
|
||||
background-repeat: no-repeat;
|
||||
content: "";
|
||||
position: absolute;
|
||||
height: 150px;
|
||||
width: 100%;
|
||||
top:-110px;
|
||||
}
|
||||
}
|
||||
|
||||
@media($max-mobile-viewport) {
|
||||
.carrousel-item-content {
|
||||
text-align: center;
|
||||
background: $green-light;
|
||||
}
|
||||
}
|
||||
|
||||
input + div {
|
||||
padding: 3rem;
|
||||
div.carrousel-item {
|
||||
&:after {
|
||||
background-color: transparent;
|
||||
}
|
||||
color: black;
|
||||
background-repeat: no-repeat;
|
||||
background-size: 30%;
|
||||
background-position-x: 10%;
|
||||
padding: 1rem;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
// Custom classes
|
||||
.errornotice,
|
||||
.warningnotice,
|
||||
.successnotice,
|
||||
.infonotice {
|
||||
border-radius: $border-radius;
|
||||
padding-top: 1rem;
|
||||
padding-bottom: 1rem;
|
||||
padding-right: 1rem;
|
||||
min-height: calc(#{$notification-icon-size} + 2rem);
|
||||
&::before {
|
||||
top: 1rem;
|
||||
}
|
||||
}
|
|
@ -0,0 +1,33 @@
|
|||
:root {
|
||||
--pf-icon-content: "";
|
||||
}
|
||||
|
||||
h1 {
|
||||
font-size: $fz-1;
|
||||
font-weight: 800;
|
||||
}
|
||||
|
||||
h2 {
|
||||
font-size: $fz-2;
|
||||
font-weight: 700;
|
||||
}
|
||||
|
||||
h3 {
|
||||
font-size: $fz-3;
|
||||
font-weight: 600;
|
||||
}
|
||||
|
||||
div#main-content {
|
||||
margin-top: 6rem;
|
||||
@media($max-mobile-viewport) {
|
||||
margin-top: 1rem;
|
||||
}
|
||||
}
|
||||
|
||||
%pf-field {
|
||||
padding: 0.5rem;
|
||||
font-size: $font-size;
|
||||
background-color: $gray-light;
|
||||
border-radius: $border-radius;
|
||||
}
|
||||
|
|
@ -0,0 +1,112 @@
|
|||
.pf-cloud {
|
||||
position: relative;
|
||||
&::before {
|
||||
background: url('img/cloud.svg');
|
||||
bottom: -120px;
|
||||
content: "";
|
||||
height: 264px;
|
||||
position: absolute;
|
||||
right: 50px;
|
||||
width: 342px;
|
||||
z-index: -1;
|
||||
}
|
||||
}
|
||||
|
||||
.gray-cell {
|
||||
.gru-content &.cell {
|
||||
background-color: $gray-light;
|
||||
padding-bottom: 1rem;
|
||||
}
|
||||
}
|
||||
|
||||
.green-cell {
|
||||
.gru-content &.cell {
|
||||
background-color: $green-light;
|
||||
padding-bottom: 1rem;
|
||||
}
|
||||
}
|
||||
|
||||
div.pf-icon-list {
|
||||
ul > li:not(.add-more-items) > a {
|
||||
background: url(img/bubble.svg);
|
||||
background-position: bottom left;
|
||||
background-repeat: no-repeat;
|
||||
transition: background-position 0.2s ease-out;
|
||||
|
||||
&::before {
|
||||
@extend %pf-icon;
|
||||
width: 35px;
|
||||
height: 35px;
|
||||
font-size: 35px;
|
||||
margin-right: 1rem;
|
||||
}
|
||||
|
||||
&:hover {
|
||||
background-position-x: 10px;
|
||||
background-size: contain;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
div.card.pf-card-detail {
|
||||
h2:first-child {
|
||||
border-bottom: 2px solid $gray;
|
||||
padding: 1rem 0;
|
||||
border-radius: 0;
|
||||
}
|
||||
.label {
|
||||
color: $gray-dark;
|
||||
font-size: $fz-3;
|
||||
font-weight: 700;
|
||||
margin-bottom: 0.3rem;
|
||||
margin-top: 0.3rem;
|
||||
text-align: right;
|
||||
}
|
||||
.value {
|
||||
@extend %pf-field;
|
||||
margin-bottom: 0.3rem;
|
||||
margin-top: 0.3rem;
|
||||
}
|
||||
}
|
||||
|
||||
%icon-button {
|
||||
&:not(.pf-big-button) {
|
||||
div.links-list {
|
||||
ul > li > a {
|
||||
&::before {
|
||||
@extend %pf-icon;
|
||||
padding-right: 1rem;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
&.pf-big-button {
|
||||
div.links-list {
|
||||
ul > li > a {
|
||||
border: 2px solid $orange;
|
||||
padding: 0.3rem 1.5rem;
|
||||
width: max-content;
|
||||
color: $orange;
|
||||
&::after {
|
||||
@extend %pf-icon;
|
||||
margin-left: 1rem;
|
||||
font-size: 35px;
|
||||
width: 35px;
|
||||
height: 35px;
|
||||
margin-bottom: 3px;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.pf-icon-famille {
|
||||
@extend %icon-button;
|
||||
--pf-icon-picture: url('img/icon_famille.svg');
|
||||
}
|
||||
|
||||
.pf-icon-add {
|
||||
@extend %icon-button;
|
||||
--pf-icon-content: '\f055';
|
||||
}
|
|
@ -0,0 +1,240 @@
|
|||
$desktop-gray-header-height: 90px;
|
||||
$mobile-top-links-height: 2rem;
|
||||
|
||||
body.has-header-background #header {
|
||||
background-position-x: 30%;
|
||||
background-size: contain;
|
||||
@media($max-mobile-viewport) {
|
||||
background-image: none;
|
||||
}
|
||||
}
|
||||
|
||||
div#top {
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
align-items: center;
|
||||
@media ($min-desktop-viewport) {
|
||||
padding-right: $nav-menu-side * 1.5;
|
||||
}
|
||||
@media ($min-desktop-viewport) {
|
||||
height: $desktop-gray-header-height;
|
||||
}
|
||||
}
|
||||
|
||||
h1#logo.has-logo {
|
||||
padding: 10px 0;
|
||||
flex-grow: 1;
|
||||
}
|
||||
|
||||
#toplinks {
|
||||
position: static;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
word-spacing: 1em;
|
||||
|
||||
@media ($max-mobile-viewport) {
|
||||
order: -1;
|
||||
min-height: 2em;
|
||||
flex: 1 0 100%;
|
||||
max-width: none;
|
||||
margin: 0 -0.7rem;
|
||||
padding: 0 0.7rem;
|
||||
}
|
||||
|
||||
@media($min-desktop-viewport) {
|
||||
height: $nav-menu-side;
|
||||
padding: 0.5em 1.5em;
|
||||
border-radius: $nav-menu-side / 2;
|
||||
}
|
||||
|
||||
a {
|
||||
color: $orange-dark;
|
||||
&:first-child {
|
||||
font-weight: bold;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.site-nav {
|
||||
position: fixed;
|
||||
width: 100%;
|
||||
z-index: 102;
|
||||
}
|
||||
|
||||
.gru-nav-wrapper {
|
||||
@extend .page-width;
|
||||
position: relative;
|
||||
@media ($max-mobile-viewport) {
|
||||
max-width: none;
|
||||
}
|
||||
}
|
||||
#nav {
|
||||
margin: 0;
|
||||
position: absolute;
|
||||
width: $nav-menu-side;
|
||||
height: $desktop-gray-header-height;
|
||||
top: 0;
|
||||
right: 0.7rem;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
transition: top 400ms;
|
||||
@media ($max-mobile-viewport) {
|
||||
body:not(.scrolled) & {
|
||||
top: $mobile-top-links-height;
|
||||
}
|
||||
}
|
||||
}
|
||||
div.gru-nav {
|
||||
.gru-nav-button {
|
||||
position: relative;
|
||||
display: block;
|
||||
line-height: 0;
|
||||
top: 0;
|
||||
left: 0;
|
||||
border-radius: 50%;
|
||||
border: 6px solid transparent;
|
||||
|
||||
+ ul {
|
||||
&::before {
|
||||
content: none;
|
||||
}
|
||||
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
left: auto;
|
||||
right: 0;
|
||||
transform: translateX(100%);
|
||||
min-width: calc((100% - #{$width}) / 2 + 420px);
|
||||
padding-top: 50px;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.pf-menu-item {
|
||||
&--image {
|
||||
width: 160px;
|
||||
height: 160px;
|
||||
background: white;
|
||||
border-radius: $border-radius;
|
||||
padding: 1rem;
|
||||
}
|
||||
|
||||
&--title {
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
&:hover &--title {
|
||||
text-decoration: underline;
|
||||
}
|
||||
}
|
||||
|
||||
.pf-page-header {
|
||||
&--default {
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
align-items: end;
|
||||
|
||||
&::before {
|
||||
background: url('img/cloud.svg');
|
||||
content: "";
|
||||
position: absolute;
|
||||
height: 264px;
|
||||
width: 342px;
|
||||
top: -10px;
|
||||
left: 50px;
|
||||
z-index: -1;
|
||||
|
||||
@media($max-mobile-viewport) {
|
||||
top: 0;
|
||||
left: 10px;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
&--title {
|
||||
margin: 0;
|
||||
@media($max-mobile-viewport) {
|
||||
font-size: $fz-3;
|
||||
}
|
||||
}
|
||||
|
||||
&--picture {
|
||||
width: 100px;
|
||||
margin-right: 1rem;
|
||||
@media($max-mobile-viewport) {
|
||||
width: 35px;
|
||||
}
|
||||
}
|
||||
|
||||
&--description {
|
||||
margin-top: 0.5rem;
|
||||
flex-basis: 100%;
|
||||
}
|
||||
}
|
||||
|
||||
body.page-template-homepage {
|
||||
.site-header {
|
||||
background: transparent;
|
||||
}
|
||||
|
||||
#header {
|
||||
@media ($min-desktop-viewport) {
|
||||
background: var(--page-picture);
|
||||
background-repeat: no-repeat;
|
||||
background-position-y: 50px;
|
||||
background-size: 100%;
|
||||
}
|
||||
@media($min-desktop-viewport) {
|
||||
height: 550px;
|
||||
margin-bottom: -180px;
|
||||
}
|
||||
}
|
||||
|
||||
#top {
|
||||
align-items: flex-end;
|
||||
@media ($min-desktop-viewport) {
|
||||
height: auto;
|
||||
flex-wrap: nowrap;
|
||||
}
|
||||
}
|
||||
h1#logo.has-logo {
|
||||
@media($max-mobile-viewport) {
|
||||
text-align: center;
|
||||
}
|
||||
a::before {
|
||||
width: 260px;
|
||||
height: 150px;
|
||||
@media($max-mobile-viewport) {
|
||||
width: 200px;
|
||||
height: 114px;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
#toplinks {
|
||||
background: $gray-light;
|
||||
@media ($min-desktop-viewport) {
|
||||
position: absolute;
|
||||
right: $nav-menu-side * 1.5;
|
||||
top: ($desktop-gray-header-height - $nav-menu-side) / 2;
|
||||
}
|
||||
}
|
||||
|
||||
.pf-header-description {
|
||||
font-weight: bold;
|
||||
text-align: center;
|
||||
font-size: $fz-1;
|
||||
flex: 1 1 auto;
|
||||
|
||||
@media($max-mobile-viewport) {
|
||||
padding: 1rem;
|
||||
font-size: $fz-3;
|
||||
}
|
||||
|
||||
@media($min-desktop-viewport) {
|
||||
flex: 1 1 50%;
|
||||
padding-bottom: 10px;
|
||||
}
|
||||
}
|
||||
}
|
|
@ -0,0 +1,112 @@
|
|||
// colors
|
||||
$gray: #BFBFBF;
|
||||
$gray-dark: #575757;
|
||||
$gray-light: #F1F1F1;
|
||||
$orange: #EC671F;
|
||||
$orange-dark: #df5a13;
|
||||
$orange-gray: #A88B7D;
|
||||
$green: #6BD3AA;
|
||||
$green-dark: #31a679;
|
||||
$green-light: #A6E5CC;
|
||||
$blue: #91D5FF;
|
||||
$blue-dark: #183c88;
|
||||
$red: #df1313;
|
||||
|
||||
// typo
|
||||
$base-font: 16;
|
||||
$font-ratio: 1.333;
|
||||
$fz-3: 1em * $font-ratio;
|
||||
$fz-2: $fz-3 * $font-ratio;
|
||||
$fz-1: $fz-2 * $font-ratio;
|
||||
$fz-small: 1em / $font-ratio;
|
||||
|
||||
// Core vars
|
||||
$width: 1280em / $base-font;
|
||||
$mobile-limit: 64em;
|
||||
$very-small-limit: 35em;
|
||||
$columns-gutter: 2rem;
|
||||
|
||||
$font-size: 100% / ( 16 / $base-font );
|
||||
$font-color: $gray-dark;
|
||||
$font-family: "source sans pro", sans-serif;
|
||||
|
||||
$primary-color: $orange-dark;
|
||||
$border-radius: 1rem;
|
||||
$link-color: $primary-color;
|
||||
|
||||
$header-full-width-background: true;
|
||||
$header-background-color: $gray-light;
|
||||
$header-logo-size: 105px 60px;
|
||||
|
||||
$toplinks-style: none;
|
||||
$toplinks-background: white;
|
||||
|
||||
$nav-after-image: false;
|
||||
$nav-mobile-limit: 20000px;
|
||||
$pwa-nav-limit: 960px;
|
||||
$nav-background: $orange;
|
||||
$nav-color: white;
|
||||
$nav-border-radius: 0;
|
||||
$nav-active-color: white;
|
||||
$nav-border-color: none;
|
||||
|
||||
$nav-button-background: $orange;
|
||||
$nav-button-color: white;
|
||||
|
||||
$nav-mobile-menu-background: $orange;
|
||||
$nav-border-radius: 100%;
|
||||
$nav-mobile-menu-item-color: white;
|
||||
$nav-mobile-menu-item-hover-background: $orange;
|
||||
$nav-mobile-menu-item-hover-color: white;
|
||||
|
||||
$responsive-menu: left-to-right;
|
||||
|
||||
$title-background: transparent;
|
||||
$title-color: $font-color;
|
||||
$title-font-size: $fz-2;
|
||||
$title-weight: 900;
|
||||
|
||||
$cell-background: transparent;
|
||||
$cell-border: none;
|
||||
$cell-title-cover-border: false;
|
||||
$cell-entry-border: 2px solid $gray;
|
||||
$cell-entry-hover-color: $orange;
|
||||
$cell-entry-hover-background: $cell-background;
|
||||
|
||||
$cell-entry-color: $gray-dark;
|
||||
$cell-entry-font-weight: 600;
|
||||
|
||||
$carrousel-height: 40rem;
|
||||
$carrousel-text-position: middle right;
|
||||
$carrousel-navigation-color: black;
|
||||
$carrousel-navigation-bullet-border: black;
|
||||
|
||||
$button-background: $orange-dark;
|
||||
$button-color: white;
|
||||
$button-hover-background: $orange;
|
||||
$cancel-button-style: "%inverted-button";
|
||||
|
||||
$error-color: $red;
|
||||
$widget-unique-checkbox-position: left;
|
||||
|
||||
$widget-background: $gray-light;
|
||||
$widget-border: 1px solid $gray-light;
|
||||
$widget-border-radius: $border-radius;
|
||||
$widget-focus-border: 1px solid $orange;
|
||||
$widget-padding: 0.625rem 1rem !default;
|
||||
$widget-focus-box-shadow: none !default;
|
||||
|
||||
$notification_error_color: $red;
|
||||
$notification_warning_color: $orange_dark;
|
||||
$notification_success_color: $green-light;
|
||||
$notification_info_color: $gray-light;
|
||||
|
||||
$wcs-step-color: $gray-dark;
|
||||
$wcs-step-background: transparent !default;
|
||||
$wcs-step-current-marker-background: url(img/bubble.svg);
|
||||
$wcs-step-border-bottom: none;
|
||||
$wcs-step-current-border-bottom: none;
|
||||
|
||||
$footer-background: $gray-light;
|
||||
$footer-full-width-background: false;
|
||||
$footer-color: gray-dark;
|
|
@ -0,0 +1,32 @@
|
|||
.wcs-step {
|
||||
&.current & {
|
||||
&--marker {
|
||||
background-size: contain;
|
||||
background-repeat: no-repeat;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.form-content {
|
||||
&--sidebox {
|
||||
background: $gray-light;
|
||||
padding: 1rem;
|
||||
border-radius: $border-radius;
|
||||
}
|
||||
}
|
||||
|
||||
div.cell.wcs-cards-cell {
|
||||
h2:first-child {
|
||||
font-size: $fz-3;
|
||||
}
|
||||
|
||||
div.list-of-cards {
|
||||
ul > li {
|
||||
border: none;
|
||||
padding: 0.3rem 0;
|
||||
> a {
|
||||
@extend %pf-field;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
|
@ -0,0 +1,17 @@
|
|||
{
|
||||
"label": "Publik Famille demo",
|
||||
"variables": {
|
||||
"pwa_display": "standalone",
|
||||
"theme_color": "#EC671F",
|
||||
"email_header_asset": "emails:logo"
|
||||
},
|
||||
"settings": {
|
||||
"combo": {
|
||||
"COMBO_ASSET_SLOTS.update": {
|
||||
"header:logo": { "label": "Têtière : logo" },
|
||||
"header:background": { "label": "Têtière : fond" },
|
||||
"emails:logo": {"label": "Emails : logo"}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
|
@ -0,0 +1 @@
|
|||
<svg xmlns="http://www.w3.org/2000/svg" width="29" height="28" viewBox="0 0 29 28"><defs><style>.a{fill:#d9f1ff;}</style></defs><ellipse class="a" cx="14.5" cy="14" rx="14.5" ry="14"/></svg>
|
After Width: | Height: | Size: 190 B |
Binary file not shown.
After Width: | Height: | Size: 16 KiB |
|
@ -0,0 +1 @@
|
|||
<svg xmlns="http://www.w3.org/2000/svg" width="342.068" height="264.118" viewBox="0 0 342.068 264.118"><defs><style>.a{fill:#91d5ff;opacity:0.34;}</style></defs><path class="a" d="M1182.574,262.261c-3.436,4.7-8.6,6.818-13.549,8.658a238.914,238.914,0,0,1-32.165,9.838c-.095.024-.192.044-.29.065a126.025,126.025,0,0,1-24.334,3,92.313,92.313,0,0,1-22.782-2.347h0c-.314-.074-.624-.148-.935-.227a76.656,76.656,0,0,1-31.369-15.775c-.858-.728-1.717-1.48-2.589-2.2q-.088-.069-.168-.137a16.341,16.341,0,0,0-5.4-3.176c-5.41-1.638-10.839,1.833-15.918,4.6-31.386,17.117-71.208,7.961-95.431-21.945-2.966-3.659-5.786-7.661-9.495-10.114-5.514-3.642-12.135-3.337-18.24-5.057-18.209-5.133-30.286-31.4-24.345-52.947,3.29-11.94,10.926-21.363,19.216-28.881,20.451-18.548,46.4-27.906,71.894-25.922l.765.063c11.892,1.022,23.95,4.214,35.545.949,10.054-2.831,18.732-10.251,27.945-15.9q2.58-1.582,5.226-2.981c.169-.093.342-.183.512-.27a88.23,88.23,0,0,1,34.921-9.955c9.618-.645,21.393,1.2,28.645,9.791,7.47,8.852,7.756,24.48,17.991,30.3,8.474,4.817,19.13,3.389,27.972,8.8,8.642,5.286,16.152,14.6,17.982,26.159,1.777,11.229-1.922,22.8-.763,34.148a50.346,50.346,0,0,0,2.33,10.516q.3.932.629,1.857c2.147,6.075,4.975,11.919,7.142,18C1187.1,241.246,1188.545,254.086,1182.574,262.261Z" transform="matrix(-0.966, -0.259, 0.259, -0.966, 1122.521, 581.285)"/></svg>
|
After Width: | Height: | Size: 1.3 KiB |
|
@ -0,0 +1 @@
|
|||
<svg xmlns="http://www.w3.org/2000/svg" width="20.247" height="18.155" viewBox="0 0 20.247 18.155"><defs><style>.a{fill:#ec671f;}</style></defs><path class="a" d="M3880,308.909a9.087,9.087,0,0,0-17.966-2.742,8.947,8.947,0,0,0,1.481,6.454l-3.659,2.421,9.821,1.467A9.032,9.032,0,0,0,3880,308.909Z" transform="translate(-3859.854 -298.467)"/></svg>
|
After Width: | Height: | Size: 345 B |
File diff suppressed because one or more lines are too long
After Width: | Height: | Size: 5.5 KiB |
|
@ -0,0 +1 @@
|
|||
<svg xmlns="http://www.w3.org/2000/svg" width="19.012" height="21.907" viewBox="0 0 19.012 21.907"><defs><style>.a{fill:#ec671f;}.b{fill:#fff;}.b,.c{stroke:#ec671f;stroke-miterlimit:10;}.c{fill:none;stroke-width:1.598px;}</style></defs><g transform="translate(-3882.872 -312.104)"><path class="a" d="M3882.872,312.1v18.291H3898.1V312.1Zm11.327,13.741h-7.706v-1.3h7.706Zm0-4.364h-7.706v-1.3h7.706Zm0-4.364h-7.706v-1.3h7.706Z" transform="translate(0 0)"/><circle class="b" cx="3.697" cy="3.697" r="3.697" transform="translate(3893.99 326.117)"/><line class="c" y2="3.638" transform="translate(3897.687 327.864)"/><line class="c" x1="3.638" transform="translate(3895.868 329.683)"/></g></svg>
|
After Width: | Height: | Size: 689 B |
|
@ -0,0 +1,10 @@
|
|||
@charset "UTF-8";
|
||||
@import '../includes/fonts/source-sans-pro';
|
||||
|
||||
@import 'vars';
|
||||
@import '../includes/publik';
|
||||
@import 'cells';
|
||||
@import 'custom';
|
||||
@import 'custom_classes';
|
||||
@import 'header';
|
||||
@import 'wcs';
|
|
@ -18,7 +18,6 @@
|
|||
{% if meta_keywords %}
|
||||
<meta name="keywords" content="{{ meta_keywords }}" />
|
||||
{% endif %}
|
||||
{% block meta_icons %}{% endblock %}
|
||||
{% if theme_color %}
|
||||
<meta name="theme-color" content="{{theme_color}}">
|
||||
<meta name="msapplication-navbutton-color" content="{{theme_color}}">
|
||||
|
|
|
@ -0,0 +1,8 @@
|
|||
{% extends "combo/cells/carrousel/menu-cell.html" %}
|
||||
|
||||
{% block carrousel-item-content %}
|
||||
{% for cell in menuitem.page.get_cells %}
|
||||
{{cell.text|safe}}
|
||||
{% endfor %}
|
||||
{% endblock %}
|
||||
|
|
@ -0,0 +1,55 @@
|
|||
{% load i18n %}
|
||||
{% block cell-content %}
|
||||
{% load assets %}
|
||||
{% spaceless %}
|
||||
{% block cell-header %}
|
||||
{% if title %}<h2>{{ title }}</h2>{% endif %}
|
||||
{% include "combo/asset_picture_fragment.html" %}
|
||||
{% endblock cell-header %}
|
||||
<div class="links-list">
|
||||
{% block cell-top-content %}{% endblock cell-top-content %}
|
||||
<ul>
|
||||
{% for link in links %}
|
||||
<li class="{{ link.css_classes|default:""|join:" " }}{% if link.cell.extra_css_class %} {{ link.cell.extra_css_class }}{% endif %}"
|
||||
{% if link.cell.link_page.picture %}
|
||||
style="--pf-icon-picture: url({{ link.cell.link_page.picture.url }})"
|
||||
{% endif %}
|
||||
>
|
||||
<a href="{{ link.url }}">
|
||||
{{ link.title }}
|
||||
</a>
|
||||
</li>
|
||||
{% endfor %}
|
||||
{% if more_links %}
|
||||
<li class="add-more-items">
|
||||
<a role="button"
|
||||
tabindex="0"
|
||||
aria-expanded="false"
|
||||
aria-controls="more-items-{{ cell.get_reference }}"
|
||||
aria-label="{% trans 'More items' %}"
|
||||
id="btn-more-items-{{ cell.get_reference }}"
|
||||
class="add-more-items--button">
|
||||
{% block cell-more-items-btn-label %}+{% endblock %}
|
||||
</a>
|
||||
</li>
|
||||
{% endif %}
|
||||
</ul>
|
||||
|
||||
{% if more_links %}
|
||||
<ul style="display: none" class="more-items" id="more-items-{{ cell.get_reference }}" aria-labelledby="btn-more-items-{{ cell.get_reference }}">
|
||||
{% for link in more_links %}
|
||||
<li class="{{ link.css_classes|default:""|join:" " }}{% if link.cell.extra_css_class %} {{ link.cell.extra_css_class }}{% endif %}"
|
||||
{% if link.cell.link_page.picture %}
|
||||
style="--pf-icon-picture: url({{ link.cell.link_page.picture.url }})"
|
||||
{% endif %}
|
||||
>
|
||||
<a href="{{ link.url }}">
|
||||
{{ link.title }}
|
||||
</a>
|
||||
</li>
|
||||
{% endfor %}
|
||||
{% endif %}
|
||||
</ul>
|
||||
</div>
|
||||
{% endspaceless %}
|
||||
{% endblock %}
|
|
@ -0,0 +1,23 @@
|
|||
{% load i18n %}
|
||||
{% load assets %}
|
||||
|
||||
{% if menuitems %}
|
||||
<ul class="pf-menu--items">
|
||||
{% spaceless %}
|
||||
{% for item in menuitems %}
|
||||
<li data-menu-page-id="{{ item.page.id }}" class="menu-{{ item.page.slug }} {% if item.selected %}selected{% endif %}">
|
||||
<a {% if item.selected %}title="{{ item.page.title }} - {% trans "active page" %}"{% endif %} href="{% page_absolute_url item.page %}">
|
||||
<span class="pf-menu-item">
|
||||
{% if item.page.picture %}
|
||||
<img class="pf-menu-item--image" src="{{item.page.picture.url}}"></img>
|
||||
{% endif %}
|
||||
<div class="pf-menu-item--title">
|
||||
{{ item.page.title }}
|
||||
</div>
|
||||
</span>
|
||||
</a>
|
||||
</li>
|
||||
{% endfor %}
|
||||
{% endspaceless %}
|
||||
</ul>
|
||||
{% endif %}
|
|
@ -0,0 +1,18 @@
|
|||
{% extends "combo/page_template.html" %}
|
||||
|
||||
{% block content-pre %}
|
||||
<header class="pf-page-header">
|
||||
<div class="pf-page-header--content">
|
||||
{% placeholder "page-header" name="Entête de la page"%}
|
||||
{% if page.title %}
|
||||
<div class="pf-page-header--default">
|
||||
{% if page.picture %}
|
||||
<img src="{{site_base}}{{page.picture.url}}" alt="" class="pf-page-header--picture"></img>
|
||||
{% endif %}
|
||||
<h1 class="pf-page-header--title">{{ page.title }}</h1>
|
||||
<div class="pf-page-header--description">{{ page.description }}</div>
|
||||
</div>
|
||||
{% endif %}
|
||||
</div>
|
||||
</header>
|
||||
{% endblock %}
|
|
@ -0,0 +1,11 @@
|
|||
{% extends "combo/page_template_2cols.html" %}
|
||||
{% load combo i18n %}
|
||||
|
||||
{% block content-pre %}
|
||||
{% endblock %}
|
||||
|
||||
{% block header-content %}
|
||||
<div class="pf-header-description">{{ page.description }}</div>
|
||||
{{ block.super }}
|
||||
{% endblock %}
|
||||
|
|
@ -0,0 +1,5 @@
|
|||
{% extends "includes/nav.html" %}
|
||||
|
||||
{% block menu %}
|
||||
{% show_menu depth=1 ignore_visibility=True %}
|
||||
{% endblock %}
|
Loading…
Reference in New Issue