.path-frontpage{ .block-region-content{ display: grid; grid-template-areas: "presentation presentation presentation presentation presentation presentation" "presentation presentation presentation presentation presentation presentation" "presentation presentation presentation presentation presentation presentation" "presentation presentation presentation presentation presentation presentation" "actus actus actus actus actus actus" "actus actus actus actus actus actus" "programme programme programme programme programme programme" "programme programme programme programme programme programme" "programme programme programme programme programme programme"; grid-template-rows: auto auto auto; grid-template-columns: 1fr repeat(4, 2fr) 1fr; min-height: 100vh; // 1er bandeau home .block-config-pages-block{ grid-area: presentation; width: 100%; height: 68vh; background: url("../images/pictos/rosace_coupee.svg"); // background: url("../images/carre_site.mp4"); background-position-y: top; background-position-x: center; background-repeat: no-repeat; background-size: cover; padding-bottom: 3rem; @media (max-width: 428px){ height: 66vh; background-size: cover; background-position-y: top; background-position-x: left; } .config_pages--type--home-front{ // width:20vw; // min-width: fit-content; // height: 20vw; width: 400px; height: 340px; min-height: fit-content; margin: auto; background-color: white; margin-top: 5rem; margin-left: 22%; // margin-bottom: 5rem; padding: 4rem 2rem 4rem 2rem; // padding-left: 5%; // padding-right: 5%; // padding-bottom: 4rem; // padding-top: 4rem; @media (max-width: 428px){ width: 300px; height: 200px; margin-left: 10%; padding: 3rem 5% 4rem 5%; margin-top: 5rem; } .field--name-field-titre{ // font-size: 5rem; // font-weight: 900; // color: $blue-light; // line-height: 5.7rem; // margin-top: 4rem; // margin-bottom: 2rem; // width: fit-content; color: #e1000f; font-weight: 900; font-size: 1.5rem; text-transform: uppercase; font-family: "Source Code Pro"; @media (max-width: 428px){ font-size: 1.2rem;; } } .field--name-field-sous-titre{ // color: #e1000f; // font-weight: 900; // font-size: 1.8rem; // text-transform: uppercase; // font-family: "Source Code Pro"; font-size: 3rem; font-weight: 900; color: $blue-light; line-height: 4rem; margin-top: 3rem; margin-bottom: 2rem; width: fit-content; @media (max-width: 428px){ font-size: 2.5rem; line-height: 3rem; margin-top: 1rem; } } .field--name-field-punchline{ color: $blue-light; font-weight: 900; font-size: 1.5rem; text-transform: uppercase; font-family: "Source Code Pro"; padding-bottom: 3rem; } .field--name-field-lien{ position: relative; background-color: $white; border: 2px solid $blue-light; width: fit-content; height: 1.5rem; padding: 0.4rem 1rem; text-align: center !important; float: right; bottom: 0; a{ display: inline-flex; text-transform: uppercase; font-weight: 700; color: $blue-light; align-items: center; &:after{ display: block; content: url('data:image/svg+xml,'); } } } } } .block-block-content9448ca2a-90e3-488b-89cf-8ec6a986a9ca{ display: none; } .block-block-content1bb9024b-d95f-4137-894c-362abf10a483{ display: none; } // .block-views-blockhome-nodes-block-1{ // grid-area: presentation; // // grid-row: 1; // background: url("../images/pictos/forme_home_2.svg"); // // background: url("../images/carre_site.mp4"); // background-size: 75%; // background-position-y: bottom; // background-position-x: left; // background-repeat: no-repeat; // @media (max-width: 810px){ // background: url("../images/pictos/forme_home_2_smartphone.svg"); // background-size: 100%; // background-position-y: bottom; // background-position-x: left; // background-repeat: no-repeat; // } // .node-type-static{ // div:first-child{ // display: grid; // grid-template-columns: 1fr repeat(4, 2fr) 1fr; // grid-template-rows: repeat(4, auto); // .field--name-field-images{ // ///////////////// à activer le 19 février ///////////////// // display: none; // ////////////////////////////////// // grid-column: 4 / span 6; // grid-row: 2; // .field__item{ // display: block; // width: 400px; // height: 400px; // @media (max-width: 1517px){ // width: 300px; // height: 300px; // } // img{ // max-width:100%; // max-height: 100%; // } // } // } // .field--name-field-accroche{ // grid-column: 2 /span 2; // grid-row: 2 / span 2; // font-size: 5rem; // font-weight: 900; // color: $blue-light; // line-height: 6.9rem; // margin-top: 4rem; // margin-bottom: 5rem; // width: fit-content; // p{ // margin-top: 0rem; // margin-bottom: 0; // } // span { // background-color: $white; // } // @media (max-width: 810px){ // grid-column: 2 /span 5; // grid-row: 2; // font-size: 3rem; // line-height: 4.3rem; // margin-top: 0; // margin-bottom: 1rem; // p{ // margin-top: 0rem; // } // } // } // .field--name-title{ // // grid-column: 4; // // grid-row: 2; // grid-column: 2; // grid-row: 1 / span 2; // margin-top: 3rem; // margin-bottom: 2rem; // h2{ // background-color: $white; // a{ // color: #e1000f; // font-weight: 900; // text-transform: uppercase; // font-family: "Source Code Pro"; // display: table; // margin: 0px auto 0px auto; // // background-color: $white; // } // } // @media (max-width: 1517px){ // } // @media (max-width: 810px){ // margin-top: 1rem; // grid-column: 2 / 6; // grid-row: 1; // } // } // .links.inline{ // grid-column: 2; // grid-row: 4; // max-width: 70%; // min-width: fit-content; // height: 1.5rem; // padding: 0.4rem 1rem; // font-size: 0.8rem; // margin-bottom: 2.5rem; // background-color: $white; // border: 2px solid $blue-light; // list-style: none; // text-align: center !important; // a{ // display: inline-flex; // text-transform: uppercase; // font-weight: 700; // color: $blue-light; // align-items: center; // &:after{ // display: block; // content: url('data:image/svg+xml,'); // } // } // @media (max-width: 810px){ // grid-column: 2; // grid-row:3; // font-size: 0.6rem; // a{ // &:after{ // display: none; // } // } // } // } // } // } // } // // bouton déposer candidature // .block-block-content9448ca2a-90e3-488b-89cf-8ec6a986a9ca{ // ///////////////// à activer le 19 février ///////////////// // display: none; // ////////////////////////////////// // grid-area: presentation; // grid-column: 3 /span 4; // grid-row: 4; // align-self: flex-end; // margin-bottom: 2.5rem; // max-width: 25%; // min-width: fit-content; // .field--type-link { // grid-column: 3; // // justify-self: flex-end; // position: relative; // // max-width: 70%; // // min-width: fit-content; // height: 1.5rem; // padding: 0.4rem 1rem; // font-size: 0.8rem; // margin: 0; // background-color: $white; // border: 2px solid $blue-light; // list-style: none; // top: -200%; // text-align: center !important; // a{ // display: inline-flex; // text-transform: uppercase; // font-weight: 700; // color: $blue-light; // align-items: center; // .ext{ // display: none; // } // } // a::after{ // content: url('data:image/svg+xml,'); // } // } // @media (max-width: 810px){ // grid-area: presentation; // grid-column: 5; // grid-row: 4; // .field--type-link { font-size: 0.6rem; // a::after{ // display: none; // } // } // } // } // // bouton foire aux questions // .block-block-content1bb9024b-d95f-4137-894c-362abf10a483{ // ///////////////// à activer le 19 février ///////////////// // display: none; // ////////////////////////////////// // grid-area: presentation; // grid-column: 5 ; // grid-row: 4; // background-color: $blue-light; // height: fit-content; // align-self: flex-end; // max-width: 70%; // min-width: fit-content; // .field--name-field-lien{ // &:before{ // margin-top: 1rem; // display: block; // content: url("../images/pictos/picto_faq.svg"); // } // text-align: center; // a{ // font-size: 0.8rem; // font-weight: 1000; // color: $blue-dark; // text-transform: uppercase; // } // } // .field--name-field-description{ // margin-bottom: 1rem; // p{ // margin-top: 0; // margin-bottom: 0; // margin-left: 1.5rem; // margin-right: 1.5rem; // text-align: center; // a{ // font-weight: 800; // color: $white; // font-size: 1.3rem; // } // } // } // @media (max-width: 810px){ // .field--name-field-lien{ // background-color: $white; // border: 2px solid $blue-light; // padding: 0.4rem 1rem; // &:before{display: none;} // a{ // display: inline-flex; // text-transform: uppercase; // font-weight: 700; // color: $blue-light; // align-items: center; // font-size: 0.6rem; // } // a::after{ // display: none; // } // } // .field--name-field-description{display: none;} // } // } // // date limite de candidature // .block-block-content7db64d87-3e22-4fbd-9c11-2b95f5bef695{ // ///////////////// à activer le 19 février ///////////////// // // display: none; // ////////////////////////////////// // grid-column: 5; // grid-row: 1; // height: fit-content; // ///////////////// à désactiver le 19 février ///////////////// // display: flex; // ////////////////////////////////// // justify-self: flex-end; // width: 50%; // margin-top: 3rem; // .field--name-body{ // justify-content: right; // display: flex; // flex-direction: column; // text-transform: uppercase; // text-align: right; // font-size: 1.3rem; // :nth-child(1){ // &:after{ // display: block; // content: url("../images/pictos/noun_Arrow_3771902-rouge.svg"); // transform: rotate(90deg); // height: fit-content; // position: relative; // top: -30px; // right: -60px; // } // } // :nth-child(2){ // font-size: 2.5rem; // font-weight: 900; // } // } // @media (max-width: 810px){ // display: none; // grid-column: 2 / span 6; // grid-row: 3; // width: 100%; // margin-top:8rem; // .field--name-body{ // justify-content: left; // display: flex; // flex-direction:row; // text-transform: uppercase; // text-align: left; // align-items: center; // font-size: 1rem; // font-weight: 800; // :nth-child(1){ // width: 25%; // height: fit-content; // &:after{ // display: inline-flex; // transform: rotate(360deg) translateX(80px) translateY(-6px) scale(50%); // } // } // :nth-child(2){ // margin: 0; // text-align: right; // justify-self: flex-end; // font-size: 1.5rem; // margin-left: 5rem; // margin-top: 0.6rem; // margin-bottom: 2rem; // } // } // } // } // bandeau actus .block-views-blockactus-blocks-pages-block-1{ grid-area: actus; width: 100vw; border-bottom: 5px solid $blue-light; border-top: 5px solid $blue-light; background: $background-actus; .view-actus-blocks-pages{ .view-content{ display: grid; grid-template-columns: 1fr repeat(4, 2fr) 1fr; margin: auto; padding-top: 2rem; padding-bottom: 4rem; @media (max-width: 479px){ display: flex; padding-left: 1rem; width: 80%; } .views-row:nth-of-type(1) { grid-column: 2; } .node-type-actualite{ color: $black; line-height: 1.5rem; padding: 0.5rem; div:first-child{ // block actu dans le bandeau display: flex; flex-direction: column; // :nth-child(1) { order: 1; } // :nth-child(4) { order: 2; } // :nth-child(5) { order: 3; } } .field--name-field-images { order: 1; .field__item img{ max-width: 95%; max-height: 150px; object-fit: cover; width: 100%; padding-bottom: 1rem; } } .field--name-field-date{ order: 2; display: flex; flex-direction: row; justify-content: flex-start; &:not(:last-child):after{ padding-right: 1rem; content: "|"; } time{ font-size: 0.9rem; font-weight: 800; padding-right: 1rem; width: fit-content; // :not(:last-child):after{ // padding-left: 0.5rem; // content: "|"; // } } } .field--name-title{ order:3; } .field--name-field-sous-titre{ order:4; margin-top: 0.3rem; font-weight: 800; } .field:not(.field--name-field-images){ width: 100%; } h2{ margin:0; } a{ color: $black; } .inline.links{ padding-top: none !important; list-style: none; width: fit-content; align-self: flex-end; padding-right: 1rem; a{ display: none; } } .field--name-field-actu-type{ order:5; padding-top: 1rem; } } } } } // bouton voir toutes actus du bandeau bleu .block-block-content3ee1f633-aaa7-4b4c-a42a-02206e26d3a2{ grid-area: actus; grid-row: 6; grid-column: 5 / span 6; max-width: 50%; min-width: fit-content; margin-bottom: 2rem; align-self: flex-end; @media (max-width: 479px){ grid-column: 3 / span 6; } .field--type-link { width: fit-content; height: fit-content; padding: 0.4rem 1rem; font-size: 0.8rem; margin: 0; background-color: $white; border: 2px solid $blue-light; list-style: none; display: inline-flex; a{ text-transform: uppercase; font-weight: 700; color: $blue-light; display: inline-flex; align-items: center; } a::after{ content: url('data:image/svg+xml,'); } } } // présentation programme .block-views-blockhome-nodes-block-2{ grid-area: programme; .view-display-id-block_2:is(.view-id-home_nodes){ padding-top: 2rem; // background: url('data:image/svg+xml,'); background: url('../images/pictos/carre-contour-bleu.svg'); // background-position-y: 50%; background-repeat: no-repeat; max-width: 100vw; background-size: cover; .node-type-static{ width: 70%; margin: auto; div:first-child:not(.field__item):not(.field){ display: flex; flex-direction: row; flex-wrap: wrap; :nth-child(4) { order: 3; } } .inline.links{ z-index: 95; align-self: flex-end; width: fit-content; height: fit-content; padding: 0.4rem 1rem; font-size: 0.8rem; margin: 0; background-color: $white; border: 2px solid $blue-light; list-style: none; a{ text-transform: uppercase; font-weight: 700; color: $blue-light; display: inline-flex; align-items: center; &:after{ // display: block; content: url('data:image/svg+xml,'); } } } .field--name-field-images{ // grid-column: 2 / 4; .field__item{ img{ width: 15rem; height: auto; } } } .field--name-title{ display: none; } .field--name-field-accroche{ flex: 1 1 50px; // grid-column: 4 / 9; padding-left: 1rem; p{ background-color: $white; font-size: 1.5rem; width: 110%; padding-bottom: 2rem; margin-block-start: 0; text-align: start !important; } } .field--name-field-videos{ flex: 0 0 80%; padding-top: 4rem; margin: auto; } } } } } }