nantes: new theme (#66170)
This commit is contained in:
parent
ae69072491
commit
430100388e
|
@ -1,114 +1,633 @@
|
|||
h1#logo.has-logo a {
|
||||
display: block;
|
||||
height: 40px;
|
||||
min-width: 200px;
|
||||
}
|
||||
//
|
||||
// Typo
|
||||
//
|
||||
|
||||
#toplinks {
|
||||
box-sizing: content-box;
|
||||
right: 0;
|
||||
top: 4px;
|
||||
font-size: 90%;
|
||||
width: 280px;
|
||||
max-width: 280px;
|
||||
box-sizing: border-box;
|
||||
text-align: center;
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
font-size: 90%;
|
||||
background: #45ccb1;
|
||||
border-radius: 20px;
|
||||
padding: 10px;
|
||||
box-shadow: none;
|
||||
border: none;
|
||||
a {
|
||||
text-decoration: underline;
|
||||
color: black;
|
||||
@mixin orange-focus {
|
||||
&:focus-visible {
|
||||
outline: 1px solid $orange;
|
||||
outline-offset: 2px;
|
||||
}
|
||||
}
|
||||
|
||||
.site-header {
|
||||
z-index: 100;
|
||||
#header {
|
||||
transition: all ease 0.2s;
|
||||
margin-top: 3rem;
|
||||
h1 {
|
||||
margin-top: 0.4rem;
|
||||
a {
|
||||
padding-left: 1rem;
|
||||
html {
|
||||
@media ($min-desktop-viewport) {
|
||||
font-size: 112.5%;
|
||||
}
|
||||
}
|
||||
h1, .h1 {
|
||||
font-size: $fz-1;
|
||||
color : $green;
|
||||
font-weight: normal;
|
||||
line-height: 1.2;
|
||||
}
|
||||
h2, .h2 {
|
||||
font-size: $fz-2;
|
||||
line-height: 1.2;
|
||||
font-weight: bold;
|
||||
}
|
||||
h3, .h3 {
|
||||
font-size: $fz-3;
|
||||
line-height: 1.3;
|
||||
font-weight: normal;
|
||||
}
|
||||
h4, .h4 {
|
||||
font-size: $fz-4;
|
||||
line-height: 1.3;
|
||||
font-weight: normal;
|
||||
}
|
||||
a, .a {
|
||||
text-decoration: underline dotted;
|
||||
text-underline-offset: 3px;
|
||||
&:hover, &:focus {
|
||||
color: $blue-dark;
|
||||
text-decoration: underline;
|
||||
}
|
||||
@include orange-focus;
|
||||
}
|
||||
.description, .theme-description {
|
||||
font-size: $font-small;
|
||||
color: $font-color;
|
||||
padding-top: 0;
|
||||
*:first-child {
|
||||
margin-top: 0;
|
||||
}
|
||||
a:not(:hover) {
|
||||
color: inherit;
|
||||
text-decoration: none;
|
||||
}
|
||||
}
|
||||
|
||||
//
|
||||
// buttons
|
||||
//
|
||||
|
||||
%button {
|
||||
text-decoration: none;
|
||||
border-radius: $button-border-radius !important;
|
||||
&::before {
|
||||
content: none;
|
||||
display: inline-block;
|
||||
width: 1em;
|
||||
height: 1em;
|
||||
color: inherit;
|
||||
font-family: "FontAwesome";
|
||||
margin-right: .33em;
|
||||
}
|
||||
@include orange-focus;
|
||||
}
|
||||
|
||||
a.pk-inverted-button,
|
||||
div.link-cell.pk-inverted-button ul > li > a {
|
||||
@extend %inverted-button;
|
||||
display: inline-block;
|
||||
}
|
||||
|
||||
%button.icon-back,
|
||||
.link-cell.icon-back ul > li > a {
|
||||
&::before {
|
||||
content: "\f060" !important;
|
||||
}
|
||||
}
|
||||
|
||||
// hexagone
|
||||
@mixin hexagon($width, $radius) {
|
||||
$sqtr3: 1.7320508075688772;
|
||||
border-radius: $radius;
|
||||
height: calc(#{$width / $sqtr3} + #{$radius / 2});
|
||||
&:before,
|
||||
&:after {
|
||||
content: '';
|
||||
display: block;
|
||||
position: absolute;
|
||||
top: 0;
|
||||
bottom: 0;
|
||||
left: 0;
|
||||
right: 0;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
background-color: inherit;
|
||||
border-radius: inherit;
|
||||
transform: rotate(60deg);
|
||||
z-index: -1;
|
||||
}
|
||||
&:after {
|
||||
transform: rotate(-60deg);
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
//
|
||||
// HEADER
|
||||
//
|
||||
|
||||
#top {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
min-height: $header-height;
|
||||
}
|
||||
|
||||
h1#logo.has-logo {
|
||||
flex-grow: 1;
|
||||
line-height: 0;
|
||||
margin-right: 1rem;
|
||||
@media ($min-desktop-viewport) {
|
||||
padding-left: 0;
|
||||
}
|
||||
a {
|
||||
&:before {
|
||||
margin-right: 0;
|
||||
@media ($min-desktop-viewport) {
|
||||
width: 360px;
|
||||
height: 55px;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
div#nav {
|
||||
padding-right: 1rem;
|
||||
z-index: 10;
|
||||
margin-top: 0;
|
||||
& > ul {
|
||||
transition: all ease 0.2s;
|
||||
margin-top: 2rem;
|
||||
margin-bottom: 2rem;
|
||||
li > a {
|
||||
font-weight: normal;
|
||||
#toplinks {
|
||||
position: static;
|
||||
text-align: center;
|
||||
font-size: $font-small;
|
||||
word-spacing: 1rem;
|
||||
a {
|
||||
vertical-align: middle;
|
||||
}
|
||||
.login-link,
|
||||
.account-link {
|
||||
display: inline-block;
|
||||
white-space: nowrap;
|
||||
@media ($max-mobile-viewport) {
|
||||
max-width: 9em;
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
}
|
||||
@extend %button;
|
||||
margin-right: 0;
|
||||
&::before {
|
||||
content: "\f2be";
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
div#main-content-wrapper {
|
||||
padding-top: 2rem;
|
||||
}
|
||||
|
||||
body.has-picture {
|
||||
div#main-content-wrapper {
|
||||
padding-top: 1rem;
|
||||
//
|
||||
// NAV
|
||||
//
|
||||
.gru-nav-wrapper {
|
||||
@media ($max-mobile-viewport) {
|
||||
margin-top: -$header-height;
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
#logo a {
|
||||
color: $primary-color;
|
||||
font-weight: normal;
|
||||
}
|
||||
|
||||
@media screen and ($max-mobile-viewport) {
|
||||
.site-header #header h1 a {
|
||||
margin-top: 1em;
|
||||
div.gru-nav .gru-nav-button {
|
||||
height: 80px;
|
||||
border: 0 solid transparent;
|
||||
border-width: #{($header-height - $nav-menu-side) / 2} 0;
|
||||
.icon-bar {
|
||||
height: 3px;
|
||||
}
|
||||
div#nav, header.site-header {
|
||||
padding-right: 0;
|
||||
border-bottom: 0;
|
||||
#header h1 a {
|
||||
padding-left: 0;
|
||||
&:not(.toggled) {
|
||||
.icon-bar-1, .icon-bar-3 {
|
||||
width: 50%;
|
||||
left: 25%;
|
||||
}
|
||||
}
|
||||
|
||||
div.site-nav > ul {
|
||||
margin-top: 2rem;
|
||||
margin-bottom: 1rem;
|
||||
}
|
||||
|
||||
#toplinks {
|
||||
right: 0;
|
||||
left: 0;
|
||||
top: -3rem;
|
||||
width: 100%;
|
||||
max-width: none;
|
||||
border-radius: 0;
|
||||
+ ul {
|
||||
margin: 0;
|
||||
a {
|
||||
font-weight: 600;
|
||||
&:hover {
|
||||
text-decoration: underline;
|
||||
text-decoration-thickness: 2px;
|
||||
text-underline-offset: 5px;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
div.textcell {
|
||||
h1 {
|
||||
padding-left: 0.7rem;
|
||||
font-weight: normal;
|
||||
// Page image
|
||||
body.has-picture .site-nav::after {
|
||||
position: static;;
|
||||
margin-bottom: -3rem;
|
||||
@media ($max-mobile-viewport) {
|
||||
height: 125px;
|
||||
}
|
||||
}
|
||||
|
||||
#footer-wrapper {
|
||||
background-image: linear-gradient(45deg, #087FA3 20%, #20A791 100%);
|
||||
//
|
||||
// Main
|
||||
//
|
||||
|
||||
main {
|
||||
padding-left: 1em;
|
||||
padding-right: 1em;
|
||||
}
|
||||
#columns-wrapper {
|
||||
padding: 0;
|
||||
}
|
||||
|
||||
// Page header
|
||||
.theme-page-header {
|
||||
display: flow-root;
|
||||
background-color: white;
|
||||
border-radius: $radius-l;
|
||||
padding: 1rem;
|
||||
@media (max-width: $width) {
|
||||
margin: 0 0.33rem;
|
||||
}
|
||||
@media ($min-desktop-viewport) {
|
||||
padding: 3rem;
|
||||
}
|
||||
h1:first-child {
|
||||
margin-top: 0;
|
||||
}
|
||||
.cell + .default-header {
|
||||
display: none;
|
||||
}
|
||||
.page-header--description {
|
||||
font-size: $fz-5;
|
||||
}
|
||||
}
|
||||
|
||||
// Home page page header
|
||||
body {
|
||||
overflow-x: hidden;
|
||||
}
|
||||
.page-template-homepage {
|
||||
&.has-picture .site-nav::after {
|
||||
content: none;
|
||||
}
|
||||
.theme-page-header {
|
||||
background-color: transparent;
|
||||
padding: 0;
|
||||
.banner.text-cell {
|
||||
border-radius: 0;
|
||||
background-image: $gradient;
|
||||
padding-top: 50px;
|
||||
padding-bottom: 50px;
|
||||
// fill viewport
|
||||
width: 100vw;
|
||||
margin-left: calc(-50vw + 50%);
|
||||
padding-left: calc(50vw - 50%);
|
||||
padding-right: calc(50vw - 50%);
|
||||
color: white !important;
|
||||
@media ($min-desktop-viewport) {
|
||||
padding-top: 100px;
|
||||
padding-bottom: 100px;
|
||||
position: relative;
|
||||
> div {
|
||||
width: 50%;
|
||||
}
|
||||
// Page image
|
||||
&::after {
|
||||
content: "";
|
||||
background: var(--page-picture) no-repeat;
|
||||
background-size: contain;
|
||||
background-position: bottom left;
|
||||
display: block;
|
||||
position: absolute;
|
||||
top: 0;
|
||||
bottom: 0;
|
||||
left: 50%;
|
||||
right: 0;
|
||||
}
|
||||
}
|
||||
* {
|
||||
color: inherit;
|
||||
margin: 0;
|
||||
font-weight: normal;
|
||||
}
|
||||
|
||||
+ .tracking-code-input-cell {
|
||||
margin-top: -3rem;
|
||||
@media ($min-desktop-viewport) {
|
||||
margin-top: -4rem;
|
||||
max-width: 60%;
|
||||
position: relative;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
//
|
||||
// Cells
|
||||
//
|
||||
|
||||
.column div.a2-block,
|
||||
.gru-content div.cell,
|
||||
.block {
|
||||
margin-bottom: 1.5rem;
|
||||
& h2 + div,
|
||||
.cell--body {
|
||||
padding-top: 0;
|
||||
}
|
||||
&.has-asset-picture picture {
|
||||
padding-left: $title-padding;
|
||||
display: block;
|
||||
img {
|
||||
width: 48px;
|
||||
height: 48px;
|
||||
padding: 8px;
|
||||
}
|
||||
}
|
||||
&.foldable {
|
||||
h2:first-child {
|
||||
&:hover {
|
||||
color: $blue-dark;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
%cell-links-list {
|
||||
& > li {
|
||||
> a {
|
||||
@extend .a;
|
||||
}
|
||||
}
|
||||
li div.description {
|
||||
padding: 0;
|
||||
@extend .theme-description;
|
||||
padding-bottom: 0.5rem;
|
||||
|
||||
}
|
||||
}
|
||||
|
||||
.bordered-cell {
|
||||
.gru-content &.cell {
|
||||
border: $cell-entry-border;
|
||||
h2:first-child {
|
||||
@extend .h4;
|
||||
font-weight: bold;
|
||||
}
|
||||
.links-list ul li a {
|
||||
.form-number, .form-status {
|
||||
color: $font-color;
|
||||
text-decoration: none;
|
||||
}
|
||||
&:hover {
|
||||
background-color: $gray-light;
|
||||
}
|
||||
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
// For tracking code cells
|
||||
.violet-cell {
|
||||
background-color: $violet-xlight;
|
||||
background-image:
|
||||
repeating-linear-gradient(
|
||||
-45deg,
|
||||
$violet-light,
|
||||
$violet-light 4px,
|
||||
$violet 4px,
|
||||
$violet 8px
|
||||
)
|
||||
;
|
||||
background-repeat: no-repeat;
|
||||
background-size: 5px 100%;
|
||||
h2:first-child, h3 {
|
||||
color: $violet
|
||||
}
|
||||
}
|
||||
|
||||
// Custom text-cell
|
||||
.green-cell {
|
||||
.gru-content &.text-cell {
|
||||
background-color: $green-light;
|
||||
border-radius: $radius-l;
|
||||
padding: 1rem;
|
||||
padding-bottom: 2rem;
|
||||
}
|
||||
}
|
||||
.gray-cell {
|
||||
.gru-content &.text-cell {
|
||||
@extend .green-cell;
|
||||
background-color: $gray-xlight;
|
||||
}
|
||||
}
|
||||
.true-title {
|
||||
.gru-content &.text-cell {
|
||||
h2:first-child {
|
||||
font-size: $fz-2;
|
||||
font-weight: bold;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
.tracking-code-input-cell {
|
||||
.gru-content &.cell {
|
||||
@extend .violet-cell;
|
||||
}
|
||||
}
|
||||
|
||||
// Custom forms-of-category cells
|
||||
.category-link {
|
||||
.gru-content &.wcs-forms-of-category-cell {
|
||||
border-top: $cell-entry-border;
|
||||
.cell--title {
|
||||
@extend %title;
|
||||
@extend .a;
|
||||
font-size: 1rem;
|
||||
|
||||
}
|
||||
picture + .cell--title {
|
||||
padding-top: 0;
|
||||
}
|
||||
}
|
||||
}
|
||||
.forms-only-2-cols {
|
||||
.gru-content &.wcs-forms-of-category-cell {
|
||||
.links-list ul {
|
||||
@extend .fx-grid;
|
||||
> li {
|
||||
border-top: $cell-entry-border;
|
||||
border-bottom: none;
|
||||
@media ($min-grid-tablet-viewport) {
|
||||
flex-basis: calc( 50% - #{$fx-grid-gutter});
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
.category-header {
|
||||
.gru-content &.wcs-forms-of-category-cell {
|
||||
.cell--title {
|
||||
display: flex;
|
||||
picture {
|
||||
flex: 0 0 1em;
|
||||
height: 1em;
|
||||
|
||||
padding-left: 0;
|
||||
margin-right: .33em;
|
||||
align-self: center;
|
||||
img {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
padding: 0;
|
||||
filter: hue-rotate(340deg) brightness(120%);
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
// menu-cell
|
||||
.menu-cell {
|
||||
.gru-content & {
|
||||
.links-list ul {
|
||||
> li {
|
||||
border: none;
|
||||
> a {
|
||||
&:not(:hover) {
|
||||
color: $font-color;
|
||||
text-decoration: none;
|
||||
}
|
||||
}
|
||||
|
||||
&.selected > a {
|
||||
color: white;
|
||||
background-color: $blue;
|
||||
display: flex;
|
||||
border-radius: $radius-s;
|
||||
span {
|
||||
text-decoration: underline 2px;
|
||||
}
|
||||
&::after {
|
||||
content: "\f061"; // arrow right
|
||||
font-family: fontawesome;
|
||||
flex-grow: 1;
|
||||
text-align: right;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
//
|
||||
// WCS
|
||||
//
|
||||
|
||||
.wcs-page {
|
||||
.theme-page-header {
|
||||
display: none;
|
||||
|
||||
}
|
||||
.form-content--sidebox .tracking-code-part,
|
||||
.form-content--body #tracking-code {
|
||||
@extend .violet-cell;
|
||||
}
|
||||
.form-content--body #tracking-code {
|
||||
padding: 1em;
|
||||
}
|
||||
}
|
||||
|
||||
.form-content--title {
|
||||
font-size: 180%;
|
||||
@extend .h1;
|
||||
padding-left: 0;
|
||||
}
|
||||
|
||||
div#rub_service {
|
||||
h3 {
|
||||
font-weight: bold;
|
||||
}
|
||||
.section.foldable h2:first-child {
|
||||
padding-left: 0;
|
||||
@extend .h2;
|
||||
&:hover {
|
||||
color: $blue;
|
||||
text-decoration: underline;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
label {
|
||||
font-weight: 600;
|
||||
}
|
||||
|
||||
.widget .error {
|
||||
font-weight: normal;
|
||||
color: $red-dark;
|
||||
}
|
||||
|
||||
|
||||
// steps
|
||||
.wcs-step {
|
||||
margin-bottom: $wcs-steps-spacing * 2;
|
||||
&.current {
|
||||
font-weight: normal;
|
||||
}
|
||||
&.step-before {
|
||||
color: $blue;
|
||||
}
|
||||
&.step-before &--marker {
|
||||
color: white;
|
||||
background-color: $blue;
|
||||
}
|
||||
}
|
||||
@media ($mq-max--wcs-steps-small-layout) {
|
||||
.wcs-step.current .wcs-step--marker{
|
||||
background-color: white;
|
||||
color: $blue-dark;
|
||||
width: auto;
|
||||
&-nb {
|
||||
display: inline-block;
|
||||
background-color: $blue-dark;
|
||||
color: white;
|
||||
width: 2em;
|
||||
@include hexagon(2em, 5px);
|
||||
}
|
||||
}
|
||||
}
|
||||
@media ($mq-min--wcs-steps-horizontal-layout) {
|
||||
.wcs-steps {
|
||||
font-size: 1em;
|
||||
}
|
||||
.wcs-step {
|
||||
&--marker {
|
||||
@include hexagon($wcs-step-marker-size, 5px);
|
||||
.step-after & {
|
||||
filter: drop-shadow(0 0 2px #333);
|
||||
}
|
||||
&-nb {
|
||||
line-height: 0;
|
||||
}
|
||||
}
|
||||
}
|
||||
.wcs-step--label {
|
||||
font-size: 1em;
|
||||
}
|
||||
}
|
||||
@include desktop-vertical-steps() {
|
||||
.wcs-steps {
|
||||
margin-top: 2rem;
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
//
|
||||
// FOOTER
|
||||
//
|
||||
|
||||
#footer-wrapper {
|
||||
background-image: $gradient-reverse;
|
||||
padding-top: 2.5rem;
|
||||
padding-botom: 2.5rem;
|
||||
|
||||
%cell-links-list {
|
||||
> li {
|
||||
border: none;
|
||||
}
|
||||
> li > a {
|
||||
padding-top: 0;
|
||||
padding-bottom: 0;
|
||||
}
|
||||
}
|
||||
}
|
||||
.back-top--link:not(:hover) {
|
||||
text-decoration: none;
|
||||
}
|
||||
|
|
|
@ -1,55 +1,139 @@
|
|||
$primary-color:#087FA3;
|
||||
$nav-active-color: $primary-color;
|
||||
$nav-item-selected-mode: bottom-border;
|
||||
$sidebar-width: 33%;
|
||||
// colors
|
||||
$blue: #087FA3;
|
||||
$blue-dark: #055A81;
|
||||
$blue-light: #E4F4FB;
|
||||
|
||||
$green: #20A791;
|
||||
$green-light: #E0F6EE;
|
||||
$green-dark: #167E6A;
|
||||
$green-xdark: #0F5B4C;
|
||||
|
||||
$orange: #E17120;
|
||||
|
||||
$violet: #6D29B1;
|
||||
$violet-light: #ba9cd9;
|
||||
$violet-xlight: #efeaf4;
|
||||
|
||||
$gray: #D4D1CE;
|
||||
$gray-light: #EFEDEB;
|
||||
$gray-xlight: #F6F5F4;
|
||||
$gray-dark: #949494;
|
||||
$gray-xdark: #707070;
|
||||
|
||||
$red-dark: #A61010;
|
||||
|
||||
$gradient: linear-gradient(
|
||||
45deg,
|
||||
$green,
|
||||
$blue-dark
|
||||
);
|
||||
$gradient-reverse: linear-gradient(
|
||||
225deg,
|
||||
$green,
|
||||
$blue-dark
|
||||
);
|
||||
|
||||
// typo
|
||||
$title-ratio: 1.2;
|
||||
$fz-5: $title-ratio*1em;
|
||||
$fz-4: $fz-5*$title-ratio;
|
||||
$fz-3: $fz-4*$title-ratio;
|
||||
$fz-2: $fz-3*$title-ratio;
|
||||
$fz-1: $fz-2*$title-ratio;
|
||||
|
||||
$font-small: 0.875em;
|
||||
|
||||
// border radius
|
||||
$radius-s: 0.2rem;
|
||||
$radius-l: 1rem;
|
||||
|
||||
// Layout
|
||||
$header-height: 80px;
|
||||
|
||||
// Core vars
|
||||
$primary-color: $blue;
|
||||
|
||||
$font-color: black;
|
||||
$font-family: "Source sans pro", Ubuntu, Cantarell, Noto Sans, sans-serif;
|
||||
$font-color: #000000;
|
||||
$font-size: 100%;
|
||||
$link-color: $primary-color;
|
||||
$footer-color: white;
|
||||
$footer-link-color: #FFFFFF;
|
||||
|
||||
$width: 1280px;
|
||||
$border-radius: 1rem;
|
||||
$grid-gutter: 2rem;
|
||||
$columns-gutter: 2rem;
|
||||
$grid-gutter: 2rem;
|
||||
$sidebar-width: 33%;
|
||||
$sidebar-min-width: 300px;
|
||||
$footer-background: #087fa3;
|
||||
$title-border-radius: 0;
|
||||
$title-font-size: $font-size * 1.2;
|
||||
$title-padding: 1em 0 .75em 1rem;
|
||||
$title-border-top: 2px solid;
|
||||
$title-background: transparent;
|
||||
$title-weight: bold;
|
||||
$form-sidebar-width: 25%;
|
||||
$button-hover-background: #055A81;
|
||||
$button-background: $link-color;
|
||||
$widget-background: #F6F5F4;
|
||||
$button-color: #FFFFFF;
|
||||
$widget-focus-background: #FFFFFF;
|
||||
$widget-border-radius: $border-radius;
|
||||
$form-sidebar-gutter: $columns-gutter;
|
||||
$widget-focus-border: 1px solid #087FA3;
|
||||
$widget-focus-box-shadow: inset 0 0 0 1px #087FA3;
|
||||
$nav-active-color: #087FA3;
|
||||
$nav-submenu-color: $font-color;
|
||||
$nav-after-image-height: 250px;
|
||||
|
||||
$header-logo-size: 137px 30px;
|
||||
$toplinks-style: none;
|
||||
|
||||
$nav-border-color: none;
|
||||
$nav-background: black;
|
||||
$nav-full-width-background: true;
|
||||
$nav-color: white;
|
||||
$nav-border-radius: 0;
|
||||
$button-border: none;
|
||||
$wcs-step-current-color: $link-color;
|
||||
$wcs-step-marker-type: disc;
|
||||
$widget-border:1px solid #d2d2d2;
|
||||
$widget-custom-radio-checkbox: 1;
|
||||
$widget-unique-checkbox-position: left;
|
||||
$wcs-step-border-bottom: none;
|
||||
$wcs-step-current-border-bottom: none;
|
||||
$wcs-step-marker-background: transparent;
|
||||
$wcs-step-current-marker-background: transparent;
|
||||
$cell-border-radius: 0;
|
||||
$nav-item-selected-background: $gray-xdark;
|
||||
$nav-item-hover-background: $nav-background;
|
||||
$nav-submenu-color: $nav-color;
|
||||
|
||||
$nav-button-background: transparent;
|
||||
$nav-button-color: black;
|
||||
$nav-menu-side: 35px;
|
||||
$nav-mobile-menu-background: $nav-background;
|
||||
$nav-mobile-menu-item-hover-background: $nav-item-selected-background;
|
||||
$nav-mobile-menu-item-color: $nav-color;
|
||||
|
||||
$nav-after-image-height: 200px;
|
||||
|
||||
$title-border-radius: 0;
|
||||
$title-font-size: $fz-3;
|
||||
$title-padding: 1rem;
|
||||
$title-background: transparent;
|
||||
$title-weight: normal;
|
||||
|
||||
$cell-border-radius: $radius-s;
|
||||
$cell-image-padding: 0;
|
||||
$cell-entry-color: #055A81;
|
||||
$cell-border: none;
|
||||
$cell-background: transparent;
|
||||
$table-headers-color: #000000;
|
||||
|
||||
$cell-entry-color: $link-color;
|
||||
$cell-entry-hover-background: transparent;
|
||||
$cell-entry-border-color: $gray;
|
||||
|
||||
$form-sidebar-width: 25%;
|
||||
$form-sidebar-gutter: $columns-gutter;
|
||||
|
||||
$button-color: white;
|
||||
$button-hover-background: #055A81;
|
||||
$button-background: $link-color;
|
||||
$button-border: none;
|
||||
$button-border-radius: $radius-l;
|
||||
$cancel-button-style: '%inverted-button';
|
||||
$buttons-order: cancel (grow), previous, submit;
|
||||
|
||||
$form-accent-color: $primary-color;
|
||||
$widget-unique-checkbox-position: left;
|
||||
$widget-background: white;
|
||||
$widget-border-radius: $radius-l;
|
||||
$widget-border: 1px solid $gray;
|
||||
$widget-focus-border: 1px solid $blue;
|
||||
$widget-focus-box-shadow: inset 0 0 0 1px $blue;
|
||||
$widget-focus-outline: 2px solid $blue-light;
|
||||
$widget-focus-outline-offset: 1px;
|
||||
|
||||
$wcs-step-current-color: $link-color;
|
||||
$wcs-step-marker-type: disc;
|
||||
|
||||
$wcs-steps-spacing: 1rem;
|
||||
$wcs-step-color: $gray-dark;
|
||||
$wcs-step-border-bottom: none;
|
||||
$wcs-step-marker-size: 1.8em;
|
||||
$wcs-step-marker-background: white;
|
||||
$wcs-step-current-marker-color: white;
|
||||
$wcs-step-current-marker-background: $blue-dark;
|
||||
$wcs-step-marker-type: square tied;
|
||||
$wcs-step-marker-tie-width: 2px;
|
||||
|
||||
$table-headers-color: black;
|
||||
$table-headers-background: #E4F3F9;
|
||||
$table-caption-color: $font-color;
|
||||
$table-headers-font-family: $font-family;
|
||||
|
@ -57,4 +141,11 @@ $table-headers-font-size: 1rem;
|
|||
$table-headers-font-weight: bold;
|
||||
$table-headers-text-transform: none;
|
||||
$table-headers-font-style: normal;
|
||||
|
||||
$footer-color: white;
|
||||
$footer-link-color: white;
|
||||
$footer-background: #087fa3;
|
||||
|
||||
$back-top-display: block;
|
||||
$back-top-icon-character: "\f062";
|
||||
$back-top-icon-size: 1em;
|
||||
|
|
|
@ -1,12 +1,39 @@
|
|||
{
|
||||
"label": "Nantes",
|
||||
"variables": {
|
||||
"theme_color": "#087FA3"
|
||||
"theme_color": "#087FA3",
|
||||
"email_header_asset": "emails:logo"
|
||||
},
|
||||
"settings": {
|
||||
"combo": {
|
||||
"COMBO_ASSET_SLOTS.update": {
|
||||
"header:logo": { "label": "Têtière : logo" }
|
||||
"header:logo": {"label": "Têtière : logo"},
|
||||
"emails:logo": {"label": "Emails : logo"}
|
||||
},
|
||||
"COMBO_PUBLIC_TEMPLATES.update": {
|
||||
"category_detail": {
|
||||
"name": "Catégorie",
|
||||
"template": "combo/page_category.html"
|
||||
}
|
||||
},
|
||||
"COMBO_CELL_TEMPLATES.update" : {
|
||||
"wcs_wcsformsofcategorycell" : {
|
||||
"category-link" : {
|
||||
"extra-css-classes" : "category-link",
|
||||
"label" : "Lien catégorie",
|
||||
"template" : "combo/cells/category-link/forms_of_category.html"
|
||||
},
|
||||
"category-header" : {
|
||||
"extra-css-classes" : "category-header",
|
||||
"label" : "Entête catégorie",
|
||||
"template" : "combo/cells/category-header/forms_of_category.html"
|
||||
},
|
||||
"forms-only" : {
|
||||
"extra-css-classes" : "forms-only-2-cols",
|
||||
"label" : "Démarches uniquement, 2 colonnes",
|
||||
"template" : "combo/cells/forms-only/forms_of_category.html"
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
|
@ -0,0 +1,18 @@
|
|||
{% load assets %}
|
||||
{% get_asset cell=cell type='picture' as asset %}
|
||||
|
||||
{% block cell-content %}
|
||||
{% if forms or combo_display_even_empty_categories %}
|
||||
{% block cell-header %}
|
||||
<h1 class="cell--title">
|
||||
{% include "combo/asset_picture_fragment.html" %}
|
||||
{{ title }}
|
||||
</h1>
|
||||
{% if description %}
|
||||
<div class="description page-header--description">
|
||||
{{ description|safe }}
|
||||
</div>
|
||||
{% endif %}
|
||||
{% endblock %}
|
||||
{% endif %}
|
||||
{% endblock %}
|
|
@ -0,0 +1,16 @@
|
|||
{% load assets i18n %}
|
||||
{% block cell-content %}
|
||||
{% if forms or combo_display_even_empty_categories %}
|
||||
{% block cell-header %}
|
||||
{% include "combo/asset_picture_fragment.html" %}
|
||||
<h3 class="cell--title">
|
||||
<a href="{{ portal_url }}{{ category_path }}{{ slug }}">{{ title }}</a>
|
||||
</h3>
|
||||
{% if description %}
|
||||
<div class="cell--body description">
|
||||
{{ description|safe }}
|
||||
</div>
|
||||
{% endif %}
|
||||
{% endblock %}
|
||||
{% endif %}
|
||||
{% endblock %}
|
|
@ -0,0 +1,3 @@
|
|||
{% extends "combo/wcs/forms_of_category.html" %}
|
||||
|
||||
{% block cell-header %}{% endblock %}
|
|
@ -0,0 +1,20 @@
|
|||
{% extends "combo/page_template.html" %}
|
||||
{% load combo %}
|
||||
|
||||
{% block content-pre %}
|
||||
<header class="theme-page-header gru-content">
|
||||
{% placeholder "page_header" name="Entête de la page" optional=False acquired=False %}
|
||||
<div class="default-header">
|
||||
{% block default_page_header_content %}
|
||||
<h1>
|
||||
{{ page.title }}
|
||||
</h1>
|
||||
{% if page.description %}
|
||||
<div class="description page-header--description">
|
||||
<p>{{ page.description }}</p>
|
||||
</div>
|
||||
{% endif %}
|
||||
{% endblock %}
|
||||
</div>
|
||||
</header>
|
||||
{% endblock %}
|
|
@ -0,0 +1 @@
|
|||
{% extends "combo/page_template.html" %}
|
Loading…
Reference in New Issue