/lesprojets et page projet

This commit is contained in:
2025-11-03 22:42:26 +01:00
parent 67cf13da9d
commit 3739306af1
11 changed files with 1230 additions and 23 deletions

View File

@@ -3991,24 +3991,50 @@ body {
width: fit-content; width: fit-content;
} }
} }
.node-type-site .layout--threecol-25-50-25 .layout__region--third .block-region-third div .prev-site { .node-type-site .layout--threecol-25-50-25 .layout__region--third .block-region-third div h2 {
padding-right: 0.5rem; font-family: "gilroy-light";
text-transform: uppercase;
font-size: 0.5rem;
} }
.node-type-site .layout--threecol-25-50-25 .layout__region--third .block-region-third div .prev-site::before { .node-type-site .layout--threecol-25-50-25 .layout__region--third .block-region-third div .field_field_nom_de_l_equipe {
content: url("../img/prev.svg"); width: 80%;
border-bottom: solid black 1px;
font-size: 0.6rem;
} }
.node-type-site .layout--threecol-25-50-25 .layout__region--third .block-region-third div .prev-site span { .node-type-site .layout--threecol-25-50-25 .layout__region--third .block-region-third div .field_field_nom_de_l_equipe p {
display: none; font-family: "gilroy-semibold";
margin-bottom: 0.5rem;
font-size: 0.6rem;
} }
.node-type-site .layout--threecol-25-50-25 .layout__region--third .block-region-third div .next-site span { .node-type-site .layout--threecol-25-50-25 .layout__region--third .block-region-third div .field_field_nom_de_l_equipe div.more-link {
display: none; margin-bottom: 1rem;
padding-left: 0rem;
} }
.node-type-site .layout--threecol-25-50-25 .layout__region--third .block-region-third div .next-site::before { .node-type-site .layout--threecol-25-50-25 .layout__region--third .block-region-third div .field_field_nom_de_l_equipe div.more-link a {
content: url("../img/next.svg"); font-size: 0.5rem;
}
.node-type-site .layout--threecol-25-50-25 .layout__region--third .block-region-third div .field_field_laureats {
color: red;
text-transform: uppercase;
} }
.node-type-site .layout--threecol-25-50-25 .layout__region--third .block-region-third .prevnext { .node-type-site .layout--threecol-25-50-25 .layout__region--third .block-region-third .prevnext {
flex-direction: row; flex-direction: row;
margin-bottom: 3rem; margin-bottom: 0rem;
}
.node-type-site .layout--threecol-25-50-25 .layout__region--third .block-region-third .prevnext .prev-site {
padding-right: 0.5rem;
}
.node-type-site .layout--threecol-25-50-25 .layout__region--third .block-region-third .prevnext .prev-site::before {
content: url("../img/prev.svg");
}
.node-type-site .layout--threecol-25-50-25 .layout__region--third .block-region-third .prevnext .prev-site span {
display: none;
}
.node-type-site .layout--threecol-25-50-25 .layout__region--third .block-region-third .prevnext .next-site span {
display: none;
}
.node-type-site .layout--threecol-25-50-25 .layout__region--third .block-region-third .prevnext .next-site::before {
content: url("../img/next.svg");
} }
.node-type-site .layout--threecol-25-50-25 .layout__region--third .documents-liens-wrapper { .node-type-site .layout--threecol-25-50-25 .layout__region--third .documents-liens-wrapper {
display: flex; display: flex;
@@ -4067,17 +4093,20 @@ body {
padding-left: 0.2rem; padding-left: 0.2rem;
height: 25px; height: 25px;
} }
.node-type-site .layout--threecol-25-50-25 .layout__region--third .file--mime-application-pdf { .node-type-site .layout--threecol-25-50-25 .layout__region--third .file--mime-application-pdf,
.node-type-site .layout--threecol-25-50-25 .layout__region--third .more-link {
width: fit-content; width: fit-content;
padding-left: 0.5rem; padding-left: 0.5rem;
background: black; background: black;
} }
@media (max-width: 810px) { @media (max-width: 810px) {
.node-type-site .layout--threecol-25-50-25 .layout__region--third .file--mime-application-pdf { .node-type-site .layout--threecol-25-50-25 .layout__region--third .file--mime-application-pdf,
.node-type-site .layout--threecol-25-50-25 .layout__region--third .more-link {
margin-left: 0; margin-left: 0;
} }
} }
.node-type-site .layout--threecol-25-50-25 .layout__region--third .file--mime-application-pdf a { .node-type-site .layout--threecol-25-50-25 .layout__region--third .file--mime-application-pdf a,
.node-type-site .layout--threecol-25-50-25 .layout__region--third .more-link a {
display: inline-flex; display: inline-flex;
justify-content: space-between; justify-content: space-between;
align-items: center; align-items: center;
@@ -4085,10 +4114,12 @@ body {
text-transform: uppercase; text-transform: uppercase;
font-size: 0.6rem; font-size: 0.6rem;
} }
.node-type-site .layout--threecol-25-50-25 .layout__region--third .file--mime-application-pdf a svg { .node-type-site .layout--threecol-25-50-25 .layout__region--third .file--mime-application-pdf a svg,
.node-type-site .layout--threecol-25-50-25 .layout__region--third .more-link a svg {
display: none; display: none;
} }
.node-type-site .layout--threecol-25-50-25 .layout__region--third .file--mime-application-pdf a::after { .node-type-site .layout--threecol-25-50-25 .layout__region--third .file--mime-application-pdf a::after,
.node-type-site .layout--threecol-25-50-25 .layout__region--third .more-link a::after {
display: inline-flex; display: inline-flex;
content: url("../img/noun-arrow-to-right.svg"); content: url("../img/noun-arrow-to-right.svg");
padding-right: 0.2rem; padding-right: 0.2rem;
@@ -4102,6 +4133,234 @@ body {
flex-direction: column; flex-direction: column;
} }
.node-type-projet .layout-content {
margin-top: 2rem;
}
.node-type-projet .layout-content .content_container {
width: 95% !important;
}
.node-type-projet .layout--threecol-25-50-25 .layout__region--first {
flex: 0 1 25%;
margin-top: 1rem;
position: relative;
}
.node-type-projet .layout--threecol-25-50-25 .layout__region--first .block-region-first {
position: fixed;
width: 20% !important;
margin-top: 1rem;
display: flex;
flex-direction: column;
align-items: center;
margin-left: 2rem;
}
.node-type-projet .layout--threecol-25-50-25 .layout__region--first .block-region-first .field_field_site_projet .node-type-site {
width: 80%;
}
.node-type-projet .layout--threecol-25-50-25 .layout__region--first .block-region-first .field_field_site_projet .node-type-site .field_title h2 {
text-transform: none;
font-size: 0.6rem;
}
.node-type-projet .layout--threecol-25-50-25 .layout__region--first .block-region-first .field_field_site_projet .node-type-site .field_title h2 a {
color: rgb(7, 50, 194);
font-weight: 700;
}
.node-type-projet .layout--threecol-25-50-25 .layout__region--first .block-region-first .field_field_site_projet .node-type-site .field_field_sous_titre p {
font-size: 0.55rem;
}
.node-type-projet .layout--threecol-25-50-25 .layout__region--first .block-region-first .field_field_site_projet .node-type-site .more-link {
width: fit-content;
background: black;
}
@media (max-width: 810px) {
.node-type-projet .layout--threecol-25-50-25 .layout__region--first .block-region-first .field_field_site_projet .node-type-site .more-link {
margin-left: 0;
}
}
.node-type-projet .layout--threecol-25-50-25 .layout__region--first .block-region-first .field_field_site_projet .node-type-site .more-link a {
display: inline-flex;
justify-content: space-between;
align-items: center;
color: white;
text-transform: uppercase;
font-size: 0.6rem;
padding-left: 0.5rem;
}
.node-type-projet .layout--threecol-25-50-25 .layout__region--first .block-region-first .field_field_site_projet .node-type-site .more-link a svg {
display: none;
}
.node-type-projet .layout--threecol-25-50-25 .layout__region--first .block-region-first .field_field_site_projet .node-type-site .more-link a::after {
display: inline-flex;
content: url("../img/noun-arrow-to-right.svg");
padding-right: 0.2rem;
padding-left: 0.2rem;
padding-bottom: 0.2rem;
height: 25px;
}
.node-type-projet .layout--threecol-25-50-25 .layout__region--second {
flex: 0 1 50% !important;
margin-top: 1rem;
max-width: 50%;
}
.node-type-projet .layout--threecol-25-50-25 .layout__region--second .block-region-second {
margin-right: 3rem;
margin-top: 1rem;
}
.node-type-projet .layout--threecol-25-50-25 .layout__region--second .block-region-second .field_field_nom_de_l_equipe {
border-top: solid black 1px;
padding-bottom: 0.5rem;
}
.node-type-projet .layout--threecol-25-50-25 .layout__region--second .block-region-second .field_field_infos {
display: flex;
flex-direction: column;
flex-wrap: wrap;
height: 200px;
border-bottom: solid black 1px;
}
.node-type-projet .layout--threecol-25-50-25 .layout__region--second .block-region-second .field_field_infos .infos-projet {
width: 25%;
margin-bottom: 1rem;
}
.node-type-projet .layout--threecol-25-50-25 .layout__region--second .block-region-second .field_field_infos .infos-projet h4 {
margin: 0;
font-size: 0.7em;
font-family: "gilroy-light";
}
.node-type-projet .layout--threecol-25-50-25 .layout__region--second .block-region-second .field_field_infos .infos-projet .field_field_contenu {
font-size: 0.8em;
font-family: "gilroy-bold";
}
.node-type-projet .layout--threecol-25-50-25 .layout__region--second .block-region-second .field_field_parties_projet {
margin-top: 2rem;
width: 100%;
}
@media (max-width: 500px) {
.node-type-projet .layout--threecol-25-50-25 .layout__region--second .block-region-second .field_field_parties_projet {
width: 100%;
}
}
.node-type-projet .layout--threecol-25-50-25 .layout__region--second .block-region-second .field_field_parties_projet .paragraph--type--projet-partie-texte .field_field_texte_partie_texte_projet p {
font-family: "gilroy-light";
font-size: 0.6rem;
}
.node-type-projet .layout--threecol-25-50-25 .layout__region--second .block-region-second .field_field_documents,
.node-type-projet .layout--threecol-25-50-25 .layout__region--second .block-region-second .field_field_liens {
width: fit-content;
padding-left: 0.5rem;
background: black;
margin-bottom: 1rem;
}
@media (max-width: 810px) {
.node-type-projet .layout--threecol-25-50-25 .layout__region--second .block-region-second .field_field_documents,
.node-type-projet .layout--threecol-25-50-25 .layout__region--second .block-region-second .field_field_liens {
margin-left: 0;
}
}
.node-type-projet .layout--threecol-25-50-25 .layout__region--second .block-region-second .field_field_documents a,
.node-type-projet .layout--threecol-25-50-25 .layout__region--second .block-region-second .field_field_liens a {
display: inline-flex;
justify-content: space-between;
align-items: center;
color: white;
text-transform: uppercase;
font-size: 0.6rem;
}
.node-type-projet .layout--threecol-25-50-25 .layout__region--second .block-region-second .field_field_documents a svg,
.node-type-projet .layout--threecol-25-50-25 .layout__region--second .block-region-second .field_field_liens a svg {
display: none;
}
.node-type-projet .layout--threecol-25-50-25 .layout__region--second .block-region-second .field_field_documents a::after,
.node-type-projet .layout--threecol-25-50-25 .layout__region--second .block-region-second .field_field_liens a::after {
display: inline-flex;
content: url("../img/noun-arrow-to-right.svg");
padding-right: 0.2rem;
padding-left: 0.2rem;
padding-bottom: 0.2rem;
height: 25px;
}
.node-type-projet .layout--threecol-25-50-25 .layout__region--third {
flex: 0 1 25%;
}
.node-type-projet .layout--threecol-25-50-25 .layout__region--third .block-region-third {
position: fixed;
width: 20% !important;
}
@media (max-width: 810px) {
.node-type-projet .layout--threecol-25-50-25 .layout__region--third .block-region-third {
position: relative;
}
}
.node-type-projet .layout--threecol-25-50-25 .layout__region--third .block-region-third div {
display: flex;
flex-direction: column;
}
@media (max-width: 810px) {
.node-type-projet .layout--threecol-25-50-25 .layout__region--third .block-region-third div {
justify-content: center;
margin: auto;
margin-bottom: 1rem;
width: fit-content;
}
}
@media (max-width: 500px) {
.node-type-projet .layout--threecol-25-50-25 .layout__region--third .block-region-third div {
justify-content: center;
margin: auto;
margin-bottom: 1rem;
width: fit-content;
}
}
.node-type-projet .layout--threecol-25-50-25 .layout__region--third .block-region-third div h2 {
font-family: "gilroy-light";
text-transform: uppercase;
font-size: 0.5rem;
}
.node-type-projet .layout--threecol-25-50-25 .layout__region--third .block-region-third div .views-row {
width: 80%;
border-bottom: solid black 1px;
padding-bottom: 1rem;
}
.node-type-projet .layout--threecol-25-50-25 .layout__region--third .block-region-third div .views-row .views-field-field-nom-de-l-equipe {
font-size: 0.6rem;
}
.node-type-projet .layout--threecol-25-50-25 .layout__region--third .block-region-third div .views-row .views-field-field-nom-de-l-equipe p {
font-family: "gilroy-semibold";
margin-bottom: 0.5rem;
font-size: 0.6rem;
}
.node-type-projet .layout--threecol-25-50-25 .layout__region--third .block-region-third div .views-row .views-field-view-node {
width: fit-content;
padding-left: 0.5rem;
background: black;
}
@media (max-width: 810px) {
.node-type-projet .layout--threecol-25-50-25 .layout__region--third .block-region-third div .views-row .views-field-view-node {
margin-left: 0;
}
}
.node-type-projet .layout--threecol-25-50-25 .layout__region--third .block-region-third div .views-row .views-field-view-node a {
display: inline-flex;
justify-content: space-between;
align-items: center;
color: white;
text-transform: uppercase;
font-size: 0.6rem;
}
.node-type-projet .layout--threecol-25-50-25 .layout__region--third .block-region-third div .views-row .views-field-view-node a svg {
display: none;
}
.node-type-projet .layout--threecol-25-50-25 .layout__region--third .block-region-third div .views-row .views-field-view-node a::after {
display: inline-flex;
content: url("../img/noun-arrow-to-right.svg");
padding-right: 0.2rem;
padding-left: 0.2rem;
padding-bottom: 0.2rem;
height: 25px;
}
.node-type-projet .layout--threecol-25-50-25 .layout__region--third .block-region-third div .field_field_laureats {
color: red;
text-transform: uppercase;
}
main { main {
background-color: #f6f7f3; background-color: #f6f7f3;
} }
@@ -4231,6 +4490,154 @@ main {
object-fit: cover; object-fit: cover;
} }
main {
background-color: #f6f7f3;
}
#lesprojets .content_container {
display: flex;
flex-direction: column;
align-items: center;
}
#lesprojets .content_container #block-quartiers-de-demain-titredepage {
margin-top: 1rem;
width: fit-content;
margin-left: 10%;
margin: auto;
padding-left: 20%;
}
@media (max-width: 810px) {
#lesprojets .content_container #block-quartiers-de-demain-titredepage {
margin-top: 14rem;
grid-column: 2/span 9;
padding-left: 0%;
}
}
#lesprojets .content_container #block-quartiers-de-demain-titredepage h1 {
text-align: center;
text-transform: none;
color: rgb(7, 50, 194);
font-size: 2rem;
font-weight: 500;
}
#lesprojets .content_container .views-element-container {
width: 90%;
}
#lesprojets .content_container .views-element-container .views-row {
display: flex;
flex-direction: row;
border-top: solid 1px rgb(7, 50, 194);
padding-top: 2rem;
}
#lesprojets .content_container .views-element-container .views-row .views-field-group {
width: 25%;
margin-bottom: 2rem;
font-size: 0.4rem;
}
@media (max-width: 810px) {
#lesprojets .content_container .views-element-container .views-row .views-field-group {
width: 45%;
}
}
@media (max-width: 550px) {
#lesprojets .content_container .views-element-container .views-row .views-field-group {
font-size: 0.7rem;
}
}
#lesprojets .content_container .views-element-container .views-row .views-field-group .views-field-title .field-content a {
color: rgb(7, 50, 194);
font-family: "gilroy-bold";
padding-top: 0.5rem;
font-size: 0.55rem;
}
@media (max-width: 550px) {
#lesprojets .content_container .views-element-container .views-row .views-field-group .views-field-title .field-content a {
font-size: 0.7rem;
}
}
#lesprojets .content_container .views-element-container .views-row .views-field-group .views-field-field-images .field-content img {
width: 100%;
height: auto;
aspect-ratio: 1/1;
object-fit: cover;
}
#lesprojets .content_container .views-element-container .views-row .views-field-group .views-field-view-node {
width: fit-content;
padding-left: 0.5rem;
background: black;
}
@media (max-width: 810px) {
#lesprojets .content_container .views-element-container .views-row .views-field-group .views-field-view-node {
margin-left: 0;
}
}
#lesprojets .content_container .views-element-container .views-row .views-field-group .views-field-view-node a {
display: inline-flex;
justify-content: space-between;
align-items: center;
color: white;
text-transform: uppercase;
font-size: 0.6rem;
}
#lesprojets .content_container .views-element-container .views-row .views-field-group .views-field-view-node a svg {
display: none;
}
#lesprojets .content_container .views-element-container .views-row .views-field-group .views-field-view-node a::after {
display: inline-flex;
content: url("../img/noun-arrow-to-right.svg");
padding-right: 0.2rem;
padding-left: 0.2rem;
padding-bottom: 0.2rem;
height: 25px;
}
#lesprojets .content_container .views-element-container .views-row .views-field-field-projets-lie {
width: 75%;
padding-left: 0;
}
#lesprojets .content_container .views-element-container .views-row .views-field-field-projets-lie .field-content ul {
display: flex;
flex-direction: row;
margin-top: 0;
}
#lesprojets .content_container .views-element-container .views-row .views-field-field-projets-lie .field-content ul li .node-type-projet {
font-size: 0.4rem;
}
#lesprojets .content_container .views-element-container .views-row .views-field-field-projets-lie .field-content ul li .node-type-projet .field_field_nom_de_l_equipe h3 {
font-size: 0.6rem;
}
#lesprojets .content_container .views-element-container .views-row .views-field-field-projets-lie .field-content ul li .node-type-projet .field_field_intro p {
font-size: 0.5rem;
}
#lesprojets .content_container .views-element-container .views-row .views-field-field-projets-lie .field-content ul li .node-type-projet .field_field_intro .more-link {
width: fit-content;
padding-left: 0.5rem;
background: black;
}
@media (max-width: 810px) {
#lesprojets .content_container .views-element-container .views-row .views-field-field-projets-lie .field-content ul li .node-type-projet .field_field_intro .more-link {
margin-left: 0;
}
}
#lesprojets .content_container .views-element-container .views-row .views-field-field-projets-lie .field-content ul li .node-type-projet .field_field_intro .more-link a {
display: inline-flex;
justify-content: space-between;
align-items: center;
color: white;
text-transform: uppercase;
font-size: 0.6rem;
}
#lesprojets .content_container .views-element-container .views-row .views-field-field-projets-lie .field-content ul li .node-type-projet .field_field_intro .more-link a svg {
display: none;
}
#lesprojets .content_container .views-element-container .views-row .views-field-field-projets-lie .field-content ul li .node-type-projet .field_field_intro .more-link a::after {
display: inline-flex;
content: url("../img/noun-arrow-to-right.svg");
padding-right: 0.2rem;
padding-left: 0.2rem;
padding-bottom: 0.2rem;
height: 25px;
}
#ressources { #ressources {
background-color: #f6f7f3; background-color: #f6f7f3;
} }

View File

@@ -92,6 +92,27 @@ function quartiers_de_demain_preprocess_field(&$variables) {
} }
function quartiers_de_demain_preprocess_views_view_fields(&$variables) {
// Cible uniquement la vue et laffichage voulus
if ($variables['view']->id() === 'quartiers' && $variables['view']->current_display === 'page_1') {
$fields = $variables['fields'];
// Crée un nouveau groupe pour les champs principaux
$variables['main_group'] = [
'field_images' => $fields['field_images'] ?? NULL,
'title' => $fields['title'] ?? NULL,
'field_sous_titre' => $fields['field_sous_titre'] ?? NULL,
'view_node' => $fields['view_node'] ?? NULL,
];
// Groupe pour projets-lié
$variables['projets_group'] = [
'field_projets_lie' => $fields['field_projets_lie'] ?? NULL,
];
}
}
/** /**
* Prepares variables for block templates. * Prepares variables for block templates.

View File

@@ -0,0 +1,180 @@
main{
background-color: #f6f7f3;
}
#lesprojets{
.content_container{
// background-color: red;
display: flex;
flex-direction: column;
align-items: center;
#block-quartiers-de-demain-titredepage{
margin-top: 1rem;
width: fit-content;
margin-left: 10%;
margin: auto;
padding-left: 20%;
@media(max-width: 810px){
margin-top: 14rem;
grid-column: 2 /span 9;
padding-left: 0%;
}
h1{
text-align: center;
text-transform: none;
color: $blue_QDD;
font-size: 2rem;
font-weight: 500;
}
}
.views-element-container{
width: 90%;
.views-row{
display: flex;
flex-direction: row;
border-top: solid 1px $blue_QDD;
padding-top: 2rem;
.views-field-group{
width: 25%;
margin-bottom: 2rem;
font-size: 0.4rem ;
@media(max-width: 810px){
width: 45%;
}
@media(max-width: 550px){
font-size: 0.7rem ;
}
.views-field-title .field-content a{
color: $blue_QDD;
font-family: "gilroy-bold";
padding-top: 0.5rem;
font-size: 0.55rem ;
@media(max-width: 550px){
font-size: 0.7rem ;
}
}
.views-field-field-images .field-content img{
width: 100%;
height: auto;
aspect-ratio: 1 / 1;
object-fit: cover;
}
.views-field-view-node{
width: fit-content;
padding-left: 0.5rem;
background: black;
@media (max-width:810px) {
margin-left: 0;
}
a{
display: inline-flex;
justify-content: space-between;
align-items: center;
color: white;
text-transform: uppercase;
font-size: 0.6rem;
svg{
display: none;
}
&::after{
display: inline-flex;
content: url("../img/noun-arrow-to-right.svg");
padding-right: 0.2rem;
padding-left: 0.2rem;
padding-bottom: 0.2rem;
height: 25px;
}
}
}
}
.views-field-field-projets-lie{
width: 75%;
padding-left: 0;
.field-content{
ul{
display: flex;
flex-direction: row;
margin-top: 0;
li .node-type-projet{
font-size: 0.4rem;
.field_field_laureats{
}
.field_field_nom_de_l_equipe{
h3{
font-size: 0.6rem;
}
}
.field_field_intro{
p{
font-size: 0.5rem;
}
.more-link{
width: fit-content;
padding-left: 0.5rem;
background: black;
@media (max-width:810px) {
margin-left: 0;
}
a{
display: inline-flex;
justify-content: space-between;
align-items: center;
color: white;
text-transform: uppercase;
font-size: 0.6rem;
svg{
display: none;
}
&::after{
display: inline-flex;
content: url("../img/noun-arrow-to-right.svg");
padding-right: 0.2rem;
padding-left: 0.2rem;
padding-bottom: 0.2rem;
height: 25px;
}
}
}
}
}
}
}
}
}
}
// .view{
// display: flex;
// flex-direction: column;
// flex-wrap: wrap;
// width: 100vw;
// .views-row-wrapper{
// display: flex;
// flex-direction: row;
// flex-wrap: wrap;
// justify-content: center;
// width: 60%;
// margin: auto;
// padding-left: 10%;
// gap: 25px;
// margin-right: 10%;
// @media (max-width:1100px) {
// padding-left: 0;
// margin-right: auto;
// width: 80%;
// }
// }
// }
}
}

View File

@@ -0,0 +1,267 @@
.node-type-projet{
.layout-content{
margin-top: 2rem;
// max-width: 100vw;
.content_container{
width: 95% !important;
}
}
.layout--threecol-25-50-25{
// flex-wrap: nowrap;
// @media(max-width: 810px){
// display: flex;
// flex-direction: column;
// width: 100%;
// }
.layout__region--first{
flex: 0 1 25%;
margin-top: 1rem;
position: relative;
.block-region-first{
position:fixed;
width: 20% !important;
margin-top: 1rem;
display: flex;
flex-direction: column;
align-items: center;
margin-left: 2rem;
// @media(max-width: 810px){
// position: relative;
// width: 100% !important;
// }
.field_field_site_projet{
.node-type-site{
width: 80%;
.field_title{
h2{
text-transform: none;
font-size: 0.60rem;
a{
color: $blue_QDD;
font-weight: 700;
}
}
}
.field_field_sous_titre{
p{
font-size: 0.55rem;
}
}
.more-link{
width: fit-content;
// padding-left: 0.5rem;
background: black;
@media (max-width:810px) {
margin-left: 0;
}
a{
display: inline-flex;
justify-content: space-between;
align-items: center;
color: white;
text-transform: uppercase;
font-size: 0.6rem;
padding-left: 0.5rem;
svg{
display: none;
}
&::after{
display: inline-flex;
content: url("../img/noun-arrow-to-right.svg");
padding-right: 0.2rem;
padding-left: 0.2rem;
padding-bottom: 0.2rem;
height: 25px;
}
}
}
}
}
}
}
.layout__region--second{
flex: 0 1 50% !important;
margin-top: 1rem;
max-width: 50%;
.block-region-second{
// margin-left: 3rem;
margin-right: 3rem;
margin-top: 1rem;
.field_field_nom_de_l_equipe{
border-top: solid black 1px;
padding-bottom: 0.5rem;
}
.field_field_infos{
display: flex;
flex-direction: column;
flex-wrap: wrap;
height: 200px;
border-bottom: solid black 1px;
.infos-projet{
width: 25%;
margin-bottom: 1rem;
h4{
margin: 0;
font-size: 0.7em;
font-family: 'gilroy-light';
}
.field_field_contenu{
font-size: 0.8em;
font-family: 'gilroy-bold';
}
}
}
.field_field_parties_projet{
margin-top: 2rem;
width: 100%;
@media(max-width: 500px){
width: 100%;
}
.paragraph--type--projet-partie-texte{
.field_field_titre_partie_texte_projet{
h3{
}
}
.field_field_texte_partie_texte_projet{
p{
font-family: "gilroy-light";
font-size: 0.6rem;
}
}
}
.paragraph--type--projet-video{
}
.paragraph--type--projet-diapo{
.field_field_images_projet{
}
}
}
.field_field_documents,
.field_field_liens{
width: fit-content;
padding-left: 0.5rem;
background: black;
margin-bottom: 1rem;
@media (max-width:810px) {
margin-left: 0;
}
a{
display: inline-flex;
justify-content: space-between;
align-items: center;
color: white;
text-transform: uppercase;
font-size: 0.6rem;
svg{
display: none;
}
&::after{
display: inline-flex;
content: url("../img/noun-arrow-to-right.svg");
padding-right: 0.2rem;
padding-left: 0.2rem;
padding-bottom: 0.2rem;
height: 25px;
}
}
}
}
}
.layout__region--third{
flex: 0 1 25%;
.block-region-third{
position:fixed;
width: 20% !important;
@media(max-width: 810px){
position: relative;
}
div{
display: flex;
flex-direction: column;
// margin-bottom: 1rem;
@media(max-width: 810px){
justify-content: center;
margin: auto;
margin-bottom: 1rem;
width: fit-content;
}
@media(max-width: 500px){
justify-content: center;
margin: auto;
margin-bottom: 1rem;
width: fit-content;
}
h2{
font-family: "gilroy-light";
text-transform: uppercase;
font-size: 0.5rem;
}
.views-row{
width: 80%;
border-bottom: solid black 1px;
padding-bottom: 1rem;
.views-field-field-nom-de-l-equipe{
font-size: 0.6rem;
p{
font-family: "gilroy-semibold";
margin-bottom: 0.5rem;
font-size: 0.6rem;
}
}
.views-field-view-node{
width: fit-content;
padding-left: 0.5rem;
background: black;
@media (max-width:810px) {
margin-left: 0;
}
a{
display: inline-flex;
justify-content: space-between;
align-items: center;
color: white;
text-transform: uppercase;
font-size: 0.6rem;
svg{
display: none;
}
&::after{
display: inline-flex;
content: url("../img/noun-arrow-to-right.svg");
padding-right: 0.2rem;
padding-left: 0.2rem;
padding-bottom: 0.2rem;
height: 25px;
}
}
}
}
.field_field_laureats{
color: red;
text-transform: uppercase;
}
}
}
}
}
}

View File

@@ -334,6 +334,7 @@
} }
.block-region-third{ .block-region-third{
position: fixed; position: fixed;
// width: 80%;
@media(max-width: 810px){ @media(max-width: 810px){
position: relative; position: relative;
} }
@@ -353,6 +354,37 @@
margin-bottom: 1rem; margin-bottom: 1rem;
width: fit-content; width: fit-content;
} }
h2{
font-family: "gilroy-light";
text-transform: uppercase;
font-size: 0.5rem;
}
.field_field_nom_de_l_equipe{
width: 80%;
border-bottom: solid black 1px;
font-size: 0.6rem;
p{
font-family: "gilroy-semibold";
margin-bottom: 0.5rem;
font-size: 0.6rem;
}
div.more-link{
margin-bottom: 1rem;
padding-left: 0rem;
a{
font-size: 0.5rem;
}
}
}
.field_field_laureats{
color: red;
text-transform: uppercase;
}
}
.prevnext{
flex-direction: row;
margin-bottom: 0rem;
.prev-site{ .prev-site{
padding-right: 0.5rem; padding-right: 0.5rem;
&::before{ &::before{
@@ -370,11 +402,6 @@
content: url('../img/next.svg'); content: url('../img/next.svg');
} }
} }
}
.prevnext{
flex-direction: row;
margin-bottom: 3rem;
} }
} }
@@ -439,7 +466,8 @@
} }
} }
} }
.file--mime-application-pdf{ .file--mime-application-pdf,
.more-link{
width: fit-content; width: fit-content;
padding-left: 0.5rem; padding-left: 0.5rem;
// padding-bottom: 0.2rem; // padding-bottom: 0.2rem;

View File

@@ -48,7 +48,9 @@
@import "pages/static"; @import "pages/static";
@import "pages/node-type-actualite"; @import "pages/node-type-actualite";
@import "pages/node-type-site"; @import "pages/node-type-site";
@import "pages/node-type-projet";
@import "pages/lessites.scss"; @import "pages/lessites.scss";
@import "pages/lesprojets.scss";
@import "pages/ressources"; @import "pages/ressources";
@import "pages/actualites"; @import "pages/actualites";

View File

@@ -0,0 +1,79 @@
{#
/**
* @file
* Default theme implementation for a field.
*
* To override output, copy the "field.html.twig" from the templates directory
* to your theme's directory and customize it, just like customizing other
* Drupal templates such as page.html.twig or node.html.twig.
*
* Instead of overriding the theming for all fields, you can also just override
* theming for a subset of fields using
* @link themeable Theme hook suggestions. @endlink For example,
* here are some theme hook suggestions that can be used for a field_foo field
* on an article node type:
* - field--node--field-foo--article.html.twig
* - field--node--field-foo.html.twig
* - field--node--article.html.twig
* - field--field-foo.html.twig
* - field--text-with-summary.html.twig
* - field.html.twig
*
* Available variables:
* - attributes: HTML attributes for the containing element.
* - label_hidden: Whether to show the field label or not.
* - title_attributes: HTML attributes for the title.
* - label: The label for the field.
* - multiple: TRUE if a field can contain multiple items.
* - items: List of all the field items. Each item contains:
* - attributes: List of HTML attributes for each item.
* - content: The field item's content.
* - entity_type: The entity type to which the field belongs.
* - field_name: The name of the field.
* - field_type: The type of the field.
* - label_display: The display settings for the label.
*
* @see template_preprocess_field()
*
* @ingroup themeable
*/
#}
{%
set title_classes = [
'field',
'field--name-' ~ field_name|clean_class,
'field--type-' ~ field_type|clean_class,
'field--label-' ~ label_display,
label_display == 'visually_hidden' ? 'visually-hidden',
]
%}
{%
set ancre_href = '#paragraph-id--' ~ paragraph.id()
%}
{% if label_hidden %}
{% if multiple %}
<div{{ attributes }}>
{% for item in items %}
<div{{ item.attributes }}>{{ item.content }}</div>
{% endfor %}
</div>
{% else %}
{% for item in items %}
<div{{ attributes }}>{{ item.content }}</div>
{% endfor %}
{% endif %}
{% else %}
<div{{ attributes }}>
<div{{ title_attributes.addClass(title_classes) }}>{{ label }}</div>
{% if multiple %}
<div>
{% endif %}
{% for item in items %}
<div{{ item.attributes }}>{{ item.content }}</div>
{% endfor %}
{% if multiple %}
</div>
{% endif %}
</div>
{% endif %}

View File

@@ -0,0 +1,78 @@
{#
/**
* @file
* Default theme implementation for a field.
*
* To override output, copy the "field.html.twig" from the templates directory
* to your theme's directory and customize it, just like customizing other
* Drupal templates such as page.html.twig or node.html.twig.
*
* Instead of overriding the theming for all fields, you can also just override
* theming for a subset of fields using
* @link themeable Theme hook suggestions. @endlink For example,
* here are some theme hook suggestions that can be used for a field_foo field
* on an article node type:
* - field--node--field-foo--article.html.twig
* - field--node--field-foo.html.twig
* - field--node--article.html.twig
* - field--field-foo.html.twig
* - field--text-with-summary.html.twig
* - field.html.twig
*
* Available variables:
* - attributes: HTML attributes for the containing element.
* - label_hidden: Whether to show the field label or not.
* - title_attributes: HTML attributes for the title.
* - label: The label for the field.
* - multiple: TRUE if a field can contain multiple items.
* - items: List of all the field items. Each item contains:
* - attributes: List of HTML attributes for each item.
* - content: The field item's content.
* - entity_type: The entity type to which the field belongs.
* - field_name: The name of the field.
* - field_type: The type of the field.
* - label_display: The display settings for the label.
*
* @see template_preprocess_field()
*
* @ingroup themeable
*/
#}
{%
set title_classes = [
'field',
'field--name-' ~ field_name|clean_class,
'field--type-' ~ field_type|clean_class,
'field--label-' ~ label_display,
label_display == 'visually_hidden' ? 'visually-hidden',
]
%}
{%
set ancre_href = '#paragraph-id--' ~ paragraph.id()
%}
{% if label_hidden %}
{% if multiple %}
<div{{ attributes }}>
{% for item in items %}
<div{{ item.attributes }}>{{ item.content }}</div>
{% endfor %}
</div>
{% else %}
{% for item in items %}
<div{{ attributes }}>{{ item.content }}</div>
{% endfor %}
{% endif %}
{% else %}
<div{{ attributes }}>
<div{{ title_attributes.addClass(title_classes) }}>{{ label }}</div>
{% if multiple %}
{# <div class='infos-projet'> #}
{% endif %}
{% for item in items %}
<div class='infos-projet'{{ item.attributes }}>{{ item.content }}</div>
{% endfor %}
{% if multiple %}
{# </div> #}
{% endif %}
</div>
{% endif %}

View File

@@ -0,0 +1,97 @@
{#
/**
* @file
* Claro's theme implementation to display a single Drupal page.
*
* The doctype, html, head, and body tags are not in this template. Instead
* they can be found in the html.html.twig template normally located in the
* core/modules/system 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):
* - 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.pre_content: Items for the pre-content region.
* - page.breadcrumb: Items for the breadcrumb region.
* - page.highlighted: Items for the highlighted region.
* - page.help: Dynamic help text, mostly for admin pages.
* - page.content: The main content of the current page.
*
* @see template_preprocess_page()
* @see html.html.twig
*/
#}
<div class="layout-container">
<header role="banner">
{{ page.header_left }}
{{ page.header_right }}
{{ page.header_nav }}
</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" id="lesprojets">
{{ 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"> #}
<span class="totop"><a href="#" id="toTop"><i class="arrow-up"></i></a></span>
{# </section> #}
<div class="footer">
<section id="footer-left">{{ page.footer_left }}</section>
<div class='first-row'>
<section id="footer-middle">{{ page.footer_middle }}</section>
<section id="footer-right">{{ page.footer_right }}</section>
</div>
</div>
{# <section id="footer-bottom">{{ page.footer_bottom }}</section> #}
</footer>
{# {% endif %} #}
</div>{# /.layout-container #}

View File

@@ -0,0 +1,46 @@
{# views-view-fields--sites_projets--page_1.html.twig (or your variant) #}
{% import _self as m %}
{# The 4 fields to group #}
{% set main_fields = ['field_images', 'title', 'field_sous_titre', 'view_node'] %}
{# Macro that renders a field exactly like the default loop #}
{% macro render_field(field) %}
{{ field.separator }}
{% if field.wrapper_element %}<{{ field.wrapper_element }}{{ field.wrapper_attributes }}>{% endif %}
{% if field.label %}
{% if field.label_element %}
<{{ field.label_element }}{{ field.label_attributes }}>{{ field.label }}{{ field.label_suffix }}</{{ field.label_element }}>
{% else %}
{{ field.label }}{{ field.label_suffix }}
{% endif %}
{% endif %}
{% if field.element_type %}
<{{ field.element_type }}{{ field.element_attributes }}>
{{ field.content }}
</{{ field.element_type }}>
{% else %}
{{ field.content }}
{% endif %}
{% if field.wrapper_element %}</{{ field.wrapper_element }}>{% endif %}
{% endmacro %}
{# --- Your single new wrapper just for the 4 fields --- #}
<div class="views-field-group">
{% for name in main_fields %}
{% if fields[name] is defined %}
{{ m.render_field(fields[name]) }}
{% endif %}
{% endfor %}
</div>
{# Render everything else exactly as before #}
{% for name, field in fields %}
{% if name not in main_fields %}
{{ m.render_field(field) }}
{% endif %}
{% endfor %}

View File

@@ -32,7 +32,8 @@
*/ */
#} #}
{# À enlever après vérification #}
view.id(): {{ view.id() }} | view.current_display: {{ view.current_display }}
{% for field in fields -%} {% for field in fields -%}
@@ -56,3 +57,4 @@
</{{ field.wrapper_element }}> </{{ field.wrapper_element }}>
{%- endif %} {%- endif %}
{%- endfor %} {%- endfor %}