responsive node projet

This commit is contained in:
2025-12-01 11:44:53 +01:00
parent c53e9461dd
commit 53b935bd07
2 changed files with 214 additions and 56 deletions

View File

@@ -44,9 +44,9 @@
display: none;
}
@media(max-width: 810px){
width: 50% !important;
// width: 50% !important;
margin: auto;
margin-top: 3rem;
}
}
.field_field_site_projet{
@@ -54,10 +54,17 @@
width: 65%;
margin: auto;
padding-left: 2rem;
@media(max-width: 810px){
padding-left: 0rem;
width: 80%;
}
.field_title{
h2{
text-transform: none;
font-size: 0.60rem;
@media(max-width: 810px){
font-size:1rem;
}
a{
color: $blue_QDD;
font-weight: 700;
@@ -67,6 +74,9 @@
.field_field_sous_titre{
p{
font-size: 0.55rem;
@media(max-width: 810px){
font-size:1rem;
}
}
}
.more-link{
@@ -85,6 +95,9 @@
text-transform: uppercase;
font-size: 0.5rem;
padding-left: 0.5rem;
@media(max-width: 810px){
font-size:0.8rem;
}
svg{
display: none;
@@ -123,8 +136,7 @@
flex-direction: column;
padding-left: 2rem;
@media(max-width: 810px){
// margin-left: 2rem;
// margin-top: 3rem;
padding-left: 0rem;
}
.field_field_laureats{
@@ -164,10 +176,16 @@
margin: 0;
font-size: 0.7em;
font-family: 'gilroy-light';
@media(max-width: 810px){
font-size:0.8rem;
}
}
.field_field_contenu{
font-size: 0.8em;
font-family: 'gilroy-bold';
@media(max-width: 810px){
font-size:0.8rem;
}
}
}
}
@@ -183,9 +201,15 @@
margin-left: 0;
font-size: 0.5rem;
font-family: "gilroy-light";
@media(max-width: 810px){
font-size:0.8rem;
}
p{
margin-top: 0;
font-size: 0.5rem;
@media(max-width: 810px){
font-size:0.8rem;
}
}
}
}
@@ -193,6 +217,9 @@
p{
font-family: "gilroy-light";
font-size: 0.6rem;
@media(max-width: 810px){
font-size:0.8rem;
}
}
}
.equipe-panel {
@@ -223,6 +250,9 @@
display: flex;
border: none;
// margin-top: 1rem;
@media(max-width: 810px){
font-size:0.8rem;
}
svg{
display: none;
@@ -262,6 +292,9 @@
p{
font-family: "gilroy-light";
font-size: 0.6rem;
@media(max-width: 810px){
font-size:0.8rem;
}
}
}
}
@@ -284,6 +317,10 @@
object-fit: cover;
width: 220px;
height: 145px;
@media (max-width:810px){
width: 100%;
height: auto;
}
}
}
.image-field-caption{
@@ -293,6 +330,9 @@
margin-top: 0;
font-size: 0.5rem;
font-family: 'gilroy-light';
@media(max-width: 810px){
font-size:0.8rem;
}
}
}
@@ -316,6 +356,9 @@
color: white;
text-transform: uppercase;
font-size: 0.5rem;
@media(max-width: 810px){
font-size:0.8rem;
}
svg{
display: none;
}
@@ -368,6 +411,8 @@
margin-left: 2rem;
@media(max-width: 810px){
position: relative;
margin-left: 0;
margin-top: 2rem;
}
div{
display: flex;
@@ -375,19 +420,21 @@
@media(max-width: 810px){
justify-content: center;
margin: auto;
margin-bottom: 1rem;
width: fit-content;
}
@media(max-width: 500px){
justify-content: center;
margin: auto;
margin-bottom: 1rem;
width: fit-content;
margin-bottom: 0rem;
}
h2{
font-family: "gilroy-light";
text-transform: uppercase;
font-size: 0.6rem;
@media(max-width: 810px){
font-size:0.8rem;
margin: auto;
margin-bottom: 1rem;
width: 80%;
}
&::after{
content: " :";
}
@@ -397,6 +444,11 @@
border-bottom: solid black 1px;
padding-bottom: 0.5rem;
padding-top: 0.5rem;
@media(max-width: 810px){
width: 80%;
justify-content: start;
padding-top: 1rem;
}
transition: transform 0.4s ease-in-out;
&:hover {
transform: scale(1.05);
@@ -417,6 +469,10 @@
background-size: contain;
z-index: 0;
margin-top: 0.2rem;
@media(max-width: 810px){
top: 0rem;
left: -11.4rem;
}
}
.field-content{
font-size: 0;
@@ -424,24 +480,37 @@
}
.views-field-title {
@media (max-width:810px){
width: fit-content;
}
h2 {
font-size: 0.5rem;
margin-bottom: 0rem;
// margin-top: 0.3rem;
text-transform: none;
font-family: "gilroy-regular";
&::after{
content: "";
font-size: 0.5rem;
margin-bottom: 0rem;
text-transform: none;
font-family: "gilroy-regular";
&::after{
content: "";
}
@media(max-width: 810px){
font-size:0.8rem;
width: 100% !important;
}
}
}
.views-field-field-nom-de-l-equipe{
@media (max-width:810px){
width: fit-content;
margin: 0;
}
h3 {
margin-bottom: 0.3rem;
margin-top:0.3rem;
text-transform: uppercase;
}
font-size: 0.4rem;
@media(max-width: 810px){
font-size:0.7rem;
}
p{
font-family: "gilroy-semibold";
margin-bottom: 0.5rem;
@@ -449,32 +518,7 @@
}
.views-field-view-node{
display: none;
// width: fit-content;
// padding-left: 0.5rem;
// background: black;
// @media (max-width:810px) {
// margin-left: 0;
// }
// a{
// display: inline-flex;
// justify-content: space-between;
// align-items: center;
// color: white;
// text-transform: uppercase;
// font-size: 0.5rem;
// 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;
// height: 25px;
// }
// }
display: none;
}
}