add new theme ma-cnil (#53106)

This commit is contained in:
Thomas NOËL 2021-04-14 00:05:20 +02:00 committed by Thomas NOEL
parent 239cd0b542
commit 8e3618797e
6 changed files with 475 additions and 0 deletions

392
static/ma-cnil/_custom.scss Normal file
View File

@ -0,0 +1,392 @@
a:link, a:visited {
color: $link-color;
&:hover {
text-decoration: underline;
}
}
a.pk-button:link, a.pk-button:visited {
color: white;
}
%button {
@extend %button;
&:hover {
text-decoration: none !important;
box-shadow: none;
}
}
body {
background: $lightgray;
@media screen and ($max-mobile-viewport) {
background: white;
}
h1, h2, h3 {
font-family: $title-font-family;
}
h2, h4 {
color: $lightblue;
}
}
.site-header {
background: none;
border-top: none;
h1#logo {
padding: 10px 0;
@media screen and ($max-mobile-viewport) {
padding: 10px 50px;
}
a {
display: block;
margin: 0 0;
width: 208px;
height: 47px;
background: url(/assets/header:logo) no-repeat;
background-size: cover;
text-indent: -10000px;
}
}
#toplinks {
background: $logoblue;
border: 1px solid white;
box-shadow: none;
border-radius: 0;
top: 11px;
padding-bottom: 0.6rem;
a {
color: white;
}
span { color: #f2f0e7;}
}
}
div#header {
background: $logoblue;
padding: 0 1.2em;
}
.site-nav {
font-family: $title-font-family;
@media screen and ($max-mobile-viewport) {
text-align: left;
}
div.gru-nav > ul > li a {
font-weight: 400;
color: $deepblue;
}
@media screen and ($max-mobile-viewport) {
div.gru-nav-wrapper {
background: transparent;
}
}
}
#main-content {
background: white;
padding: 0.5rem 1rem;
@media screen and ($max-mobile-viewport) {
padding: 0.5rem 0.5rem;
}
}
div.comment-field,
div.textcell {
line-height: 1.4285714;
h1, h2, h3, h4, p {
margin: 0.7em 0;
}
}
footer {
margin-top: 30px;
@media screen and ($max-mobile-viewport) {
margin-top: 0;
}
h1, h2, h3 {
color: white;
}
ul, li {
list-style: none;
margin: 0;
padding: 0;
}
a:link {
color: #A9A9A9;
&:hover {
color: #4796ec;
}
}
}
.cell.textcell.intro,
div#title-section {
h1 {
font-family: "Open Sans Condensed", $title-font-family;
font-size: 2.375rem;
color: #333;
font-weight: bold;
}
p {
font-family: "Open Sans Semibold", $title-font-family;
font-size: 130%;
color: $lightblue;
margin: 0 auto;
}
}
// STEPS
.wcs-steps {
font-family: $title-font-family;
}
.wcs-step--label {
text-transform: uppercase;
}
@media ($mq-min--wcs-steps-horizontal-layout) {
.wcs-steps--list {
justify-content: center;
align-items: flex-end;
overflow: hidden;
}
.wcs-step {
flex-direction: column;
align-items: center;
flex: 1 1 6em;
max-width: 11em;
position: relative;
font-size: 1.2em;
&--label {
position: static;
font-size: 0.67em;
order: -1;
padding-bottom: .66em;
text-align: center;
}
&:not(.current) & {
&--label {
display: block;
}
}
// Tie
&::after {
position: absolute;
bottom: calc( (#{$wcs-step-marker-size} - #{$wcs-step-marker-tie-width}) / 2}) !important;
left: 50%;
width: calc(100% + #{$wcs-step-marker-size});
}
}
}
div#rub_service div#tracking-code {
text-align: center;
button {
margin-right: 0;
}
h3, a {
font-size: 100%;
display: inline-block;
}
}
div.form-validation {
div.page {
background: $lightgray;
}
div.title label {
font-weight: bold;
}
input[readonly], select[readonly], textarea[readonly] {
border-width: 0 0 3px 0;
}
}
div.gru-content #rub_service form.quixote {
h3, h4 {
clear: both;
margin: 25px 0;
text-align: left;
font-size: 1.625rem;
line-height: 40px;
color: $darkgray;
border-bottom: none;
}
h4 {
font-size: 1.375rem;
}
div.buttons {
}
}
.wcs-step--label {
font-weight: 500;
}
div.errornotice {
color: #cc1a1a;
}
.gru-content div.cell.inverse {
background: $logoblue;
color: white;
h2 {
background: $logoblue;
color: white;
}
}
div.links-list ul > li > a {
color: $link-color;
}
div.list-of-forms {
span.form-status {
font-weight: bold;
}
span.form-number {
opacity: 1;
font-size: 100%;
color: $typogray;
}
}
.a2-block + #frontend-registration-fc, .block + .block-fc,
.block + .block-fc {
border-left: none;
}
#registration-blocks,
#login-page {
h2 {
text-transform: uppercase;
font-size: 115%;
margin-top: 2rem;
margin-bottom: 0;
padding-bottom: 0;
@media screen and ($max-mobile-viewport) {
margin-top: 0;
}
}
form {
margin-left: 0;
p {
margin-left: 0;
}
}
}
@media screen and ($max-mobile-viewport) {
#login-page.methods2 > .block {
margin-left: 0;
margin-right: 0;
}
}
.a2-block + #frontend-registration-fc::after,
.block + .block-fc::after {
margin-top: 60px;
font-weight: bold;
font-size: 1.5rem;
font-family: $title-font-family;
color: $logoblue;
}
div.block {
&.block-fc h2 {
padding-left: 0;
}
div#fc-registration-user-info, div#fc-button-wrapper, div#fc-explanation-text {
text-align: left;
}
}
div.a2-block {
h2 {
padding-left: 0;
}
div#fc-registration-user-info, div#fc-button-wrapper, div#fc-explanation-text {
text-align: left;
}
}
h2.intertitle {
text-align: center;
color: $title-color;
}
div.registration-bottom {
padding-top: 20px;
clear: both;
position: relative;
&::before {
content: '';
height: 3px;
width: 170px;
display: block;
margin: 30px auto 10px auto;
background: $gray;
}
text-align: center;
}
div#rub_service div.dataview, div#rub_service dl#evolutions, div#rub_service form {
padding: 0.5rem 1rem;
}
// adjustments for extra right gutter
div.form-validation div.page {
padding-left: 2rem;
}
div#rub_service #steps ~ form {
margin-right: #{0 - $grid-gutter};
@media screen and ($max-mobile-viewport) {
margin-right: 0;
}
}
div.widget label {
font-weight: bold;
}
.text-check-before-submit {
text-align: center;
font-size: 1.25rem;
font-style: italic;
}
.mention {
font-size: 80%;
text-align: center;
&::before {
content: '';
height: 3px;
width: 170px;
display: block;
margin: 30px auto 10px auto;
background: #c6bfa5;
}
}
div.error {
background-image: url(img/alerte-saisie.png);
background-size: 16px;
}
#profile span.label {
color: $font-color;
font-weight: bold;
}
#registration-blocks h2 {
padding-left: 1rem;
}

64
static/ma-cnil/_vars.scss Normal file
View File

@ -0,0 +1,64 @@
@import '../includes/fonts/opensans';
@import '../includes/fonts/opensans-condensed';
$gray: #f2f0e7;
$logoblue: #3879bf; // colour defined in #37830
$darkgray: #222222;
$typogray: #444444;
$lightblue: #3879bf;
$lightgray: #f8f7f7;
$red: #dd2c2d;
$deepblue: #004084;
$font-family: "Open Sans", arial, sans-serif;
$title-font-family: "Open Sans Condensed Bold", arial, sans-serif;
$title-transform: none;
$title-font-size: 1.25rem;
$title-weight: bold;
$title-background: white;
$title-color: $darkgray;
$title-padding: 0.7rem 0.5rem;
$width: 1000px;
$font-color: $typogray;
$font-size: 1em;
$footer-background: #222222;
$footer-color: #999999;
$nav-background: white;
$nav-full-width-background: false;
$nav-color: $typogray;
$nav-active-color: #333;
$nav-item-selected-background: transparent;
$nav-item-selected-color: $nav-active-color;
$nav-submenu-color: $nav-color;
$border-radius: 0;
$button-background: $logoblue;
$button-hover-background: $lightblue;
$button-color: white;
$button-border-radius: 0;
$link-color: $lightblue;
$cell-border: none;
$widget-border: 2px solid $gray;
$widget-focus-border: 2px solid #66afe9;
$grid-gutter: 2rem;
$form-sidebar-position: top;
$wcs-steps-spacing: .7rem;
$wcs-step-border-bottom: none;
$wcs-step-marker-type: disc tied;
$wcs-step-current-color: #333;
$wcs-step-marker-color: #626262;
$wcs-step-current-marker-color: white;
$wcs-step-current-marker-background: $lightblue;
$wcs-step-marker-background: $gray;
$wcs-step-marker-tie-color: $gray;
$wcs-step-marker-tie-width: 3px;
$wcs-step-color: #626262;
$notification_error_color: #fcefef;
$buttons-order: previous, submit, cancel;
$buttons-alignment: center;

View File

@ -0,0 +1,14 @@
{
"label": "CNIL (ma.cnil)",
"variables": {
"favicon": "ma-cnil/img/favicon.png",
"theme_color": "#2c1e9e"
},
"settings": {
"combo": {
"COMBO_ASSET_SLOTS.update": {
"header:logo": { "label": "Têtière : logo" }
}
}
}
}

Binary file not shown.

After

Width:  |  Height:  |  Size: 5.5 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 2.1 KiB

View File

@ -0,0 +1,5 @@
@charset "UTF-8";
@import 'vars';
@import '../includes/publik';
@import 'custom';