site pilote

This commit is contained in:
2024-06-19 18:03:19 +02:00
parent 895488d676
commit 9f8ee055b8
14 changed files with 643 additions and 64 deletions
+177 -25
View File
@@ -17,6 +17,7 @@
.field--type-link {
width: fit-content;
padding: 0.4rem;
}
.bouton {
@@ -43,15 +44,12 @@
display: none;
}
#edit-submit:hover {
background-color: #fdc300;
}
.views-field-edit-node:hover {
background-color: #fdc300;
}
.form-submit:hover {
.views-field-edit-node:hover,
.field--name-field-lien:hover,
#edit-submit:hover,
.form-submit:hover,
.field--type-link:hover,
.field--type-file:hover {
background-color: #fdc300;
}
@@ -176,6 +174,15 @@
padding-top: 0;
}
}
.layout-content .layout__region--first {
flex: 0 1 25%;
}
.layout-content .layout__region--second {
flex: 0 1 75%;
}
.layout-content .layout__region--second.view-id-home {
margin: 0;
}
aside {
width: 20%;
@@ -217,6 +224,10 @@ main {
display: none;
}
p {
background-color: transparent;
}
ul {
list-style-type: none;
}
@@ -911,7 +922,7 @@ input {
.slick-next {
position: absolute;
display: block;
z-index: 999;
z-index: 9;
height: 20px;
width: 20px;
line-height: 0px;
@@ -919,7 +930,7 @@ input {
cursor: pointer;
background: transparent;
color: transparent;
top: 50%;
top: 25%;
-webkit-transform: translate(0, -50%);
-ms-transform: translate(0, -50%);
transform: translate(0, -50%);
@@ -956,6 +967,7 @@ input {
.slick-prev {
left: -25px;
padding-left: 4rem;
}
[dir=rtl] .slick-prev {
left: auto;
@@ -963,9 +975,11 @@ input {
}
.slick-prev:before {
content: "<";
font-weight: lighter;
}
[dir=rtl] .slick-prev:before {
content: ">";
font-weight: lighter;
}
.slick-next {
@@ -977,9 +991,11 @@ input {
}
.slick-next:before {
content: ">";
font-weight: lighter;
}
[dir=rtl] .slick-next:before {
content: "<";
font-weight: lighter;
}
/* Dots */
@@ -1191,13 +1207,21 @@ input {
padding-top: 2rem;
padding-bottom: 2rem;
}
.home-page-layout-content .layout-content .layout--onecol .block-region-content {
display: grid;
grid-template-rows: repeat(8, 1fr);
}
@media (max-width: 891px) {
.home-page-layout-content .layout-content .layout--onecol .block-region-content {
display: flex;
flex-direction: column;
}
}
.home-page-layout-content .layout-content .layout--onecol .block-region-content .block-block-content3d4d153c-9da8-49e2-be7a-d2245f5716ee {
grid-row: 1/span 3;
}
.home-page-layout-content .layout-content .layout--onecol .block-region-content .block-views-blockhome-block-1 {
grid-row: 2/span 6;
margin-bottom: 2rem;
}
@media (max-width: 500px) {
@@ -1580,6 +1604,33 @@ html.js body.node-type-operation.node-id-7 div.dialog-off-canvas-main-canvas div
width: 70%;
}
.home-page-layout-content .block-block-content3d4d153c-9da8-49e2-be7a-d2245f5716ee {
border: solid #fdc300 1px;
background-color: rgb(255, 255, 255);
font-weight: 800;
padding: 2rem;
margin-right: 1rem;
width: 20%;
margin-left: 8%;
padding-top: 0.5rem;
padding-left: 0.5rem;
padding-bottom: 5rem;
}
@media (max-width: 891px) {
.home-page-layout-content .block-block-content3d4d153c-9da8-49e2-be7a-d2245f5716ee {
margin-bottom: 1rem;
}
}
.home-page-layout-content .block-block-content3d4d153c-9da8-49e2-be7a-d2245f5716ee p {
margin: 0;
}
.home-page-layout-content .block-block-content3d4d153c-9da8-49e2-be7a-d2245f5716ee strong {
font-size: 1.3rem;
}
.home-page-layout-content .block-views-blocksites-block-1 {
top: -60px;
position: relative;
}
.home-page-layout-content .block-views-blocksites-block-1 .views-row .node-type-site {
width: 70%;
margin: auto;
@@ -1637,20 +1688,6 @@ html.js body.node-type-operation.node-id-7 div.dialog-off-canvas-main-canvas div
.home-page-layout-content .block-views-blocksites-block-1 .views-row .node-type-site .filtered-content .field--name-field-architecte {
order: 4;
}
.home-page-layout-content .block-block-content3d4d153c-9da8-49e2-be7a-d2245f5716ee {
border: solid #fdc300 1px;
background-color: rgb(255, 255, 255);
font-weight: 800;
padding: 2rem;
margin-right: 1rem;
width: 20%;
margin-left: 8%;
}
@media (max-width: 891px) {
.home-page-layout-content .block-block-content3d4d153c-9da8-49e2-be7a-d2245f5716ee {
margin-bottom: 1rem;
}
}
.home-page-layout-content .block-block-contentbbaa5e2a-7f7c-498f-b08e-d1a3b36c03a8 {
width: fit-content;
margin: auto;
@@ -1741,6 +1778,7 @@ html.js body.node-type-operation.node-id-7 div.dialog-off-canvas-main-canvas div
}
.block-views-blockactus-block-1 {
display: none;
background-color: white;
}
.block-views-blockactus-block-1 h2 {
@@ -1801,4 +1839,118 @@ html.js body.node-type-operation.node-id-7 div.dialog-off-canvas-main-canvas div
width: 60%;
margin: auto;
padding-top: 5rem;
}
.page-programme .block-region-first {
padding-left: 18%;
}
.page-programme .block-region-second h2 {
font-weight: 1000;
}
.page-programme .block-region-second .view-display-id-block_1 {
margin: 0;
width: 80%;
padding-top: 1rem;
}
.page-programme .block-region-second .block-config-pages-block {
margin: 0;
width: 80%;
padding-top: 1rem;
}
.page-programme .block-region-second .block-config-pages-block .config_pages--partenaires--full .paragraph--type--partenaire {
width: 100%;
padding-bottom: 3rem;
display: grid;
grid-template-columns: repeat(7, 1fr);
grid-template-rows: repeat(auto-fill);
}
@media (max-width: 810px) {
.page-programme .block-region-second .block-config-pages-block .config_pages--partenaires--full .paragraph--type--partenaire {
display: flex;
flex-direction: column;
}
}
.page-programme .block-region-second .block-config-pages-block .config_pages--partenaires--full .paragraph--type--partenaire .field--name-field-logo {
grid-column: 1/2;
grid-row: 2;
margin-top: 2rem;
padding-right: 1rem;
}
.page-programme .block-region-second .block-config-pages-block .config_pages--partenaires--full .paragraph--type--partenaire .field--name-field-nom {
grid-column: 2/8;
grid-row: 1;
font-weight: 900;
font-size: 1.2rem;
}
.page-programme .block-region-second .block-config-pages-block .config_pages--partenaires--full .paragraph--type--partenaire .field--name-field-texte {
grid-column: 2/8;
grid-row: 2;
}
.page-programme .block-region-second .block-config-pages-block .config_pages--partenaires--full .paragraph--type--partenaire .field--name-field-texte span {
background-color: none;
}
.page-programme .block-region-second .block-config-pages-block .config_pages--partenaires--full .paragraph--type--partenaire .field--name-field-lien {
grid-column: 2/8;
grid-row: 3;
}
.page-node-site .block-region-first .block-entity-fieldnodefield-fichiers {
width: 80%;
margin: auto;
}
.page-node-site .block-region-second {
width: 50%;
}
.page-node-site .block-region-second img {
width: 100%;
height: auto;
}
.page-node-site .block-region-second .block-entity-fieldnodetitle {
order: 2;
margin: 0;
font-size: 1.3rem;
font-weight: 900;
}
.page-node-site .block-region-second .field--name-field-numero-site {
order: 1;
text-transform: uppercase;
font-size: 1.5rem;
}
.page-node-site .block-region-second .field--name-field-adresse-site {
order: 3;
font-size: 1.3rem;
line-height: 0.3rem;
}
.page-node-site .block-region-second .field--name-field-adresse-site .address {
margin: 0;
display: inline-flex;
}
.page-node-site .block-region-second .field--name-field-adresse-site .address .postal-code {
order: 2;
}
.page-node-site .block-region-second .field--name-field-adresse-site .address .locality {
order: 1;
text-transform: capitalize;
margin-right: 0.5rem;
}
.page-node-site .block-region-second .field--name-field-adresse-site .address .country {
display: none;
}
.page-node-site .block-region-second .field--name-field-architecte {
order: 4;
padding-top: 1rem;
}
.page-node-site .block-region-second ul.links {
order: 5;
text-transform: uppercase;
padding: 0;
margin: 0;
border: none;
padding-bottom: 2rem;
padding-top: 0.9rem;
display: inline-flex;
}
.page-node-site .block-region-second ul.links::after {
content: url("../../dist/images/noun-arrow-1569918-black.svg");
padding-left: 0.5rem;
}
+21 -5
View File
@@ -22,12 +22,7 @@ function reha_preprocess_html(&$variables) {
}
}
/**
* Implements hook_preprocess_HOOK() for page.html.twig.
*/
function reha_preprocess_page(&$variables) {
}
/**
* Implements hook_preprocess_HOOK() for node.html.twig.
@@ -57,6 +52,27 @@ function reha_preprocess_node(&$variables) {
}
/**
* Implements hook_preprocess_HOOK() for page templates.
*/
function reha_preprocess_page(&$variables) {
// Vérifiez si c'est une page de nœud.
if ($node = \Drupal::routeMatch()->getParameter('node')) {
if ($node instanceof \Drupal\node\NodeInterface) {
// Ajoutez une classe unique basée sur le nid (Node ID).
$variables['attributes']['class'][] = 'page-node-' . $node->id();
// Ajoutez un ID unique basé sur le nid.
$variables['attributes']['id'] = 'page-node-' . $node->id();
}
}
else {
// Si ce n'est pas une page de nœud, vous pouvez ajouter un ID basé sur le nom de la route.
$route_name = \Drupal::routeMatch()->getRouteName();
$variables['attributes']['id'] = 'page-' . str_replace('.', '-', $route_name);
}
}
// /**
// * Implements hook_preprocess_HOOK() for node templates.
@@ -40,7 +40,15 @@ $width-menu-slidedown : 550px;
@media (max-width:500px) {
padding-top: 0;
}
.layout__region--first{
flex: 0 1 25%;
}
.layout__region--second{
flex: 0 1 75%;
&.view-id-home{
margin: 0;
}
}
}
@@ -77,4 +85,8 @@ main{
#block-reha-titredepage{
display: none;
}
p{
background-color: transparent;
}
@@ -13,16 +13,17 @@
}
// %hoveryellow{
// :hover{
// background-color: $yellow-puca;
// }
// }
%hoveryellow{
:hover{
background-color: $yellow-puca;
}
}
.field--type-link {
@extend %buttonwithborder;
width: fit-content;
padding: 0.4rem;
}
.bouton{
@@ -62,14 +63,16 @@
display: none;
}
#edit-submit:hover{
background-color: $yellow-puca;
}
.views-field-edit-node:hover{
background-color: $yellow-puca;
}
.form-submit:hover{
background-color: $yellow-puca;
.views-field-edit-node:hover,
.field--name-field-lien:hover,
#edit-submit:hover,
.form-submit:hover,
.field--type-link:hover,
.field--type-file:hover{
background-color: $yellow-puca;
}
@@ -7,4 +7,37 @@
transition: 0.3s transform ease, 0.3s box-shadow ease;
}
}
@mixin node-site {
h2{
order: 2;
margin: 0;
}
.field--name-field-numero-site {
order: 1;
text-transform: uppercase;
font-size: 2rem;
}
.field--name-field-adresse-site{
order: 3;
font-size: 1.5rem;
.address{
margin: 0;
display: inline-flex;
.postal-code{
order: 2;
}
.locality{
order: 1;
text-transform: capitalize;
margin-right: 0.5rem;
}
.country{
display: none;
}
}
}
.field--name-field-architecte{
order: 4;
}
}
+6 -2
View File
@@ -43,16 +43,20 @@
}
.block-region-content{
// display: grid;
display: grid;
// grid-column: repeat(2, 1fr);
grid-template-rows: repeat(8, 1fr);
@media(max-width: 891px){
display: flex;
flex-direction: column;
}
.block-block-content3d4d153c-9da8-49e2-be7a-d2245f5716ee{
grid-row: 1 /span 3;
}
.block-views-blockhome-block-1{
// grid-column: 1 /span 2;
// grid-row: 1;
grid-row: 2 /span 6;
margin-bottom: 2rem;
@media(max-width: 500px){
img{
@@ -1,4 +1,5 @@
.block-views-blockactus-block-1{
display:none;
background-color: white;
h2{
width: 80%;
@@ -1,6 +1,29 @@
.home-page-layout-content {
.block-block-content3d4d153c-9da8-49e2-be7a-d2245f5716ee{
border: solid $yellow-puca 1px;
background-color: $white-button;
font-weight: 800;
padding: 2rem;
margin-right: 1rem;
width: 20%;
margin-left: 8%;
padding-top: 0.5rem;
padding-left: 0.5rem;
padding-bottom: 5rem;
@media(max-width: 891px){
margin-bottom: 1rem;
// margin: auto;
}
p{margin: 0;}
strong{
font-size: 1.3rem;
}
}
.block-views-blocksites-block-1 {
top: -60px;
position: relative;
.views-row{
.node-type-site{
@@ -64,19 +87,7 @@
}
}
.block-block-content3d4d153c-9da8-49e2-be7a-d2245f5716ee{
border: solid $yellow-puca 1px;
background-color: $white-button;
font-weight: 800;
padding: 2rem;
margin-right: 1rem;
width: 20%;
margin-left: 8%;
@media(max-width: 891px){
margin-bottom: 1rem;
// margin: auto;
}
}
.block-block-contentbbaa5e2a-7f7c-498f-b08e-d1a3b36c03a8{
width: fit-content;
@@ -0,0 +1,70 @@
.page-programme{
.block-region-first{
padding-left: 18%;
}
.block-region-second{
h2{
font-weight: 1000;
}
.view-display-id-block_1{
margin: 0;
width: 80%;
padding-top: 1rem;
}
.block-config-pages-block{
margin: 0;
width: 80%;
padding-top: 1rem;
.config_pages--partenaires--full{
.paragraph--type--partenaire{
// background-color: $white;
width: 100%;
padding-bottom: 3rem;
display: grid;
grid-template-columns: repeat(7, 1fr);
grid-template-rows: repeat(auto-fill);
@media (max-width: 810px){
display: flex;
flex-direction: column;
}
.field--name-field-logo{
grid-column: 1 / 2;
grid-row: 2;
margin-top: 2rem;
padding-right: 1rem;
}
.field--name-field-nom{
grid-column: 2 / 8;
grid-row: 1;
font-weight: 900;
font-size: 1.2rem
}
.field--name-field-texte{
grid-column: 2 / 8;
grid-row: 2;
span{
background-color: none;
}
}
.field--name-field-lien{
grid-column: 2 / 8;
grid-row: 3;
}
}
}
}
}
}
@@ -0,0 +1,73 @@
.page-node-site{
.block-region-first{
.block-entity-fieldnodefield-fichiers{
width: 80%;
margin: auto;
}
}
.block-region-second{
width: 50%;
img{
width: 100%;
// object-fit: contain;
height: auto;
}
.block-entity-fieldnodetitle{
order: 2;
margin: 0;
font-size: 1.3rem;
font-weight: 900;
}
.field--name-field-numero-site {
order: 1;
text-transform: uppercase;
font-size: 1.5rem;
}
.field--name-field-adresse-site{
order: 3;
font-size: 1.3rem;
line-height: 0.3rem;
.address{
margin: 0;
display: inline-flex;
.postal-code{
order: 2;
}
.locality{
order: 1;
text-transform: capitalize;
margin-right: 0.5rem;
}
.country{
display: none;
}
}
}
.field--name-field-architecte{
order: 4;
padding-top: 1rem;
}
ul.links{
order: 5;
text-transform: uppercase;
padding: 0;
margin: 0;
border: none;
padding-bottom: 2rem;
padding-top: 0.9rem;
display: inline-flex;
&::after{
content:url("../../dist/images/noun-arrow-1569918-black.svg");
padding-left: 0.5rem;
}
}
}
}
@@ -64,7 +64,7 @@ $slick-opacity-not-active: 0.25 !default;
.slick-next {
position: absolute;
display: block;
z-index: 999;
z-index: 9;
height: 20px;
width: 20px;
line-height: 0px;
@@ -72,7 +72,7 @@ $slick-opacity-not-active: 0.25 !default;
cursor: pointer;
background: transparent;
color: transparent;
top: 50%;
top: 25%;
-webkit-transform: translate(0, -50%);
-ms-transform: translate(0, -50%);
transform: translate(0, -50%);
@@ -103,14 +103,19 @@ $slick-opacity-not-active: 0.25 !default;
.slick-prev {
left: -25px;
padding-left: 4rem;
[dir="rtl"] & {
left: auto;
right: 200px;
}
&:before {
content: $slick-prev-character;
font-weight: lighter;
[dir="rtl"] & {
content: $slick-next-character;
font-weight: lighter;
}
}
}
@@ -123,8 +128,12 @@ $slick-opacity-not-active: 0.25 !default;
}
&:before {
content: $slick-next-character;
font-weight: lighter;
[dir="rtl"] & {
content: $slick-prev-character;
font-weight: lighter;
}
}
}
+3 -2
View File
@@ -24,7 +24,6 @@
@import "partials/slick";
@import "partials/slick_custom";
/*pages*/
@import "pages/home";
@import "pages/creer-un-compte";
@@ -36,4 +35,6 @@
@import "pages/home/home-view-sites";
@import "pages/les-sites-pilotes";
@import "pages/home/home-view-actualites";
@import "pages/home/home-view-presentation";
@import "pages/home/home-view-presentation";
@import "pages/le-programme";
@import "pages/node-site";
@@ -0,0 +1,97 @@
{#
/**
* @file
* Default theme implementation to display a single page.
*
* The doctype, html, head and body tags are not in this template. Instead they
* can be found in the html.html.twig template in this directory.
*
* Available variables:
*
* General utility variables:
* - base_path: The base URL path of the Drupal installation. Will usually be
* "/" unless you have installed Drupal in a sub-directory.
* - is_front: A flag indicating if the current page is the front page.
* - logged_in: A flag indicating if the user is registered and signed in.
* - is_admin: A flag indicating if the user has permission to access
* administration pages.
*
* Site identity:
* - front_page: The URL of the front page. Use this instead of base_path when
* linking to the front page. This includes the language domain or prefix.
*
* Page content (in order of occurrence in the default page.html.twig):
* - messages: Status and error messages. Should be displayed prominently.
* - node: Fully loaded node, if there is an automatically-loaded node
* associated with the page and the node ID is the second argument in the
* page's path (e.g. node/12345 and node/12345/revisions, but not
* comment/reply/12345).
*
* Regions:
* - page.header: Items for the header region.
* - page.primary_menu: Items for the primary menu region.
* - page.secondary_menu: Items for the secondary menu region.
* - page.highlighted: Items for the highlighted content region.
* - page.help: Dynamic help text, mostly for admin pages.
* - page.content: The main content of the current page.
* - page.sidebar_first: Items for the first sidebar.
* - page.sidebar_second: Items for the second sidebar.
* - page.footer: Items for the footer region.
* - page.breadcrumb: Items for the breadcrumb region.
*
* @see template_preprocess_page()
* @see html.html.twig
*
* @ingroup themeable
*/
#}
<div class="layout-container page-node-site">
<header role="banner">
{{ page.header }}
</header>
{{ page.primary_menu }}
{{ page.secondary_menu }}
{{ page.breadcrumb }}
{{ page.highlighted }}
{{ page.help }}
<main role="main">
<a id="main-content" tabindex="-1"></a>{# link is in html.html.twig #}
<div class="layout-content home-page-layout-content">
{{ page.content }}
</div>{# /.layout-content #}
{% if page.sidebar_first %}
<aside class="layout-sidebar-first" role="complementary">
{{ page.sidebar_first }}
</aside>
{% endif %}
{% if page.sidebar_second %}
<aside class="layout-sidebar-second" role="complementary">
{{ page.sidebar_second }}
</aside>
{% endif %}
</main>
{% if page.footer_top or page.footer_left or page.footer_middle or page.footer_right or page.footer_bottom %}
<footer role="contentinfo">
<section id="footer-top">{{ page.footer_top }}</section>
<div>
<section id="footer-left">{{ page.footer_left }}</section>
<section id="footer-middle">{{ page.footer_middle }}</section>
<section id="footer-right">{{ page.footer_right }}</section>
</div>
<section id="footer-bottom">{{ page.footer_bottom }}</section>
</footer>
{% endif %}
</div>{# /.layout-container #}
@@ -0,0 +1,97 @@
{#
/**
* @file
* Default theme implementation to display a single page.
*
* The doctype, html, head and body tags are not in this template. Instead they
* can be found in the html.html.twig template in this directory.
*
* Available variables:
*
* General utility variables:
* - base_path: The base URL path of the Drupal installation. Will usually be
* "/" unless you have installed Drupal in a sub-directory.
* - is_front: A flag indicating if the current page is the front page.
* - logged_in: A flag indicating if the user is registered and signed in.
* - is_admin: A flag indicating if the user has permission to access
* administration pages.
*
* Site identity:
* - front_page: The URL of the front page. Use this instead of base_path when
* linking to the front page. This includes the language domain or prefix.
*
* Page content (in order of occurrence in the default page.html.twig):
* - messages: Status and error messages. Should be displayed prominently.
* - node: Fully loaded node, if there is an automatically-loaded node
* associated with the page and the node ID is the second argument in the
* page's path (e.g. node/12345 and node/12345/revisions, but not
* comment/reply/12345).
*
* Regions:
* - page.header: Items for the header region.
* - page.primary_menu: Items for the primary menu region.
* - page.secondary_menu: Items for the secondary menu region.
* - page.highlighted: Items for the highlighted content region.
* - page.help: Dynamic help text, mostly for admin pages.
* - page.content: The main content of the current page.
* - page.sidebar_first: Items for the first sidebar.
* - page.sidebar_second: Items for the second sidebar.
* - page.footer: Items for the footer region.
* - page.breadcrumb: Items for the breadcrumb region.
*
* @see template_preprocess_page()
* @see html.html.twig
*
* @ingroup themeable
*/
#}
<div class="layout-container page-programme">
<header role="banner">
{{ page.header }}
</header>
{{ page.primary_menu }}
{{ page.secondary_menu }}
{{ page.breadcrumb }}
{{ page.highlighted }}
{{ page.help }}
<main role="main">
<a id="main-content" tabindex="-1"></a>{# link is in html.html.twig #}
<div class="layout-content home-page-layout-content">
{{ page.content }}
</div>{# /.layout-content #}
{% if page.sidebar_first %}
<aside class="layout-sidebar-first" role="complementary">
{{ page.sidebar_first }}
</aside>
{% endif %}
{% if page.sidebar_second %}
<aside class="layout-sidebar-second" role="complementary">
{{ page.sidebar_second }}
</aside>
{% endif %}
</main>
{% if page.footer_top or page.footer_left or page.footer_middle or page.footer_right or page.footer_bottom %}
<footer role="contentinfo">
<section id="footer-top">{{ page.footer_top }}</section>
<div>
<section id="footer-left">{{ page.footer_left }}</section>
<section id="footer-middle">{{ page.footer_middle }}</section>
<section id="footer-right">{{ page.footer_right }}</section>
</div>
<section id="footer-bottom">{{ page.footer_bottom }}</section>
</footer>
{% endif %}
</div>{# /.layout-container #}