css ressources-actu

This commit is contained in:
2024-11-22 14:42:38 +01:00
parent 52332fa126
commit e26a08fa6a
18 changed files with 558 additions and 909 deletions
@@ -1,82 +1,49 @@
.page-actualites{
.block-page-title-block{
width: 75%;
margin: auto;
}
.view-actus{
padding-top: 3rem;
padding-bottom: 6rem;
width: 80%;
margin: auto;
display: flex;
flex-direction: row;
flex-wrap: wrap;
align-items: baseline;
justify-content: space-between;
.views-row{
width: 28%;
padding: 1rem;
&:hover{
transform: scale(1.05);
transition: 0.3s transform ease, 0.3s box-shadow ease;
}
.node-type-actualite{
.image-actualite{
width: 90%;
margin: auto;
img{
width: 100%;
height: auto;
}
}
.infos-content{
position: relative;
top: -10px;
display: flex;
width: 30vw !important;
.entete_actu{
flex-direction: column;
border: solid $yellow-puca 1px;
background-color: $white-button;
padding: 1rem;
h2{
order: 2;
margin: 0;
font-size: 1.5rem;
font-weight: 600;
}
.field--name-field-sous-titre {
order: 3;
font-size: 1.3rem;
// line-height: 0.3rem;
}
.field--name-field-date{
order: 4;
font-weight: 900;
padding-bottom: 1rem;
}
.field--name-field-type-d-actualite{
order: 1;
text-transform: uppercase;
font-size: 1.2rem;
}
.field--name-field-site{
order: 5;
background-color: $gris-violet;
border-radius: 50px;
width: fit-content;
padding: 0.2rem 0.9rem;
margin-top: 1rem;
.field__item{
display: inline;
}
a{
color: white;
font-weight: 900;
font-size: 0.8rem;
vertical-align: top;
.image-actualite{
width: 90%;
margin: auto;
img{
width: 100%;
height: auto;
}
}
ul.links{
order: 6;
display: none;
.infos-content{
height: fit-content;
width: 100%;
margin: auto;
h1{
display: none;
}
}
}
}
}
}
}
@@ -1,30 +1,29 @@
.block-views-blockactus-block-1{
// display:none;
background-color: white;
padding-bottom: 3rem;
// padding-left: 12%;
h2{
width: 80%;
// margin: auto;
padding-top: 2rem;
padding-bottom: 2rem;
padding-left: 12%;
font-size: 2rem;
font-weight: 900;
margin-left: 10%;
}
.view-id-actus{
width: 100%;
margin: auto;
.views-row{
width: 35vw !important;
width: 30vw !important;
margin-left: 1rem;
@media (max-width: 1200px) {
width: 50vw !important;
}
&:first-of-type{
padding-left: 15%;
@media (max-width: 1200px) {
padding-left: 16%;
}
}
.node-type-actualite{
width: 100%;
// display: flex;
// flex-direction: column;
height: 100%;
> .entete_actu{
display: flex;
@@ -37,7 +36,9 @@
height: 250px;
right: 10%;
position: relative;
// margin-left: 1rem;
@media (max-width: 1200px) {
max-height: 150px;
}
.field--name-field-image{
height: 100%;
.field__items{
@@ -56,56 +57,8 @@
}
}
.infos-content{
position: relative;
display: flex;
flex-direction: column;
border: solid $yellow-puca 1px;
background-color: $white-button;
padding: 1rem;
height: fit-content;
width: 100%;
right: 0%;
height: auto;
h2{
order: 2;
margin: 0;
font-size: 1.5rem;
font-weight: 600;
padding: 0;;
}
.field--name-field-sous-titre {
order: 3;
font-size: 1.3rem;
}
.field--name-field-date{
order: 4;
font-weight: 900;
padding-bottom: 1rem;
}
.field--name-field-type-d-actualite{
order: 1;
text-transform: uppercase;
font-size: 1.2rem;
}
.field--name-field-site{
order: 5;
background-color: $gris-violet;
color: white;
border-radius: 50px;
width: fit-content;
padding: 0.2rem 0.9rem;
.field__item{
display: inline;
color: white;
font-weight: 900;
font-size: 0.8rem;
vertical-align: top;
}
}
ul.links{
order: 6;
display: none;
}
}
.body-content{
display: none;
@@ -121,5 +74,16 @@
.slick-prev{
left:35px;
}
.slick-next{
left: 90vw;
}
@media (max-width: 1400px) {
.slick-prev{
left:0vw;
}
.slick-next{
left: 85vw;
}
}
}
}
@@ -1,6 +1,9 @@
.page-sitespilotes{
.views-element-container{
padding-bottom: 8rem;
}
h1{
width: 80%;
margin: auto;
@@ -142,6 +145,7 @@
footer{
background-color: transparent;
text-transform: none !important;
z-index: 100;
p{
font-size: 2rem;
padding-left: 1rem;
@@ -271,258 +275,3 @@
font-weight: 1000;
}
}
.view-display-id-page_1{
display: flex;
flex-direction: row;
flex-wrap: wrap;
align-items: baseline;
justify-content: space-between;
article{
padding-bottom: 0.7rem;
}
.views-row{
width: 28%;
padding: 1rem;
&:hover{
transform: scale(1.05);
transition: 0.3s transform ease, 0.3s box-shadow ease;
}
.node-type-site{
margin: auto;
display: flex;
flex-direction: column;
width: 100%;
background-color: white;
.field--name-field-image{
order: 1;
max-width: 100%;
img{
width: 100%;
object-fit: cover;
height: fit-content;
}
}
.infos-content-site{
background-color: $white-button;
order: 2;
display: flex;
flex-direction: column;
padding-left: 1rem;
padding-right: 1rem;
padding-top: 0.5rem;
h1{display: none;}
h2{
order: 2;
margin: 0;
font-size: 1.6rem;
font-weight: 900;
line-height: 1;
padding-bottom: 0.8rem;
}
.first-row{
order: 1;
display:flex;
flex-direction: row;
align-items: end;
padding-bottom: 0.5rem;
.field--name-field-numero-site {
order: 1;
text-transform: uppercase;
font-size: 1rem;
display: inline-flex;
&::after{
content: '|';
padding-left: 1rem;
padding-right: 1rem;
}
}
.field--name-field-adresse-site{
order: 3;
font-size: 1.2rem;
.field__item{
display: flex;
}
.address{
margin: 0;
display: inline-flex;
.postal-code{
order: 2;
}
.locality{
order: 1;
text-transform: capitalize;
margin-right: 0.5rem;
}
.country{
display: none;
}
}
}
}
.field--name-field-architecte{
order: 4;
font-size: 1.2rem;
.field__items{
display: flex;
flex-direction: row;
flex-wrap: wrap;
.field__item{
display: inline;
&::after{
content:',';
padding-right: 0.5rem;
}
}
}
.field__item:last-of-type::after {
content: '';
}
}
ul.links{
order: 5;
text-transform: uppercase;
padding: 0;
margin: 0;
border: none;
padding-bottom: 1rem;
padding-top: 3rem;
display: inline-flex;
&::after{
content:url("../../dist/images/noun-arrow-1569918-black.svg");
padding-left: 0.5rem;
}
}
}
}
}
footer{
background-color: transparent;
text-transform: none !important;
p{
font-size: 2rem;
padding-left: 1rem;
font-weight: 1000;
}
.view-display-id-block_2{
display: flex;
flex-direction: row;
flex-wrap: wrap;
align-items: baseline;
justify-content: space-between;
.views-row{
width: 28%;
padding: 1rem;
&:hover{
transform: none;
}
.node-type-site{
margin: auto;
display: flex;
flex-direction: column;
width: 100%;
background-color: transparent;
.infos-content-site{
background-color: transparent;
order: 2;
display: flex;
flex-direction: column;
padding-left: 1rem;
padding-right: 1rem;;
padding-right: 1rem;
h2{
order: 2;
margin: 0;
font-size: 1.6rem;
font-weight: 900;
line-height: 1;
a{
cursor: default !important;
pointer-events: none;
}
}
.first-row{
order: 1;
display:flex;
flex-direction: row;
align-items: center;
padding-bottom: 0.5rem;
.field--name-field-lettre-de-site {
order: 1;
text-transform: uppercase;
font-size: 1rem;
font-weight: 400;
display: flex;
align-items: center;
&::before{
content:'SITE';
padding-right: 0.5rem;
}
&::after{
content: '|';
padding-left: 1rem;
padding-right: 1rem;
}
}
.field--name-field-adresse-site{
order: 3;
p.address{
padding-left: 0;
margin: 0;
display: inline-flex;
font-size: 1.3rem;
font-weight: 500!important;
.postal-code{
order: 2;
}
.locality{
order: 1;
text-transform: capitalize;
margin-right: 0.5rem;
}
.country{
display: none;
}
}
}
}
.field--name-field-architecte{
order: 4;
text-transform: capitalize;
font-weight: 400;
font-size: 1.2rem;
}
ul.links{
order: 5;
text-transform: uppercase;
padding: 0;
margin: 0;
border: none;
padding-bottom: 2rem;
padding-top: 0.9rem;
display: inline-flex;
&::after{
content:url("../../dist/images/noun-arrow-1569918-black.svg");
padding-left: 0.5rem;
}
}
}
}
}
}
}
}
@@ -7,8 +7,12 @@
margin: auto;
align-items: center;
.image-actualite{
width: 60%;
width: 50%;
height: 100%;
@media (max-width: 900px) {
width: 80%;
height: 100% !important;
}
img{
width: 100%;
height: auto;
@@ -16,57 +20,13 @@
}
}
.infos-content{
position: relative;
display: flex;
flex-direction: column;
border: solid $yellow-puca 1px;
background-color: $white-button;
padding: 1rem;
height: 350px;
// height: 350px;
width: 30%;
position: relative;
right: 5%;
margin-bottom: 30px;
h2{
order: 2;
margin: 0;
font-size: 1.5rem;
font-weight: 600;
padding: 0;;
}
.field--name-field-sous-titre {
order: 3;
font-size: 1.3rem;
}
.field--name-field-date{
order: 4;
font-weight: 900;
padding-bottom: 1rem;
}
.field--name-field-type-d-actualite{
order: 1;
text-transform: uppercase;
font-size: 1.2rem;
}
.field--name-field-site{
order: 5;
background-color: $gris-violet;
color: white;
border-radius: 50px;
width: fit-content;
padding: 0.2rem 0.9rem;
.field__item{
display: inline;
color: white;
font-weight: 900;
font-size: 0.8rem;
vertical-align: top;
}
}
ul.links{
order: 6;
display: none;
@media (max-width: 900px) {
width: 45%;
height: fit-content;
}
}
@@ -78,7 +38,7 @@
}
.links-content{
width: 15%;
margin-left: 15%;
margin-left: calc(25%/2);
}
}
}
@@ -1,4 +1,4 @@
.page-node-site{
.node-type-ressource{
display: grid;
@@ -6,9 +6,13 @@
grid-template-rows: repeat(2, auto);
padding-top: 3rem;
// #block-reha-titredepage{
// display: block !important;
// }
.image-ressource{
grid-row: 1;
grid-column: 2 /span 2;
grid-column: 2;
margin-right: 2rem;
img{
@@ -20,17 +24,22 @@
grid-row: 1;
grid-column: 3 /span 4;
margin-left: 2rem;
border: none;
background-color:transparent;
.field--name-field-type-de-ressource{
text-transform: uppercase;
font-size: 1rem;
order: 1;
}
h1{order: 2;}
.field--name-field-sous-titre{
font-size: 2rem;
order: 3;
}
.field--name-field-auteur{
font-weight: 800;
font-size: 1.3rem;
order: 4;
}
.field--name-field-site{
background-color: rgb(153, 147, 174);
@@ -38,6 +47,7 @@
width: fit-content;
padding: 0.2rem 0.9rem;
margin-top: 1rem;
order: 5;
a{
color: white;
font-weight: 900;
@@ -66,4 +76,3 @@
}
}
}
@@ -9,10 +9,6 @@
}
.region-content{
display: grid;
// width: 80%;
// margin: auto;
// display: flex;
// flex-direction: column;
grid-template-columns: repeat(8 1fr);
grid-template-rows: repeat(3 auto);
@@ -239,7 +235,7 @@
background-color: transparent;
}
.field__item{
padding: 0.3rem;
padding: 0.5rem;
border: solid black 1px;
margin-bottom: 1rem;
background-color: rgb(255, 255, 255);
@@ -1,13 +0,0 @@
.page-actualites{
.node-type-actualite{
width: 30vw !important;
.entete_actu{
flex-direction: column;
.infos-content{
width: 100%;
height: 250px;
right: 0;
}
}
}
}
@@ -7,13 +7,16 @@
}
.view-ressources{
display: flex;
flex-direction: row;
flex-wrap: wrap;
justify-content: space-between;
padding: 5rem;
width: 80%;
margin: auto;
#views-exposed-form-ressources-page-1{
width: 100%;
// margin: auto;
margin: auto;
display: grid;
grid-template-columns: repeat(8, 1fr);
grid-template-rows: repeat(3, 1fr);
@@ -53,52 +56,83 @@
}
}
}
article{
padding-bottom: 0 !important;
}
.views-row{
.node-type-ressource{
width: 28%;
padding: 1rem;
display: flex !important;
flex-direction: column;
background-color: $white-button;
margin-bottom: 6rem;
&:hover{
transform: scale(1.05);
transition: 0.3s transform ease, 0.3s box-shadow ease;
}
.node-type-ressource{
width: 100%;
margin: auto;
background-color: $white-button;
display: flex !important;
flex-direction: column-reverse;
padding-top: 0;
.image-ressource{
order: 1;
width: 90%;
width: auto;
margin: auto;
img{
width: 100%;
// height: auto;
max-height: 250px;
object-fit: contain;
margin-left: auto;
height: 15rem;
margin-left: 0;
.field--name-field-image{
height: 100%;
.field__items{
height: 100%;
.field__item{
height: 100%;
img{
height: 100%;
object-fit: contain;
}
}
}
}
}
.body-content{display: none;}
.infos-content{
display: flex;
flex-direction: column;
// border: solid $yellow-puca 1px;
padding: 1rem;
background-color: transparent !important;
right: 0;
margin-bottom: 0;
border: none;
margin-left: 0 !important;
h1{display: none;}
h2{
order: 2;
margin: 0;
font-size: 1.5rem;
font-weight: 600;
font-weight: 500;
line-height: 1.8rem;
}
.field--name-field-sous-titre {
order: 3;
font-size: 1.3rem;
// line-height: 0.3rem;
padding-top: 0.3rem;
}
.field--name-field-auteur{
order: 4;
font-weight: 900;
padding-top: 1rem;
padding-bottom: 1rem;
font-size: 1rem;
}
.field--name-field-type-de-ressource{
order: 1;
text-transform: uppercase;
font-size: 1.2rem;
font-size: 0.9rem;
a{
pointer-events: none;
}
@@ -128,10 +162,7 @@
display: none;
}
}
}
}
.pagination{
width: 100%;
@@ -65,7 +65,7 @@ header{
justify-content: space-evenly;
@media (max-width:1400px) {
@media (max-width:1100px) {
flex-direction: column;
}
li{
@@ -0,0 +1,69 @@
.infos-content{
position: relative;
display: flex;
flex-direction: column;
border: solid $yellow-puca 1px;
background-color: $white-button;
padding: 1rem;
height: fit-content;
width: 100%;
position: relative;
right: 5%;
margin-bottom: 30px;
h1{
// display: none;
order: 2;
font-size: 2rem;
font-weight: 500;
margin: 0;
}
h2{
order: 2;
margin: 0;
font-size: 1.5rem;
font-weight: 600;
padding: 0;
}
.field--name-field-sous-titre {
order: 3;
font-size: 1.5rem;
}
.field--name-field-date{
order: 4;
font-weight: 900;
}
.field--name-field-type-d-actualite{
order: 1;
text-transform: uppercase;
font-size: 0.8rem;
}
.field--name-field-site{
order: 5;
background-color: $gris-violet;
color: white;
border-radius: 50px;
width: fit-content;
padding: 0 0.9rem 0.3rem 0.9rem;
margin-top: 0.5rem;
.field__item{
display: inline;
color: white;
font-weight: 900;
font-size: 0.8rem;
a{
&:visited{
color: white;
}
&:link{
color: white;
}
}
}
}
ul.links{
order: 6;
display: none;
}
}
@@ -0,0 +1,40 @@
.links-content{
.field--name-field-liens {
padding: 0.5rem;
.field__items .field__item {
::after{
content: url("../../dist/images/noun-arrow-1569918-black.svg");
padding-left: 0.5rem;
}
}
}
.field--name-field-fichiers,
.field--name-field-fichier{
width: fit-content;
padding: 0.5rem;
padding-right: 0.8rem;
.file--mime-application-pdf{
a{
text-transform: uppercase;
}
::after{
content: url("../../dist/images/noun-download.svg");
padding-left: 0.8rem;
}
}
span:nth-of-type(2){
display: none;
}
}
}
.field--name-field-node-link .field__item {
::after{
content: url("../../dist/images/noun-arrow-1569918-black.svg");
padding-left: 0.5rem;
}
}
+4 -2
View File
@@ -23,6 +23,8 @@
@import "partials/slick-theme";
@import "partials/slick";
@import "partials/slick_custom";
@import "partials/infos_content_actus.scss";
@import "partials/links_content";
/*pages*/
@import "pages/home";
@@ -38,9 +40,9 @@
@import "pages/home/home-view-presentation";
@import "pages/le-programme";
@import "pages/node-site";
@import "pages/ressources";
@import "pages/ressources.scss";
@import "pages/node-ressource";
@import "pages/actualites";
@import "pages/node-actualite";
@import "pages/page-mon-espace-de-travail";
@import "pages/page-actualites";
// @import "pages/page-actualites";