From 86135fb150c567ceb8be3b9c28b0188652a0e77f Mon Sep 17 00:00:00 2001 From: ouidade Date: Thu, 9 Apr 2026 14:59:16 +0200 Subject: [PATCH] header print --- .../custom/eql/dist/assets/css/bundle.css | 78 ++++++++++----- .../global/print/_projets-complets-ecran.scss | 98 ++++++++----------- .../global/print/_projets-complets-print.scss | 28 +++++- .../templates/node--view--projets.html.twig | 7 ++ 4 files changed, 128 insertions(+), 83 deletions(-) diff --git a/web/themes/custom/eql/dist/assets/css/bundle.css b/web/themes/custom/eql/dist/assets/css/bundle.css index 70fd3de..fcf0e68 100644 --- a/web/themes/custom/eql/dist/assets/css/bundle.css +++ b/web/themes/custom/eql/dist/assets/css/bundle.css @@ -390,6 +390,22 @@ svg.ext { .path-projets-complets span { display: none; } +.path-projets-complets .print-header { + display: none; +} +.path-projets-complets .print-header img { + width: 2cm; + height: auto; +} +.path-projets-complets .print-header__text { + text-transform: uppercase; + font-family: "Source Code Pro"; + color: rgb(9, 57, 139); + font-size: 0.8rem; + font-weight: 500; + text-transform: uppercase; + text-align: end; +} .path-projets-complets .node-type-projet { border-bottom: 1px solid black; padding-bottom: 5rem; @@ -492,18 +508,23 @@ svg.ext { } .path-projets-complets .field--name-field-incube { order: 4; + display: inline-flex; width: fit-content; background-color: rgb(225, 0, 15); color: white; font-weight: 800; padding-right: 0.3rem; padding-left: 0.2rem; - flex-direction: row; + margin-bottom: 1rem; + margin-top: 1rem; } .path-projets-complets .field--name-field-incube::before { content: " Projet "; padding-right: 0.5rem; } +.path-projets-complets .field--name-field-incube .field__label { + display: inline; +} .path-projets-complets .field--name-field-incube .field__item { display: none; } @@ -512,30 +533,18 @@ svg.ext { display: none; } .path-projets-complets .field--name-field-region { - order: 5; - width: 30%; - position: relative; - height: 80px; - text-align: center; - padding-right: 1rem; -} -@media (max-width: 479px) { - .path-projets-complets .field--name-field-region { - width: 100%; - } -} -.path-projets-complets .field--name-field-region .field__label { - display: none; + display: flex; + align-items: center; + gap: 0.5rem; + margin-bottom: 2rem; } .path-projets-complets .field--name-field-region::before { - content: url("../images/pictos/picto_lieu.svg"); - min-width: 30px; - height: auto; - padding-right: 1rem; - position: absolute; - left: 0; - margin-top: 0.83em; - margin-left: 1rem; + content: ""; + display: block; + width: 20px; + height: 20px; + background: url("../images/pictos/picto_lieu.svg") no-repeat center; + background-size: contain; } .path-projets-complets .field--name-field-type-de-moa { order: 6; @@ -593,6 +602,27 @@ svg.ext { .path-projets-complets .layout-content { width: 80vw; } + .path-projets-complets .layout-content .print-header { + position: absolute; + top: 1cm; + right: 1cm; + display: flex; + align-items: center; + gap: 0.5rem; + } + .path-projets-complets .layout-content .print-header img { + width: 2cm; + height: auto; + } + .path-projets-complets .layout-content .print-header__text { + text-transform: uppercase; + font-family: "Source Code Pro"; + color: rgb(9, 57, 139); + font-size: 0.8rem; + font-weight: 500; + text-transform: uppercase; + text-align: end; + } .path-projets-complets .layout-content .views-row { margin-top: 3rem; break-after: page; @@ -602,7 +632,7 @@ svg.ext { padding-top: 3rem; } .path-projets-complets .layout-content .views-row .projet-header-print .field--name-title { - font-size: 1.5rem; + font-size: 1.2rem; } .path-projets-complets .layout-content .views-row .projet-body-print { padding-top: 3rem; diff --git a/web/themes/custom/eql/scss/global/print/_projets-complets-ecran.scss b/web/themes/custom/eql/scss/global/print/_projets-complets-ecran.scss index 87a33d3..2f0871a 100644 --- a/web/themes/custom/eql/scss/global/print/_projets-complets-ecran.scss +++ b/web/themes/custom/eql/scss/global/print/_projets-complets-ecran.scss @@ -15,6 +15,27 @@ span { display: none; } + .print-header{ + display: none; + } + + + + .print-header img { + width: 2cm; + height: auto; + } + + .print-header__text { + text-transform: uppercase; + font-family: "Source Code Pro"; + + color: $blue-dark; + font-size: 0.8rem; + font-weight: 500; + text-transform: uppercase; + text-align: end; + } .node-type-projet { border-bottom: 1px solid black; @@ -82,39 +103,6 @@ display: none; } } - // .field--name-field-photo { - // order: 1; - - // .field__label { - // display: none; - // } - - // .field__items { - // display: grid; - // grid-template-columns: repeat(3, 1fr); - // grid-template-rows: 500px 150px 150px; - // gap: 3px; - // } - - // .field__item:first-child { - // grid-column: 1 / 4; - // grid-row: 1; - - // img { - // max-height: 500px; - // } - // } - - // .field__item { - // overflow: hidden; - // } - - // .field__item img { - // width: 100%; - // height: 100%; - // object-fit: cover; - // display: block; - // } // } .field--name-title { @@ -171,18 +159,24 @@ .field--name-field-incube { order: 4; + display: inline-flex; width: fit-content; background-color: $red; color: white; font-weight: 800; padding-right: 0.3rem; padding-left: 0.2rem; - flex-direction: row; + margin-bottom: 1rem; + margin-top: 1rem; + // flex-direction: row; &::before { content: ' Projet '; padding-right: 0.5rem; } + .field__label{ + display: inline; + } .field__item { display: none; @@ -193,32 +187,20 @@ .field--name-field-encours-fini { display: none; } - + .field--name-field-region { - order: 5; - width: 30%; - position: relative; - height: 80px; - text-align: center; - padding-right: 1rem; - - @media (max-width: 479px) { - width: 100%; - } - - .field__label { - display: none; - } - + display: flex; + align-items: center; + gap: 0.5rem; + margin-bottom: 2rem; + &::before { - content: url("../images/pictos/picto_lieu.svg"); - min-width: 30px; - height: auto; - padding-right: 1rem; - position: absolute; - left: 0; - margin-top: .83em; - margin-left: 1rem; + content: ""; + display: block; + width: 20px; + height: 20px; + background: url("../images/pictos/picto_lieu.svg") no-repeat center; + background-size: contain; } } diff --git a/web/themes/custom/eql/scss/global/print/_projets-complets-print.scss b/web/themes/custom/eql/scss/global/print/_projets-complets-print.scss index 58f18fd..843a004 100644 --- a/web/themes/custom/eql/scss/global/print/_projets-complets-print.scss +++ b/web/themes/custom/eql/scss/global/print/_projets-complets-print.scss @@ -9,6 +9,32 @@ .layout-content{ width: 80vw; + + .print-header { + position: absolute; + top: 1cm; + right: 1cm; + display: flex; + align-items: center; + gap: 0.5rem; + } + + .print-header img { + width: 2cm; + height: auto; + } + + .print-header__text { + text-transform: uppercase; + font-family: "Source Code Pro"; + + color: $blue-dark; + font-size: 0.8rem; + font-weight: 500; + text-transform: uppercase; + text-align: end; + } + .views-row{ margin-top: 3rem; @@ -18,7 +44,7 @@ .projet-header-print{ padding-top: 3rem; .field--name-title{ - font-size: 1.5rem; + font-size: 1.2rem; } } .projet-body-print{ diff --git a/web/themes/custom/eql/templates/node--view--projets.html.twig b/web/themes/custom/eql/templates/node--view--projets.html.twig index 8ab7e15..97c9921 100644 --- a/web/themes/custom/eql/templates/node--view--projets.html.twig +++ b/web/themes/custom/eql/templates/node--view--projets.html.twig @@ -94,6 +94,13 @@
{# {{ content }} #} +
+
+ ENGAGÉS POUR LA QUALITÉ
+ DU LOGEMENT DE DEMAIN +
+ +
{#
#}