bachir/d9-eql
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

css filters

Browse Source
This commit is contained in:
ouidade
2025-05-15 13:18:47 +02:00
parent 4d6f2e4ca1
commit 1010858e14
2 changed files with 150 additions and 18 deletions
Download Patch File Download Diff File Expand all files Collapse all files
web/themes/custom/eql/dist/assets/css/bundle.css
Vendored
+75 -7
View File
@@ -5442,11 +5442,16 @@ svg.ext {
order: 3; order: 3;
} }
} }
.path-ressources .layout-content .region-content #block-contenudelapageprincipale .layout--onecol .layout__region--content .block-region-content .block-views-blockbase-de-donnees-block-1 .view-base-de-donnees {
display: grid;
grid-template-columns: 20% 75%;
gap: 2rem;
}
.path-ressources .layout-content .region-content #block-contenudelapageprincipale .layout--onecol .layout__region--content .block-region-content .block-views-blockbase-de-donnees-block-1 .view-base-de-donnees .view-filters { .path-ressources .layout-content .region-content #block-contenudelapageprincipale .layout--onecol .layout__region--content .block-region-content .block-views-blockbase-de-donnees-block-1 .view-base-de-donnees .view-filters {
position: sticky; position: sticky;
align-self: start;
top: 13rem; top: 13rem;
left: 0; left: 0;
width: 15%;
background-color: rgb(255, 255, 255); background-color: rgb(255, 255, 255);
margin-top: 2rem; margin-top: 2rem;
margin-bottom: 5rem; margin-bottom: 5rem;
@@ -5454,6 +5459,12 @@ svg.ext {
padding-left: 2rem; padding-left: 2rem;
padding-right: 3rem; padding-right: 3rem;
} }
@media (max-width: 810px) {
.path-ressources .layout-content .region-content #block-contenudelapageprincipale .layout--onecol .layout__region--content .block-region-content .block-views-blockbase-de-donnees-block-1 .view-base-de-donnees .view-filters {
position: static;
margin-bottom: 2rem;
}
}
@media (max-width: 479px) { @media (max-width: 479px) {
.path-ressources .layout-content .region-content #block-contenudelapageprincipale .layout--onecol .layout__region--content .block-region-content .block-views-blockbase-de-donnees-block-1 .view-base-de-donnees .view-filters { .path-ressources .layout-content .region-content #block-contenudelapageprincipale .layout--onecol .layout__region--content .block-region-content .block-views-blockbase-de-donnees-block-1 .view-base-de-donnees .view-filters {
margin-left: 0; margin-left: 0;
@@ -5484,6 +5495,68 @@ svg.ext {
display: flex; display: flex;
flex-direction: column; flex-direction: column;
max-width: 100%; max-width: 100%;
margin-bottom: 1rem;
padding: 0.5rem;
align-items: baseline;
border: solid black 0.5px;
}
@media (max-width: 810px) {
.path-ressources .layout-content .region-content #block-contenudelapageprincipale .layout--onecol .layout__region--content .block-region-content .block-views-blockbase-de-donnees-block-1 .view-base-de-donnees .view-filters #views-exposed-form-base-de-donnees-block-1 .js-form-item {
display: flex;
flex-direction: row;
justify-content: space-between;
}
}
.path-ressources .layout-content .region-content #block-contenudelapageprincipale .layout--onecol .layout__region--content .block-region-content .block-views-blockbase-de-donnees-block-1 .view-base-de-donnees .view-filters #views-exposed-form-base-de-donnees-block-1 .js-form-item label {
flex: 2 1 auto;
}
.path-ressources .layout-content .region-content #block-contenudelapageprincipale .layout--onecol .layout__region--content .block-region-content .block-views-blockbase-de-donnees-block-1 .view-base-de-donnees .view-filters #views-exposed-form-base-de-donnees-block-1 .js-form-item input {
flex: 2 1 auto;
max-width: 55%;
}
@media (max-width: 810px) {
.path-ressources .layout-content .region-content #block-contenudelapageprincipale .layout--onecol .layout__region--content .block-region-content .block-views-blockbase-de-donnees-block-1 .view-base-de-donnees .view-filters #views-exposed-form-base-de-donnees-block-1 .js-form-item input {
max-width: 100%;
}
}
.path-ressources .layout-content .region-content #block-contenudelapageprincipale .layout--onecol .layout__region--content .block-region-content .block-views-blockbase-de-donnees-block-1 .view-base-de-donnees .view-filters #views-exposed-form-base-de-donnees-block-1 .js-form-type-select {
display: flex;
flex-direction: row;
justify-content: space-evenly;
padding-top: 0.5rem;
}
.path-ressources .layout-content .region-content #block-contenudelapageprincipale .layout--onecol .layout__region--content .block-region-content .block-views-blockbase-de-donnees-block-1 .view-base-de-donnees .view-filters #views-exposed-form-base-de-donnees-block-1 .js-form-type-select label {
width: 60%;
text-transform: lowercase;
}
.path-ressources .layout-content .region-content #block-contenudelapageprincipale .layout--onecol .layout__region--content .block-region-content .block-views-blockbase-de-donnees-block-1 .view-base-de-donnees .view-filters #views-exposed-form-base-de-donnees-block-1 .js-form-type-select select {
background-color: white;
border: none;
width: 50%;
padding-bottom: 0.2rem;
}
@media (max-width: 810px) {
.path-ressources .layout-content .region-content #block-contenudelapageprincipale .layout--onecol .layout__region--content .block-region-content .block-views-blockbase-de-donnees-block-1 .view-base-de-donnees .view-filters #views-exposed-form-base-de-donnees-block-1 .js-form-type-select select {
width: 100%;
}
}
.path-ressources .layout-content .region-content #block-contenudelapageprincipale .layout--onecol .layout__region--content .block-region-content .block-views-blockbase-de-donnees-block-1 .view-base-de-donnees .view-filters #views-exposed-form-base-de-donnees-block-1 .js-form-type-textfield {
flex-direction: column;
padding-top: 0.8rem;
}
.path-ressources .layout-content .region-content #block-contenudelapageprincipale .layout--onecol .layout__region--content .block-region-content .block-views-blockbase-de-donnees-block-1 .view-base-de-donnees .view-filters #views-exposed-form-base-de-donnees-block-1 .js-form-type-textfield label {
text-transform: lowercase;
padding-bottom: 0.2rem;
flex: 2 1 auto;
}
.path-ressources .layout-content .region-content #block-contenudelapageprincipale .layout--onecol .layout__region--content .block-region-content .block-views-blockbase-de-donnees-block-1 .view-base-de-donnees .view-filters #views-exposed-form-base-de-donnees-block-1 .js-form-type-textfield input {
flex: 2 1 auto;
max-width: 55%;
}
@media (max-width: 810px) {
.path-ressources .layout-content .region-content #block-contenudelapageprincipale .layout--onecol .layout__region--content .block-region-content .block-views-blockbase-de-donnees-block-1 .view-base-de-donnees .view-filters #views-exposed-form-base-de-donnees-block-1.js-form-item {
flex-direction: column;
}
} }
.path-ressources .layout-content .region-content #block-contenudelapageprincipale .layout--onecol .layout__region--content .block-region-content .block-views-blockbase-de-donnees-block-1 .view-base-de-donnees .view-filters #views-exposed-form-base-de-donnees-block-1 #edit-actions { .path-ressources .layout-content .region-content #block-contenudelapageprincipale .layout--onecol .layout__region--content .block-region-content .block-views-blockbase-de-donnees-block-1 .view-base-de-donnees .view-filters #views-exposed-form-base-de-donnees-block-1 #edit-actions {
display: flex; display: flex;
@@ -5527,21 +5600,17 @@ svg.ext {
margin-top: 1rem; margin-top: 1rem;
} }
} }
.path-ressources .layout-content .region-content #block-contenudelapageprincipale .layout--onecol .layout__region--content .block-region-content .block-views-blockbase-de-donnees-block-1 .view-base-de-donnees .view-filters .form-item {
margin-bottom: 1rem;
}
.path-ressources .layout-content .region-content #block-contenudelapageprincipale .layout--onecol .layout__region--content .block-region-content .block-views-blockbase-de-donnees-block-1 .view-base-de-donnees .view-content { .path-ressources .layout-content .region-content #block-contenudelapageprincipale .layout--onecol .layout__region--content .block-region-content .block-views-blockbase-de-donnees-block-1 .view-base-de-donnees .view-content {
width: 100%;
display: flex; display: flex;
flex-direction: row; flex-direction: row;
flex-wrap: wrap; flex-wrap: wrap;
width: 100%;
} }
.path-ressources .layout-content .region-content #block-contenudelapageprincipale .layout--onecol .layout__region--content .block-region-content .block-views-blockbase-de-donnees-block-1 .view-base-de-donnees .view-content .view-type-ressource-slide:not(footer) { .path-ressources .layout-content .region-content #block-contenudelapageprincipale .layout--onecol .layout__region--content .block-region-content .block-views-blockbase-de-donnees-block-1 .view-base-de-donnees .view-content .view-type-ressource-slide:not(footer) {
width: 100%; width: 100%;
padding-top: 1rem; padding-top: 1rem;
} }
.path-ressources .layout-content .region-content #block-contenudelapageprincipale .layout--onecol .layout__region--content .block-region-content .block-views-blockbase-de-donnees-block-1 .view-base-de-donnees .view-content .view-type-ressource-slide:not(footer) h3 { .path-ressources .layout-content .region-content #block-contenudelapageprincipale .layout--onecol .layout__region--content .block-region-content .block-views-blockbase-de-donnees-block-1 .view-base-de-donnees .view-content .view-type-ressource-slide:not(footer) h3 {
margin-left: 25%;
text-transform: uppercase; text-transform: uppercase;
} }
.path-ressources .layout-content .region-content #block-contenudelapageprincipale .layout--onecol .layout__region--content .block-region-content .block-views-blockbase-de-donnees-block-1 .view-base-de-donnees .view-content .view-type-ressource-slide:not(footer) h3 a { .path-ressources .layout-content .region-content #block-contenudelapageprincipale .layout--onecol .layout__region--content .block-region-content .block-views-blockbase-de-donnees-block-1 .view-base-de-donnees .view-content .view-type-ressource-slide:not(footer) h3 a {
@@ -5569,7 +5638,6 @@ svg.ext {
padding-right: 1rem; padding-right: 1rem;
} }
.path-ressources .layout-content .region-content #block-contenudelapageprincipale .layout--onecol .layout__region--content .block-region-content .block-views-blockbase-de-donnees-block-1 .view-base-de-donnees .view-content .view-type-ressource-slide:not(footer) .views-row-wrapper { .path-ressources .layout-content .region-content #block-contenudelapageprincipale .layout--onecol .layout__region--content .block-region-content .block-views-blockbase-de-donnees-block-1 .view-base-de-donnees .view-content .view-type-ressource-slide:not(footer) .views-row-wrapper {
margin-left: 25%;
display: flex; display: flex;
flex-direction: row; flex-direction: row;
} }
web/themes/custom/eql/scss/pages/ressources.scss
+75 -11
View File
@@ -113,20 +113,25 @@
order: 3; order: 3;
} }
.view-base-de-donnees{ .view-base-de-donnees{
// display: flex; display: grid;
// flex-direction: row; grid-template-columns: 20% 75%;
gap: 2rem;
.view-filters{ .view-filters{
position: sticky; position: sticky;
align-self: start;
top: 13rem; top: 13rem;
left: 0; left: 0;
width: 15%;
background-color: $white; background-color: $white;
margin-top: 2rem; margin-top: 2rem;
// margin-left: 1rem;
margin-bottom: 5rem; margin-bottom: 5rem;
padding: 1rem; padding: 1rem;
padding-left: 2rem; padding-left: 2rem;
padding-right: 3rem; padding-right: 3rem;
@media (max-width: 810px) {
position: static;
margin-bottom: 2rem;
}
@media (max-width: 479px) { @media (max-width: 479px) {
margin-left: 0; margin-left: 0;
} }
@@ -148,13 +153,75 @@
@media (max-width: 479px){ @media (max-width: 479px){
justify-content: center; justify-content: center;
} }
.js-form-item{ .js-form-item{
display: flex; display: flex;
flex-direction: column; flex-direction: column;
max-width: 100%; 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{ #edit-actions{
display: flex; display: flex;
flex-direction: column; flex-direction: column;
@@ -194,20 +261,18 @@
} }
} }
.form-item{
margin-bottom: 1rem;
}
} }
.view-content{ .view-content{
width: 100%;
display: flex; display: flex;
flex-direction: row; flex-direction: row;
flex-wrap: wrap; flex-wrap: wrap;
width: 100%;
.view-type-ressource-slide:not(footer){ .view-type-ressource-slide:not(footer){
width: 100%; width: 100%;
padding-top: 1rem; padding-top: 1rem;
h3{ h3{
margin-left: 25%;
text-transform: uppercase; text-transform: uppercase;
a{color: rgb(9, 57, 139) !important;} a{color: rgb(9, 57, 139) !important;}
} }
@@ -241,7 +306,6 @@
} }
} }
.views-row-wrapper{ .views-row-wrapper{
margin-left: 25%;
display: flex; display: flex;
flex-direction: row; flex-direction: row;