bachir/d9-eql
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

retouche design

Browse Source
This commit is contained in:
ouidade
2022-01-27 15:34:13 +01:00
parent 199e8b4f8c
commit 8f5b2d283c
8 changed files with 99 additions and 50 deletions
Download Patch File Download Diff File Expand all files Collapse all files
web/themes/custom/eql/css-compiled/styles.css
+34 -18
View File
@@ -189,7 +189,7 @@ a {
padding-bottom: 0rem; } } padding-bottom: 0rem; } }
.path-node.page-node-type-static .layout-container .layout-content .layout__region--top .block-entity-fieldnodetitle { .path-node.page-node-type-static .layout-container .layout-content .layout__region--top .block-entity-fieldnodetitle {
width: fit-content; width: fit-content;
margin-left: 13%; margin-left: 11%;
margin-top: 15vh; } margin-top: 15vh; }
@media (max-width: 810px) { @media (max-width: 810px) {
.path-node.page-node-type-static .layout-container .layout-content .layout__region--top .block-entity-fieldnodetitle { .path-node.page-node-type-static .layout-container .layout-content .layout__region--top .block-entity-fieldnodetitle {
@@ -375,7 +375,7 @@ a {
min-height: 100vh; } min-height: 100vh; }
.path-frontpage .block-region-content .block-views-blockhome-nodes-block-1 { .path-frontpage .block-region-content .block-views-blockhome-nodes-block-1 {
grid-area: presentation; grid-area: presentation;
background: url("../images/pictos/forme_home_2.svg"); background: url("../images/carre_site.mp4");
background-size: 75%; background-size: 75%;
background-position-y: bottom; background-position-y: bottom;
background-position-x: left; background-position-x: left;
@@ -1883,25 +1883,38 @@ a {
margin-top: 4rem; margin-top: 4rem;
background-color: #009ee3; background-color: #009ee3;
height: fit-content; height: fit-content;
width: 80%; width: 60%;
margin-left: 2rem; } margin-left: 2rem;
aspect-ratio: 1/1;
display: flex; }
@media (max-width: 1260px) {
.offresdeservices .layout-content .region-content #block-contenudelapageprincipale .layout--onecol .block-region-content .block-block-content7dc5bc6b-f5ca-4815-b689-49382aafa2dc {
width: 70%; } }
@media (max-width: 1073px) {
.offresdeservices .layout-content .region-content #block-contenudelapageprincipale .layout--onecol .block-region-content .block-block-content7dc5bc6b-f5ca-4815-b689-49382aafa2dc {
width: 80%; } }
@media (max-width: 935px) {
.offresdeservices .layout-content .region-content #block-contenudelapageprincipale .layout--onecol .block-region-content .block-block-content7dc5bc6b-f5ca-4815-b689-49382aafa2dc {
width: 90%; } }
@media (max-width: 810px) {
.offresdeservices .layout-content .region-content #block-contenudelapageprincipale .layout--onecol .block-region-content .block-block-content7dc5bc6b-f5ca-4815-b689-49382aafa2dc {
width: 100%; } }
.offresdeservices .layout-content .region-content #block-contenudelapageprincipale .layout--onecol .block-region-content .block-block-content7dc5bc6b-f5ca-4815-b689-49382aafa2dc .field--name-field-lien { .offresdeservices .layout-content .region-content #block-contenudelapageprincipale .layout--onecol .block-region-content .block-block-content7dc5bc6b-f5ca-4815-b689-49382aafa2dc .field--name-field-lien {
display: flex; display: flex;
flex-direction: column; flex-direction: column;
margin-top: 2rem; text-align: center;
margin-bottom: 2rem; margin: auto;
margin-left: 1.5rem; padding: 1rem; }
margin-right: 1.5rem;
text-align: center; }
.offresdeservices .layout-content .region-content #block-contenudelapageprincipale .layout--onecol .block-region-content .block-block-content7dc5bc6b-f5ca-4815-b689-49382aafa2dc .field--name-field-lien a { .offresdeservices .layout-content .region-content #block-contenudelapageprincipale .layout--onecol .block-region-content .block-block-content7dc5bc6b-f5ca-4815-b689-49382aafa2dc .field--name-field-lien a {
display: block;
font-weight: 800; font-weight: 800;
color: white; color: white;
font-size: 1.3rem; } font-size: 1.3rem; }
.offresdeservices .layout-content .region-content #block-contenudelapageprincipale .layout--onecol .block-region-content .block-block-content7dc5bc6b-f5ca-4815-b689-49382aafa2dc .field--name-field-lien:after { .offresdeservices .layout-content .region-content #block-contenudelapageprincipale .layout--onecol .block-region-content .block-block-content7dc5bc6b-f5ca-4815-b689-49382aafa2dc .field--name-field-lien a:after {
margin-left: auto; margin-left: 80%;
padding-top: 1rem; padding-top: 0.5rem;
display: block; display: block;
content: url("../images/pictos/noun_Arrow_3771902.svg"); } content: url("../images/pictos/noun_Arrow_3771902.svg"); }
.offresdeservices .layout-content .region-content #block-contenudelapageprincipale .layout--onecol .block-region-content .block-views-blockoffres-de--block-1 { .offresdeservices .layout-content .region-content #block-contenudelapageprincipale .layout--onecol .block-region-content .block-views-blockoffres-de--block-1 {
grid-column: 2 / span 3; } grid-column: 2 / span 3; }
@media (max-width: 810px) { @media (max-width: 810px) {
@@ -2081,7 +2094,7 @@ a {
grid-row: 3; grid-row: 3;
text-transform: uppercase; text-transform: uppercase;
font-weight: 800; font-weight: 800;
font-size: 0.8rem; font-size: 1.2rem;
margin-top: 0.5rem; } margin-top: 0.5rem; }
.page-node-type-offre-de-service .layout__region--top .block-region-top .block-entity-fieldnodefield-structure::after { .page-node-type-offre-de-service .layout__region--top .block-region-top .block-entity-fieldnodefield-structure::after {
content: url('data:image/svg+xml,<svg width="160" height="30" xmlns="http://www.w3.org/2000/svg" version="1.1"> <line x1="0" x2="80" y1="20" y2="20" stroke-linecap="cube" stroke="rgb(0,158,227)" stroke-width="3"/></svg>'); } content: url('data:image/svg+xml,<svg width="160" height="30" xmlns="http://www.w3.org/2000/svg" version="1.1"> <line x1="0" x2="80" y1="20" y2="20" stroke-linecap="cube" stroke="rgb(0,158,227)" stroke-width="3"/></svg>'); }
@@ -2092,7 +2105,7 @@ a {
grid-row: 4; grid-row: 4;
font-size: 2.5rem; font-size: 2.5rem;
font-family: "Source Code Pro"; font-family: "Source Code Pro";
padding-right: 15%; } width: 70%; }
@media (max-width: 810px) { @media (max-width: 810px) {
.page-node-type-offre-de-service .layout__region--top .block-region-top .block-entity-fieldnodetitle { .page-node-type-offre-de-service .layout__region--top .block-region-top .block-entity-fieldnodetitle {
font-size: 1.2rem; } } font-size: 1.2rem; } }
@@ -2105,7 +2118,8 @@ a {
grid-row: 5; grid-row: 5;
text-transform: uppercase; text-transform: uppercase;
font-weight: 800; font-weight: 800;
font-size: 00.8rem; } font-size: 0.8rem;
margin-top: 1.5rem; }
.page-node-type-offre-de-service .layout__region--top .block-region-top .block-entity-fieldnodefield-date-de-proposition { .page-node-type-offre-de-service .layout__region--top .block-region-top .block-entity-fieldnodefield-date-de-proposition {
background: white; background: white;
width: fit-content; width: fit-content;
@@ -2870,7 +2884,9 @@ a {
height: auto; } height: auto; }
#header-top .region-header-top-left #block-headermenu { #header-top .region-header-top-left #block-headermenu {
align-self: baseline; align-self: baseline;
width: 70%; } width: 70%;
margin-left: 3rem;
margin-right: 3rem; }
#header-top .region-header-top-left ul { #header-top .region-header-top-left ul {
font-size: 1rem; font-size: 1rem;
list-style: none; list-style: none;
web/themes/custom/eql/css-prefixed/styles.css
+15 -11
View File
File diff suppressed because one or more lines are too long
web/themes/custom/eql/scss/pages/_home.scss
+2 -1
View File
@@ -20,7 +20,8 @@
.block-views-blockhome-nodes-block-1{ .block-views-blockhome-nodes-block-1{
grid-area: presentation; grid-area: presentation;
// grid-row: 1; // grid-row: 1;
background: url("../images/pictos/forme_home_2.svg"); // background: url("../images/pictos/forme_home_2.svg");
background: url("../images/carre_site.mp4");
background-size: 75%; background-size: 75%;
background-position-y: bottom; background-position-y: bottom;
background-position-x: left; background-position-x: left;
web/themes/custom/eql/scss/pages/_offre.scss
+5 -3
View File
@@ -87,7 +87,7 @@
grid-row: 3; grid-row: 3;
text-transform: uppercase; text-transform: uppercase;
font-weight: 800; font-weight: 800;
font-size: 0.8rem; font-size: 1.2rem;
margin-top: 0.5rem; margin-top: 0.5rem;
&::after{ &::after{
content:url('data:image/svg+xml,<svg width="160" height="30" xmlns="http://www.w3.org/2000/svg" version="1.1"> <line x1="0" x2="80" y1="20" y2="20" stroke-linecap="cube" stroke="rgb(0,158,227)" stroke-width="3"/></svg>'); content:url('data:image/svg+xml,<svg width="160" height="30" xmlns="http://www.w3.org/2000/svg" version="1.1"> <line x1="0" x2="80" y1="20" y2="20" stroke-linecap="cube" stroke="rgb(0,158,227)" stroke-width="3"/></svg>');
@@ -100,7 +100,8 @@
grid-row: 4; grid-row: 4;
font-size: 2.5rem; font-size: 2.5rem;
font-family: "Source Code Pro"; font-family: "Source Code Pro";
padding-right: 15%; // padding-right: 15%;
width: 70%;
@media (max-width: 810px){ @media (max-width: 810px){
font-size: 1.2rem; font-size: 1.2rem;
} }
@@ -115,7 +116,8 @@
grid-row: 5; grid-row: 5;
text-transform: uppercase; text-transform: uppercase;
font-weight: 800; font-weight: 800;
font-size: 00.8rem; font-size: 0.8rem;
margin-top: 1.5rem;
} }
.block-entity-fieldnodefield-date-de-proposition{ .block-entity-fieldnodefield-date-de-proposition{
background: $white; background: $white;
web/themes/custom/eql/scss/pages/_offresdeservices.scss
+30 -13
View File
@@ -54,29 +54,46 @@
margin-top: 4rem; margin-top: 4rem;
background-color: $blue-light; background-color: $blue-light;
height: fit-content; height: fit-content;
width: 80%; width: 60%;
// width: 80%;
margin-left: 2rem; margin-left: 2rem;
aspect-ratio: 1/1;
display: flex;
@media (max-width: 1260px) {
width: 70%;
}
@media (max-width: 1073px) {
width: 80%;
}
@media (max-width: 935px) {
width: 90%;
}
@media (max-width: 810px) {
width: 100%;
}
.field--name-field-lien{ .field--name-field-lien{
display: flex; display: flex;
flex-direction: column; flex-direction: column;
margin-top: 2rem; // margin-top: 2rem;
margin-bottom: 2rem; // margin-bottom: 2rem;
margin-left: 1.5rem; // margin-left: 1.5rem;
margin-right: 1.5rem; // margin-right: 1.5rem;
text-align: center; text-align: center;
margin: auto;
padding: 1rem;
a{ a{
display: block;
font-weight: 800; font-weight: 800;
color: $white; color: $white;
font-size: 1.3rem; font-size: 1.3rem;
&:after{
margin-left:80%;
padding-top: 0.5rem;
display: block;
content:url("../images/pictos/noun_Arrow_3771902.svg")
}
} }
&:after{
margin-left: auto;
padding-top: 1rem;
display: block;
content:url("../images/pictos/noun_Arrow_3771902.svg")
}
} }
web/themes/custom/eql/scss/pages/_static.scss
+1 -1
View File
@@ -20,7 +20,7 @@
} }
.block-entity-fieldnodetitle{ .block-entity-fieldnodetitle{
width: fit-content; width: fit-content;
margin-left: 13%; margin-left: 11%;
margin-top: 15vh; margin-top: 15vh;
@media (max-width: 810px){ @media (max-width: 810px){
margin-left: 8%; margin-left: 8%;
web/themes/custom/eql/scss/partials/_header.scss
+6 -3
View File
@@ -32,8 +32,8 @@
scroll-margin: 8rem {}; scroll-margin: 8rem {};
// logo + menu déroulant
.region-header-top-left { // logo + menu déroulant .region-header-top-left {
display:flex; display:flex;
flex-direction: row; flex-direction: row;
padding: 1rem; padding: 1rem;
@@ -67,6 +67,8 @@
#block-headermenu{ #block-headermenu{
align-self: baseline; align-self: baseline;
width: 70%; width: 70%;
margin-left: 3rem;
margin-right: 3rem;
} }
ul{ ul{
@@ -190,7 +192,8 @@
} }
#block-burger { // menu burger à droite // menu burger à droite
#block-burger {
z-index: 1; z-index: 1;
background-color: $blue-light; background-color: $blue-light;
font-size: 0.7rem; font-size: 0.7rem;
web/themes/custom/eql/templates/block.html.twig
+6
View File
@@ -35,10 +35,16 @@
<div{{ attributes.addClass(classes) }}> <div{{ attributes.addClass(classes) }}>
{{ title_prefix }} {{ title_prefix }}
{% if label %} {% if label %}
<video autoplay muted loop id="myVideo">
<source src="rain.mp4" type="video/mp4">
</video>
<span><h2{{ title_attributes }}>{{ label }}</h2></span> <span><h2{{ title_attributes }}>{{ label }}</h2></span>
{% endif %} {% endif %}
{{ title_suffix }} {{ title_suffix }}
{% block content %} {% block content %}
{{ content }} {{ content }}
{% endblock %} {% endblock %}
</div> </div>