css fichier unique filtres

This commit is contained in:
2025-05-16 13:52:02 +02:00
parent 5c941c4654
commit 65a95309d5
5 changed files with 201 additions and 522 deletions
@@ -126,8 +126,9 @@
}
.view-filters{
margin-top: 4rem;
padding-left: 0.5rem;
display: flex;
flex-direction: row;
flex-direction: column;
@media (max-width: 479px){
flex-direction: column;
padding-bottom: 3rem;
@@ -137,152 +138,14 @@
content: 'Filtrer par :';
margin-right: 2rem;
margin-bottom: 1rem;
margin-left: 0.5rem;
font-weight: 900;
// width: 160px;
min-width: fit-content;
@media (max-width: 479px){
padding-bottom: 1rem;
}
}
#views-exposed-form-projets-block-1{
display: flex;
flex-direction: row;
flex-wrap: wrap;
position: relative;
align-content: center;
.form-item{
margin-right: 1rem;
margin-bottom: 1rem;
display: flex;
align-content: center;
@media (max-width: 550px) {
width: 100%;
margin: auto;
}
}
select, input{
padding: 0.3rem;
margin:0.5rem;
}
input, label{
margin: 0.5rem;
}
#edit-field-neuf-rehabilitation-value--wrapper{
legend{display: none;}
.js-form-item-field-neuf-rehabilitation-value:first-of-type{
display: none;
}
@media (max-width: 479px){
padding-bottom: 1rem;
padding-top: 1rem;
margin-inline-start: 0px;
}
}
#edit-field-encours-fini-value--wrapper{
legend{display: none;}
.js-form-item-field-encours-fini-value:first-of-type{
display: none;
}
@media (max-width: 479px){
padding-bottom: 1rem;
margin-inline-start: 0px;
}
}
#edit-field-etape-du-projet-value{
@media (max-width: 479px){
max-width: 60vw;
}
}
.js-form-type-textfield{
label{display: none;}
}
input[type="radio"]{
display: none;
}
input[type="radio"] + label::before{
content:"";
display:inline-block;
width: 15px;
height: 15px;
background:#fff;
border-radius:0px;
border-color: rgba($color: #000000, $alpha: 1);
border-style: solid;
border-width: 1px;
margin-right: 0.5rem;
}
input[type="radio"]:checked + label::before{
background:$blue-light;
}
label{
padding-right: 1rem;
}
#edit-submit-projets{
// display: inline-block;
background-color: $blue-light;
color: white;
text-transform: uppercase;
border: none;
padding: 0.3rem 0.7rem;
// margin-left: 2rem;
@media (max-width: 479px){
margin-left: 0rem;
margin-right: 2rem;
}
@media (min-width:1495px) {
// margin-left: 0;
// position: absolute;
// right: 150px;
// // justify-content: flex-end;
// margin-left: auto;
}
}
#edit-reset{
background-color: $blue-light;
color: white;
text-transform: uppercase;
border: none;
padding: 0.3rem 0.7rem;
margin-left: 1rem;
@media (min-width:1495px) {
position: absolute;
right: 0px;
}
}
input[type="checkbox"]{
display: none;
}
input[type="checkbox"] + label::before{
content:"";
display:inline-block;
width: 15px;
height: 15px;
background:#fff;
border-radius:0px;
border-color: rgba($color: #000000, $alpha: 1);
border-style: solid;
border-width: 1px;
margin-right: 0.5rem;
}
input[type="checkbox"]:checked + label::before{
background:$blue-light;
}
@media (max-width: 479px){
flex-direction: column;
#edit-actions{
width: 100%;
margin: auto;
}
}
}
}
}
//grille de projets
@@ -144,124 +144,6 @@
padding-bottom: 1rem;
}
}
#views-exposed-form-base-de-donnees-block-1{
// max-width: 20%;
display: flex;
flex-direction: column;
flex-wrap: wrap;
margin-top: 1rem;
@media (max-width: 479px){
justify-content: center;
}
.js-form-item{
display: flex;
flex-direction: column;
max-width: 100%;
margin-bottom: 1rem;
padding: 0.5rem;
align-items: baseline;
border: solid black 0.5px ;
@media(max-width: 810px){
display: flex;
flex-direction: row;
justify-content: space-between;
}
label{
flex: 2 1 auto;
}
input{
flex: 2 1 auto;
max-width: 55%;
@media(max-width: 810px){
max-width: 100%;
}
}
}
.js-form-type-select{
display: flex;
flex-direction: row;
justify-content: space-evenly;
padding-top: 0.5rem;
label{
width: 60%;
text-transform: lowercase;
}
select{
background-color: white;
border: none;
width: 50%;
padding-bottom: 0.2rem;
@media(max-width: 810px){
width: 100%;
}
}
}
.js-form-type-textfield{
flex-direction: column;
padding-top: 0.8rem;
label{
text-transform: lowercase;
padding-bottom: 0.2rem;
flex: 2 1 auto;
}
input{
flex: 2 1 auto;
max-width: 55%;
}
}
&.js-form-item{
@media(max-width: 810px){
flex-direction: column;
}
}
#edit-actions{
display: flex;
flex-direction: column;
justify-content: space-between;
align-self: center;
margin-left: auto;
@media (max-width: 479px){
justify-content: center;
margin: auto;
}
#edit-submit-base-de-donnees{
background-color: $blue-light;
color: white;
text-transform: uppercase;
border: none;
padding: 0.3rem 0.7rem;
margin-left: 2rem;
@media (max-width: 479px){
margin: auto;
margin-top: 1rem;
}
}
#edit-reset{
background-color: $blue-light;
color: white;
text-transform: uppercase;
border: none;
padding: 0.3rem 0.7rem;
margin-top: 1rem;
margin-left: 1rem;
@media (max-width: 479px){
margin: auto;
margin-top: 1rem;
}
}
}
}
}
.view-content{
@@ -461,19 +343,12 @@
}
.field--name-field-images{
grid-column: 1;
// display: none;
// width: 30%;
// width: fit-content;
// height: 100px;
.field__item{
height: 100px;
}
img{
height: 100%;
width: auto;
// width: 100%;
// height: auto;
}
}
.field--name-field-date-de-parution{
@@ -0,0 +1,89 @@
#views-exposed-form-projets-block-1{
flex-direction: row;
position: relative;
align-items: center;
}
#views-exposed-form-base-de-donnees-block-1{
flex-direction: column;
margin-top: 1rem;
@media (max-width: 479px){
justify-content: center;
}
.js-form-item{
flex-direction: column !important;
margin-right: 0 !important;
input,
select{
width: 100%;
}
label{
padding-right: 0 !important;
}
}
}
#views-exposed-form-base-de-donnees-block-1,
#views-exposed-form-projets-block-1{
display: flex;
flex-wrap: wrap;
.js-form-item{
display: flex;
flex-direction: row;
max-width: 100%;
margin-right: 1rem;
margin-bottom: 1rem;
padding: 0.5rem 1rem;
align-items: baseline;
border: solid black 0.5px ;
justify-content: space-evenly;
@media(max-width: 810px){
display: flex;
flex-direction: row;
justify-content: space-between;
}
label{
flex: 2 1 auto;
padding-right: 2rem;
&::after{
content: ' : ';
}
}
input{
flex: 2 1 auto;
max-width: 55%;
@media(max-width: 810px){
max-width: 100%;
}
}
.form-checkbox{
margin-right: 1rem;
}
.select-wrapper{
margin: 0;
}
}
.js-form-type-checkbox label{
&::after{
content: none;
}
}
.form-actions{
input{
color: white;
font-weight: 600;
text-transform: uppercase;
padding: 0.3rem 0.7rem;
background-color: $blue-light;
border: none;
}
}
input, select{
border: none;
background-color: transparent;
font-family: "Marianne";
font-size: 1rem;
}
}
+1
View File
@@ -61,4 +61,5 @@
@import "partials/_slick_custom.scss";
@import "partials/_slick";
@import "partials/_slick-theme";
@import "partials/_filtres";
// @import "partials/_block_third_ressources_liees";