From 4a03300d2a463dc185bdd595f8b3bf358c53a145 Mon Sep 17 00:00:00 2001 From: ouidade Date: Thu, 16 Dec 2021 15:52:11 +0100 Subject: [PATCH] page 1 offre --- web/themes/custom/eql/css-compiled/styles.css | 208 +++++++++++++ .../pictos/carre-contour-bleu-offre.svg | 57 ++++ web/themes/custom/eql/scss/pages/_offre.scss | 293 ++++++++++++++++++ .../eql/scss/pages/_offresdeservices.scss | 2 - 4 files changed, 558 insertions(+), 2 deletions(-) create mode 100644 web/themes/custom/eql/images/pictos/carre-contour-bleu-offre.svg diff --git a/web/themes/custom/eql/css-compiled/styles.css b/web/themes/custom/eql/css-compiled/styles.css index 1b76bfb..dd79f00 100644 --- a/web/themes/custom/eql/css-compiled/styles.css +++ b/web/themes/custom/eql/css-compiled/styles.css @@ -1597,6 +1597,214 @@ a { content: url("../images/pictos/noun_Arrow_3771902.svg"); align-self: end; } +.page-node-type-offre-de-service { + background: url("../images/pictos/carre-contour-bleu-offre.svg"); + background-repeat: no-repeat; + background-position-y: 7rem; + max-width: 100vw; + background-size: contain; } + .page-node-type-offre-de-service .layout__region--top .block-region-top { + margin-top: 2rem; + margin-left: 13%; + display: grid; + grid-template-columns: auto auto 1fr; + grid-template-rows: repeat(6 auto); } + .page-node-type-offre-de-service .layout__region--top .block-region-top .block-entity-fieldnodefield-photo { + width: fit-content; + grid-column: 1; + grid-row: 1 / span 6; + width: 250px; + height: 250px; + margin-right: 2rem; } + .page-node-type-offre-de-service .layout__region--top .block-region-top .block-entity-fieldnodefield-photo img { + width: 100%; + height: auto; } + .page-node-type-offre-de-service .layout__region--top .block-region-top .block-entity-fieldnodefield-prenom { + background: white; + width: fit-content; + grid-column: 2; + grid-row: 1; + padding-right: 0.5rem; + text-transform: uppercase; + font-weight: 900; + font-size: 1.5rem; } + .page-node-type-offre-de-service .layout__region--top .block-region-top .block-entity-fieldnodefield-nom { + background: white; + width: fit-content; + grid-column: 3; + grid-row: 1; + text-transform: uppercase; + font-weight: 900; + font-size: 1.5rem; } + .page-node-type-offre-de-service .layout__region--top .block-region-top .block-entity-fieldnodefield-structure { + background: white; + width: fit-content; + grid-column: 2 / span 3; + grid-row: 2; + text-transform: uppercase; + font-weight: 800; + font-size: 0.8rem; + margin-top: 0.5rem; } + .page-node-type-offre-de-service .layout__region--top .block-region-top .block-entity-fieldnodefield-structure::after { + content: url('data:image/svg+xml, '); } + .page-node-type-offre-de-service .layout__region--top .block-region-top .block-entity-fieldnodetitle { + background: white; + width: fit-content; + grid-column: 2 / span 3; + grid-row: 3; + font-size: 2.5rem; + font-family: "Source Code Pro"; } + .page-node-type-offre-de-service .layout__region--top .block-region-top .block-entity-fieldnodetitle a { + color: black; } + .page-node-type-offre-de-service .layout__region--top .block-region-top .block-entity-fieldnodefield-localisation { + background: white; + width: fit-content; + grid-column: 2 / span 3; + grid-row: 4; + text-transform: uppercase; + font-weight: 800; + font-size: 00.8rem; } + .page-node-type-offre-de-service .layout__region--top .block-region-top .block-entity-fieldnodefield-date-de-proposition { + background: white; + width: fit-content; + grid-column: 2 / span 3; + grid-row: 5; + font-size: 0.8rem; + padding-top: 1rem; } + .page-node-type-offre-de-service .layout__region--second { + margin-top: 3rem; + margin-left: 20%; + margin-right: 2rem; } + .page-node-type-offre-de-service .layout__region--second .block-entity-fieldnodebody .field--type-text-with-summary { + background: white; } + .page-node-type-offre-de-service .layout__region--second .block-entity-fieldnodebody .field--type-text-with-summary p { + margin: 0; } + .page-node-type-offre-de-service .layout__region--third { + margin-top: 3rem; } + .page-node-type-offre-de-service .layout__region--third .block-region-third { + display: flex; + flex-direction: column; + width: 70%; } + .page-node-type-offre-de-service .layout__region--third .block-region-third .block-entity-fieldnodefield-courriel { + background: #009ee3; + color: white; + font-weight: 600; + padding-top: 1rem; + padding-left: 1rem; + padding-right: 1rem; } + .page-node-type-offre-de-service .layout__region--third .block-region-third .block-entity-fieldnodefield-telephone { + background: #009ee3; + color: white; + font-weight: 600; + padding-left: 1rem; + padding-right: 1rem; + padding-bottom: 1rem; } + .page-node-type-offre-de-service .layout__region--third .block-region-third .block-entity-fieldnodefield-fichiers { + height: fit-content; + border: 2px solid #009ee3; + background-color: white; + margin-top: 1rem; } + .page-node-type-offre-de-service .layout__region--third .block-region-third .field--name-field-fichiers { + min-height: 4rem; + background: white; + color: #009ee3; + padding-left: 1rem; + padding-top: 1rem; + margin-bottom: 1rem; } + .page-node-type-offre-de-service .layout__region--third .block-region-third .field--name-field-fichiers span:nth-of-type(2) { + display: none; } + .page-node-type-offre-de-service .layout__region--third .block-region-third .field--name-field-fichiers .file--mime-application-pdf { + height: inherit; + margin: auto; } + .page-node-type-offre-de-service .layout__region--third .block-region-third .field--name-field-fichiers .file--mime-application-pdf ::before { + content: url("../images/pictos/noun_Download_file_307900.svg"); + min-width: 50px; + height: auto; + padding-right: 1rem; } + .page-node-type-offre-de-service .layout__region--third .block-region-third .field--name-field-fichiers .file--mime-application-pdf a { + hyphens: auto; + display: inline-flex; + align-items: center; + color: #009ee3; + font-weight: 800; } + .page-node-type-offre-de-service .layout__region--third .block-region-third .block-entity-fieldnodefield-liens { + margin-top: 1rem; } + .page-node-type-offre-de-service .layout__region--third .block-region-third .block-entity-fieldnodefield-liens .field--name-field-liens .field__item { + margin: auto; + height: fit-content; + border: 2px solid #009ee3; + min-height: 4rem; + background: white; + color: #009ee3; + padding-left: 1rem; + padding-top: 1rem; + margin-bottom: 1rem; } + .page-node-type-offre-de-service .layout__region--third .block-region-third .block-entity-fieldnodefield-liens .field--name-field-liens a { + display: inline-flex; + align-items: center; + color: #009ee3; + font-weight: 800; } + .page-node-type-offre-de-service .layout__region--third .block-region-third .block-entity-fieldnodefield-liens .field--name-field-liens a::before { + content: url("../images/pictos/noun_External Link_674151.svg"); + min-width: 50px; + height: auto; + padding-right: 1rem; } + .page-node-type-offre-de-service .layout__region--third .block-region-third .block-entity-fieldnodefield-liens .field--name-field-liens a svg.ext { + display: none; } + .page-node-type-offre-de-service .layout__region--third .block-region-third .block-entity-fieldnodefield-ress { + margin-top: 3rem; } + .page-node-type-offre-de-service .layout__region--third .block-region-third .block-entity-fieldnodefield-ress .field--name-field-ress .field__label { + font-size: 0.8rem; + color: black; + font-weight: 900; + margin-bottom: 1rem; } + .page-node-type-offre-de-service .layout__region--third .block-region-third .block-entity-fieldnodefield-ress .field--name-field-ress .node-type-ressource { + display: flex; + flex-direction: column; + border: 2px solid #009ee3; + padding: 1rem; + height: fit-content; + margin-bottom: 1rem; + background-color: white; } + .page-node-type-offre-de-service .layout__region--third .block-region-third .block-entity-fieldnodefield-ress .field--name-field-ress .node-type-ressource:first-of-type { + border-top: 1px solid #009ee3; + padding-top: 1rem; } + .page-node-type-offre-de-service .layout__region--third .block-region-third .block-entity-fieldnodefield-ress .field--name-field-ress .node-type-ressource:first-of-type::after { + content: url("../images/pictos/noun_Arrow_3771902.svg"); + align-self: end; } + .page-node-type-offre-de-service .layout__region--third .block-region-third .block-entity-fieldnodefield-ress .field--name-field-ress .node-type-ressource .field--name-title h2 { + margin: 0; } + .page-node-type-offre-de-service .layout__region--third .block-region-third .block-entity-fieldnodefield-ress .field--name-field-ress .node-type-ressource .field--name-title a { + color: black; + font-size: 1.4rem; + font-weight: 600; } + .page-node-type-offre-de-service .layout__region--third .block-region-third .block-entity-fieldnodefield-ress .field--name-field-ress .node-type-ressource .field--name-field-auteur-s- { + font-weight: 800; } + .page-node-type-offre-de-service .layout__region--third .block-region-third .block-entity-fieldnodefield-ress .field--name-field-ress .node-type-ressource .field--name-field-auteur-s- p { + margin: 0; } + .page-node-type-offre-de-service .layout__region--third .block-region-third .block-entity-fieldnodefield-ress .field--name-field-ress .node-type-ressource .field--name-field-auteur-s- .field__label { + display: none; } + .page-node-type-offre-de-service .layout__region--third .block-region-third .block-entity-fieldnodefield-ress .field--name-field-ress .node-type-ressource .field--name-field-edition p { + margin: 0; } + .page-node-type-offre-de-service .layout__region--third .block-region-third .block-entity-fieldnodefield-ress .field--name-field-ress .node-type-ressource .field--name-field-edition .field__label { + display: none; } + .page-node-type-offre-de-service .layout__region--third .block-region-third .block-entity-fieldnodefield-ress .field--name-field-ress .node-type-ressource .field--name-field-images { + display: none; + width: 50%; } + .page-node-type-offre-de-service .layout__region--third .block-region-third .block-entity-fieldnodefield-ress .field--name-field-ress .node-type-ressource .field--name-field-images img { + width: 100%; + height: auto; } + .page-node-type-offre-de-service .layout__region--third .block-region-third .block-entity-fieldnodefield-ress .field--name-field-ress .node-type-ressource .field--name-field-type-de-ressource { + display: inline-flex; + margin-top: 2rem; + background: #09398b; + margin-right: 1rem; + padding-left: 0.3rem; + padding-right: 0.3rem; + color: white; + font-weight: 800; + vertical-align: middle; } + .path-ressources.annuairederecherche .layout-content .region-content #block-contenudelapageprincipale span { padding-top: 3rem; padding-bottom: 3rem; diff --git a/web/themes/custom/eql/images/pictos/carre-contour-bleu-offre.svg b/web/themes/custom/eql/images/pictos/carre-contour-bleu-offre.svg new file mode 100644 index 0000000..33bce20 --- /dev/null +++ b/web/themes/custom/eql/images/pictos/carre-contour-bleu-offre.svg @@ -0,0 +1,57 @@ + + + + + + + + + + diff --git a/web/themes/custom/eql/scss/pages/_offre.scss b/web/themes/custom/eql/scss/pages/_offre.scss index e69de29..057975c 100644 --- a/web/themes/custom/eql/scss/pages/_offre.scss +++ b/web/themes/custom/eql/scss/pages/_offre.scss @@ -0,0 +1,293 @@ +.page-node-type-offre-de-service{ + + background: url('../images/pictos/carre-contour-bleu-offre.svg'); + background-repeat: no-repeat; + background-position-y: 7rem; + max-width: 100vw; + background-size: contain; + + // #block-contenudelapageprincipale{ + .layout__region--top{ + + .block-region-top{ + margin-top: 2rem; + margin-left: 13%; + display: grid; + grid-template-columns: auto auto 1fr; + grid-template-rows: repeat(6 auto); + + .block-entity-fieldnodefield-photo{ + width: fit-content; + grid-column: 1; + grid-row: 1 / span 6; + width: 250px; + height: 250px; + margin-right: 2rem; + img{ + width: 100%; + height: auto; + } + } + .block-entity-fieldnodefield-prenom{ + background: $white; + width: fit-content; + grid-column: 2; + grid-row: 1; + padding-right: 0.5rem; + text-transform: uppercase; + font-weight: 900; + font-size: 1.5rem; + } + .block-entity-fieldnodefield-nom{ + background: $white; + width: fit-content; + grid-column: 3; + grid-row: 1; + text-transform: uppercase; + font-weight: 900; + font-size: 1.5rem; + } + .block-entity-fieldnodefield-structure{ + background: $white; + width: fit-content; + grid-column: 2 / span 3; + grid-row: 2; + text-transform: uppercase; + font-weight: 800; + font-size: 0.8rem; + margin-top: 0.5rem; + &::after{ + content:url('data:image/svg+xml, '); + } + } + .block-entity-fieldnodetitle{ + background: $white; + width: fit-content; + grid-column: 2 / span 3; + grid-row: 3; + font-size: 2.5rem; + font-family: "Source Code Pro"; + + a{ + color: $black; + } + } + .block-entity-fieldnodefield-localisation{ + background: $white; + width: fit-content; + grid-column: 2 / span 3; + grid-row: 4; + text-transform: uppercase; + font-weight: 800; + font-size: 00.8rem; + } + .block-entity-fieldnodefield-date-de-proposition{ + background: $white; + width: fit-content; + grid-column: 2 / span 3; + grid-row: 5; + font-size: 0.8rem; + padding-top: 1rem; + } + + + } + } + + .layout__region--second{ // paragraphe texte + margin-top: 3rem; + margin-left: 20%; + margin-right: 2rem; + .block-entity-fieldnodebody{ + .field--type-text-with-summary{ + background: $white; + p{ margin: 0;} + } + } + + } + + .layout__region--third{ // colone de droite fichiers et ressources liƩes + margin-top: 3rem; + .block-region-third{ + display: flex; + flex-direction: column; + width: 70%; + + .block-entity-fieldnodefield-courriel{ + background: $blue-light; + color: $white; + font-weight: 600; + padding-top: 1rem; + padding-left: 1rem; + padding-right: 1rem; + } + .block-entity-fieldnodefield-telephone{ + background: $blue-light; + color: $white; + font-weight: 600; + padding-left: 1rem; + padding-right: 1rem; + padding-bottom: 1rem; + } + + .block-entity-fieldnodefield-fichiers{ + height: fit-content; + border: 2px solid $blue-light; + background-color: $white; + margin-top: 1rem; + + } + .field--name-field-fichiers{ + min-height: 4rem; + background: $white; + color: $blue-light; + padding-left: 1rem; + padding-top: 1rem; + margin-bottom: 1rem; + + span:nth-of-type(2){ + display: none; + } + + .file--mime-application-pdf{ + height: inherit; + margin: auto; + ::before{ + content: url("../images/pictos/noun_Download_file_307900.svg"); + min-width:50px; + height: auto; + padding-right: 1rem; + } + a{ + hyphens: auto; + display: inline-flex; + align-items: center; + color: $blue-light; + font-weight: 800; + // max-width: 80px ; + } + } + + } + .block-entity-fieldnodefield-liens{ + margin-top: 1rem; + .field--name-field-liens{ + .field__item{ + margin: auto; + height: fit-content; + border: 2px solid $blue-light; + min-height: 4rem; + background: $white; + color: $blue-light; + padding-left: 1rem; + padding-top: 1rem; + margin-bottom: 1rem; + } + a{ + display: inline-flex; + align-items: center; + color: $blue-light; + font-weight: 800; + &::before{ + content: url("../images/pictos/noun_External Link_674151.svg"); + min-width: 50px; + height: auto; + padding-right: 1rem; + } + svg.ext{ + display: none; + } + } + } + + } + + + .block-entity-fieldnodefield-ress{ + margin-top: 3rem; + .field--name-field-ress{ + .field__label{ + font-size: 0.8rem; + color: $black; + font-weight: 900; + margin-bottom: 1rem; + } + + .node-type-ressource{ + display: flex; + flex-direction: column; + border: 2px solid $blue-light; + padding: 1rem; + + height: fit-content; + margin-bottom: 1rem; + background-color: $white; + &:first-of-type{ + border-top: 1px solid $blue-light; + padding-top: 1rem; + &::after{ + content: url("../images/pictos/noun_Arrow_3771902.svg"); + align-self: end; + } + } + .field--name-title{ + h2{ + margin: 0; + } + a{ + color: $black; + font-size: 1.4rem; + font-weight: 600; + + } + } + .field--name-field-auteur-s-{ + font-weight: 800; + p{ + margin: 0; + } + .field__label{ + display:none; + } + } + .field--name-field-edition{ + p{ + margin: 0; + } + .field__label{ + display:none; + } + } + .field--name-field-images{ + display: none; + width: 50%; + img{ + width: 100%; + height: auto; + } + } + .field--name-field-type-de-ressource{ + display: inline-flex; + margin-top: 2rem; + background: $blue-dark; + margin-right: 1rem; + padding-left: 0.3rem; + padding-right: 0.3rem; + color: $white; + font-weight: 800; + vertical-align: middle; + } + } + } + + + } + + } + + + } + // } + +} \ No newline at end of file diff --git a/web/themes/custom/eql/scss/pages/_offresdeservices.scss b/web/themes/custom/eql/scss/pages/_offresdeservices.scss index 241d06d..ffc8e66 100644 --- a/web/themes/custom/eql/scss/pages/_offresdeservices.scss +++ b/web/themes/custom/eql/scss/pages/_offresdeservices.scss @@ -1,7 +1,5 @@ -.path-ressources{ -} .offresdeservices{ .layout-content{ .region-content{