From 66bd5cb3d9e0355e45651adc3b8eee6ec02f1d13 Mon Sep 17 00:00:00 2001 From: Valentin Date: Mon, 25 Mar 2024 23:22:38 +0100 Subject: [PATCH] modifs couleurs etc --- user/themes/figureslibres-v2/css/theme.css | 307 +++++++++++----- .../themes/figureslibres-v2/css/theme.css.map | 2 +- user/themes/figureslibres-v2/js/script.js | 234 +++++++++--- .../scss/configuration/_variable.scss | 11 +- user/themes/figureslibres-v2/scss/style.scss | 334 ++++++++++++------ .../templates/partials/relatedpages.html.twig | 86 ++--- .../templates/projets-index.html.twig | 4 +- .../templates/reader.html.twig | 96 +++-- 8 files changed, 733 insertions(+), 341 deletions(-) diff --git a/user/themes/figureslibres-v2/css/theme.css b/user/themes/figureslibres-v2/css/theme.css index 6fab87a..5ec3816 100644 --- a/user/themes/figureslibres-v2/css/theme.css +++ b/user/themes/figureslibres-v2/css/theme.css @@ -179,6 +179,7 @@ body { overflow-x: hidden; color: #0e1229; background-color: #f5f5f5; + transition: background-color 0.4s ease-out; } body header { position: fixed; @@ -189,11 +190,12 @@ body header { } body header #nav-container { height: 7vh; - background-color: #f5f5f5; padding: 0 3vw; display: flex; justify-content: space-between; align-items: center; + background-color: #f5f5f5; + transition: background-color 0.4s ease-out; } body header #nav-container h1 { cursor: pointer; @@ -211,7 +213,7 @@ body header nav { display: flex; align-items: center; opacity: 0; - transition: opacity 0.4s ease-out, top 0.7s ease-out; + transition: opacity 0.4s ease-out, top 0.7s ease-out, background-color 0.4s ease-out; } body header nav #crossMenu { position: absolute; @@ -253,6 +255,11 @@ body header:after { width: 100%; height: 4vh; background: linear-gradient(to bottom, #f5f5f5, #f5f5f500); + opacity: 1; + transition: opacity 0.4s ease-out; +} +body header.plain_bg:after { + opacity: 0; } body main { position: relative; @@ -274,7 +281,7 @@ body main .content h2 a, body main .content p a, body main .content ul a { transition: text-underline-offset 0.4s ease-out; } body main .content h2 a:hover, body main .content p a:hover, body main .content ul a:hover { - text-underline-offset: 0.15em; + text-underline-offset: 0.15em !important; } body main .content .projet-card { cursor: pointer; @@ -331,6 +338,9 @@ body main #index-content { flex-direction: column; align-items: center; } +body main #index-content .animateText { + text-decoration: underline 1px; +} body main #index-content #loader-index { position: absolute; height: 80vh; @@ -362,14 +372,10 @@ body main #index-content #main-p-index #culturelle { font-weight: bold; font-style: italic; } -body main #index-content #main-p-index #logicielslibres { - font-family: Rumeur, sans-serif; - font-weight: bold; -} body main #index-content #extrait-projets > div { max-height: 0vh; display: grid; - grid-template-columns: 1fr 1fr; + grid-template-columns: repeat(2, 1fr); gap: 0px 20px; align-items: flex-start; } @@ -433,7 +439,7 @@ body main #index-content #second-p-index #projets { body main #index-content #commanditaires-grid { width: 85vw; display: grid; - grid-template-columns: 1fr 1fr; + grid-template-columns: repeat(2, 1fr); gap: 25px 40px; align-items: center; } @@ -472,28 +478,45 @@ body main #projets-index #filter-index { text-align: center; width: 100%; margin-bottom: 30px; + display: flex; + flex-direction: column; + align-items: center; + justify-content: center; } body main #projets-index #filter-index .filter-button { cursor: pointer; + filter: grayscale(1); opacity: 0.4; - transition: opacity 0.4s ease-out; + padding: 0.25rem 0.75rem; + border-radius: 1rem; + font-size: 0.95em; + min-height: 1.25em; + display: inline-block; + transition: opacity 0.4s ease-out, filter 0.4s ease-out; +} +body main #projets-index #filter-index .filter-button:hover { + filter: grayscale(0) !important; + opacity: 1 !important; } body main #projets-index #filter-index p { - margin-bottom: 0; + margin-bottom: 1rem; } body main #projets-index #filter-index #publique-filter { font-family: PlayfairDisplay, serif; font-style: italic; + background-color: #ffaeab; } body main #projets-index #filter-index #sociale-filter { font-family: ManifontGrotesk, sans-serif; font-weight: bold; font-style: italic; + background-color: #71ff94; } body main #projets-index #filter-index #culturelle-filter { font-family: Avara, serif; font-weight: bold; font-style: italic; + background-color: #feff74; } body main #projets-index hr { width: 66%; @@ -561,31 +584,18 @@ body main #reader #header-project { position: fixed; height: 6vh; width: 100%; - background-color: #f5f5f5; - top: -9vh; + top: -4vh; transition: top 0.4s ease-out; } -body main #reader #header-project .info-project-publique span { - font-family: PlayfairDisplay, serif; - font-style: italic; -} -body main #reader #header-project .info-project-sociale span { - font-family: ManifontGrotesk, sans-serif; - font-weight: bold; - font-style: italic; -} -body main #reader #header-project .info-project-culturelle span { - font-family: Avara, serif; - font-weight: bold; - font-style: italic; -} body main #reader #header-project h2 { + margin: 0; overflow: hidden; position: absolute; - width: 80%; + width: 100%; + height: 100%; padding: 3px 0; - margin-top: 1.8vh; - margin-left: 3vw; + padding-top: 1.8vh; + padding-left: 3vw; font-size: 1.2em; } body main #reader #header-project h2 span { @@ -598,6 +608,29 @@ body main #reader #header-project h2 .scrollText:after { padding-left: 20px; white-space: nowrap; } +body main #reader #header-project h2.info-project-publique { + background: linear-gradient(to bottom, #ffaeab, #ffaeab 60%, rgba(255, 174, 171, 0)); +} +body main #reader #header-project h2.info-project-publique span { + font-family: PlayfairDisplay, serif; + font-style: italic; +} +body main #reader #header-project h2.info-project-sociale { + background: linear-gradient(to bottom, #71ff94, #71ff94 60%, rgba(113, 255, 148, 0)); +} +body main #reader #header-project h2.info-project-sociale span { + font-family: ManifontGrotesk, sans-serif; + font-weight: bold; + font-style: italic; +} +body main #reader #header-project h2.info-project-culturelle { + background: linear-gradient(to bottom, #feff74, #feff74 60%, rgba(254, 255, 116, 0)); +} +body main #reader #header-project h2.info-project-culturelle span { + font-family: Avara, serif; + font-weight: bold; + font-style: italic; +} body main #reader #header-project #gradient-long-title { position: absolute; height: 4vh; @@ -606,14 +639,6 @@ body main #reader #header-project #gradient-long-title { right: 16.5%; background: linear-gradient(to left, #f5f5f5, #f5f5f500); } -body main #reader #header-project:after { - position: absolute; - top: 6vh; - content: ""; - height: 4vh; - width: 100%; - background: linear-gradient(#f5f5f5, rgba(245, 245, 245, 0)); -} body main #reader #header-project + a { z-index: 2; } @@ -624,13 +649,54 @@ body main #reader #close-project { width: calc(25px - 5px); height: calc(23px - 5px); } -body main #reader #cover-image-mobile { +body main #reader figure#cover-image-mobile { margin-top: -2vh; margin-bottom: 2vh; } -body main #reader #cover-image { +body main #reader figure#cover-image { display: none; } +body main #reader figure#cover-image-mobile, +body main #reader figure#cover-image { + position: relative; + margin-top: 3vh; +} +body main #reader figure#cover-image-mobile img, +body main #reader figure#cover-image img { + filter: grayscale(0); + transition: filter 0.4s ease-out; + mix-blend-mode: normal; +} +body main #reader figure#cover-image-mobile:hover img, +body main #reader figure#cover-image:hover img { + filter: grayscale(1); + mix-blend-mode: darken; +} +body main #reader figure#cover-image-mobile::before, +body main #reader figure#cover-image::before { + position: absolute; + content: ""; + height: 100%; + width: 100%; + opacity: 0; + transition: opacity 0.4s ease-out; +} +body main #reader figure#cover-image-mobile:hover::before, +body main #reader figure#cover-image:hover::before { + opacity: 1; +} +body main #reader figure#cover-image-mobile.sociale:hover::before, +body main #reader figure#cover-image.sociale:hover::before { + background-color: #71ff94; +} +body main #reader figure#cover-image-mobile.culturelle:hover::before, +body main #reader figure#cover-image.culturelle:hover::before { + background-color: #feff74; +} +body main #reader figure#cover-image-mobile.publique:hover::before, +body main #reader figure#cover-image.publique:hover::before { + background-color: #ffaeab; +} body main #reader #info-project { align-self: flex-start; } @@ -664,8 +730,38 @@ body main #reader #project-description { margin-top: 2.2vh; } body main #reader #project-images-grid figure { + position: relative; margin-top: 3vh; } +body main #reader #project-images-grid figure img { + filter: grayscale(0); + transition: filter 0.4s ease-out; + mix-blend-mode: normal; +} +body main #reader #project-images-grid figure:hover img { + filter: grayscale(1); + mix-blend-mode: darken; +} +body main #reader #project-images-grid figure::before { + position: absolute; + content: ""; + height: 100%; + width: 100%; + opacity: 0; + transition: opacity 0.4s ease-out; +} +body main #reader #project-images-grid figure:hover::before { + opacity: 1; +} +body main #reader #project-images-grid figure:hover.sociale::before { + background-color: #71ff94; +} +body main #reader #project-images-grid figure:hover.publique::before { + background-color: #ffaeab; +} +body main #reader #project-images-grid figure:hover.culturelle::before { + background-color: #feff74; +} body main #reader hr { margin-bottom: 2vh; width: 66%; @@ -688,12 +784,15 @@ body main #reader #related-pages h3 { margin-top: 2vh; } body main #reader #related-pages #related-grid { - margin-bottom: 5vh; width: 80%; } body main #reader #related-pages #related-grid .card-displayed { margin-top: 1.5vh; } +body main #reader #related-pages p { + margin-top: 3vh; + margin-bottom: 5vh; +} body main #reader .swiper { position: fixed; top: 0; @@ -721,8 +820,8 @@ body main #reader .swiper .swiper-wrapper .swiper-slide { justify-content: center; } body main #reader .swiper .swiper-wrapper .swiper-slide img { - max-height: 100%; - max-width: 100%; + max-height: 90%; + max-width: 90%; object-fit: cover; } body main #reader .swiper .swiper-button-next, body main #reader .swiper .swiper-button-prev { @@ -769,22 +868,6 @@ body footer p a { body header nav { height: 100vh; } - body .content .card-displayed figure a figcaption { - opacity: 0; - position: absolute; - bottom: 0; - left: 0; - width: 100%; - box-sizing: border-box; - padding: 10px; - background: #0e1229; - color: #f5f5f5; - font-size: 0.75em; - border-radius: 0 0 10px 10px; - } - body .card-displayed:hover figure a figcaption { - opacity: 1; - } body main #index-content { min-height: 80vh; display: flex; @@ -792,12 +875,12 @@ body footer p a { justify-content: center; } body main #index-content #extrait-projets > div { - grid-template-columns: 1fr 1fr 1fr 1fr; + grid-template-columns: repeat(2, 1fr); } body main #index-content #extrait-projets > div div:last-of-type { overflow-x: hidden; text-align: right; - grid-column-end: span 4; + grid-column-end: span 2; } body main #index-content #extrait-projets > div div:last-of-type p { display: inline-block; @@ -811,13 +894,13 @@ body footer p a { } body main #index-content #commanditaires-grid { width: auto; - grid-template-columns: 1fr 1fr 1fr 1fr 1fr; + grid-template-columns: repeat(5, 1fr); } body main #projets-index { width: auto; } body main #projets-index #filter-index { - display: flex; + justify-content: start; flex-direction: row; max-width: 100%; } @@ -831,15 +914,13 @@ body footer p a { body main #projets-index .projets-grid { width: 100%; display: grid; - grid-template-columns: 1fr 1fr 1fr 1fr; + grid-template-columns: repeat(3, 1fr); gap: 0 10px; + align-items: start; } body main #projets-index .projets-grid > div { width: 100%; } - body main #reader #header-project h2 { - margin-top: 1vh; - } body main #reader #close-project { width: 12px; height: 10px; @@ -869,7 +950,7 @@ body footer p a { body main #reader #project-images-grid { width: auto; display: grid; - grid-template-columns: 1fr 1fr; + grid-template-columns: repeat(2, 1fr); grid-gap: 1em; } body main #reader #project-images-grid figure { @@ -885,19 +966,22 @@ body footer p a { body main #reader #project-images-grid figure:last-child:nth-child(odd) { grid-column: span 2; } - body main #reader #related-grid { + body main #reader #related-pages #related-grid { display: grid; - grid-template-columns: 1fr 1fr 1fr; + grid-template-columns: repeat(3, 1fr); width: auto !important; grid-column-gap: 10%; - margin-bottom: 6vh !important; } - body main #reader #related-grid .card-displayed { + body main #reader #related-pages #related-grid .card-displayed { margin-top: 2vh !important; + width: 100%; } - body main #reader #related-grid .card-displayed figure { + body main #reader #related-pages #related-grid .card-displayed figure { min-height: 80px !important; - min-width: 15vw; + } + body main #reader #related-pages p { + margin-top: 3vh; + margin-bottom: 6vh !important; } body main #reader .swiper .swiper-button-next, body main #reader .swiper .swiper-button-prev { bottom: unset; @@ -928,11 +1012,11 @@ body footer p a { display: none; } body header nav { + background-color: #f5f5f5; position: relative; top: 0; opacity: 1; height: 7vh; - background-color: #f5f5f5; justify-content: center; } body header nav #crossMenu { @@ -989,18 +1073,52 @@ body footer p a { justify-content: center; margin-top: calc(7vh + 2vh + 30px); } + body main #index-content > #extrait-projets figure a figcaption { + background-color: #0e1229; + color: #f5f5f5; + } body main .content { width: 65vw; padding: 0; } + body main .content .card-displayed figure a figcaption { + opacity: 0; + position: absolute; + bottom: 0; + left: 0; + width: 100%; + box-sizing: border-box; + padding: 10px; + color: #0e1229; + font-size: 0.75em; + border-radius: 0 0 10px 10px; + } + body main .content .culturelle-card figure a figcaption { + background-color: #feff74; + } + body main .content .sociale-card figure a figcaption { + background-color: #71ff94; + } + body main .content .publique-card figure a figcaption { + background-color: #ffaeab; + } + body main .card-displayed:hover figure a figcaption { + opacity: 1; + } + body main #index-content #extrait-projets > div { + grid-template-columns: repeat(4, 1fr); + } + body main #index-content #extrait-projets > div div:last-of-type { + grid-column-end: span 4; + } body main #index-content #commanditaires-grid { - grid-template-columns: 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr; + grid-template-columns: repeat(8, 1fr); } body main #projets-index { width: 65vw; } - body main #projets-index #filter-index .filter-button:hover { - opacity: 1 !important; + body main #projets-index .projets-grid { + grid-template-columns: repeat(4, 1fr); } body main #text-content .text-item { width: 70%; @@ -1017,30 +1135,37 @@ body footer p a { } body main #reader { margin-top: -10vh; - width: 40vw; + width: 60vw; } body main #reader #header-project { width: 100%; } body main #reader #header-project h2 { - width: 35vw; - margin-left: 29.5vw; + width: 100%; padding: 0; } body main #reader #header-project h2 span { + padding-left: 20vw; + padding-top: 1.4vh; height: 1.25em; - padding-top: 5px; } body main #reader #header-project #gradient-long-title { right: 34.2vw; } + body main #reader #cover-image { + width: 66.666%; + box-sizing: border-box; + margin: 0 10vw; + } body main #reader #info-project { width: 100%; + box-sizing: border-box; + padding: 0 10vw; margin-top: 2vh; margin-bottom: 4vh; } body main #reader #info-project h2 { - min-width: 100%; + min-width: 95%; border-right: solid 1px rgba(0, 0, 0, 0.4); margin-top: 0; margin-bottom: 1vh; @@ -1054,17 +1179,18 @@ body footer p a { body main #reader #close-project { width: 25px; height: 23px; - top: 6vh; + top: calc(4vh + 11.5px); right: calc(30vw - 25px - 2vw); transform: scale(1, 1); transition: top 0.4s ease-out, right 0.4s ease-out, transform 0.4s ease-out; } body main #reader .scrolled-cross { top: 1.4vh !important; - right: 30vw !important; + right: 20vw !important; transform: scale(0.7, 0.7) !important; } body main #reader #project-description { + padding: 0 10vw; align-self: flex-start; } body main #reader #project-images-grid { @@ -1081,11 +1207,15 @@ body footer p a { margin-top: 0; } body main #reader #related-pages #related-grid { + width: 100%; grid-column-gap: 3%; } body main #reader #related-pages #related-grid div figure { min-width: 10vw; } + body main #reader #related-pages p { + align-self: flex-end; + } body footer { height: 4vh; width: auto; @@ -1110,7 +1240,12 @@ body footer p a { height: 54px; } body main #projets-index .projets-grid { - grid-template-columns: 1fr 1fr 1fr 1fr 1fr; + column-gap: 2em; + grid-template-columns: repeat(4, 1fr); + } + body main #reader #related-pages { + padding: 0 10vw; + box-sizing: border-box; } } diff --git a/user/themes/figureslibres-v2/css/theme.css.map b/user/themes/figureslibres-v2/css/theme.css.map index b85b802..b7d4b3e 100644 --- a/user/themes/figureslibres-v2/css/theme.css.map +++ b/user/themes/figureslibres-v2/css/theme.css.map @@ -1 +1 @@ -{"version":3,"sourceRoot":"","sources":["../scss/configuration/_reset.css","../scss/configuration/_fonts.scss","../scss/configuration/_variable.scss","../scss/style.scss"],"names":[],"mappings":"AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;EAaC;EACA;EACA;EACA;EACA;EACA;;;AAED;AACA;AAAA;EAEC;;;AAED;EACC;;;AAED;EACC;;;AAED;EACC;;;AAED;AAAA;EAEC;EACA;;;AAED;EACC;EACA;;;AAED;EACE;EACA;;;AC7BA;EACE,aAWe;EAVf;EACA;EACA;;AAJF;EACE,aAYe;EAXf;EACA;EACA;;AAJF;EACE,aAae;EAZf;EACA;EACA;;AAJF;EACE,aAce;EAbf;EACA;EACA;;AAJF;EACE,aAgBe;EAff;EACA;EACA;;AAJF;EACE,aAiBe;EAhBf;EACA;EACA;;AAJF;EACE,aAmBe;EAlBf;EACA;EACA;;AAJF;EACE,aAoBe;EAnBf;EACA;EACA;;AAJF;EACE,aAqBe;EApBf;EACA;EACA;;AAJF;EACE,aAsBe;EArBf;EACA;EACA;;AAJF;EACE,aAuBe;EAtBf;EACA;EACA;;AAJF;EACE,aAwBe;EAvBf;EACA;EACA;;AAJF;EACE,aAyBe;EAxBf;EACA;EACA;;ACyFF;EACE;IAAM;;EACN;IAAM;;EACN;IAAM;;;AC/GR;EACE;EACA;EACA,kBDuDU;;;ACrDZ;EACE;EACA,ODyCiB;ECxCjB,QDyCkB;;;ACvCpB;EACE,aDTU;ECUV,WD+BoB;EC9BpB,aD4BgB;;;AC1BlB;EACE,aDfS;ECgBT,WDoBY;ECnBZ,aDsBkB;;;ACpBpB;EACE;EACA,aDpBU;;;ACsBZ;EACE;;;AAIF;EACE;EACA,OD2BU;EC1BV,kBD4BQ;;AC3BR;EACE;EACA;EACA;EACA;EACA;;AACA;EACE,QD2BM;EC1BN,kBDmBI;EClBJ;EACA;EACA;EACA;;AACA;EACE;;AAEF;EACE;EACA;;AAGJ;EACE;EACA,kBDEM;ECDN;EACA;EACA;EACA;EACA;EACA;EDyBJ,YAFwB;;ACrBpB;EACE;EACA;EACA,ODGW;ECFX,kBDRE;ECSF,ODnBU;ECoBV,QDnBW;;ACqBb;EACE;EACA;EACA;EACA;;AACA;EACE;EACA,ODnBA;;ACoBA;EACE;EACA;EACA;EACA;EACA,aDnFA;ECoFA,WD1CQ;;AC6CZ;EACE,ODhCE;ECiCF,kBD/BA;;ACmCN;EACE;EACA;;AAGJ;EACE;EACA;EACA;EACA,QDjCsB;ECkCtB,YD3CiB;;AC6CnB;EACE;EACA;EACA;EACA;EACA;;AACA;EACE;EACA;;AACA;EACE,eDjDS;;ACkDT;EACE;EACA;EDjCR,YAFwB;;ACsClB;EACE;;AAGJ;EACE;EACA;EACA;EACA;EACA;EACA;EACA,eDlES;;ACmET;EACE;EACA;;AAEF;EACE;EACA;EACA,SD7EK;;AC+EP;EACE;;AACA;EACI,ODzFF;EC0FE;EACA;EACA;EACA;EACA,WDlHF;EAiDV,YAFwB;;ACsEd;EDtJV;EACA;;ACwJU;EDrJV;EACA;EACA;;ACsJU;EDnJV;EACA;EACA;;ACuJI;EACE;;AAEF;EACE;;AAGJ;EACE;EACA;EACA;;AACA;EACE;EACA;EACA;EACA,kBD1HE;EC2HF;EACA;EACA;EACA;;AAGA;EACE,WDlJU;;ACoJZ;ED5KN;EACA;;AC8KM;ED9LN;EACA;;ACgMM;ED7LN;EACA;EACA;;AC8LM;ED3LN;EACA;EACA;;AC4LM;EDpLN;EACA;;ACwLM;EACE;EACA;EACA;EACA;EACA;;AAEE;EACE;;AAGJ;EACE;EACA;EACA;EACA,WD3LE;EC4LF;;AACA;EACE;EACA;EACA;EACA;EACA;EACA;;AACA;EACE;EACA;;AACA;EDvOd;EACA;;ACyOc;EDtOd;EACA;EACA;;ACuOc;EDpOd;EACA;EACA;;ACsOY;EACE;EACA,QDvMI;ECwMJ,ODvME;ECwMF;EDnKd,YAFwB;;ACyKd;EACE;;AAMN;EACE,WD1NU;;AC4NZ;ED5ON;EACA;;AC8OM;ED3ON;EACA;;AC8OI;EACE;EACA;EACA;EACA;EACA;;AACA;EACE;EACA;EACA;;AAGJ;EACE,YDxNS;ECyNT;EDtMN,YAFwB;;AC0MlB;EACE,OD5OQ;EC6OR,QD5OS;;AC8OX;EACE;;AAGJ;EACE;EACA;EACA;EACA;EACA;EDrNN,YAFwB;;AC0NpB;EACE;;AAGJ;EACE;;AACA;EACE;EACA;EACA,eDpPS;;ACqPT;EACE;EACA,SD1PK;EAsBb,YAFwB;;ACyOlB;EACE;;AAEF;ED5TN;EACA;;AC8TM;ED3TN;EACA;EACA;;AC4TM;EDzTN;EACA;EACA;;AC2TI;EACE;EACA;EACA,SD7QO;;AC+QT;EACE;EACA;EACA;EACA;;AACA;EACE;;AAGJ;EACE;EACA;EACA;EACA,eDzRS;;AC0RT;EACE;EACA;;AAEF;EACE;EACA,ODlTQ;ECmTR,QDlTS;ECmTT;EACA;EDhRR,YAFwB;;ACqRlB;EACE;;AAIN;EACE;EACA;;AACA;EACE;;AAGJ;EACE;EACA;EACA;;AACA;EACE;EACA;EACA;EACA;;AAEF;EACE;EACA;;AAEF;EACE;;AAEF;EACE;EACA;EACA;EACA;EACA;EACA,kBDjVE;ECkVF;EDvTN,YAFwB;;AC4ThB;ED5YR;EACA;;ACgZQ;ED7YR;EACA;EACA;;ACgZQ;ED7YR;EACA;EACA;;AC+YM;EACE;EACA;EACA;EACA;EACA;EACA,aD/VS;ECgWT,WDjYI;;ACkYJ;EACE;EACA;EACA;;AAEF;EACE;EACA;EACA;;AAGJ;EACE;EACA;EACA;EACA;EACA;EACA,YDzXS;;AC4Xb;EACE;EACA;EACA;EACA;EACA;EACA;;AAEF;EACE;;AAEF;EACE;EACA,ODlYW;ECmYX;EACA;EACA;;AAEF;EACE;EACA;;AAEF;EACE;;AAEF;EACE;;AACA;EACE;EACA;EACA;EACA,aDjbQ;;ACmbV;EACE;EACA;EACA;EACA,aDxbU;;AC4bZ;ED/dN;EACA;;ACmeM;EDheN;EACA;EACA;;ACmeM;EDheN;EACA;EACA;;ACkeI;EACE;;AAGA;EACE;;AAGJ;EACE;EACA;EACA;EACA,ODpcI;ECqcJ,kBDrcI;;ACucN;EACE;EACA;EACA;EACA;EACA;;AACA;EACE;EACA,WD9dY;EC+dZ,aDxgBE;ECygBF;EACA;;AAEF;EACE;EACA;;AACA;EACE;;AAIN;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AACA;EACE;EACA;EACA;;AACA;EACE;EACA;EACA;EACA;EACA;;AACA;EACE;EACA;EACA;;AAIN;EACE,OD3fE;EC4fF;EACA;EACA;;AAEF;EACE;EACA;EACA;EACA;EACA;EACA;;AAKR;EACE;EACA;EACA,QDhgBiB;ECigBjB;EACA;EACA;EACA;EACA;;AACA;EACE;EACA;EACA;EACA,ODthBI;;ACuhBJ;EACE;EACA,YD3hBI;EC4hBJ;EACA;EACA,aDtlBI;ECulBJ;EACA,OD9hBE;;;ACoiBV;EAGM;IACE;;EAIF;IACE;IACA;IACA;IACA;IACA;IACA;IACA;IACA,YDtjBI;ICujBJ,ODrjBE;ICsjBF,WD3kBG;IC4kBH;;EAGJ;IACE;;EAGA;IACE;IACA;IACA;IACA;;EAEE;IACE;;EACA;IACE;IACA;IACA;;EACA;IACE;;EACA;IACE;;EAGJ;IACE;IACA;;EAKR;IACE;IACA;;EAGJ;IACE;;EACA;IACE;IACA;IACA;;EACA;IACE;;EAGJ;IACE;IACA;;EAEF;IACE;IACA;IACA;IACA;;EACA;IACE;;EAMF;IACE;;EAGJ;IACE,ODvoBS;ICwoBT,QDvoBU;ICwoBV;;EAEF;IACE;;EAEF;IACE;IACA;;EAEF;IACE,WDrpBW;;ECupBb;IACE;;EACA;IACE;IACA;;EAGJ;IACE,WDvqBE;ICwqBF;;EAEF;IACE;IACA;IACA;IACA;;EACA;IACE;IACA;IACA;;EACA;IACE;IACA;IACA;;EAGJ;IACE;;EAGJ;IACE;IACA;IACA;IACA;IACA;;EACA;IACE;;EACA;IACE;IACA;;EAKJ;IACE;IACA;;EAKR;IACE;IACA;IACA;IACA;IACA;IACA,QDhrBgB;ICirBhB,OD1rBa;IC2rBb;IACA,kBDxsBM;;ECysBN;IACE;IACA,WD/tBI;;ECguBJ;IACE;IACA;;;AAOV;EAGM;IACE;;EAEF;IACE;IACA;IACA;IACA,QDttBI;ICutBJ,kBD9tBE;IC+tBF;;EACA;IACE;;EAEF;IACE;IACA,WDrtBK;ICstBL;;EACA;IACE;IACA,OD3uBA;IC4uBA,QDhwBA;ICiwBA;;EACA;IACE;IACA,WDpwBF;ICqwBE;IACA;IACA;IDttBZ,YAFwB;;EC4tBhB;IACE,ODtvBF;;ECyvBE;IACE,OD1vBJ;IC2vBI;;EAGJ;IACE;IACA;IACA;IACA;IACA;IACA;IAGA;IACA;IACA,kBD3wBA;IC4wBA;IACA;IDhvBV,YAFwB;;ECqvBhB;IACE;;EAKR;IACE,QDvwBqB;;ECywBvB;IACE;IACA;IACA;;EACA;IACE,OD7wBI;IC8wBJ;;EAGA;IACE;;EAGJ;IACE,ODtxBI;;ECwxBF;IACE;;EAKJ;IACE;;EAEF;IACE;IACA;IACA;IACA;;EACA;IACE;IACA;;EAIN;IACE;IACA;;EACA;IACE;;EACA;IACE;IACA;IACA;;EACA;IACE,QDz1BM;IC01BN;;EAGJ;IACE;;EAGJ;IACE;IACA;IACA;;EACA;IACE;IACA;IACA;IACA;;EAEF;IACE;;EAIF;IACE;;EAGJ;IACE,OD32BQ;IC42BR,QD32BS;IC42BT;IACA;IACA;ID10BR,YAFwB;;EC+0BlB;IACE;IACA;IACA;;EAEF;IACE;;EAEF;IACE;IACA;;EACA;IACE;;EAIF;IACE;;EAEF;IACE;;EAEF;IACE;;EACA;IACE;;EAMV;IACE,QDr3BgB;ICs3BhB;IACA;;EACA;IACE;;EACA;IACE,WDr6BI;;;AC46Bd;EAKU;IACE,WDz6BS;;EC46Bb;IACE,YD74Bc;;EC84Bd;IACE,ODv6BW;ICw6BX,QDv6BY;;EC46BhB;IACE","file":"theme.css"} \ No newline at end of file +{"version":3,"sourceRoot":"","sources":["../scss/configuration/_reset.css","../scss/configuration/_fonts.scss","../scss/configuration/_variable.scss","../scss/style.scss"],"names":[],"mappings":"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;EACA;EACA;EACA;EDzNN,YAFwB;;AC8NpB;EACE;;AAGJ;EACE;;AACA;EACE;EACA;EACA,eDxPS;ECyPT;EACA;EACA;EACA;;AACA;EACE;EACA;EACA,SDnQK;ECoQL;EACA;EACA,WDxSE;ECySF,YDvSU;ECwSV;EDlPR,YAFwB;;ACuPlB;EACE;EACA;;AAEF;EACE;;AAEF;EDjVN;EACA;ECkVQ,kBD9RO;;ACgST;EDjVN;EACA;EACA;ECiVQ,kBDjSM;;ACmSR;EDhVN;EACA;EACA;ECgVQ,kBDpSS;;ACuSb;EACE;EACA;EACA,SDlSO;;ACoST;EACE;EACA;EACA;EACA;;AACA;EACE;;AAGJ;EACE;EACA;EACA;EACA,eD9SS;;AC+ST;EACE;EACA;;AAEF;EACE;EACA,OD9UQ;EC+UR,QD9US;EC+UT;EACA;EDrSR,YAFwB;;AC0SlB;EACE;;AAIN;EACE;EACA;;AACA;EACE;;AAGJ;EACE;EACA;EACA;;AACA;EACE;EACA;EACA;EACA;;AAEF;EACE;EACA;;AAEF;EACE;;AAEF;EACE;EACA;EACA;EACA;EACA;EAEA;ED5UN,YAFwB;;ACgVlB;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA,cDvWS;ECwWT,WDhZI;;ACiZJ;EACE;EACA;EACA;;AAEF;EACE;EACA;EACA;;AAGJ;EACE;;AACA;ED1bR;EACA;;AC6bM;EACE;;AACA;ED5bR;EACA;EACA;;AC8bM;EACE;;AACA;ED7bR;EACA;EACA;;AC+bM;EACE;EACA;EACA;EACA;EACA;EACA,YDnZS;;ACsZb;EACE;;AAEF;EACE;EACA,ODpZW;ECqZX;EACA;EACA;;AAEF;EACE;EACA;;AAEF;EACE;;AAEF;AAAA;EAEE;EACA;;AACA;AAAA;EACE;EDpZR,YAFwB;ECwZhB;;AAGJ;AAAA;EAEE;EACA;;AAEF;AAAA;EAEE;EACA;EACA;EACA;EACA;EDpaN,YAFwB;;ACyapB;AAAA;EAEE;;AAEF;AAAA;EAEE,kBD5cQ;;AC8cV;AAAA;EAEE,kBD/cW;;ACidb;AAAA;EAEE,kBDrdS;;ACudX;EACE;;AACA;EACE;EACA;EACA;EACA,aDlfQ;;ACofV;EACE;EACA;EACA;EACA,aDzfU;;AC6fZ;ED5hBN;EACA;;ACgiBM;ED7hBN;EACA;EACA;;ACgiBM;ED7hBN;EACA;EACA;;AC+hBI;EACE;;AAGA;EACE;EACA;;AACA;EACE;ED7dV,YAFwB;ECied;;AAGJ;EACE;EACA;;AAEF;EACE;EACA;EACA;EACA;EACA;ED3eR,YAFwB;;ACgflB;EACE;;AAEF;EACE,kBDjhBM;;ACmhBR;EACE,kBDrhBO;;ACuhBT;EACE,kBDthBS;;ACyhBb;EACE;EACA;EACA;EACA,ODniBI;ECoiBJ,kBDpiBI;;ACsiBN;EACE;EACA;EACA;EACA;EACA;;AACA;EACE;EACA,WD7jBY;EC8jBZ,aDnmBE;EComBF;EACA;;AAEF;EACE;;AACA;EACE;;AAGJ;EACE;EACA;;AAGJ;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AACA;EACE;EACA;EACA;;AACA;EACE;EACA;EACA;EACA;EACA;;AACA;EACE;EACA;EACA;;AAIN;EACE,OD7lBE;EC8lBF;EACA;EACA;;AAEF;EACE;EACA;EACA;EACA;EACA;EACA;;AAKR;EACE;EACA;EACA,QD3lBiB;EC4lBjB;EACA;EACA;EACA;EACA;;AACA;EACE;EACA;EACA;EACA,ODxnBI;;ACynBJ;EACE;EACA,YD7nBI;EC8nBJ;EACA;EACA,aDprBI;ECqrBJ;EACA,ODhoBE;;;ACsoBV;EAGM;IACE;;EAIF;IACE;IACA;IACA;IACA;;EAEE;IACE;;EACA;IACE;IACA;IACA;;EACA;IACE;;EACA;IACE;;EAGJ;IACE;IACA;;EAKR;IACE;IACA;;EAGJ;IACE;;EACA;IACE;IACA;IACA;;EACA;IACE;;EAGJ;IACE;IACA;;EAEF;IACE;IACA;IACA;IACA;IACA;;EACA;IACE;;EAKJ;IACE,ODntBS;ICotBT,QDntBU;ICotBV;;EAEF;IACE;;EAEF;IACE;IACA;;EAEF;IACE,WDjuBW;;ECmuBb;IACE;;EACA;IACE;IACA;;EAGJ;IACE,WDnvBE;ICovBF;;EAEF;IACE;IACA;IACA;IACA;;EACA;IACE;IACA;IACA;;EACA;IACE;IACA;IACA;;EAGJ;IACE;;EAIF;IACE;IACA;IACA;IACA;;EACA;IACE;IACA;;EACA;IACE;;EAIN;IACE;IACA;;EAIF;IACE;IACA;;EAKR;IACE;IACA;IACA;IACA;IACA;IACA,QD1vBgB;IC2vBhB,ODpwBa;ICqwBb;IACA,kBDzxBM;;EC0xBN;IACE;IACA,WDhzBI;;ECizBJ;IACE;IACA;;;AAOV;EAGM;IACE;;EAEF;IACE,kBD3yBE;IC4yBF;IACA;IACA;IACA,QDjyBI;ICkyBJ;;EACA;IACE;;EAEF;IACE;IACA,WD/xBK;ICgyBL;;EACA;IACE;IACA,OD5zBA;IC6zBA,QDj1BA;ICk1BA;;EACA;IACE;IACA,WDr1BF;ICs1BE;IACA;IACA;IDhyBZ,YAFwB;;ECsyBhB;IACE,ODv0BF;;EC00BE;IACE,OD30BJ;IC40BI;;EAGJ;IACE;IACA;IACA;IACA;IACA;IACA;IAGA;IACA;IACA,kBD51BA;IC61BA;IACA;ID1zBV,YAFwB;;EC+zBhB;IACE;;EAKR;IACE,QDj1BqB;;ECo1BvB;IACE;IACA;IACA;;EAEF;IACE,kBDj3BM;ICk3BN,ODh3BI;;ECk3BN;IACE,OD71BM;IC81BN;;EACA;IACE;IACA;IACA;IACA;IACA;IACA;IACA;IACA,OD/3BI;ICg4BJ,WDn5BG;ICo5BH;;EAEF;IACE,kBD93BW;;ECg4Bb;IACE,kBDl4BQ;;ECo4BV;IACE,kBDt4BS;;ECy4Bb;IACE;;EAII;IACE;;EACA;IACE;;EAIN;IACE;;EAGJ;IACE,ODt4BI;;ECu4BJ;IACE;;EAIF;IACE;;EAEF;IACE;IACA;IACA;IACA;;EACA;IACE;IACA;;EAIN;IACE;IACA;;EACA;IACE;;EACA;IACE;IACA;;EACA;IACE;IACA;IACA,QD/8BM;;ECk9BV;IACE;;EAGJ;IACE;IACA;IACA;;EAEF;IACE;IACA;IACA;IACA;IACA;;EACA;IACE;IACA;IACA;IACA;;EAEF;IACE;;EAIF;IACE;;EAGJ;IACE,ODv+BQ;ICw+BR,QDv+BS;ICw+BT;IACA;IACA;ID/7BR,YAFwB;;ECo8BlB;IACE;IACA;IACA;;EAEF;IACE;IACA;;EAEF;IACE;IACA;;EACA;IACE;;EAIF;IACE;;EAEF;IACE;;EAEF;IACE;IACA;;EACA;IACE;;EAGJ;IACE;;EAKR;IACE,QD/+BgB;ICg/BhB;IACA;;EACA;IACE;;EACA;IACE,WDtiCI;;;AC6iCd;EAKU;IACE,WD1iCS;;EC6iCb;IACE,YDvgCc;;ECwgCd;IACE,ODxiCW;ICyiCX,QDxiCY;;EC6iChB;IACE;IACA;;EAIF;IACE;IACA","file":"theme.css"} \ No newline at end of file diff --git a/user/themes/figureslibres-v2/js/script.js b/user/themes/figureslibres-v2/js/script.js index 081e2bb..486007e 100644 --- a/user/themes/figureslibres-v2/js/script.js +++ b/user/themes/figureslibres-v2/js/script.js @@ -32,7 +32,7 @@ let isMobileNavOpen = false, // MAIN FUNCTIONS function initBarba() { barba.init({ - prefetchIgnore: true, + //prefetchIgnore: true, transitions: [{ name: 'opacity-transition', leave(data) { @@ -51,13 +51,12 @@ function initBarba() { if (isMobileNavOpen) { toggleMobileNav() } if ($(data.current.container).attr('id') == 'projets-index') { resetFilters() } if ($(data.current.container).attr('id') == 'text-content' ) { hideFooter() } + setBgColor(color_bg) }) barba.hooks.afterLeave((data) => { - if ($(data.current.container).attr('id') == 'reader') { - if ($(data.next.container).attr('id') != 'reader') { - leaveReader() - $('#nav-container h1').empty().append(currentPage.text()) - } + if ($(data.current.container).attr('id') == 'reader' && $(data.next.container).attr('id') != 'reader') { + leaveReader() + $('#nav-container h1').empty().append(currentPage.text()) } }) barba.hooks.beforeEnter((data) => { @@ -100,7 +99,7 @@ function initBarba() { } if ($(data.next.container).attr('id') == 'reader') { displayReader() - } + } }) } @@ -163,6 +162,22 @@ function refreshUiOnResize() { hideFooterOnResize() hideMobileNavOnResize() checkTitleAutoScroll() + function menuViewJustChanged(callback) { + let prevDeviceIsDesktop = isDesktopDevice; + setTimeout(() => callback(!(isDesktopDevice === prevDeviceIsDesktop)), 50); + } + menuViewJustChanged(result => { + if (result) { + currentColor = $('body').css('background-color') + if (isDesktopDevice) { + $('nav').css('background-color', currentColor) + $('#nav-container').css('background-color', color_bg) + } else { + $('nav').css('background-color', color_main) + $('#nav-container').css('background-color', currentColor) + } + } + }) } function triggerLazyLoading() { @@ -237,32 +252,82 @@ function changeMobileTitle() { $('#nav-container h1').empty().append(currentPage.text()) } + + +const color_publique = "#ffaeab"; +const color_sociale = "#71ff94"; +const color_culturelle = "#feff74"; +const color_commanditaire = "#fabbde"; +const color_figureslibres = "#82f8ee"; +const color_projets = "#4bffc9"; + +const color_bg = "#f5f5f5"; +const color_main = "#0e1229"; + +let isExtraitOpen = false, +isCommanditairesOpen = false, +quelExtrait + +function setBgColor(color) { + $('body').css('background-color', color); + if (isDesktopDevice) { + $('nav').css('background-color', color) + } else { + $('#nav-container').css('background-color', color) + } + if (color === color_bg) { + $('header').removeClass('plain_bg'); + } else { + $('header').addClass('plain_bg'); + } +} + + + // index interaction function toggleIndexContent(closeEverything) { - let isTextOpen = false, - isCommanditairesOpen = false, - isExtraitOpen = false, - quelExtrait + let isTextOpen = false if (closeEverything) { closeEverything() } - $('#second-p-index, #commanditaires-grid, #extrait-publique, #extrait-social, #extrait-culturelle').children().fadeOut() + $('#figureslibres, #publique, #sociale, #culturelle, #commanditaires, #projets') + .on('mouseleave', () => !isExtraitOpen && !isCommanditairesOpen ? setBgColor(color_bg) : null) + + $('#figureslibres') + .on('mouseenter', () => !isExtraitOpen && !isCommanditairesOpen ? setBgColor(color_figureslibres) : null) + + $('#publique') + .on('mouseenter', () => !isExtraitOpen && !isCommanditairesOpen ? setBgColor(color_publique) : null) + + $('#sociale') + .on('mouseenter', () => !isExtraitOpen && !isCommanditairesOpen ? setBgColor(color_sociale) : null) + + $('#culturelle') + .on('mouseenter', () => !isExtraitOpen && !isCommanditairesOpen ? setBgColor(color_culturelle) : null) + + $('#commanditaires') + .on('mouseenter', () => !isExtraitOpen && !isCommanditairesOpen ? setBgColor(color_commanditaire) : null) + + $('#projets') + .on('mouseenter', () => !isExtraitOpen && !isCommanditairesOpen ? setBgColor(color_projets) : null) + + $('#second-p-index, #commanditaires-grid, #extrait-publique, #extrait-social, #extrait-culturelle') + .children().fadeOut() $('#arrowIndex').click( () => { if (!isTextOpen && !isExtraitOpen) { - if (isDesktopDevice) { - displayContent($('#second-p-index'), '70vh') - } else { - displayContent($('#second-p-index'), '90vh') - } + displayContent($('#second-p-index'), isDesktopDevice ? '70vh' : '90vh') turnArrow('down') isTextOpen = true } else { if (isExtraitOpen) { hideContent($('#extrait-' + quelExtrait)) - $('#' + quelExtrait).css('text-decoration', 'none') + $('#' + quelExtrait).css({ + 'text-underline-offset': '0.1em', + 'text-decoration-thickness': '1px', + }) isExtraitOpen = false turnArrow('top') } @@ -273,7 +338,9 @@ function toggleIndexContent(closeEverything) { } if (isCommanditairesOpen) { hideContent($('#commanditaires-grid')) - $('#commanditaires').css('text-decoration', 'none') + $('#commanditaires').css({ + 'text-underline-offset': '0.1em', + 'text-decoration-thickness': '1px',}) isCommanditairesOpen = false } } @@ -292,18 +359,20 @@ function toggleIndexContent(closeEverything) { case 'figureslibres': changeMenuSelected($('nav li a[href$=collectif]').parent()) break - case 'logicielslibres': +/* case 'logicielslibres': changeMenuSelected($('nav li a[href$=logiciels-libres]').parent()) break - case 'projets': + */ case 'projets': changeMenuSelected($('nav li a[href$=projets]').parent()) break } + setBgColor(color_bg) } }) $('#extrait-projets .projets-link-filter').click(() => { changeMenuSelected($('nav li a[href$=projets]').parent()) + setBgColor(color_bg) }) function toggleExtrait(category) { @@ -314,38 +383,65 @@ function toggleIndexContent(closeEverything) { } if (isCommanditairesOpen) { hideContent($('#commanditaires-grid')) - $('#commanditaires').css('text-decoration', 'none') + $('#commanditaires').css({ + 'text-underline-offset': '0.1em', + 'text-decoration-thickness': '1px', + }) isCommanditairesOpen = false } - displayContent($('#extrait-' + category), '80vh') + displayContent($('#extrait-' + category), '100vh') turnArrow('down') - $('#' + category).css({'text-decoration': 'underline', 'text-decoration-thickness': '2px', 'text-underline-offset': '8px'}) + $('#' + category).css({ + 'text-underline-offset': '0.3em', + 'text-decoration-thickness': '2px', + }) + isExtraitOpen = true quelExtrait = category - } else if (isExtraitOpen && quelExtrait != category) { - hideContent($('#extrait-' + quelExtrait)) - $('#' + category).css({'text-decoration': 'underline', 'text-decoration-thickness': '2px', 'text-underline-offset': '8px'}) - $('#' + quelExtrait).css('text-decoration', 'none') - setTimeout(() => { - displayContent($('#extrait-' + category), '80vh') - quelExtrait = category - }, 1000) - } else if (isExtraitOpen && quelExtrait == category) { - hideContent($('#extrait-' + category)) - turnArrow('top') - $('#' + category).css('text-decoration', 'none') - isExtraitOpen = false + } else { + if (quelExtrait != category) { + hideContent($('#extrait-' + quelExtrait)) + $('#' + category).css({ + 'text-underline-offset': '0.3em', + 'text-decoration-thickness': '2px', + }) + $('#' + quelExtrait).css({ + 'text-underline-offset': '0.1em', + 'text-decoration-thickness': '1px', + }) + setTimeout(() => { + displayContent($('#extrait-' + category), '80vh') + quelExtrait = category + }, 1000) + } else { + hideContent($('#extrait-' + category)) + turnArrow('top') + $('#' + category).css({ + 'text-underline-offset': '0.1em', + 'text-decoration-thickness': '1px', + }) + setBgColor(color_bg) + isExtraitOpen = false + } } } function toggleCommanditaires() { if (!isCommanditairesOpen) { displayContent($('#commanditaires-grid'), '150vh') - $('#commanditaires').css({'text-decoration': 'underline', 'text-decoration-thickness': '2px', 'text-underline-offset': '8px'}) + $('#commanditaires').css({ + 'text-underline-offset': '0.3em', + 'text-decoration-thickness': '2px', + }) + setBgColor(color_commanditaire) isCommanditairesOpen = true } else { hideContent($('#commanditaires-grid')) - $('#commanditaires').css('text-decoration', 'none') + $('#commanditaires').css({ + 'text-underline-offset': '0.1em', + 'text-decoration-thickness': '1px', + }) + setBgColor(color_bg) isCommanditairesOpen = false } } @@ -357,16 +453,24 @@ function toggleIndexContent(closeEverything) { } if (isExtraitOpen) { hideContent($('#extrait-' + quelExtrait)) - $('#' + quelExtrait).css('text-decoration', 'none') + $('#' + quelExtrait).css({ + 'text-underline-offset': '0.1em', + 'text-decoration-thickness': '1px', + }) isExtraitOpen = false } if (isCommanditairesOpen) { hideContent($('#commanditaires-grid')) - $('#commanditaires').css('text-decoration', 'none') + $('#commanditaires').css({ + 'text-underline-offset': '0.1em', + 'text-decoration-thickness': '1px', + }) isCommanditairesOpen = false } turnArrow('top') + setBgColor(color_bg); } + } function turnArrow(direction) { @@ -382,10 +486,25 @@ function turnArrow(direction) { 'margin-bottom': '0vh' }) $('#arrow-container .picto').attr('id', 'arrowIndex') + setBgColor(color_bg); } } function displayContent(content, maxHeight) { + switch (content[0].id) { + case 'extrait-publique': + setBgColor(color_publique) + break + case 'extrait-sociale': + setBgColor(color_sociale) + break + case 'extrait-culturelle': + setBgColor(color_culturelle) + break + default: + break + } + content.children().fadeIn() setTimeout( () => { content.css({ @@ -475,7 +594,10 @@ function filterCards(utilite) { } }) - $('#' + utilite + '-filter').css('opacity', 1) + $('#' + utilite + '-filter').css({ + 'opacity': 1, + 'filter': 'grayscale(0)' + }) Object.keys(filterObj).forEach(v => filterObj[v] = false) @@ -487,12 +609,18 @@ function filterCards(utilite) { checkFilter() if (filterIsOn) { - $('#' + utilite + '-filter').css('opacity', 0.4) + $('#' + utilite + '-filter').css({ + 'opacity': 0.4, + 'filter': 'grayscale(1)' + }) $('.projets-grid div').each(function () { // display all cards $(this).removeClass('card-hidden').addClass('card-displayed') }) } else { - $('#' + utilite + '-filter').css('opacity', 1) + $('#' + utilite + '-filter').css({ + 'opacity': 1, + 'filter': 'grayscale(0)' + }) $('.' + utilite + '-card').each(function () { // only display cards from selected category $(this).removeClass('card-hidden').addClass('card-displayed') }) @@ -504,13 +632,19 @@ function filterCards(utilite) { checkFilter() if (filterIsOn) { - $('#' + utilite + '-filter').css('opacity', 0.4) + $('#' + utilite + '-filter').css({ + 'opacity': 0.4, + 'filter': 'grayscale(1)' + }) $('.' + utilite + '-card').each(function () { // only display cards from selected category $(this).removeClass('card-displayed').addClass('card-hidden') }) } else { $('.filter-button').each(function() { - $(this).css('opacity', 0.4) + $(this).css({ + 'opacity': 0.4, + 'filter': 'grayscale(1)' + }) }) $('.projets-grid div').each(function () { // hide all cards $(this).removeClass('card-hidden').addClass('card-displayed') @@ -565,6 +699,9 @@ function filterWhenEntering() { // display reader function displayReader() { + $('header').fadeOut() + projectTitleIsScrolling = false + checkTitleAutoScroll() const swiper = new Swiper('.swiper', { // Optional parameters loop: true, @@ -596,9 +733,6 @@ function displayReader() { swiper.el.style.display = "none"; }, 300); }) - $('header').fadeOut() - projectTitleIsScrolling = false - checkTitleAutoScroll() @@ -612,7 +746,7 @@ function displayReader() { } isProjectHeaderDisplayed = true } else if ($(window).scrollTop() < $('#main-project-title').offset().top && isProjectHeaderDisplayed) { - $('#header-project').css('top', '-9vh') + $('#header-project').css('top', '-4vh') if (isDesktopDevice) { $('#close-project').removeClass('scrolled-cross') } diff --git a/user/themes/figureslibres-v2/scss/configuration/_variable.scss b/user/themes/figureslibres-v2/scss/configuration/_variable.scss index a2e766e..339cd1a 100644 --- a/user/themes/figureslibres-v2/scss/configuration/_variable.scss +++ b/user/themes/figureslibres-v2/scss/configuration/_variable.scss @@ -22,10 +22,6 @@ font-family: Syne, sans-serif; font-weight: bold; } - @mixin logiciels-libres-font { - font-family: Rumeur, sans-serif; - font-weight: bold; - } @mixin commanditaires-font { font-family: Moche, sans-serif; font-weight: bold; @@ -60,6 +56,13 @@ $mainColor: #0e1229; $mainColorSoft: #1f2429; $bgColor: #f5f5f5; + + $color_publique: #ffaeab; + $color_sociale: #71ff94; + $color_culturelle: #feff74; + $color_commanditaire: #fabbde; + $color_figureslibres: #82f8ee; + $color_projets: #4bffc9; // colors - gradient $bgGradientToBottom: linear-gradient(to bottom, #{$bgColor}, #{$bgColor}00); $bgGradientToLeft: linear-gradient(to left, #{$bgColor}, #{$bgColor}00); diff --git a/user/themes/figureslibres-v2/scss/style.scss b/user/themes/figureslibres-v2/scss/style.scss index 0ade164..37f81e4 100644 --- a/user/themes/figureslibres-v2/scss/style.scss +++ b/user/themes/figureslibres-v2/scss/style.scss @@ -32,6 +32,7 @@ overflow-x: hidden; color: $mainColor; background-color: $bgColor; + @include transition-ease-out(background-color); header { position: fixed; top: 0; @@ -40,11 +41,12 @@ box-sizing: border-box; #nav-container { height: $navHeight; - background-color: $bgColor; padding: 0 $bodyMarginMobile; display: flex; justify-content: space-between; align-items: center; + background-color: $bgColor; + @include transition-ease-out(background-color); h1 { cursor: pointer; } @@ -62,7 +64,7 @@ display: flex; align-items: center; opacity: 0; - @include transition-ease-out(opacity, top 0.7s); + @include transition-ease-out(opacity, top 0.7s, background-color); #crossMenu { position: absolute; top: 2vh; @@ -104,7 +106,12 @@ display: block; width: 100%; height: $navGradientHeightMobile; - background: $bgGradientToBottom + background: $bgGradientToBottom; + opacity: 1; + @include transition-ease-out(opacity); + } + header.plain_bg:after { + opacity: 0; } main { position: relative; @@ -123,7 +130,7 @@ @include transition-ease-out(text-underline-offset); } a:hover { - text-underline-offset: 0.15em; + text-underline-offset: 0.15em !important; } } .projet-card { @@ -177,6 +184,9 @@ display: flex; flex-direction: column; align-items: center; + .animateText { + text-decoration: underline 1px; + } #loader-index { position: absolute; height: 80vh; @@ -203,15 +213,12 @@ #culturelle { @include culturelle-font; } - #logicielslibres { - @include logiciels-libres-font; - } } #extrait-projets { >div { max-height: 0vh; display: grid; - grid-template-columns: 1fr 1fr; + grid-template-columns: repeat(2, 1fr); gap: 0px 20px; align-items: flex-start; div { @@ -273,7 +280,7 @@ #commanditaires-grid { width: 85vw; display: grid; - grid-template-columns: 1fr 1fr; + grid-template-columns: repeat(2, 1fr); gap: 25px 40px; align-items: center; img { @@ -312,22 +319,39 @@ text-align: center; width: 100%; margin-bottom: $sectionSpacing; + display: flex; + flex-direction: column; + align-items: center; + justify-content: center; .filter-button { cursor: pointer; + filter: grayscale(1); opacity: $transparency; - @include transition-ease-out(opacity); + padding: 0.25rem 0.75rem; + border-radius: 1rem; + font-size: $smallSize; + min-height: $currentLineHeight; + display: inline-block; + @include transition-ease-out(opacity, filter); + } + .filter-button:hover { + filter: grayscale(0) !important; + opacity: 1 !important; } p { - margin-bottom: 0; + margin-bottom: 1rem; } #publique-filter { @include publique-font; + background-color: $color_publique; } #sociale-filter { @include sociale-font; + background-color: $color_sociale; } #culturelle-filter { @include culturelle-font; + background-color: $color_culturelle; } } hr { @@ -396,31 +420,18 @@ position: fixed; height: 6vh; width: 100%; - background-color: $bgColor; - top: -9vh; + // background-color: $bgColor; + top: -4vh; @include transition-ease-out(top); - .info-project-publique { - span { - @include publique-font; - } - } - .info-project-sociale { - span { - @include sociale-font; - } - } - .info-project-culturelle { - span { - @include culturelle-font; - } - } h2 { + margin: 0; overflow: hidden; position: absolute; - width: 80%; + width: 100%; + height: 100%; padding: 3px 0; - margin-top: 1.8vh; - margin-left: $bodyMarginMobile; + padding-top: 1.8vh; + padding-left: $bodyMarginMobile; font-size: $currentSize; span { transform: translate(0, 0); @@ -433,6 +444,24 @@ white-space: nowrap; } } + h2.info-project-publique { + background: linear-gradient(to bottom, $color_publique, $color_publique 60%, rgba($color_publique, 0)); + span { + @include publique-font; + } + } + h2.info-project-sociale { + background: linear-gradient(to bottom, $color_sociale, $color_sociale 60%, rgba($color_sociale, 0)); + span { + @include sociale-font; + } + } + h2.info-project-culturelle { + background: linear-gradient(to bottom, $color_culturelle, $color_culturelle 60%, rgba($color_culturelle, 0)); + span { + @include culturelle-font; + } + } #gradient-long-title { position: absolute; height: 4vh; @@ -442,14 +471,6 @@ background: $bgGradientToLeft; } } - #header-project:after { - position: absolute; - top: 6vh; - content: ''; - height: 4vh; - width: 100%; - background: linear-gradient($bgColor, rgba($bgColor, 0)); - } #header-project + a { z-index: 2; } @@ -460,13 +481,53 @@ width: calc(#{$pictoSmallWidth} - 5px); height: calc(#{$pictoSmallHeight} - 5px); } - #cover-image-mobile { + figure#cover-image-mobile { margin-top: -2vh; margin-bottom: 2vh; } - #cover-image { + figure#cover-image { display: none; } + figure#cover-image-mobile, + figure#cover-image { + position: relative; + margin-top: 3vh; + img { + filter: grayscale(0); + @include transition-ease-out(filter); + mix-blend-mode: normal; + } + } + figure#cover-image-mobile:hover img, + figure#cover-image:hover img { + filter: grayscale(1); + mix-blend-mode: darken; + } + figure#cover-image-mobile::before, + figure#cover-image::before { + position: absolute; + content: ''; + height: 100%; + width: 100%; + opacity: 0; + @include transition-ease-out(opacity); + } + figure#cover-image-mobile:hover::before, + figure#cover-image:hover::before { + opacity: 1; + } + figure#cover-image-mobile.sociale:hover::before, + figure#cover-image.sociale:hover::before { + background-color: $color_sociale; + } + figure#cover-image-mobile.culturelle:hover::before, + figure#cover-image.culturelle:hover::before { + background-color: $color_culturelle; + } + figure#cover-image-mobile.publique:hover::before, + figure#cover-image.publique:hover::before { + background-color: $color_publique; + } #info-project { align-self: flex-start; h2 { @@ -502,7 +563,37 @@ } #project-images-grid { figure { + position: relative; margin-top: 3vh; + img { + filter: grayscale(0); + @include transition-ease-out(filter); + mix-blend-mode: normal; + } + } + figure:hover img { + filter: grayscale(1); + mix-blend-mode: darken; + } + figure::before { + position: absolute; + content: ''; + height: 100%; + width: 100%; + opacity: 0; + @include transition-ease-out(opacity); + } + figure:hover::before { + opacity: 1; + } + figure:hover.sociale::before { + background-color: $color_sociale; + } + figure:hover.publique::before { + background-color: $color_publique; + } + figure:hover.culturelle::before { + background-color: $color_culturelle; } } hr { @@ -526,12 +617,15 @@ margin-top: 2vh; } #related-grid { - margin-bottom: 5vh; width: 80%; .card-displayed { margin-top: 1.5vh; } } + p { + margin-top: 3vh; + margin-bottom: 5vh; + } } .swiper { position: fixed; @@ -557,8 +651,8 @@ align-items: center; justify-content: center; img { - max-height: 100%; - max-width: 100%; + max-height: 90%; + max-width: 90%; object-fit: cover; } } @@ -614,24 +708,6 @@ height: 100vh; } } - .content { - .card-displayed figure a figcaption { - opacity: 0; - position: absolute; - bottom: 0; - left: 0; - width: 100%; - box-sizing: border-box; - padding: 10px; - background: $mainColor; - color: $bgColor; - font-size: $tinySize; - border-radius: 0 0 10px 10px; - } - } - .card-displayed:hover figure a figcaption { - opacity: 1; - } main { #index-content { min-height: 80vh; @@ -640,11 +716,11 @@ justify-content: center; #extrait-projets { >div { - grid-template-columns: 1fr 1fr 1fr 1fr; + grid-template-columns: repeat(2, 1fr); div:last-of-type { overflow-x: hidden; text-align: right; - grid-column-end: span 4; + grid-column-end: span 2; p { display: inline-block; .picto { @@ -660,13 +736,13 @@ } #commanditaires-grid { width: auto; - grid-template-columns: 1fr 1fr 1fr 1fr 1fr; + grid-template-columns: repeat(5, 1fr); } } #projets-index { width: auto; #filter-index { - display: flex; + justify-content: start; flex-direction: row; max-width: 100%; p:last-of-type { @@ -680,19 +756,15 @@ .projets-grid { width: 100%; display: grid; - grid-template-columns: 1fr 1fr 1fr 1fr; + grid-template-columns: repeat(3, 1fr); gap: 0 10px; + align-items: start; >div { width: 100%; } } } #reader { - #header-project { - h2 { - margin-top: 1vh; - } - } #close-project { width: $pictoInlineWidth; height: $pictoInlineHeight; @@ -722,7 +794,7 @@ #project-images-grid { width: auto; display: grid; - grid-template-columns: 1fr 1fr; + grid-template-columns: repeat(2, 1fr); grid-gap: 1em; figure { margin-top: 0; @@ -738,19 +810,24 @@ grid-column: span 2; } } - #related-grid { - display: grid; - grid-template-columns: 1fr 1fr 1fr; - width: auto !important; - grid-column-gap: 10%; - margin-bottom: 6vh !important; - .card-displayed { - margin-top: 2vh !important; - figure { - min-height: 80px !important; - min-width: 15vw; + #related-pages { + #related-grid { + display: grid; + grid-template-columns: repeat(3, 1fr); + width: auto !important; + grid-column-gap: 10%; + .card-displayed { + margin-top: 2vh !important; + width: 100%; + figure { + min-height: 80px !important; + } } } + p { + margin-top: 3vh; + margin-bottom: 6vh !important; + } } .swiper { .swiper-button-next, .swiper-button-prev { @@ -789,11 +866,11 @@ display: none; } nav { + background-color: $bgColor; position: relative; top: 0; opacity: 1; height: $navHeight; - background-color: $bgColor; justify-content: center; #crossMenu { display: none; @@ -850,25 +927,61 @@ header:after { height: $navGradientHeightDesktop; } + main { display: flex; justify-content: center; margin-top: calc(#{$navHeight} + #{$navGradientHeightDesktop} + #{$sectionSpacing}); - .content { - width: $bodyWidth; - padding: 0; + + #index-content > #extrait-projets figure a figcaption { + background-color: $mainColor; + color: $bgColor; + } + .content { + width: $bodyWidth; + padding: 0; + .card-displayed figure a figcaption { + opacity: 0; + position: absolute; + bottom: 0; + left: 0; + width: 100%; + box-sizing: border-box; + padding: 10px; + color: $mainColor; + font-size: $tinySize; + border-radius: 0 0 10px 10px; } + .culturelle-card figure a figcaption { + background-color: $color_culturelle; + } + .sociale-card figure a figcaption { + background-color: $color_sociale; + } + .publique-card figure a figcaption { + background-color: $color_publique; + } + } + .card-displayed:hover figure a figcaption { + opacity: 1; + } #index-content { + #extrait-projets { + >div { + grid-template-columns: repeat(4, 1fr); + div:last-of-type { + grid-column-end: span 4; + } + } + } #commanditaires-grid { - grid-template-columns: 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr; + grid-template-columns: repeat(8, 1fr); } } #projets-index { width: $bodyWidth; - #filter-index { - .filter-button:hover { - opacity: 1 !important; - } + .projets-grid { + grid-template-columns: repeat(4, 1fr); } } #text-content { @@ -888,28 +1001,35 @@ } #reader { margin-top: -10vh; - width: 40vw; + width: 60vw; #header-project { width: 100%; h2 { - width: 35vw; - margin-left: 29.5vw; + width: 100%; padding: 0; span { + padding-left: 20vw; + padding-top: 1.4vh; height: $currentLineHeight; - padding-top: 5px; } } #gradient-long-title { right: 34.2vw; } } + #cover-image { + width: 66.666%; + box-sizing: border-box; + margin: 0 10vw; + } #info-project { width: 100%; + box-sizing: border-box; + padding: 0 10vw; margin-top: 2vh; margin-bottom: 4vh; h2 { - min-width: 100%; + min-width: 95%; border-right: solid 1px rgba(0, 0, 0, $transparency); margin-top: 0; margin-bottom: 1vh; @@ -926,17 +1046,18 @@ #close-project { width: $pictoSmallWidth; height: $pictoSmallHeight; - top: 6vh; + top: calc(4vh + $pictoSmallHeight / 2); right: calc(30vw - #{$pictoSmallWidth} - 2vw); transform: scale(1, 1); @include transition-ease-out(top, right, transform); } .scrolled-cross { top: 1.4vh !important; - right: 30vw !important; + right: 20vw !important; transform: scale(0.7, 0.7) !important; } #project-description { + padding: 0 10vw; align-self: flex-start; } #project-images-grid { @@ -954,11 +1075,15 @@ margin-top: 0; } #related-grid { + width: 100%; grid-column-gap: 3%; div figure { min-width: 10vw; } } + p { + align-self: flex-end; + } } } } @@ -995,7 +1120,14 @@ } #projets-index { .projets-grid { - grid-template-columns: 1fr 1fr 1fr 1fr 1fr; + column-gap: 2em; + grid-template-columns: repeat(4, 1fr); + } + } + #reader { + #related-pages { + padding: 0 10vw; + box-sizing: border-box; } } } diff --git a/user/themes/figureslibres-v2/templates/partials/relatedpages.html.twig b/user/themes/figureslibres-v2/templates/partials/relatedpages.html.twig index 8c07c8a..04a362a 100644 --- a/user/themes/figureslibres-v2/templates/partials/relatedpages.html.twig +++ b/user/themes/figureslibres-v2/templates/partials/relatedpages.html.twig @@ -1,50 +1,50 @@ +{% macro recursivePages(amount, page, page1, page2) %} + {% import _self as self %} + {% set index = amount - 1 %} + {% if index >= 0 %} + {% set random_utilite = random(page.find('/projets').children) %} + {% set p = random(random_utilite.children) %} + + {% if not page1 %} + {% if p == page %} + {% set index = amount + 1 %} + {{ self.recursivePages(index, page) }} + {% else %} + {% include 'partials/projet_card.html.twig' with { p } %} + {{ self.recursivePages(index, page, p) }} + {% endif %} + + {% elseif not page2 %} + {% if p == page or p == page1 %} + {% set index = amount + 1 %} + {{ self.recursivePages(index, page, page1) }} + {% else %} + {% include 'partials/projet_card.html.twig' with { p } %} + {{ self.recursivePages(index, page, page1, p) }} + {% endif %} + + {% elseif not page3 %} + {% if p == page or p == page1 or p == page2 %} + {% set index = amount + 1 %} + {{ self.recursivePages(index, page, page1, page2) }} + {% else %} + {% include 'partials/projet_card.html.twig' with { p } %} + {% endif %} + + {% endif %} + + {% endif %} +{% endmacro %} + +{% import _self as self %} + diff --git a/user/themes/figureslibres-v2/templates/projets-index.html.twig b/user/themes/figureslibres-v2/templates/projets-index.html.twig index d366d69..eeb6a61 100644 --- a/user/themes/figureslibres-v2/templates/projets-index.html.twig +++ b/user/themes/figureslibres-v2/templates/projets-index.html.twig @@ -6,8 +6,8 @@

Consulter les projets d'utilité

- publique, - sociale, + publique + sociale culturelle

diff --git a/user/themes/figureslibres-v2/templates/reader.html.twig b/user/themes/figureslibres-v2/templates/reader.html.twig index a03066a..c2300f4 100644 --- a/user/themes/figureslibres-v2/templates/reader.html.twig +++ b/user/themes/figureslibres-v2/templates/reader.html.twig @@ -1,61 +1,49 @@ {% extends 'partials/base.html.twig' %} {% block content %} -
-
- {% switch page.parent.title %} - {% case 'Publique' %} -

- {% case 'Sociale' %} -

- {% case 'Culturelle' %} -

- {% endswitch %} - {{ page.title }}

-
- -
- {{ page.title }} -
- {% switch page.parent.title %} - {% case 'Publique' %} -
- {% case 'Sociale' %} -
- {% case 'Culturelle' %} -
- {% endswitch %} -

{{ page.title }}

-
- {% for tag in page.taxonomy.tag %} - {{ tag }}, - {% endfor %} - {{ page.date|date("Y") }} -
-
-
- {{ page.title }} -
-
-
- {{ page.content|raw }} + {% set class_suffix = page.parent.title|lower %} +
+
+

+ {{ page.title }} +

+
+ +
+ {{ page.title }} +
+
+

{{ page.title }}

+
+ {% for tag in page.taxonomy.tag %} + {{ tag }}, + {% endfor %} + {{ page.date|date("Y") }}
+
+
+ {{ page.title }} +
+
+
+ {{ page.content|raw }} +
-
- {% for image in page.media.images %} - {% if image != page.media.images | first %} -
- {{ page.title }} -
- {% endif %} - {% endfor %} +
+ {% for image in page.media.images %} + {% if image != page.media.images | first %} +
+ {{ page.title }} +
+ {% endif %} + {% endfor %} +
-
- {% block related_pages %} - {% include 'partials/relatedpages.html.twig' %} - {% endblock %} - {% block carousel %} - {% include 'partials/carousel.html.twig' %} - {% endblock %} -
+ {% block related_pages %} + {% include 'partials/relatedpages.html.twig' %} + {% endblock %} + {% block carousel %} + {% include 'partials/carousel.html.twig' %} + {% endblock %} +
{% endblock %}