Compare commits
12 Commits
735a9a0278
...
ba724f32f9
| Author | SHA1 | Date | |
|---|---|---|---|
| ba724f32f9 | |||
| f5b4092e98 | |||
| 9a73e1cbaa | |||
| a7bff409d1 | |||
| 9c6643200d | |||
| f4208a492e | |||
| efe44ec52a | |||
| 36928232d6 | |||
| 3212219618 | |||
| c5f23ffca8 | |||
| 8d8c87844b | |||
| 045505a1c0 |
File diff suppressed because one or more lines are too long
@ -1527,7 +1527,7 @@ footer {
|
||||
padding-bottom: 0rem;
|
||||
}
|
||||
}
|
||||
#actus-caroussel .content-actus .view {
|
||||
#actus-caroussel .content-actus .view .view-rows-wrapper {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
flex-wrap: nowrap;
|
||||
@ -1542,14 +1542,12 @@ footer {
|
||||
padding-top: 3rem;
|
||||
}
|
||||
}
|
||||
#actus-caroussel .content-actus .views-row article.node-type-actualite a {
|
||||
#actus-caroussel .content-actus .views-row article.node-type-actualite div {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: flex-start;
|
||||
}
|
||||
#actus-caroussel .content-actus .views-row article.node-type-actualite a h2 {
|
||||
display: none;
|
||||
}
|
||||
#actus-caroussel .content-actus .views-row article.node-type-actualite a .field_field_images {
|
||||
#actus-caroussel .content-actus .views-row article.node-type-actualite div .field_field_images {
|
||||
order: 1;
|
||||
background-color: black;
|
||||
-moz-border-radius: 9px; /* pour Mozilla */
|
||||
@ -1557,21 +1555,20 @@ footer {
|
||||
-webkit-border-radius: 9px; /* pour Safari sur Mac */
|
||||
border-radius: 9px; /* CSS3 */
|
||||
height: 250px;
|
||||
width: 100%;
|
||||
margin-bottom: 0.6rem;
|
||||
}
|
||||
@media (max-width: 550px) {
|
||||
#actus-caroussel .content-actus .views-row article.node-type-actualite a .field_field_images {
|
||||
#actus-caroussel .content-actus .views-row article.node-type-actualite div .field_field_images {
|
||||
height: 170px;
|
||||
}
|
||||
}
|
||||
#actus-caroussel .content-actus .views-row article.node-type-actualite a .field_field_images div {
|
||||
#actus-caroussel .content-actus .views-row article.node-type-actualite div .field_field_images div.cadre-img-zoom {
|
||||
height: 100%;
|
||||
}
|
||||
#actus-caroussel .content-actus .views-row article.node-type-actualite a .field_field_images div div a {
|
||||
display: block;
|
||||
height: 100%;
|
||||
}
|
||||
#actus-caroussel .content-actus .views-row article.node-type-actualite a .field_field_images div div a img {
|
||||
#actus-caroussel .content-actus .views-row article.node-type-actualite div .field_field_images div.cadre-img-zoom img {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
object-fit: cover;
|
||||
@ -1581,103 +1578,92 @@ footer {
|
||||
border-radius: 9px; /* CSS3 */
|
||||
}
|
||||
@media (max-width: 550px) {
|
||||
#actus-caroussel .content-actus .views-row article.node-type-actualite a .field_field_images div div a img {
|
||||
#actus-caroussel .content-actus .views-row article.node-type-actualite div .field_field_images div.cadre-img-zoom img {
|
||||
max-height: 170px;
|
||||
}
|
||||
}
|
||||
#actus-caroussel .content-actus .views-row article.node-type-actualite a .field_field_images img {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
object-fit: cover;
|
||||
-moz-border-radius: 9px; /* pour Mozilla */
|
||||
-khtml-border-radius: 9px; /* pour Safari et Chrome */
|
||||
-webkit-border-radius: 9px; /* pour Safari sur Mac */
|
||||
border-radius: 9px; /* CSS3 */
|
||||
}
|
||||
@media (max-width: 550px) {
|
||||
#actus-caroussel .content-actus .views-row article.node-type-actualite a .field_field_images img {
|
||||
max-height: 170px;
|
||||
}
|
||||
}
|
||||
#actus-caroussel .content-actus .views-row article.node-type-actualite a .field_field_type_d_actualite {
|
||||
#actus-caroussel .content-actus .views-row article.node-type-actualite div .field_field_type_d_actualite {
|
||||
order: 2;
|
||||
text-transform: uppercase;
|
||||
color: red;
|
||||
font-size: 0.5rem;
|
||||
font-family: "gilroy-bold";
|
||||
display: inline-flex;
|
||||
flex-direction: row;
|
||||
align-items: center;
|
||||
}
|
||||
#actus-caroussel .content-actus .views-row article.node-type-actualite a .field_field_type_d_actualite::before {
|
||||
#actus-caroussel .content-actus .views-row article.node-type-actualite div .field_field_type_d_actualite::before {
|
||||
content: url("../img/type-actu.svg");
|
||||
padding-right: 0.3rem;
|
||||
padding-bottom: 0.2rem;
|
||||
}
|
||||
#actus-caroussel .content-actus .views-row article.node-type-actualite a .infos-actu {
|
||||
order: 2;
|
||||
#actus-caroussel .content-actus .views-row article.node-type-actualite div .field_field_type_d_actualite a {
|
||||
color: red;
|
||||
}
|
||||
#actus-caroussel .content-actus .views-row article.node-type-actualite a .infos-actu h2 {
|
||||
font-family: "gilroy-semibold";
|
||||
}
|
||||
#actus-caroussel .content-actus .views-row article.node-type-actualite a .field_field_date {
|
||||
#actus-caroussel .content-actus .views-row article.node-type-actualite div .field_field_date {
|
||||
order: 3;
|
||||
color: red;
|
||||
display: inline-flex;
|
||||
flex-direction: row;
|
||||
align-items: center;
|
||||
font-size: 0.5rem;
|
||||
font-family: "gilroy-bold";
|
||||
}
|
||||
#actus-caroussel .content-actus .views-row article.node-type-actualite a .field_field_date::before {
|
||||
#actus-caroussel .content-actus .views-row article.node-type-actualite div .field_field_date::before {
|
||||
content: url("../img/date-actu.svg");
|
||||
padding-right: 0.3rem;
|
||||
}
|
||||
#actus-caroussel .content-actus .views-row article.node-type-actualite a .field_title {
|
||||
order: 3;
|
||||
#actus-caroussel .content-actus .views-row article.node-type-actualite div .field_title {
|
||||
order: 4;
|
||||
padding-top: 0.2rem;
|
||||
}
|
||||
#actus-caroussel .content-actus .views-row article.node-type-actualite a .field_title h2 {
|
||||
#actus-caroussel .content-actus .views-row article.node-type-actualite div .field_title h2 {
|
||||
margin: 0;
|
||||
line-height: 0.4;
|
||||
padding-bottom: 0.6rem;
|
||||
padding-left: 0;
|
||||
}
|
||||
#actus-caroussel .content-actus .views-row article.node-type-actualite a .field_title h2 a {
|
||||
#actus-caroussel .content-actus .views-row article.node-type-actualite div .field_title h2 a {
|
||||
font-size: 0.8rem;
|
||||
color: rgb(7, 50, 194);
|
||||
}
|
||||
#actus-caroussel .content-actus .views-row article.node-type-actualite a .field_body {
|
||||
order: 4;
|
||||
#actus-caroussel .content-actus .views-row article.node-type-actualite div .field_body {
|
||||
order: 5;
|
||||
opacity: 1 !important;
|
||||
transform: none !important;
|
||||
font-family: "gilroy-regular";
|
||||
padding-bottom: 0.5rem;
|
||||
}
|
||||
#actus-caroussel .content-actus .views-row article.node-type-actualite a .field_body p {
|
||||
#actus-caroussel .content-actus .views-row article.node-type-actualite div .field_body p {
|
||||
margin: 0;
|
||||
margin-bottom: 1rem;
|
||||
font-size: 0.7rem;
|
||||
}
|
||||
#actus-caroussel .content-actus .views-row article.node-type-actualite a .field_body a {
|
||||
#actus-caroussel .content-actus .views-row article.node-type-actualite div .field_body a {
|
||||
color: rgb(7, 50, 194);
|
||||
}
|
||||
#actus-caroussel .content-actus .views-row article.node-type-actualite a .field_field_liens {
|
||||
order: 5;
|
||||
#actus-caroussel .content-actus .views-row article.node-type-actualite div .field_field_liens {
|
||||
order: 6;
|
||||
width: fit-content;
|
||||
padding-left: 0.5rem;
|
||||
background: black;
|
||||
}
|
||||
@media (max-width: 810px) {
|
||||
#actus-caroussel .content-actus .views-row article.node-type-actualite a .field_field_liens {
|
||||
#actus-caroussel .content-actus .views-row article.node-type-actualite div .field_field_liens {
|
||||
margin-left: 0;
|
||||
}
|
||||
}
|
||||
#actus-caroussel .content-actus .views-row article.node-type-actualite a .field_field_liens a {
|
||||
#actus-caroussel .content-actus .views-row article.node-type-actualite div .field_field_liens a {
|
||||
display: inline-flex;
|
||||
align-items: center;
|
||||
color: white;
|
||||
text-transform: uppercase;
|
||||
font-size: 0.6rem;
|
||||
}
|
||||
#actus-caroussel .content-actus .views-row article.node-type-actualite a .field_field_liens a svg {
|
||||
#actus-caroussel .content-actus .views-row article.node-type-actualite div .field_field_liens a svg {
|
||||
display: none;
|
||||
}
|
||||
#actus-caroussel .content-actus .views-row article.node-type-actualite a .field_field_liens a::after {
|
||||
#actus-caroussel .content-actus .views-row article.node-type-actualite div .field_field_liens a::after {
|
||||
display: inline-flex;
|
||||
content: url("../img/noun-arrow-to-right.svg");
|
||||
padding-right: 0.2rem;
|
||||
@ -3184,11 +3170,65 @@ body {
|
||||
#page-node .content_container .node-type-actualite {
|
||||
width: 100%;
|
||||
padding-bottom: 7rem;
|
||||
}
|
||||
#page-node .content_container .node-type-actualite a {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
}
|
||||
#page-node .content_container .node-type-actualite div {
|
||||
order: 2;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
}
|
||||
#page-node .content_container .node-type-actualite div .field_body {
|
||||
order: 2;
|
||||
padding-bottom: 2rem;
|
||||
}
|
||||
#page-node .content_container .node-type-actualite div .field_body p {
|
||||
font-size: 0.8rem;
|
||||
}
|
||||
#page-node .content_container .node-type-actualite div .field_field_liens {
|
||||
order: 3;
|
||||
padding-bottom: 2rem;
|
||||
padding-top: 2rem;
|
||||
width: fit-content;
|
||||
}
|
||||
#page-node .content_container .node-type-actualite div .field_field_liens a {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
padding-left: 0.5rem;
|
||||
display: inline-flex;
|
||||
align-items: center;
|
||||
color: white;
|
||||
background: black;
|
||||
text-transform: uppercase;
|
||||
font-size: 0.6rem;
|
||||
}
|
||||
#page-node .content_container .node-type-actualite div .field_field_liens a svg {
|
||||
display: none;
|
||||
}
|
||||
#page-node .content_container .node-type-actualite div .field_field_liens a::after {
|
||||
display: inline-flex;
|
||||
content: url("../img/noun-arrow-to-right.svg");
|
||||
padding-right: 0.2rem;
|
||||
padding-left: 0.2rem;
|
||||
}
|
||||
#page-node .content_container .node-type-actualite div .field_field_liens a:not(.ext) {
|
||||
display: none;
|
||||
}
|
||||
#page-node .content_container .node-type-actualite div .field_field_images {
|
||||
order: 5;
|
||||
}
|
||||
#page-node .content_container .node-type-actualite div .field_field_images img {
|
||||
width: 100%;
|
||||
height: auto;
|
||||
}
|
||||
#page-node .content_container .node-type-actualite div .field_field_images blockquote.image-field-caption {
|
||||
margin-left: 0;
|
||||
margin-top: 0;
|
||||
}
|
||||
#page-node .content_container .node-type-actualite div .field_field_images blockquote.image-field-caption p {
|
||||
margin-top: 0;
|
||||
font-size: 0.4rem;
|
||||
}
|
||||
#page-node .content_container .node-type-actualite .infos-actu {
|
||||
order: 1;
|
||||
display: flex;
|
||||
@ -3203,8 +3243,8 @@ body {
|
||||
color: red;
|
||||
font-size: 0.6rem;
|
||||
font-weight: 600;
|
||||
display: inline-flex;
|
||||
align-items: center;
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
}
|
||||
#page-node .content_container .node-type-actualite .infos-actu .field_field_type_d_actualite a::before {
|
||||
content: url("../img/type-actu.svg");
|
||||
@ -3212,64 +3252,15 @@ body {
|
||||
}
|
||||
#page-node .content_container .node-type-actualite .infos-actu .field_field_date {
|
||||
color: red;
|
||||
display: inline-flex;
|
||||
align-items: center;
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
margin-left: 1rem;
|
||||
padding-right: 1rem;
|
||||
}
|
||||
#page-node .content_container .node-type-actualite .infos-actu .field_field_date::before {
|
||||
content: url("../img/date-actu.svg");
|
||||
padding-right: 0.4rem;
|
||||
}
|
||||
#page-node .content_container .node-type-actualite .field_body {
|
||||
order: 2;
|
||||
padding-bottom: 2rem;
|
||||
}
|
||||
#page-node .content_container .node-type-actualite .field_body p {
|
||||
font-size: 0.8rem;
|
||||
}
|
||||
#page-node .content_container .node-type-actualite .field_field_liens {
|
||||
order: 3;
|
||||
padding-bottom: 2rem;
|
||||
padding-top: 2rem;
|
||||
}
|
||||
#page-node .content_container .node-type-actualite .field_field_liens a {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
padding-left: 0.5rem;
|
||||
display: inline-flex;
|
||||
align-items: center;
|
||||
color: white;
|
||||
background: black;
|
||||
text-transform: uppercase;
|
||||
font-size: 0.6rem;
|
||||
}
|
||||
#page-node .content_container .node-type-actualite .field_field_liens a svg {
|
||||
display: none;
|
||||
}
|
||||
#page-node .content_container .node-type-actualite .field_field_liens a::after {
|
||||
display: inline-flex;
|
||||
content: url("../img/noun-arrow-to-right.svg");
|
||||
padding-right: 0.2rem;
|
||||
padding-left: 0.2rem;
|
||||
}
|
||||
#page-node .content_container .node-type-actualite .field_field_liens a:not(.ext) {
|
||||
display: none;
|
||||
}
|
||||
#page-node .content_container .node-type-actualite .field_field_images {
|
||||
order: 5;
|
||||
}
|
||||
#page-node .content_container .node-type-actualite .field_field_images img {
|
||||
width: 100%;
|
||||
height: auto;
|
||||
}
|
||||
#page-node .content_container .node-type-actualite .field_field_images blockquote.image-field-caption {
|
||||
margin-left: 0;
|
||||
margin-top: 0;
|
||||
}
|
||||
#page-node .content_container .node-type-actualite .field_field_images blockquote.image-field-caption p {
|
||||
margin-top: 0;
|
||||
font-size: 0.4rem;
|
||||
}
|
||||
|
||||
.node-type-site .layout-content {
|
||||
margin-top: 2rem;
|
||||
@ -3816,4 +3807,405 @@ main {
|
||||
height: auto;
|
||||
aspect-ratio: 1/1;
|
||||
object-fit: cover;
|
||||
}
|
||||
|
||||
#ressources {
|
||||
background-color: #f6f7f3;
|
||||
}
|
||||
#ressources .layout-content .content_container {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
}
|
||||
#ressources .layout-content .content_container #block-quartiers-de-demain-titredepage {
|
||||
margin-top: 3rem;
|
||||
margin-left: 15%;
|
||||
margin-bottom: 1rem;
|
||||
width: 70%;
|
||||
}
|
||||
@media (max-width: 810px) {
|
||||
#ressources .layout-content .content_container #block-quartiers-de-demain-titredepage {
|
||||
margin-top: 14rem;
|
||||
}
|
||||
}
|
||||
#ressources .layout-content .content_container #block-quartiers-de-demain-titredepage h1 {
|
||||
width: fit-content;
|
||||
margin: auto;
|
||||
text-transform: none;
|
||||
color: black;
|
||||
font-size: 2rem;
|
||||
font-family: "gilroy-medium";
|
||||
}
|
||||
#ressources .layout-content .content_container .views-element-container {
|
||||
margin-left: 15%;
|
||||
width: 65%;
|
||||
}
|
||||
#ressources .layout-content .content_container .views-element-container h3 {
|
||||
text-align: center;
|
||||
}
|
||||
#ressources .layout-content .content_container .views-element-container h3::before {
|
||||
content: "";
|
||||
display: block;
|
||||
border-bottom: solid 2px rgb(7, 50, 194);
|
||||
margin: auto;
|
||||
}
|
||||
#ressources .layout-content .content_container .views-element-container h3 div .field_name h2 {
|
||||
margin-bottom: 0.6rem;
|
||||
}
|
||||
#ressources .layout-content .content_container .views-element-container h3 div .field_name h2 a {
|
||||
font-family: "gilroy-light";
|
||||
color: rgb(7, 50, 194);
|
||||
font-size: 1.2rem;
|
||||
}
|
||||
#ressources .layout-content .content_container .views-element-container h3 div .field_description {
|
||||
margin-left: 10%;
|
||||
margin-right: 10%;
|
||||
font-family: "gilroy-light";
|
||||
}
|
||||
#ressources .layout-content .content_container .views-element-container h3 div .field_description p {
|
||||
margin-top: 0.6rem;
|
||||
}
|
||||
#ressources .layout-content .content_container .views-element-container button.voir-plus {
|
||||
background-color: transparent;
|
||||
color: rgb(7, 50, 194);
|
||||
border: solid rgb(7, 50, 194) 0.5px;
|
||||
padding: 0.3rem;
|
||||
display: flex;
|
||||
margin: auto;
|
||||
}
|
||||
#ressources .layout-content .content_container .views-element-container .view-rows-wrapper {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
flex-wrap: wrap;
|
||||
}
|
||||
#ressources .layout-content .content_container .views-element-container .view-rows-wrapper .views-row {
|
||||
width: 30%;
|
||||
font-size: 0.5rem;
|
||||
margin-bottom: 1rem;
|
||||
}
|
||||
#ressources .layout-content .content_container .views-element-container .view-rows-wrapper .views-row h2 {
|
||||
font-family: "gilroy-semibold";
|
||||
color: rgb(7, 50, 194);
|
||||
font-size: 0.6rem;
|
||||
}
|
||||
#ressources .layout-content .content_container .views-element-container .view-rows-wrapper .views-row p {
|
||||
font-size: 0.5rem;
|
||||
}
|
||||
#ressources .layout-content .content_container .views-element-container .view-rows-wrapper .views-row .field_field_mots_clefs div {
|
||||
display: flex;
|
||||
flex-direction: row !important;
|
||||
}
|
||||
#ressources .layout-content .content_container .views-element-container .view-rows-wrapper .views-row .field_field_mots_clefs div div {
|
||||
border: solid 1px rgb(7, 50, 194);
|
||||
margin-right: 0.2rem;
|
||||
padding: 1.3%;
|
||||
padding-bottom: 0.2%;
|
||||
padding-top: 0.2%;
|
||||
font-size: 0.4rem;
|
||||
font-family: "gilroy-semibold";
|
||||
}
|
||||
#ressources .layout-content .content_container .views-element-container .view-rows-wrapper .views-row .field_field_mots_clefs div div a {
|
||||
color: rgb(7, 50, 194);
|
||||
}
|
||||
#ressources .layout-content .content_container .views-element-container .view-rows-wrapper .views-row .field_field_site div a {
|
||||
position: relative;
|
||||
padding-left: 20px;
|
||||
color: rgb(247, 0, 43);
|
||||
font-family: "gilroy-semibold";
|
||||
}
|
||||
#ressources .layout-content .content_container .views-element-container .view-rows-wrapper .views-row .field_field_site div a:before {
|
||||
content: "";
|
||||
position: absolute;
|
||||
left: 0;
|
||||
top: 50%;
|
||||
transform: translateY(-50%);
|
||||
width: 1em;
|
||||
height: 1em;
|
||||
background-image: url("../img/map_pointer.svg");
|
||||
background-size: contain;
|
||||
background-repeat: no-repeat;
|
||||
}
|
||||
#ressources .layout-content .content_container .views-element-container .view-rows-wrapper .views-row .type-documentation .field_body,
|
||||
#ressources .layout-content .content_container .views-element-container .view-rows-wrapper .views-row .type-documentation .field_field_images {
|
||||
display: none;
|
||||
}
|
||||
#ressources .layout-content .content_container .views-element-container .view-rows-wrapper .views-row .type-podcast .content-ressource {
|
||||
display: grid;
|
||||
grid-template-columns: 1fr 1.2fr;
|
||||
grid-template-rows: repeat(5 1fr);
|
||||
margin-top: 1rem;
|
||||
}
|
||||
#ressources .layout-content .content_container .views-element-container .view-rows-wrapper .views-row .type-podcast .content-ressource .field_field_images {
|
||||
grid-column: 1;
|
||||
grid-row: 1/span 5;
|
||||
padding: 0 1rem 1rem 1rem;
|
||||
}
|
||||
#ressources .layout-content .content_container .views-element-container .view-rows-wrapper .views-row .type-podcast .content-ressource .field_field_images img {
|
||||
width: 100%;
|
||||
height: auto;
|
||||
aspect-ratio: 1/1;
|
||||
object-fit: cover;
|
||||
border-radius: 9px;
|
||||
}
|
||||
#ressources .layout-content .content_container .views-element-container .view-rows-wrapper .views-row .type-podcast .content-ressource .field_title, #ressources .layout-content .content_container .views-element-container .view-rows-wrapper .views-row .type-podcast .content-ressource h2 {
|
||||
margin-top: 0;
|
||||
}
|
||||
#ressources .layout-content .content_container .views-element-container .view-rows-wrapper .views-row .type-podcast .content-ressource .field_title,
|
||||
#ressources .layout-content .content_container .views-element-container .view-rows-wrapper .views-row .type-podcast .content-ressource .field_field_sous_titre,
|
||||
#ressources .layout-content .content_container .views-element-container .view-rows-wrapper .views-row .type-podcast .content-ressource .field_field_author,
|
||||
#ressources .layout-content .content_container .views-element-container .view-rows-wrapper .views-row .type-podcast .content-ressource .field_field_date_ressource,
|
||||
#ressources .layout-content .content_container .views-element-container .view-rows-wrapper .views-row .type-podcast .content-ressource .field_body,
|
||||
#ressources .layout-content .content_container .views-element-container .view-rows-wrapper .views-row .type-podcast .content-ressource .field_field_mots_clefs,
|
||||
#ressources .layout-content .content_container .views-element-container .view-rows-wrapper .views-row .type-podcast .content-ressource .field_field_site,
|
||||
#ressources .layout-content .content_container .views-element-container .view-rows-wrapper .views-row .type-podcast .content-ressource .field_field_documents,
|
||||
#ressources .layout-content .content_container .views-element-container .view-rows-wrapper .views-row .type-podcast .content-ressource .field_field_liens {
|
||||
grid-column: 2;
|
||||
}
|
||||
#ressources .layout-content .content_container .views-element-container .view-rows-wrapper .views-row:has(.type-podcast) {
|
||||
width: 50%;
|
||||
}
|
||||
#ressources .layout-content .content_container .views-element-container .view-rows-wrapper .views-row:has(.type-documentation) {
|
||||
width: 25%;
|
||||
}
|
||||
#ressources .layout-content .content_container .views-element-container .view-rows-wrapper .views-row:has(.type-vidéo) {
|
||||
width: 50%;
|
||||
}
|
||||
|
||||
#actualites {
|
||||
background-color: #f6f7f3;
|
||||
}
|
||||
#actualites .layout-content .content_container {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
}
|
||||
#actualites .layout-content .content_container #block-quartiers-de-demain-titredepage {
|
||||
margin-top: 3rem;
|
||||
margin-left: 15%;
|
||||
margin-bottom: 4rem;
|
||||
width: 70%;
|
||||
}
|
||||
@media (max-width: 810px) {
|
||||
#actualites .layout-content .content_container #block-quartiers-de-demain-titredepage {
|
||||
margin-top: 14rem;
|
||||
}
|
||||
}
|
||||
#actualites .layout-content .content_container #block-quartiers-de-demain-titredepage h1 {
|
||||
width: fit-content;
|
||||
margin: auto;
|
||||
text-transform: none;
|
||||
color: black;
|
||||
font-size: 2rem;
|
||||
font-family: "gilroy-medium";
|
||||
}
|
||||
#actualites .layout-content .content_container .views-element-container {
|
||||
margin-left: 20%;
|
||||
width: 65%;
|
||||
}
|
||||
#actualites .layout-content .content_container .views-element-container .view-rows-wrapper {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
flex-wrap: wrap;
|
||||
}
|
||||
#actualites .layout-content .content_container .views-element-container .view-rows-wrapper .views-row {
|
||||
width: 100%;
|
||||
font-size: 0.5rem;
|
||||
margin-bottom: 2rem;
|
||||
padding-bottom: 1rem;
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
align-items: center;
|
||||
border-bottom: solid black 0.5px;
|
||||
}
|
||||
#actualites .layout-content .content_container .views-element-container .view-rows-wrapper .views-row .node-type-actualite {
|
||||
width: 85%;
|
||||
}
|
||||
#actualites .layout-content .content_container .views-element-container .view-rows-wrapper .views-row .node-type-actualite .content-wrapper-actu {
|
||||
display: grid;
|
||||
grid-template-columns: 1fr 2fr;
|
||||
grid-template-rows: repeat(5 1fr);
|
||||
}
|
||||
#actualites .layout-content .content_container .views-element-container .view-rows-wrapper .views-row .node-type-actualite .content-wrapper-actu .field_field_images {
|
||||
grid-column: 1;
|
||||
grid-row: 1/span 5;
|
||||
width: 250px;
|
||||
margin-right: 1rem;
|
||||
}
|
||||
#actualites .layout-content .content_container .views-element-container .view-rows-wrapper .views-row .node-type-actualite .content-wrapper-actu .field_field_images .actu-diaporama {
|
||||
width: 100%;
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
align-items: center !important;
|
||||
margin: auto;
|
||||
margin-right: 1rem;
|
||||
}
|
||||
#actualites .layout-content .content_container .views-element-container .view-rows-wrapper .views-row .node-type-actualite .content-wrapper-actu .field_field_images .actu-diaporama .slick-list {
|
||||
margin: auto;
|
||||
padding-top: 0 !important;
|
||||
}
|
||||
#actualites .layout-content .content_container .views-element-container .view-rows-wrapper .views-row .node-type-actualite .content-wrapper-actu .field_field_images .actu-diaporama .slick-list .cadre-img-zoom {
|
||||
display: flex;
|
||||
margin: auto;
|
||||
width: 250px;
|
||||
height: auto;
|
||||
}
|
||||
#actualites .layout-content .content_container .views-element-container .view-rows-wrapper .views-row .node-type-actualite .content-wrapper-actu .field_field_images .actu-diaporama .slick-list .cadre-img-zoom img {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
object-fit: cover;
|
||||
-moz-border-radius: 9px; /* pour Mozilla */
|
||||
-khtml-border-radius: 9px; /* pour Safari et Chrome */
|
||||
-webkit-border-radius: 9px; /* pour Safari sur Mac */
|
||||
border-radius: 9px; /* CSS3 */
|
||||
}
|
||||
#actualites .layout-content .content_container .views-element-container .view-rows-wrapper .views-row .node-type-actualite .content-wrapper-actu .field_field_images .actu-diaporama .slick-list blockquote.image-field-caption {
|
||||
margin: 0;
|
||||
}
|
||||
#actualites .layout-content .content_container .views-element-container .view-rows-wrapper .views-row .node-type-actualite .content-wrapper-actu .field_field_images .actu-diaporama .slick-list blockquote.image-field-caption p {
|
||||
margin-top: 0;
|
||||
font-size: 0.4rem;
|
||||
}
|
||||
#actualites .layout-content .content_container .views-element-container .view-rows-wrapper .views-row .node-type-actualite .content-wrapper-actu .field_field_images .actu-diaporama button {
|
||||
margin: auto;
|
||||
transform: none;
|
||||
top: 30%;
|
||||
height: 0;
|
||||
width: 0;
|
||||
}
|
||||
#actualites .layout-content .content_container .views-element-container .view-rows-wrapper .views-row .node-type-actualite .content-wrapper-actu .field_field_images .actu-diaporama button:before {
|
||||
transform: scale(0.4) !important;
|
||||
}
|
||||
#actualites .layout-content .content_container .views-element-container .view-rows-wrapper .views-row .node-type-actualite .content-wrapper-actu .field_field_images .actu-diaporama button:before:hover {
|
||||
filter: brightness(1.75);
|
||||
}
|
||||
#actualites .layout-content .content_container .views-element-container .view-rows-wrapper .views-row .node-type-actualite .content-wrapper-actu .field_field_images .actu-diaporama button.slick-next {
|
||||
right: 15%;
|
||||
padding: 0;
|
||||
}
|
||||
#actualites .layout-content .content_container .views-element-container .view-rows-wrapper .views-row .node-type-actualite .content-wrapper-actu .field_field_images .actu-diaporama button.slick-prev {
|
||||
left: 5%;
|
||||
padding: 0;
|
||||
}
|
||||
#actualites .layout-content .content_container .views-element-container .view-rows-wrapper .views-row .node-type-actualite .content-wrapper-actu .field_field_type_d_actualite,
|
||||
#actualites .layout-content .content_container .views-element-container .view-rows-wrapper .views-row .node-type-actualite .content-wrapper-actu .field_field_date,
|
||||
#actualites .layout-content .content_container .views-element-container .view-rows-wrapper .views-row .node-type-actualite .content-wrapper-actu .field_field_site,
|
||||
#actualites .layout-content .content_container .views-element-container .view-rows-wrapper .views-row .node-type-actualite .content-wrapper-actu .field_title,
|
||||
#actualites .layout-content .content_container .views-element-container .view-rows-wrapper .views-row .node-type-actualite .content-wrapper-actu .field_body,
|
||||
#actualites .layout-content .content_container .views-element-container .view-rows-wrapper .views-row .node-type-actualite .content-wrapper-actu .field_field_liens {
|
||||
grid-column: 2;
|
||||
}
|
||||
#actualites .layout-content .content_container .views-element-container .view-rows-wrapper .views-row .node-type-actualite .content-wrapper-actu .field_field_type_d_actualite {
|
||||
order: 2;
|
||||
}
|
||||
#actualites .layout-content .content_container .views-element-container .view-rows-wrapper .views-row .node-type-actualite .content-wrapper-actu .field_field_type_d_actualite a {
|
||||
text-transform: uppercase;
|
||||
color: red;
|
||||
font-size: 0.6rem;
|
||||
font-weight: 600;
|
||||
display: inline-flex;
|
||||
align-items: center;
|
||||
}
|
||||
#actualites .layout-content .content_container .views-element-container .view-rows-wrapper .views-row .node-type-actualite .content-wrapper-actu .field_field_type_d_actualite a::before {
|
||||
content: "";
|
||||
display: inline-block;
|
||||
width: 16px; /* Ajuste la largeur */
|
||||
height: 16px; /* Ajuste la hauteur */
|
||||
background-image: url("../img/type-actu.svg");
|
||||
background-size: contain;
|
||||
background-repeat: no-repeat;
|
||||
padding-right: 0.4rem;
|
||||
}
|
||||
#actualites .layout-content .content_container .views-element-container .view-rows-wrapper .views-row .node-type-actualite .content-wrapper-actu .field_field_date {
|
||||
order: 3;
|
||||
color: red;
|
||||
font-size: 0.6rem;
|
||||
font-weight: 600;
|
||||
display: inline-flex;
|
||||
align-items: center;
|
||||
}
|
||||
#actualites .layout-content .content_container .views-element-container .view-rows-wrapper .views-row .node-type-actualite .content-wrapper-actu .field_field_date::before {
|
||||
content: "";
|
||||
display: inline-block;
|
||||
width: 16px; /* Ajuste la largeur */
|
||||
height: 16px; /* Ajuste la hauteur */
|
||||
background-image: url("../img/date-actu.svg");
|
||||
background-size: contain;
|
||||
background-repeat: no-repeat;
|
||||
padding-right: 0.4rem;
|
||||
}
|
||||
#actualites .layout-content .content_container .views-element-container .view-rows-wrapper .views-row .node-type-actualite .content-wrapper-actu .field_field_site {
|
||||
order: 4;
|
||||
}
|
||||
#actualites .layout-content .content_container .views-element-container .view-rows-wrapper .views-row .node-type-actualite .content-wrapper-actu .field_field_site a {
|
||||
color: red;
|
||||
font-size: 0.6rem;
|
||||
font-weight: 600;
|
||||
display: inline-flex;
|
||||
align-items: center;
|
||||
padding-left: 0.2rem;
|
||||
}
|
||||
#actualites .layout-content .content_container .views-element-container .view-rows-wrapper .views-row .node-type-actualite .content-wrapper-actu .field_field_site a::before {
|
||||
content: "";
|
||||
display: inline-block;
|
||||
width: 10px; /* Ajuste la largeur */
|
||||
height: 10px; /* Ajuste la hauteur */
|
||||
background-image: url("../img/map_pointer.svg");
|
||||
background-size: contain;
|
||||
background-repeat: no-repeat;
|
||||
padding-right: 0.5rem;
|
||||
}
|
||||
#actualites .layout-content .content_container .views-element-container .view-rows-wrapper .views-row .node-type-actualite .content-wrapper-actu .field_title {
|
||||
order: 5;
|
||||
}
|
||||
#actualites .layout-content .content_container .views-element-container .view-rows-wrapper .views-row .node-type-actualite .content-wrapper-actu .field_title a {
|
||||
color: rgb(7, 50, 194);
|
||||
font-size: 1.2rem;
|
||||
}
|
||||
#actualites .layout-content .content_container .views-element-container .view-rows-wrapper .views-row .node-type-actualite .content-wrapper-actu .field_body {
|
||||
order: 6;
|
||||
padding-bottom: 2rem;
|
||||
opacity: 1 !important;
|
||||
transform: none !important;
|
||||
}
|
||||
#actualites .layout-content .content_container .views-element-container .view-rows-wrapper .views-row .node-type-actualite .content-wrapper-actu .field_body p {
|
||||
font-size: 0.8rem;
|
||||
}
|
||||
#actualites .layout-content .content_container .views-element-container .view-rows-wrapper .views-row .node-type-actualite .content-wrapper-actu .field_field_liens {
|
||||
order: 7;
|
||||
padding: 0;
|
||||
width: fit-content;
|
||||
}
|
||||
#actualites .layout-content .content_container .views-element-container .view-rows-wrapper .views-row .node-type-actualite .content-wrapper-actu .field_field_liens a {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
padding-left: 0.5rem;
|
||||
display: inline-flex;
|
||||
align-items: center;
|
||||
color: white;
|
||||
background: black;
|
||||
text-transform: uppercase;
|
||||
font-size: 0.6rem;
|
||||
}
|
||||
#actualites .layout-content .content_container .views-element-container .view-rows-wrapper .views-row .node-type-actualite .content-wrapper-actu .field_field_liens a svg {
|
||||
display: none;
|
||||
}
|
||||
#actualites .layout-content .content_container .views-element-container .view-rows-wrapper .views-row .node-type-actualite .content-wrapper-actu .field_field_liens a::after {
|
||||
display: inline-flex;
|
||||
content: url("../img/noun-arrow-to-right.svg");
|
||||
padding-right: 0.2rem;
|
||||
padding-left: 0.2rem;
|
||||
}
|
||||
#actualites .layout-content .content_container .views-element-container .view-rows-wrapper .views-row .toggle-actualite {
|
||||
display: block;
|
||||
width: 40px;
|
||||
height: 40px;
|
||||
margin: 10px auto;
|
||||
border: none;
|
||||
background-color: transparent;
|
||||
font-size: 24px;
|
||||
cursor: pointer;
|
||||
transition: transform 0.3s ease;
|
||||
}
|
||||
#actualites .layout-content .content_container .views-element-container .view-rows-wrapper .views-row .toggle-actualite:hover {
|
||||
transform: scale(1.2);
|
||||
}
|
||||
@ -60,6 +60,7 @@ function quartiers_de_demain_preprocess_field(&$variables) {
|
||||
if (isset($variables['field_name'])) {
|
||||
$variables['attributes']['class'][] = 'field_'.$variables['field_name'];
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
/**
|
||||
@ -132,4 +133,7 @@ function quartiers_de_demain_preprocess_block__block_region_second(&$variables)
|
||||
unset($variables['content']['field_title']);
|
||||
unset($variables['content']['field_field_sous_titre']);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
|
||||
|
||||
@ -0,0 +1,87 @@
|
||||
/**
|
||||
* @file
|
||||
* quartiers_de_demain behaviors.
|
||||
*/
|
||||
(function (Drupal) {
|
||||
|
||||
'use strict';
|
||||
|
||||
Drupal.behaviors.quartiers_de_demain = {
|
||||
attach: function (context, settings) {
|
||||
console.log('It works!');
|
||||
}
|
||||
};
|
||||
} (Drupal));
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
/////////////// start class à view-rows-ressources ////////
|
||||
$(document).ready(function () {
|
||||
$(".view-rows-wrapper").each(function () {
|
||||
let h3Container = $(this).prev("h3").find("div[class^='type-']");
|
||||
let classToAdd = h3Container.attr("class"); // Récupère la classe complète (ex: "type-Documentation")
|
||||
|
||||
if (classToAdd) {
|
||||
$(this).addClass(classToAdd); // Ajoute cette classe à .view-rows-wrapper
|
||||
}
|
||||
});
|
||||
});
|
||||
////////////////// end class à view-rows-wrapper ////////////////
|
||||
|
||||
|
||||
|
||||
/////////////////// start voir plus... ressources ////////////////////
|
||||
|
||||
$(document).ready(function () {
|
||||
// Vérifier si on est sur la page avec l'ID #ressources
|
||||
if ($("#ressources").length > 0) {
|
||||
$(".view-rows-wrapper").each(function () {
|
||||
let container = $(this); // Cible uniquement cette section
|
||||
let items = container.find(".views-row"); // Les éléments à afficher progressivement
|
||||
let visibleCount = 4; // Nombre d'éléments visibles au départ
|
||||
|
||||
|
||||
// Récupérer la classe `type-XXX`
|
||||
let typeClass = container.attr("class").split(" ").find(cls => cls.startsWith("type-"));
|
||||
let typeName = typeClass ? typeClass.replace("type-", "").replace(/-/g, " ") : "contenu"; // Nettoyer le nom
|
||||
|
||||
if (typeClass === "type-podcast" || typeClass === "type-video") {
|
||||
visibleCount = 2; // Pour Podcast et Vidéo
|
||||
}
|
||||
|
||||
// Ajouter un bouton dynamiquement après chaque `.view-rows-ressources`
|
||||
let button = $("<button>")
|
||||
.addClass("voir-plus")
|
||||
.text("Voir plus de " + typeName)
|
||||
.insertAfter(container);
|
||||
|
||||
// Cacher tous les éléments sauf les 4 premiers
|
||||
items.hide().slice(0, visibleCount).show();
|
||||
|
||||
// Action sur le bouton
|
||||
button.on("click", function () {
|
||||
let hiddenItems = container.find(".views-row:hidden").slice(0, 4); // Prochains éléments à afficher
|
||||
|
||||
if ($(this).text().includes("Voir plus")) {
|
||||
hiddenItems.slideDown(); // Afficher avec un effet de glissement
|
||||
|
||||
if (container.find(".views-row:hidden").length === 0) {
|
||||
$(this).text("Voir moins de " + typeName); // Changer le texte du bouton si tout est affiché
|
||||
}
|
||||
} else {
|
||||
container.find(".views-row").slice(visibleCount).slideUp(); // Replier les éléments
|
||||
$(this).text("Voir plus de " + typeName); // Revenir à l'état initial
|
||||
}
|
||||
});
|
||||
});
|
||||
}
|
||||
});
|
||||
|
||||
/////////////////// end voir plus... ressources ////////////////////
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
@ -361,7 +361,7 @@ document.addEventListener('DOMContentLoaded', function() {
|
||||
// Maximum number of characters to display
|
||||
const maxChars = 140; // Adjust this value as needed
|
||||
|
||||
document.querySelectorAll('#actus-caroussel .node-type-actualite .field_body p').forEach(function(paragraph) {
|
||||
document.querySelectorAll('#actus-caroussel .node-type-actualite .field_body').forEach(function(paragraph) {
|
||||
let text = paragraph.textContent.trim();
|
||||
if (text.length > maxChars) {
|
||||
let truncatedText = text.slice(0, maxChars) + '...';
|
||||
@ -372,36 +372,24 @@ document.addEventListener('DOMContentLoaded', function() {
|
||||
|
||||
|
||||
//////////// start slideshow home //////////////////////////
|
||||
|
||||
|
||||
|
||||
$(document).ready(function(){
|
||||
let actuview = $('.content-actus .view ')
|
||||
let actuview = $('.content-actus .view .view-rows-wrapper')
|
||||
if (actuview) {
|
||||
actuview.slick({
|
||||
slidesToShow: 3,
|
||||
// slidesToScroll: 1,
|
||||
dots: false,
|
||||
arrows: true,
|
||||
// centerMode: true,
|
||||
adaptiveHeight: false,
|
||||
autoplay: false,
|
||||
// autoplaySpeed: 1500,
|
||||
// infinite: true,
|
||||
// centerPadding: '100px',
|
||||
responsive: [
|
||||
{
|
||||
breakpoint: 810,
|
||||
settings: {
|
||||
slidesToShow: 1,
|
||||
// slidesToScroll: 1,
|
||||
adaptiveHeight: false,
|
||||
arrows: true,
|
||||
draggable: true,
|
||||
// centerMode: true,
|
||||
// centerPadding: '100px',
|
||||
autoplay: false,
|
||||
// autoplaySpeed: 2000,
|
||||
}
|
||||
}]
|
||||
});
|
||||
@ -414,9 +402,6 @@ $(document).ready(function(){
|
||||
|
||||
});
|
||||
|
||||
|
||||
|
||||
|
||||
$(document).ready(function () {
|
||||
let diapohome = $('.config_pages--type--diaporama-home .diaporama');
|
||||
|
||||
@ -448,105 +433,137 @@ $(document).ready(function () {
|
||||
|
||||
}
|
||||
});
|
||||
|
||||
//////////// end slideshow home //////////////////////////
|
||||
|
||||
|
||||
//////////// start slideshow /actualites //////////////////////////
|
||||
$(document).ready(function(){
|
||||
let actuview2 = $('.content-wrapper-actu .field_field_images .actu-diaporama')
|
||||
if (actuview2) {
|
||||
actuview2.slick({
|
||||
slidesToShow: 1,
|
||||
dots: false,
|
||||
arrows: true,
|
||||
adaptiveHeight: true,
|
||||
autoplay: false,
|
||||
responsive: [
|
||||
{
|
||||
breakpoint: 810,
|
||||
settings: {
|
||||
slidesToShow: 1,
|
||||
adaptiveHeight: true,
|
||||
arrows: true,
|
||||
draggable: true,
|
||||
autoplay: false,
|
||||
}
|
||||
}]
|
||||
});
|
||||
console.log('salut slick actualites');
|
||||
}
|
||||
// $('.slick-carousel').slick({
|
||||
// lazyLoad: 'progressive', // Option 'ondemand' ou 'progressive'
|
||||
// });
|
||||
});
|
||||
//////////// end slideshow /actualites //////////////////////////
|
||||
|
||||
|
||||
|
||||
//////////////// start lightbox galerie image page site////////////////////////
|
||||
|
||||
// Sélection des images et de leurs légendes dans la galerie
|
||||
let images = document.querySelectorAll('.paragraph--type--site-diapo .lightbox-trigger');
|
||||
let currentIndex;
|
||||
// Sélection des images et de leurs légendes dans la galerie
|
||||
let images = document.querySelectorAll('.paragraph--type--site-diapo .lightbox-trigger');
|
||||
let currentIndex;
|
||||
|
||||
// Création de la lightbox et de ses éléments
|
||||
const lightbox = document.createElement('div');
|
||||
lightbox.id = 'lightbox';
|
||||
lightbox.classList.add('lightbox');
|
||||
document.body.appendChild(lightbox);
|
||||
// Création de la lightbox et de ses éléments
|
||||
const lightbox = document.createElement('div');
|
||||
lightbox.id = 'lightbox';
|
||||
lightbox.classList.add('lightbox');
|
||||
document.body.appendChild(lightbox);
|
||||
|
||||
const img = document.createElement('img');
|
||||
lightbox.appendChild(img);
|
||||
const img = document.createElement('img');
|
||||
lightbox.appendChild(img);
|
||||
|
||||
// Élément pour afficher la légende
|
||||
const caption = document.createElement('p');
|
||||
caption.classList.add('caption');
|
||||
lightbox.appendChild(caption);
|
||||
// Élément pour afficher la légende
|
||||
const caption = document.createElement('p');
|
||||
caption.classList.add('caption');
|
||||
lightbox.appendChild(caption);
|
||||
|
||||
const closeBtn = document.createElement('span');
|
||||
closeBtn.classList.add('close');
|
||||
closeBtn.innerHTML = '×';
|
||||
lightbox.appendChild(closeBtn);
|
||||
const closeBtn = document.createElement('span');
|
||||
closeBtn.classList.add('close');
|
||||
closeBtn.innerHTML = '×';
|
||||
lightbox.appendChild(closeBtn);
|
||||
|
||||
const prevBtn = document.createElement('a');
|
||||
prevBtn.classList.add('prev');
|
||||
prevBtn.innerHTML = '❮';
|
||||
lightbox.appendChild(prevBtn);
|
||||
const prevBtn = document.createElement('a');
|
||||
prevBtn.classList.add('prev');
|
||||
prevBtn.innerHTML = '❮';
|
||||
lightbox.appendChild(prevBtn);
|
||||
|
||||
const nextBtn = document.createElement('a');
|
||||
nextBtn.classList.add('next');
|
||||
nextBtn.innerHTML = '❯';
|
||||
lightbox.appendChild(nextBtn);
|
||||
const nextBtn = document.createElement('a');
|
||||
nextBtn.classList.add('next');
|
||||
nextBtn.innerHTML = '❯';
|
||||
lightbox.appendChild(nextBtn);
|
||||
|
||||
// Fonction pour afficher l'image et la légende à l'index donné
|
||||
function showImage(index) {
|
||||
if (index < 0) index = images.length - 1;
|
||||
if (index >= images.length) index = 0;
|
||||
currentIndex = index;
|
||||
// Fonction pour afficher l'image et la légende à l'index donné
|
||||
function showImage(index) {
|
||||
if (index < 0) index = images.length - 1;
|
||||
if (index >= images.length) index = 0;
|
||||
currentIndex = index;
|
||||
|
||||
// Mettre à jour l'image
|
||||
img.src = images[currentIndex].getAttribute('src');
|
||||
// Mettre à jour l'image
|
||||
img.src = images[currentIndex].getAttribute('src');
|
||||
|
||||
// Récupérer la légende associée (le paragraphe dans blockquote suivant l'image)
|
||||
const captionText = images[currentIndex]
|
||||
.closest('.cadre-img-zoom')
|
||||
.nextElementSibling.querySelector('.image-field-caption p')
|
||||
.textContent;
|
||||
|
||||
caption.textContent = captionText || ''; // Affiche la légende ou une chaîne vide si elle est absente
|
||||
lightbox.style.display = 'flex';
|
||||
}
|
||||
// Récupérer la légende associée (le paragraphe dans blockquote suivant l'image)
|
||||
const captionText = images[currentIndex]
|
||||
.closest('.cadre-img-zoom')
|
||||
.nextElementSibling.querySelector('.image-field-caption p')
|
||||
.textContent;
|
||||
|
||||
caption.textContent = captionText || ''; // Affiche la légende ou une chaîne vide si elle est absente
|
||||
lightbox.style.display = 'flex';
|
||||
}
|
||||
|
||||
// Événements de clic sur chaque image pour ouvrir le lightbox avec la légende
|
||||
images.forEach((image, index) => {
|
||||
image.addEventListener('click', () => {
|
||||
showImage(index);
|
||||
});
|
||||
});
|
||||
// Événements de clic sur chaque image pour ouvrir le lightbox avec la légende
|
||||
images.forEach((image, index) => {
|
||||
image.addEventListener('click', () => {
|
||||
showImage(index);
|
||||
});
|
||||
});
|
||||
|
||||
// Fermer le lightbox
|
||||
closeBtn.addEventListener('click', () => {
|
||||
lightbox.style.display = 'none';
|
||||
});
|
||||
|
||||
// Navigation pour images précédente et suivante
|
||||
prevBtn.addEventListener('click', (e) => {
|
||||
e.stopPropagation();
|
||||
showImage(currentIndex - 1);
|
||||
});
|
||||
|
||||
nextBtn.addEventListener('click', (e) => {
|
||||
e.stopPropagation();
|
||||
showImage(currentIndex + 1);
|
||||
});
|
||||
|
||||
// Fermer le lightbox en cliquant en dehors de l'image
|
||||
lightbox.addEventListener('click', (e) => {
|
||||
if (e.target === lightbox) {
|
||||
lightbox.style.display = 'none';
|
||||
}
|
||||
});
|
||||
|
||||
// Ajout des contrôles clavier (Échap, flèches gauche/droite)
|
||||
document.addEventListener('keydown', (e) => {
|
||||
if (lightbox.style.display === 'flex') {
|
||||
if (e.key === 'Escape') {
|
||||
// Fermer le lightbox
|
||||
closeBtn.addEventListener('click', () => {
|
||||
lightbox.style.display = 'none';
|
||||
} else if (e.key === 'ArrowLeft') {
|
||||
});
|
||||
|
||||
// Navigation pour images précédente et suivante
|
||||
prevBtn.addEventListener('click', (e) => {
|
||||
e.stopPropagation();
|
||||
showImage(currentIndex - 1);
|
||||
} else if (e.key === 'ArrowRight') {
|
||||
});
|
||||
|
||||
nextBtn.addEventListener('click', (e) => {
|
||||
e.stopPropagation();
|
||||
showImage(currentIndex + 1);
|
||||
}
|
||||
}
|
||||
});
|
||||
});
|
||||
|
||||
// Fermer le lightbox en cliquant en dehors de l'image
|
||||
lightbox.addEventListener('click', (e) => {
|
||||
if (e.target === lightbox) {
|
||||
lightbox.style.display = 'none';
|
||||
}
|
||||
});
|
||||
|
||||
// Ajout des contrôles clavier (Échap, flèches gauche/droite)
|
||||
document.addEventListener('keydown', (e) => {
|
||||
if (lightbox.style.display === 'flex') {
|
||||
if (e.key === 'Escape') {
|
||||
lightbox.style.display = 'none';
|
||||
} else if (e.key === 'ArrowLeft') {
|
||||
showImage(currentIndex - 1);
|
||||
} else if (e.key === 'ArrowRight') {
|
||||
showImage(currentIndex + 1);
|
||||
}
|
||||
}
|
||||
});
|
||||
|
||||
|
||||
//////////////// end lightbox galerie image page site////////////////////////
|
||||
@ -578,12 +595,9 @@ if (container) {
|
||||
}
|
||||
}
|
||||
});
|
||||
|
||||
|
||||
//////////////////// end wrapper views-row lessites /////////////////////////
|
||||
|
||||
|
||||
|
||||
//////////////////// start div infos site ////////////////////////
|
||||
|
||||
// Vérifie si la page a la classe 'node-type-site' dans le <body>
|
||||
@ -627,6 +641,36 @@ if (elementsToWrap.length > 0) {
|
||||
}
|
||||
//////////////////// end div infos site ////////////////////////
|
||||
|
||||
|
||||
//////////////////// start div infos actualité ////////////////////////
|
||||
|
||||
$(document).ready(function () {
|
||||
// Vérifier si .layout-container A l'ID #page-node (et non un élément enfant)
|
||||
if ($(".layout-container").attr("id") === "page-node") {
|
||||
$("article.node-type-actualite").each(function () {
|
||||
let article = $(this);
|
||||
let dateField = article.find(".field_field_date");
|
||||
let typeField = article.find(".field_field_type_d_actualite");
|
||||
|
||||
// Vérifier si les deux éléments existent
|
||||
if (dateField.length > 0 && typeField.length > 0) {
|
||||
// Vérifier si l'encapsulation n'existe pas déjà
|
||||
if (article.find(".infos-actu").length === 0) {
|
||||
// Créer un conteneur et y insérer les éléments
|
||||
let infosActu = $("<div>").addClass("infos-actu").append(dateField, typeField);
|
||||
|
||||
// Ajouter ce conteneur après les champs existants
|
||||
article.append(infosActu);
|
||||
}
|
||||
}
|
||||
});
|
||||
}
|
||||
});
|
||||
|
||||
//////////////////// end div infos actualité ////////////////////////
|
||||
|
||||
//////////////////////////////////////////////////////////////////
|
||||
|
||||
document.addEventListener("DOMContentLoaded", function() {
|
||||
// Sélectionner les éléments à déplacer
|
||||
const documentsField = document.querySelector(".field_field_documents");
|
||||
@ -684,6 +728,113 @@ moveLanguageSwitcher();
|
||||
window.addEventListener("resize", moveLanguageSwitcher);
|
||||
});
|
||||
|
||||
///////////////////////////////////////////////////////////////
|
||||
|
||||
/////////////// start class à view-rows-ressources ////////
|
||||
$(document).ready(function () {
|
||||
$(".view-rows-wrapper").each(function () {
|
||||
let h3Container = $(this).prev("h3").find("div[class^='type-']");
|
||||
let classToAdd = h3Container.attr("class"); // Récupère la classe complète (ex: "type-Documentation")
|
||||
|
||||
if (classToAdd) {
|
||||
$(this).addClass(classToAdd); // Ajoute cette classe à .view-rows-wrapper
|
||||
}
|
||||
});
|
||||
});
|
||||
////////////////// end class à view-rows-wrapper ////////////////
|
||||
|
||||
|
||||
|
||||
/////////////////// start voir plus... ressources ////////////////////
|
||||
|
||||
$(document).ready(function () {
|
||||
// Vérifier si on est sur la page avec l'ID #ressources
|
||||
if ($("#ressources").length > 0) {
|
||||
$(".view-rows-wrapper").each(function () {
|
||||
let container = $(this); // Cible uniquement cette section
|
||||
let items = container.find(".views-row"); // Les éléments à afficher progressivement
|
||||
let visibleCount = 4; // Nombre d'éléments visibles au départ
|
||||
|
||||
|
||||
// Récupérer la classe `type-XXX`
|
||||
let typeClass = container.attr("class").split(" ").find(cls => cls.startsWith("type-"));
|
||||
let typeName = typeClass ? typeClass.replace("type-", "").replace(/-/g, " ") : "contenu"; // Nettoyer le nom
|
||||
|
||||
if (typeClass === "type-podcast" || typeClass === "type-video") {
|
||||
visibleCount = 2; // Pour Podcast et Vidéo
|
||||
}
|
||||
|
||||
// Ajouter un bouton dynamiquement après chaque `.view-rows-ressources`
|
||||
let button = $("<button>")
|
||||
.addClass("voir-plus")
|
||||
.text("Voir plus de " + typeName)
|
||||
.insertAfter(container);
|
||||
|
||||
// Cacher tous les éléments sauf les 4 premiers
|
||||
items.hide().slice(0, visibleCount).show();
|
||||
|
||||
// Action sur le bouton
|
||||
button.on("click", function () {
|
||||
let hiddenItems = container.find(".views-row:hidden").slice(0, 4); // Prochains éléments à afficher
|
||||
|
||||
if ($(this).text().includes("Voir plus")) {
|
||||
hiddenItems.slideDown(); // Afficher avec un effet de glissement
|
||||
|
||||
if (container.find(".views-row:hidden").length === 0) {
|
||||
$(this).text("Voir moins de " + typeName); // Changer le texte du bouton si tout est affiché
|
||||
}
|
||||
} else {
|
||||
container.find(".views-row").slice(visibleCount).slideUp(); // Replier les éléments
|
||||
$(this).text("Voir plus de " + typeName); // Revenir à l'état initial
|
||||
}
|
||||
});
|
||||
});
|
||||
}
|
||||
});
|
||||
|
||||
/////////////////// end voir plus... ressources ////////////////////
|
||||
|
||||
|
||||
|
||||
/////////////////// start voir plus... actualite dans /actualites ////////////////////
|
||||
$(document).ready(function () {
|
||||
if ($("#actualites").length > 0) {
|
||||
$(".node-type-actualite").each(function () {
|
||||
let article = $(this);
|
||||
|
||||
// Sélection des éléments à afficher/masquer
|
||||
let body = article.find(".field_body");
|
||||
let links = article.find(".field_field_liens");
|
||||
|
||||
// Masquer les éléments au chargement
|
||||
body.hide();
|
||||
links.hide();
|
||||
|
||||
// Créer le bouton flèche
|
||||
let toggleButton = $("<button>")
|
||||
.addClass("toggle-actualite")
|
||||
.html("▼") // Flèche vers le bas
|
||||
.insertAfter(article); // Insérer après l'article
|
||||
|
||||
// Action au clic sur la flèche
|
||||
toggleButton.on("click", function () {
|
||||
if (body.is(":visible")) {
|
||||
body.slideUp();
|
||||
links.slideUp();
|
||||
$(this).html("▼"); // Changer en flèche vers le bas
|
||||
} else {
|
||||
body.slideDown();
|
||||
links.slideDown();
|
||||
$(this).html("▲"); // Changer en flèche vers le haut
|
||||
}
|
||||
});
|
||||
});
|
||||
}
|
||||
});
|
||||
|
||||
|
||||
/////////////////// end voir plus... actualite dans /actualites ////////////////////
|
||||
|
||||
|
||||
})(jQuery, window);
|
||||
|
||||
|
||||
@ -33,9 +33,69 @@
|
||||
.node-type-actualite{
|
||||
width: 100%;
|
||||
padding-bottom: 7rem;
|
||||
a{
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
div{
|
||||
order: 2;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
.field_body {
|
||||
order: 2;
|
||||
padding-bottom: 2rem;
|
||||
p{
|
||||
font-size: 0.8rem;
|
||||
}
|
||||
}
|
||||
.field_field_liens{
|
||||
order: 3;
|
||||
padding-bottom: 2rem;
|
||||
padding-top: 2rem;
|
||||
width: fit-content;
|
||||
|
||||
a{
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
padding-left: 0.5rem;
|
||||
display: inline-flex;
|
||||
align-items: center;
|
||||
color: white;
|
||||
background: black;
|
||||
text-transform: uppercase;
|
||||
font-size: 0.6rem;
|
||||
svg{
|
||||
display: none;
|
||||
}
|
||||
&::after{
|
||||
display: inline-flex;
|
||||
content: url("../img/noun-arrow-to-right.svg");
|
||||
padding-right: 0.2rem;
|
||||
padding-left: 0.2rem;
|
||||
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
a:not(.ext){
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
|
||||
.field_field_images{
|
||||
order: 5;
|
||||
img{
|
||||
width: 100%;
|
||||
height: auto;
|
||||
}
|
||||
blockquote.image-field-caption{
|
||||
margin-left: 0;
|
||||
margin-top: 0;
|
||||
p{
|
||||
margin-top: 0;
|
||||
font-size: 0.4rem;
|
||||
}
|
||||
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.infos-actu{
|
||||
@ -51,8 +111,8 @@
|
||||
color: red;
|
||||
font-size: 0.6rem;
|
||||
font-weight: 600;
|
||||
display: inline-flex;
|
||||
align-items: center;
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
&::before{
|
||||
content: url('../img/type-actu.svg');
|
||||
padding-right: 0.4rem;
|
||||
@ -60,9 +120,10 @@
|
||||
}
|
||||
.field_field_date{
|
||||
color: red;
|
||||
display: inline-flex;
|
||||
align-items: center;
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
margin-left: 1rem;
|
||||
padding-right: 1rem;
|
||||
&::before{
|
||||
content: url('../img/date-actu.svg');
|
||||
padding-right: 0.4rem;
|
||||
@ -70,60 +131,7 @@
|
||||
}
|
||||
|
||||
}
|
||||
.field_body {
|
||||
order: 2;
|
||||
padding-bottom: 2rem;
|
||||
p{
|
||||
font-size: 0.8rem;
|
||||
}
|
||||
}
|
||||
.field_field_liens{
|
||||
order: 3;
|
||||
padding-bottom: 2rem;
|
||||
padding-top: 2rem;
|
||||
a{
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
padding-left: 0.5rem;
|
||||
display: inline-flex;
|
||||
align-items: center;
|
||||
color: white;
|
||||
background: black;
|
||||
text-transform: uppercase;
|
||||
font-size: 0.6rem;
|
||||
svg{
|
||||
display: none;
|
||||
}
|
||||
&::after{
|
||||
display: inline-flex;
|
||||
content: url("../img/noun-arrow-to-right.svg");
|
||||
padding-right: 0.2rem;
|
||||
padding-left: 0.2rem;
|
||||
|
||||
}
|
||||
}
|
||||
|
||||
a:not(.ext){
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
|
||||
.field_field_images{
|
||||
order: 5;
|
||||
img{
|
||||
width: 100%;
|
||||
height: auto;
|
||||
}
|
||||
blockquote.image-field-caption{
|
||||
margin-left: 0;
|
||||
margin-top: 0;
|
||||
p{
|
||||
margin-top: 0;
|
||||
font-size: 0.4rem;
|
||||
}
|
||||
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
|
||||
@ -0,0 +1,277 @@
|
||||
|
||||
#actualites{
|
||||
background-color: #f6f7f3;
|
||||
|
||||
|
||||
.layout-content{
|
||||
// padding-top: 1rem;
|
||||
.content_container{
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
|
||||
#block-quartiers-de-demain-titredepage{
|
||||
margin-top: 3rem;
|
||||
margin-left: 15%;
|
||||
margin-bottom: 4rem;
|
||||
width: 70%;
|
||||
@media(max-width: 810px){
|
||||
margin-top: 14rem;
|
||||
}
|
||||
h1{
|
||||
width: fit-content;
|
||||
margin: auto;
|
||||
text-transform: none;
|
||||
color: black;
|
||||
font-size: 2rem;
|
||||
font-family: "gilroy-medium"
|
||||
}
|
||||
|
||||
|
||||
}
|
||||
.views-element-container{
|
||||
margin-left: 20%;
|
||||
width: 65%;
|
||||
|
||||
.view-rows-wrapper{
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
flex-wrap: wrap;
|
||||
|
||||
|
||||
.views-row{
|
||||
width: 100%;
|
||||
font-size: 0.5rem;
|
||||
margin-bottom: 2rem;
|
||||
padding-bottom: 1rem;
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
align-items: center;
|
||||
border-bottom: solid black 0.5px;
|
||||
.node-type-actualite{
|
||||
width: 85%;
|
||||
// padding-bottom: 2rem;
|
||||
|
||||
.content-wrapper-actu{
|
||||
display: grid;
|
||||
grid-template-columns: 1fr 2fr;
|
||||
grid-template-rows: repeat(5 1fr);
|
||||
.field_field_images{
|
||||
grid-column: 1;
|
||||
grid-row: 1 /span 5;
|
||||
width: 250px;
|
||||
// display: flex;
|
||||
// margin: auto;
|
||||
margin-right: 1rem;
|
||||
|
||||
.actu-diaporama{
|
||||
// height: 150px;
|
||||
width: 100%;
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
align-items: center !important;
|
||||
margin:auto;
|
||||
margin-right: 1rem;
|
||||
.slick-list{
|
||||
margin: auto;
|
||||
padding-top: 0 !important;
|
||||
.cadre-img-zoom{
|
||||
display: flex;
|
||||
margin: auto;
|
||||
width: 250px;
|
||||
height: auto;
|
||||
img{
|
||||
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
object-fit: cover;
|
||||
-moz-border-radius: 9px; /* pour Mozilla */
|
||||
-khtml-border-radius: 9px; /* pour Safari et Chrome */
|
||||
-webkit-border-radius: 9px; /* pour Safari sur Mac */
|
||||
border-radius: 9px; /* CSS3 */
|
||||
}
|
||||
}
|
||||
blockquote.image-field-caption{
|
||||
margin: 0;
|
||||
p{
|
||||
margin-top: 0;
|
||||
font-size: 0.4rem;
|
||||
}
|
||||
|
||||
}
|
||||
}
|
||||
button{
|
||||
margin: auto;
|
||||
transform: none;
|
||||
top: 30%;
|
||||
height: 0;
|
||||
width: 0;
|
||||
&:before{
|
||||
transform: scale(0.4) !important;
|
||||
&:hover{
|
||||
filter: brightness(1.75);
|
||||
}
|
||||
}
|
||||
}
|
||||
button.slick-next{
|
||||
right: 15% ;
|
||||
padding: 0;
|
||||
}
|
||||
button.slick-prev{
|
||||
left: 5%;
|
||||
padding: 0;
|
||||
}
|
||||
}
|
||||
}
|
||||
.field_field_type_d_actualite,
|
||||
.field_field_date,
|
||||
.field_field_site,
|
||||
.field_title,
|
||||
.field_body,
|
||||
.field_field_liens{
|
||||
grid-column: 2;
|
||||
|
||||
}
|
||||
.field_field_type_d_actualite{
|
||||
order: 2;
|
||||
a{
|
||||
text-transform: uppercase;
|
||||
color: red;
|
||||
font-size: 0.6rem;
|
||||
font-weight: 600;
|
||||
display: inline-flex;
|
||||
align-items: center;
|
||||
&::before{
|
||||
content: "";
|
||||
display: inline-block;
|
||||
width: 16px; /* Ajuste la largeur */
|
||||
height: 16px; /* Ajuste la hauteur */
|
||||
background-image: url('../img/type-actu.svg');
|
||||
background-size: contain;
|
||||
background-repeat: no-repeat;
|
||||
// margin-right: 0.4rem;
|
||||
padding-right: 0.4rem;
|
||||
}
|
||||
}
|
||||
}
|
||||
.field_field_date{
|
||||
order: 3;
|
||||
color: red;
|
||||
font-size: 0.6rem;
|
||||
font-weight: 600;
|
||||
display: inline-flex;
|
||||
align-items: center;
|
||||
// margin-left: 1rem;
|
||||
&::before{
|
||||
content: "";
|
||||
display: inline-block;
|
||||
width: 16px; /* Ajuste la largeur */
|
||||
height: 16px; /* Ajuste la hauteur */
|
||||
background-image: url('../img/date-actu.svg');
|
||||
background-size: contain;
|
||||
background-repeat: no-repeat;
|
||||
// margin-right: 0.4rem;
|
||||
padding-right: 0.4rem;
|
||||
}
|
||||
}
|
||||
.field_field_site{
|
||||
order: 4;
|
||||
a{
|
||||
color: red;
|
||||
font-size: 0.6rem;
|
||||
font-weight: 600;
|
||||
display: inline-flex;
|
||||
align-items: center;
|
||||
// margin-left: 1rem;
|
||||
padding-left: 0.2rem;
|
||||
|
||||
&::before{
|
||||
content: "";
|
||||
display: inline-block;
|
||||
width: 10px; /* Ajuste la largeur */
|
||||
height: 10px; /* Ajuste la hauteur */
|
||||
background-image: url("../img/map_pointer.svg");
|
||||
background-size: contain;
|
||||
background-repeat: no-repeat;
|
||||
// margin-right: 0.4rem;
|
||||
padding-right: 0.5rem;
|
||||
}
|
||||
}
|
||||
}
|
||||
.field_title{
|
||||
order: 5;
|
||||
a{
|
||||
color: $blue_QDD;
|
||||
font-size: 1.2rem;
|
||||
}
|
||||
}
|
||||
|
||||
.field_body {
|
||||
order: 6;
|
||||
padding-bottom: 2rem;
|
||||
opacity: 1 !important;
|
||||
transform:none !important;
|
||||
p{
|
||||
font-size: 0.8rem;
|
||||
}
|
||||
}
|
||||
.field_field_liens{
|
||||
order: 7;
|
||||
padding:0;
|
||||
width: fit-content;
|
||||
a{
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
padding-left: 0.5rem;
|
||||
display: inline-flex;
|
||||
align-items: center;
|
||||
color: white;
|
||||
background: black;
|
||||
text-transform: uppercase;
|
||||
font-size: 0.6rem;
|
||||
svg{
|
||||
display: none;
|
||||
}
|
||||
&::after{
|
||||
display: inline-flex;
|
||||
content: url("../img/noun-arrow-to-right.svg");
|
||||
padding-right: 0.2rem;
|
||||
padding-left: 0.2rem;
|
||||
|
||||
}
|
||||
}
|
||||
|
||||
// a:not(.ext){
|
||||
// display: none;
|
||||
// }
|
||||
}
|
||||
|
||||
|
||||
}
|
||||
}
|
||||
.toggle-actualite {
|
||||
display: block;
|
||||
width: 40px;
|
||||
height: 40px;
|
||||
margin: 10px auto;
|
||||
border: none;
|
||||
background-color: transparent;
|
||||
font-size: 24px;
|
||||
cursor: pointer;
|
||||
transition: transform 0.3s ease;
|
||||
}
|
||||
|
||||
.toggle-actualite:hover {
|
||||
transform: scale(1.2);
|
||||
}
|
||||
|
||||
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
}
|
||||
}
|
||||
}
|
||||
@ -0,0 +1,205 @@
|
||||
|
||||
#ressources{
|
||||
background-color: #f6f7f3;
|
||||
|
||||
|
||||
.layout-content{
|
||||
// padding-top: 1rem;
|
||||
.content_container{
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
|
||||
#block-quartiers-de-demain-titredepage{
|
||||
margin-top: 3rem;
|
||||
margin-left: 15%;
|
||||
margin-bottom: 1rem;
|
||||
width: 70%;
|
||||
@media(max-width: 810px){
|
||||
margin-top: 14rem;
|
||||
}
|
||||
h1{
|
||||
width: fit-content;
|
||||
margin: auto;
|
||||
text-transform: none;
|
||||
color: black;
|
||||
font-size: 2rem;
|
||||
font-family: "gilroy-medium"
|
||||
}
|
||||
|
||||
|
||||
}
|
||||
.views-element-container{
|
||||
margin-left: 15%;
|
||||
width: 65%;
|
||||
h3{
|
||||
&::before{
|
||||
content:"";
|
||||
display: block;
|
||||
border-bottom: solid 2px $blue_QDD;
|
||||
// width: 80% ;
|
||||
margin: auto;
|
||||
}
|
||||
text-align: center;
|
||||
div{
|
||||
.field_name{
|
||||
h2{
|
||||
margin-bottom: 0.6rem;
|
||||
a{
|
||||
font-family: "gilroy-light";
|
||||
color: $blue_QDD;
|
||||
font-size: 1.2rem;
|
||||
}
|
||||
}
|
||||
}
|
||||
.field_description{
|
||||
margin-left: 10%;
|
||||
margin-right: 10%;
|
||||
font-family: "gilroy-light";
|
||||
p{
|
||||
margin-top: 0.6rem;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
}
|
||||
button.voir-plus{
|
||||
background-color: transparent;
|
||||
color: $blue_QDD;
|
||||
border: solid $blue_QDD 0.5px;
|
||||
padding: 0.3rem;
|
||||
display: flex;
|
||||
margin: auto;
|
||||
}
|
||||
.view-rows-wrapper{
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
flex-wrap: wrap;
|
||||
|
||||
|
||||
.views-row{
|
||||
width: 30%;
|
||||
font-size: 0.5rem;
|
||||
margin-bottom: 1rem;
|
||||
h2{
|
||||
font-family: "gilroy-semibold";
|
||||
color: $blue_QDD;
|
||||
font-size: 00.6rem;
|
||||
}
|
||||
p{
|
||||
font-size: 0.5rem;
|
||||
}
|
||||
.field_field_mots_clefs{
|
||||
div{
|
||||
display: flex;
|
||||
flex-direction: row !important;
|
||||
div{
|
||||
border: solid 1px $blue_QDD;
|
||||
margin-right: 0.2rem;
|
||||
padding: 1.3%;
|
||||
padding-bottom: 0.2%;
|
||||
padding-top: 0.2%;
|
||||
font-size: 0.4rem;
|
||||
font-family: "gilroy-semibold";
|
||||
a{
|
||||
color: $blue_QDD;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
}
|
||||
.field_field_site{
|
||||
div {
|
||||
|
||||
a {
|
||||
position: relative;
|
||||
padding-left: 20px; // Ajuster selon la taille de l'icône
|
||||
|
||||
&:before {
|
||||
content: "";
|
||||
position: absolute;
|
||||
left: 0;
|
||||
top: 50%;
|
||||
transform: translateY(-50%);
|
||||
width: 1em;
|
||||
height: 1em;
|
||||
background-image: url("../img/map_pointer.svg");
|
||||
background-size: contain;
|
||||
background-repeat: no-repeat;
|
||||
}
|
||||
|
||||
color: $red_QDD;
|
||||
font-family: "gilroy-semibold";
|
||||
}
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
.type-documentation{
|
||||
.field_body,
|
||||
.field_field_images{
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
.type-podcast{
|
||||
.content-ressource{
|
||||
display: grid;
|
||||
grid-template-columns: 1fr 1.2fr;
|
||||
grid-template-rows: repeat(5 1fr);
|
||||
margin-top: 1rem;
|
||||
.field_field_images{
|
||||
grid-column: 1;
|
||||
grid-row: 1 /span 5;
|
||||
padding: 0 1rem 1rem 1rem;
|
||||
img{
|
||||
width: 100%;
|
||||
height: auto;
|
||||
aspect-ratio: 1 / 1;
|
||||
object-fit: cover;
|
||||
border-radius: 9px;
|
||||
}
|
||||
}
|
||||
.field_title, h2{
|
||||
margin-top: 0;
|
||||
}
|
||||
.field_title,
|
||||
.field_field_sous_titre,
|
||||
.field_field_author,
|
||||
.field_field_date_ressource,
|
||||
.field_body,
|
||||
.field_field_mots_clefs,
|
||||
.field_field_site,
|
||||
.field_field_documents,
|
||||
.field_field_liens{
|
||||
grid-column: 2;
|
||||
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
}
|
||||
}
|
||||
|
||||
.views-row:has(.type-podcast){
|
||||
width: 50%;
|
||||
}
|
||||
.views-row:has(.type-documentation){
|
||||
width: 25%;
|
||||
}
|
||||
.views-row:has(.type-vidéo){
|
||||
width: 50%;
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
|
||||
|
||||
// }
|
||||
|
||||
}
|
||||
|
||||
}
|
||||
}
|
||||
}
|
||||
@ -27,7 +27,7 @@
|
||||
padding-bottom: 0rem;
|
||||
}
|
||||
}
|
||||
.view{
|
||||
.view .view-rows-wrapper{
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
flex-wrap: nowrap;
|
||||
@ -42,156 +42,143 @@
|
||||
padding-top: 3rem;
|
||||
}
|
||||
article.node-type-actualite{
|
||||
a{
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
h2{
|
||||
display: none;
|
||||
}
|
||||
.field_field_images{
|
||||
order: 1;
|
||||
background-color: black;
|
||||
-moz-border-radius: 9px; /* pour Mozilla */
|
||||
-khtml-border-radius: 9px; /* pour Safari et Chrome */
|
||||
-webkit-border-radius: 9px; /* pour Safari sur Mac */
|
||||
border-radius: 9px; /* CSS3 */
|
||||
height: 250px;
|
||||
margin-bottom: 0.6rem;
|
||||
@media(max-width: 550px){
|
||||
height: 170px;
|
||||
}
|
||||
div{
|
||||
height: 100%;
|
||||
div{
|
||||
// height: 600px;
|
||||
|
||||
a{
|
||||
display: block;
|
||||
height: 100%;
|
||||
img{
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
object-fit: cover;
|
||||
-moz-border-radius: 9px; /* pour Mozilla */
|
||||
-khtml-border-radius: 9px; /* pour Safari et Chrome */
|
||||
-webkit-border-radius: 9px; /* pour Safari sur Mac */
|
||||
border-radius: 9px; /* CSS3 */
|
||||
@media(max-width: 550px){
|
||||
max-height: 170px;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
img{
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
object-fit: cover;
|
||||
div{
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: flex-start;
|
||||
.field_field_images{
|
||||
order: 1;
|
||||
background-color: black;
|
||||
-moz-border-radius: 9px; /* pour Mozilla */
|
||||
-khtml-border-radius: 9px; /* pour Safari et Chrome */
|
||||
-webkit-border-radius: 9px; /* pour Safari sur Mac */
|
||||
border-radius: 9px; /* CSS3 */
|
||||
height: 250px;
|
||||
width: 100%;
|
||||
margin-bottom: 0.6rem;
|
||||
@media(max-width: 550px){
|
||||
max-height: 170px;
|
||||
height: 170px;
|
||||
}
|
||||
div.cadre-img-zoom{
|
||||
height: 100%;
|
||||
display: block;
|
||||
height: 100%;
|
||||
img{
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
object-fit: cover;
|
||||
-moz-border-radius: 9px; /* pour Mozilla */
|
||||
-khtml-border-radius: 9px; /* pour Safari et Chrome */
|
||||
-webkit-border-radius: 9px; /* pour Safari sur Mac */
|
||||
border-radius: 9px; /* CSS3 */
|
||||
@media(max-width: 550px){
|
||||
max-height: 170px;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
.field_field_type_d_actualite{
|
||||
order: 2;
|
||||
text-transform: uppercase;
|
||||
color: red;
|
||||
font-size: 0.5rem;
|
||||
font-family: 'gilroy-bold';
|
||||
display: inline-flex;
|
||||
flex-direction: row;
|
||||
align-items: center;
|
||||
&::before{
|
||||
content: url('../img/type-actu.svg');
|
||||
padding-right: 0.3rem;
|
||||
padding-bottom: 0.2rem;
|
||||
}
|
||||
a{color: red;}
|
||||
}
|
||||
// .infos-actu{
|
||||
// order: 2;
|
||||
// h2{
|
||||
// font-family: 'gilroy-semibold';
|
||||
// }
|
||||
// }
|
||||
.field_field_date{
|
||||
order: 3;
|
||||
color: red;
|
||||
display: inline-flex;
|
||||
flex-direction: row;
|
||||
align-items: center;
|
||||
font-size: 0.5rem;
|
||||
font-family: 'gilroy-bold';
|
||||
|
||||
&::before{
|
||||
content: url('../img/date-actu.svg');
|
||||
padding-right: 0.3rem;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
.field_field_type_d_actualite{
|
||||
text-transform: uppercase;
|
||||
color: red;
|
||||
font-size: 0.5rem;
|
||||
font-family: 'gilroy-bold';
|
||||
display: inline-flex;
|
||||
align-items: center;
|
||||
&::before{
|
||||
content: url('../img/type-actu.svg');
|
||||
padding-right: 0.3rem;
|
||||
padding-bottom: 0.2rem;
|
||||
.field_title{
|
||||
order: 4;
|
||||
padding-top: 0.2rem;
|
||||
h2{
|
||||
margin: 0;
|
||||
line-height: 0.4;
|
||||
padding-bottom: 0.6rem;
|
||||
padding-left: 0;
|
||||
a{
|
||||
font-size: 0.8rem;
|
||||
color: $blue_QDD;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
.infos-actu{
|
||||
order: 2;
|
||||
h2{
|
||||
font-family: 'gilroy-semibold';
|
||||
}
|
||||
}
|
||||
.field_field_date{
|
||||
|
||||
color: red;
|
||||
display: inline-flex;
|
||||
align-items: center;
|
||||
font-size: 0.5rem;
|
||||
font-family: 'gilroy-bold';
|
||||
|
||||
&::before{
|
||||
content: url('../img/date-actu.svg');
|
||||
padding-right: 0.3rem;
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
.field_title{
|
||||
order: 3;
|
||||
padding-top: 0.2rem;
|
||||
h2{
|
||||
margin: 0;
|
||||
line-height: 0.4;
|
||||
padding-bottom: 0.6rem;
|
||||
.field_body{
|
||||
order: 5;
|
||||
// visibility: visible;
|
||||
opacity: 1 !important;
|
||||
transform: none !important;
|
||||
font-family: 'gilroy-regular';
|
||||
padding-bottom: 0.5rem;
|
||||
p{
|
||||
margin: 0;
|
||||
margin-bottom: 1rem;
|
||||
font-size: 0.7rem ;
|
||||
}
|
||||
a{
|
||||
font-size: 0.8rem;
|
||||
color: $blue_QDD;
|
||||
}
|
||||
}
|
||||
}
|
||||
.field_body{
|
||||
order: 4;
|
||||
// visibility: visible;
|
||||
opacity: 1 !important;
|
||||
transform: none !important;
|
||||
font-family: 'gilroy-regular';
|
||||
p{
|
||||
margin: 0;
|
||||
margin-bottom: 1rem;
|
||||
font-size: 0.7rem ;
|
||||
}
|
||||
a{
|
||||
color: $blue_QDD;
|
||||
}
|
||||
}
|
||||
.field_field_liens{
|
||||
order: 5;
|
||||
width: fit-content;
|
||||
padding-left: 0.5rem;
|
||||
// padding-bottom: 0.2rem;
|
||||
// padding-top: 0.2rem;
|
||||
background: black;
|
||||
@media (max-width:810px) {
|
||||
margin-left: 0;
|
||||
}
|
||||
.field_field_liens{
|
||||
order: 6;
|
||||
width: fit-content;
|
||||
padding-left: 0.5rem;
|
||||
// padding-bottom: 0.2rem;
|
||||
// padding-top: 0.2rem;
|
||||
background: black;
|
||||
@media (max-width:810px) {
|
||||
margin-left: 0;
|
||||
}
|
||||
|
||||
a{
|
||||
display: inline-flex;
|
||||
align-items: center;
|
||||
color: white;
|
||||
text-transform: uppercase;
|
||||
font-size: 0.6rem;
|
||||
|
||||
svg{
|
||||
display: none;
|
||||
}
|
||||
&::after{
|
||||
a{
|
||||
display: inline-flex;
|
||||
content: url("../img/noun-arrow-to-right.svg");
|
||||
padding-right: 0.2rem;
|
||||
padding-left: 0.2rem;
|
||||
// padding-bottom: 0.2rem;
|
||||
}
|
||||
}
|
||||
align-items: center;
|
||||
color: white;
|
||||
text-transform: uppercase;
|
||||
font-size: 0.6rem;
|
||||
|
||||
svg{
|
||||
display: none;
|
||||
}
|
||||
&::after{
|
||||
display: inline-flex;
|
||||
content: url("../img/noun-arrow-to-right.svg");
|
||||
padding-right: 0.2rem;
|
||||
padding-left: 0.2rem;
|
||||
// padding-bottom: 0.2rem;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
}
|
||||
.views-row:nth-child(odd){
|
||||
|
||||
@ -48,6 +48,7 @@
|
||||
@import "pages/actualite";
|
||||
@import "pages/node-type-site";
|
||||
@import "pages/lessites.scss";
|
||||
|
||||
@import "pages/ressources";
|
||||
@import "pages/actualites";
|
||||
|
||||
@import "/home/ouidade/Developer/docker-quartiersdedemain/src/web/modules/custom/q2d_mod/assets/css/carte-interactive-qdd.css";
|
||||
@ -0,0 +1,78 @@
|
||||
{#
|
||||
/**
|
||||
* @file
|
||||
* Default theme implementation for a field.
|
||||
*
|
||||
* To override output, copy the "field.html.twig" from the templates directory
|
||||
* to your theme's directory and customize it, just like customizing other
|
||||
* Drupal templates such as page.html.twig or node.html.twig.
|
||||
*
|
||||
* Instead of overriding the theming for all fields, you can also just override
|
||||
* theming for a subset of fields using
|
||||
* @link themeable Theme hook suggestions. @endlink For example,
|
||||
* here are some theme hook suggestions that can be used for a field_foo field
|
||||
* on an article node type:
|
||||
* - field--node--field-foo--article.html.twig
|
||||
* - field--node--field-foo.html.twig
|
||||
* - field--node--article.html.twig
|
||||
* - field--field-foo.html.twig
|
||||
* - field--text-with-summary.html.twig
|
||||
* - field.html.twig
|
||||
*
|
||||
* Available variables:
|
||||
* - attributes: HTML attributes for the containing element.
|
||||
* - label_hidden: Whether to show the field label or not.
|
||||
* - title_attributes: HTML attributes for the title.
|
||||
* - label: The label for the field.
|
||||
* - multiple: TRUE if a field can contain multiple items.
|
||||
* - items: List of all the field items. Each item contains:
|
||||
* - attributes: List of HTML attributes for each item.
|
||||
* - content: The field item's content.
|
||||
* - entity_type: The entity type to which the field belongs.
|
||||
* - field_name: The name of the field.
|
||||
* - field_type: The type of the field.
|
||||
* - label_display: The display settings for the label.
|
||||
*
|
||||
* @see template_preprocess_field()
|
||||
*
|
||||
* @ingroup themeable
|
||||
*/
|
||||
#}
|
||||
{%
|
||||
set title_classes = [
|
||||
'field',
|
||||
'field--name-' ~ field_name|clean_class,
|
||||
'field--type-' ~ field_type|clean_class,
|
||||
'field--label-' ~ label_display,
|
||||
label_display == 'visually_hidden' ? 'visually-hidden',
|
||||
]
|
||||
%}
|
||||
{%
|
||||
set ancre_href = '#paragraph-id--' ~ paragraph.id()
|
||||
%}
|
||||
{% if label_hidden %}
|
||||
{% if multiple %}
|
||||
<div{{ attributes }}>
|
||||
{% for item in items %}
|
||||
<div{{ item.attributes }}>{{ item.content }}</div>
|
||||
{% endfor %}
|
||||
</div>
|
||||
{% else %}
|
||||
{% for item in items %}
|
||||
<div{{ attributes }}>{{ item.content }}</div>
|
||||
{% endfor %}
|
||||
{% endif %}
|
||||
{% else %}
|
||||
<div{{ attributes }}>
|
||||
<div{{ title_attributes.addClass(title_classes) }}>{{ label }}</div>
|
||||
{% if multiple %}
|
||||
<div class="actu-diaporama">
|
||||
{% endif %}
|
||||
{% for item in items %}
|
||||
<div{{ item.attributes }}>{{ item.content }}</div>
|
||||
{% endfor %}
|
||||
{% if multiple %}
|
||||
</div>
|
||||
{% endif %}
|
||||
</div>
|
||||
{% endif %}
|
||||
@ -88,8 +88,8 @@
|
||||
</footer>
|
||||
{% endif %}
|
||||
|
||||
{# <div{{ content_attributes }}> #}
|
||||
<div{{ content_attributes }}>
|
||||
{{ content }}
|
||||
{# </div> #}
|
||||
</div>
|
||||
|
||||
</article>
|
||||
|
||||
@ -88,11 +88,11 @@
|
||||
</footer>
|
||||
{% endif %}
|
||||
|
||||
{# <div{{ content_attributes }}> #}
|
||||
{# {{ content }} #}
|
||||
{# </div> #}
|
||||
{% block content %}
|
||||
<a href="{{ url }}" rel="bookmark">{{ label }}
|
||||
<div class="content-wrapper-actu"{{ content_attributes }}>
|
||||
{{ content }}
|
||||
</div>
|
||||
|
||||
{# {% block content %}
|
||||
{{content.field_images}}
|
||||
<div class="infos-actu">
|
||||
{{content.field_type_d_actualite}}
|
||||
@ -100,9 +100,5 @@
|
||||
</div>
|
||||
{{content.body}}
|
||||
{{content.field_liens}}
|
||||
|
||||
|
||||
</a>
|
||||
{% endblock %}
|
||||
|
||||
{% endblock %} #}
|
||||
</article>
|
||||
|
||||
@ -0,0 +1,103 @@
|
||||
{#
|
||||
/**
|
||||
* @file
|
||||
* Default theme implementation to display a node.
|
||||
*
|
||||
* Available variables:
|
||||
* - node: The node entity with limited access to object properties and methods.
|
||||
* Only method names starting with "get", "has", or "is" and a few common
|
||||
* methods such as "id", "label", and "bundle" are available. For example:
|
||||
* - node.getCreatedTime() will return the node creation timestamp.
|
||||
* - node.hasField('field_example') returns TRUE if the node bundle includes
|
||||
* field_example. (This does not indicate the presence of a value in this
|
||||
* field.)
|
||||
* - node.isPublished() will return whether the node is published or not.
|
||||
* Calling other methods, such as node.delete(), will result in an exception.
|
||||
* See \Drupal\node\Entity\Node for a full list of public properties and
|
||||
* methods for the node object.
|
||||
* - label: (optional) The title of the node.
|
||||
* - content: All node items. Use {{ content }} to print them all,
|
||||
* or print a subset such as {{ content.field_example }}. Use
|
||||
* {{ content|without('field_example') }} to temporarily suppress the printing
|
||||
* of a given child element.
|
||||
* - author_picture: The node author user entity, rendered using the "compact"
|
||||
* view mode.
|
||||
* - metadata: Metadata for this node.
|
||||
* - date: (optional) Themed creation date field.
|
||||
* - author_name: (optional) Themed author name field.
|
||||
* - url: Direct URL of the current node.
|
||||
* - display_submitted: Whether submission information should be displayed.
|
||||
* - attributes: HTML attributes for the containing element.
|
||||
* The attributes.class element may contain one or more of the following
|
||||
* classes:
|
||||
* - node: The current template type (also known as a "theming hook").
|
||||
* - node--type-[type]: The current node type. For example, if the node is an
|
||||
* "Article" it would result in "node--type-article". Note that the machine
|
||||
* name will often be in a short form of the human readable label.
|
||||
* - node--view-mode-[view_mode]: The View Mode of the node; for example, a
|
||||
* teaser would result in: "node--view-mode-teaser", and
|
||||
* full: "node--view-mode-full".
|
||||
* The following are controlled through the node publishing options.
|
||||
* - node--promoted: Appears on nodes promoted to the front page.
|
||||
* - node--sticky: Appears on nodes ordered above other non-sticky nodes in
|
||||
* teaser listings.
|
||||
* - node--unpublished: Appears on unpublished nodes visible only to site
|
||||
* admins.
|
||||
* - title_attributes: Same as attributes, except applied to the main title
|
||||
* tag that appears in the template.
|
||||
* - content_attributes: Same as attributes, except applied to the main
|
||||
* content tag that appears in the template.
|
||||
* - author_attributes: Same as attributes, except applied to the author of
|
||||
* the node tag that appears in the template.
|
||||
* - title_prefix: Additional output populated by modules, intended to be
|
||||
* displayed in front of the main title tag that appears in the template.
|
||||
* - title_suffix: Additional output populated by modules, intended to be
|
||||
* displayed after the main title tag that appears in the template.
|
||||
* - view_mode: View mode; for example, "teaser" or "full".
|
||||
* - teaser: Flag for the teaser state. Will be true if view_mode is 'teaser'.
|
||||
* - page: Flag for the full page state. Will be true if view_mode is 'full'.
|
||||
* - readmore: Flag for more state. Will be true if the teaser content of the
|
||||
* node cannot hold the main body content.
|
||||
* - logged_in: Flag for authenticated user status. Will be true when the
|
||||
* current user is a logged-in member.
|
||||
* - is_admin: Flag for admin user status. Will be true when the current user
|
||||
* is an administrator.
|
||||
*
|
||||
* @see template_preprocess_node()
|
||||
*
|
||||
* @ingroup themeable
|
||||
*/
|
||||
#}
|
||||
{# <pre>{{ dump(node) }}</pre> #}
|
||||
|
||||
{% set ressource_class = '' %}
|
||||
{% if node.field_type_de_ressource.entity %}
|
||||
{% set ressource_class = 'type-' ~ node.field_type_de_ressource.entity.name.value|clean_class %}
|
||||
{% endif %}
|
||||
|
||||
<article{{ attributes.addClass(ressource_class) }}>
|
||||
{{ title_prefix }}
|
||||
{% if label and not page %}
|
||||
<h2{{ title_attributes }}>
|
||||
<a href="{{ url }}" rel="bookmark">{{ label }}</a>
|
||||
</h2>
|
||||
{% endif %}
|
||||
{{ title_suffix }}
|
||||
|
||||
{% if display_submitted %}
|
||||
<footer>
|
||||
{{ author_picture }}
|
||||
<div{{ author_attributes }}>
|
||||
{% trans %}Submitted by {{ author_name }} on {{ date }}{% endtrans %}
|
||||
{{ metadata }}
|
||||
</div>
|
||||
</footer>
|
||||
{% endif %}
|
||||
|
||||
<div class="content-ressource"{{ content_attributes }}>
|
||||
{{ content }}
|
||||
</div>
|
||||
</article>
|
||||
|
||||
|
||||
|
||||
@ -0,0 +1,97 @@
|
||||
{#
|
||||
/**
|
||||
* @file
|
||||
* Claro's theme implementation to display a single Drupal page.
|
||||
*
|
||||
* The doctype, html, head, and body tags are not in this template. Instead
|
||||
* they can be found in the html.html.twig template normally located in the
|
||||
* core/modules/system directory.
|
||||
*
|
||||
* Available variables:
|
||||
*
|
||||
* General utility variables:
|
||||
* - base_path: The base URL path of the Drupal installation. Will usually be
|
||||
* "/" unless you have installed Drupal in a sub-directory.
|
||||
* - is_front: A flag indicating if the current page is the front page.
|
||||
* - logged_in: A flag indicating if the user is registered and signed in.
|
||||
* - is_admin: A flag indicating if the user has permission to access
|
||||
* administration pages.
|
||||
*
|
||||
* Site identity:
|
||||
* - front_page: The URL of the front page. Use this instead of base_path when
|
||||
* linking to the front page. This includes the language domain or prefix.
|
||||
*
|
||||
* Page content (in order of occurrence in the default page.html.twig):
|
||||
* - node: Fully loaded node, if there is an automatically-loaded node
|
||||
* associated with the page and the node ID is the second argument in the
|
||||
* page's path (e.g. node/12345 and node/12345/revisions, but not
|
||||
* comment/reply/12345).
|
||||
*
|
||||
* Regions:
|
||||
* - page.header: Items for the header region.
|
||||
* - page.pre_content: Items for the pre-content region.
|
||||
* - page.breadcrumb: Items for the breadcrumb region.
|
||||
* - page.highlighted: Items for the highlighted region.
|
||||
* - page.help: Dynamic help text, mostly for admin pages.
|
||||
* - page.content: The main content of the current page.
|
||||
*
|
||||
* @see template_preprocess_page()
|
||||
* @see html.html.twig
|
||||
*/
|
||||
#}
|
||||
<div class="layout-container " id="actualites">
|
||||
|
||||
<header role="banner">
|
||||
{{ page.header_left }}
|
||||
{{ page.header_right }}
|
||||
{{ page.header_nav }}
|
||||
</header>
|
||||
|
||||
{{ page.primary_menu }}
|
||||
{{ page.secondary_menu }}
|
||||
|
||||
{{ page.breadcrumb }}
|
||||
|
||||
{{ page.highlighted }}
|
||||
|
||||
{{ page.help }}
|
||||
|
||||
<main role="main">
|
||||
<a id="main-content" tabindex="-1"></a>{# link is in html.html.twig #}
|
||||
|
||||
<div class="layout-content">
|
||||
|
||||
{{ page.content }}
|
||||
</div>{# /.layout-content #}
|
||||
|
||||
{% if page.sidebar_first %}
|
||||
<aside class="layout-sidebar-first" role="complementary">
|
||||
{{ page.sidebar_first }}
|
||||
</aside>
|
||||
{% endif %}
|
||||
|
||||
{% if page.sidebar_second %}
|
||||
<aside class="layout-sidebar-second" role="complementary">
|
||||
{{ page.sidebar_second }}
|
||||
</aside>
|
||||
{% endif %}
|
||||
|
||||
</main>
|
||||
{# {% if page.footer_top or page.footer_left or page.footer_middle or page.footer_right or page.footer_bottom %} #}
|
||||
<footer role="contentinfo">
|
||||
{# <section id="footer-top"> #}
|
||||
<span class="totop"><a href="#" id="toTop"><i class="arrow-up"></i></a></span>
|
||||
{# </section> #}
|
||||
<div class="footer">
|
||||
<section id="footer-left">{{ page.footer_left }}</section>
|
||||
<div class='first-row'>
|
||||
<section id="footer-middle">{{ page.footer_middle }}</section>
|
||||
<section id="footer-right">{{ page.footer_right }}</section>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
{# <section id="footer-bottom">{{ page.footer_bottom }}</section> #}
|
||||
</footer>
|
||||
{# {% endif %} #}
|
||||
|
||||
</div>{# /.layout-container #}
|
||||
@ -0,0 +1,97 @@
|
||||
{#
|
||||
/**
|
||||
* @file
|
||||
* Claro's theme implementation to display a single Drupal page.
|
||||
*
|
||||
* The doctype, html, head, and body tags are not in this template. Instead
|
||||
* they can be found in the html.html.twig template normally located in the
|
||||
* core/modules/system directory.
|
||||
*
|
||||
* Available variables:
|
||||
*
|
||||
* General utility variables:
|
||||
* - base_path: The base URL path of the Drupal installation. Will usually be
|
||||
* "/" unless you have installed Drupal in a sub-directory.
|
||||
* - is_front: A flag indicating if the current page is the front page.
|
||||
* - logged_in: A flag indicating if the user is registered and signed in.
|
||||
* - is_admin: A flag indicating if the user has permission to access
|
||||
* administration pages.
|
||||
*
|
||||
* Site identity:
|
||||
* - front_page: The URL of the front page. Use this instead of base_path when
|
||||
* linking to the front page. This includes the language domain or prefix.
|
||||
*
|
||||
* Page content (in order of occurrence in the default page.html.twig):
|
||||
* - node: Fully loaded node, if there is an automatically-loaded node
|
||||
* associated with the page and the node ID is the second argument in the
|
||||
* page's path (e.g. node/12345 and node/12345/revisions, but not
|
||||
* comment/reply/12345).
|
||||
*
|
||||
* Regions:
|
||||
* - page.header: Items for the header region.
|
||||
* - page.pre_content: Items for the pre-content region.
|
||||
* - page.breadcrumb: Items for the breadcrumb region.
|
||||
* - page.highlighted: Items for the highlighted region.
|
||||
* - page.help: Dynamic help text, mostly for admin pages.
|
||||
* - page.content: The main content of the current page.
|
||||
*
|
||||
* @see template_preprocess_page()
|
||||
* @see html.html.twig
|
||||
*/
|
||||
#}
|
||||
<div class="layout-container " id="ressources">
|
||||
|
||||
<header role="banner">
|
||||
{{ page.header_left }}
|
||||
{{ page.header_right }}
|
||||
{{ page.header_nav }}
|
||||
</header>
|
||||
|
||||
{{ page.primary_menu }}
|
||||
{{ page.secondary_menu }}
|
||||
|
||||
{{ page.breadcrumb }}
|
||||
|
||||
{{ page.highlighted }}
|
||||
|
||||
{{ page.help }}
|
||||
|
||||
<main role="main">
|
||||
<a id="main-content" tabindex="-1"></a>{# link is in html.html.twig #}
|
||||
|
||||
<div class="layout-content">
|
||||
|
||||
{{ page.content }}
|
||||
</div>{# /.layout-content #}
|
||||
|
||||
{% if page.sidebar_first %}
|
||||
<aside class="layout-sidebar-first" role="complementary">
|
||||
{{ page.sidebar_first }}
|
||||
</aside>
|
||||
{% endif %}
|
||||
|
||||
{% if page.sidebar_second %}
|
||||
<aside class="layout-sidebar-second" role="complementary">
|
||||
{{ page.sidebar_second }}
|
||||
</aside>
|
||||
{% endif %}
|
||||
|
||||
</main>
|
||||
{# {% if page.footer_top or page.footer_left or page.footer_middle or page.footer_right or page.footer_bottom %} #}
|
||||
<footer role="contentinfo">
|
||||
{# <section id="footer-top"> #}
|
||||
<span class="totop"><a href="#" id="toTop"><i class="arrow-up"></i></a></span>
|
||||
{# </section> #}
|
||||
<div class="footer">
|
||||
<section id="footer-left">{{ page.footer_left }}</section>
|
||||
<div class='first-row'>
|
||||
<section id="footer-middle">{{ page.footer_middle }}</section>
|
||||
<section id="footer-right">{{ page.footer_right }}</section>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
{# <section id="footer-bottom">{{ page.footer_bottom }}</section> #}
|
||||
</footer>
|
||||
{# {% endif %} #}
|
||||
|
||||
</div>{# /.layout-container #}
|
||||
@ -0,0 +1,41 @@
|
||||
{#
|
||||
/**
|
||||
* @file
|
||||
* Default theme implementation to display a taxonomy term.
|
||||
*
|
||||
* Available variables:
|
||||
* - url: URL of the current term.
|
||||
* - name: (optional) Name of the current term.
|
||||
* - content: Items for the content of the term (fields and description).
|
||||
* Use 'content' to print them all, or print a subset such as
|
||||
* 'content.description'. Use the following code to exclude the
|
||||
* printing of a given child element:
|
||||
* @code
|
||||
* {{ content|without('description') }}
|
||||
* @endcode
|
||||
* - attributes: HTML attributes for the wrapper.
|
||||
* - page: Flag for the full page state.
|
||||
* - term: The taxonomy term entity, including:
|
||||
* - id: The ID of the taxonomy term.
|
||||
* - bundle: Machine name of the current vocabulary.
|
||||
* - view_mode: View mode, e.g. 'full', 'teaser', etc.
|
||||
*
|
||||
* @see template_preprocess_taxonomy_term()
|
||||
*
|
||||
* @ingroup themeable
|
||||
*/
|
||||
#}
|
||||
|
||||
{%
|
||||
set ressource_class = 'type-' ~ term.name()
|
||||
%}
|
||||
|
||||
|
||||
<div{{ attributes.addClass(ressource_class) }}>
|
||||
{{ title_prefix }}
|
||||
{% if name and not page %}
|
||||
<h2><a href="{{ url }}">{{ name }}</a></h2>
|
||||
{% endif %}
|
||||
{{ title_suffix }}
|
||||
{{ content }}
|
||||
</div>
|
||||
@ -0,0 +1,54 @@
|
||||
{#
|
||||
/**
|
||||
* @file
|
||||
* Default theme implementation to display a view of unformatted rows.
|
||||
*
|
||||
* Available variables:
|
||||
* - title: The title of this group of rows. May be empty.
|
||||
* - rows: A list of the view's row items.
|
||||
* - attributes: The row's HTML attributes.
|
||||
* - content: The row's content.
|
||||
* - view: The view object.
|
||||
* - default_row_class: A flag indicating whether default classes should be
|
||||
* used on rows.
|
||||
*
|
||||
* @see template_preprocess_views_view_unformatted()
|
||||
*
|
||||
* @ingroup themeable
|
||||
*/
|
||||
#}
|
||||
{#
|
||||
{% if title %}
|
||||
{%
|
||||
set view_ressource_class = [
|
||||
'view-rows-ressources',
|
||||
title ? 'type-' ~ title.field_name.term.name(),
|
||||
|
||||
]
|
||||
%}
|
||||
{% endif %} #}
|
||||
|
||||
|
||||
{%
|
||||
set view_wrapper_class = [
|
||||
'view-rows-wrapper',
|
||||
]
|
||||
%}
|
||||
|
||||
|
||||
{% if title %}
|
||||
<h3>{{ title }} </h3>
|
||||
{% endif %}
|
||||
<div {{ attributes.addClass(view_wrapper_class) }}>
|
||||
{% for row in rows %}
|
||||
{%
|
||||
set row_classes = [
|
||||
default_row_class ? 'views-row',
|
||||
]
|
||||
%}
|
||||
<div{{ row.attributes.addClass(row_classes) }}>
|
||||
{{- row.content -}}
|
||||
</div>
|
||||
{% endfor %}
|
||||
</div>
|
||||
|
||||
@ -5,6 +5,7 @@ let config = {
|
||||
mode: 'development',
|
||||
entry: [
|
||||
"./src/assets/js/quartiers_de_demain.js",
|
||||
"./src/assets/js/page_ressources.js",
|
||||
// "./src/assets/js/animated_logo.js",
|
||||
"./src/assets/js/animated_formes.js",
|
||||
"./src/assets/scss/quartiers_de_demain.scss",
|
||||
|
||||
Loading…
x
Reference in New Issue
Block a user