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

@media home

Browse Source
This commit is contained in:
ouidade
2023-07-13 13:18:44 +02:00
parent cf892433b4
commit 654fd62898
3 changed files with 103 additions and 34 deletions
Download Patch File Download Diff File Expand all files Collapse all files
web/themes/custom/eql/css-compiled/styles.css
+47 -6
View File
@@ -427,26 +427,35 @@ a {
height: 600px; height: 600px;
border-bottom: 5px solid #009ee3; border-bottom: 5px solid #009ee3;
background: rgba(0, 158, 227, 0.2); } background: rgba(0, 158, 227, 0.2); }
@media (max-width: 792px) {
.path-frontpage .block-views-blockactus-blocks-pages-block-1 {
max-height: 500px; } }
@media (max-width: 724px) {
.path-frontpage .block-views-blockactus-blocks-pages-block-1 {
max-height: 470px; } }
.path-frontpage .block-views-blockactus-blocks-pages-block-1 div { .path-frontpage .block-views-blockactus-blocks-pages-block-1 div {
height: 100%; } height: 100%; }
.path-frontpage .block-views-blockactus-blocks-pages-block-1 div .view-actus-blocks-pages { .path-frontpage .block-views-blockactus-blocks-pages-block-1 div .view-actus-blocks-pages {
height: 100%; } height: 100%; }
.path-frontpage .block-views-blockactus-blocks-pages-block-1 div .view-actus-blocks-pages .view-content { .path-frontpage .block-views-blockactus-blocks-pages-block-1 div .view-actus-blocks-pages .view-content {
height: 90%; } height: 90%; }
@media (max-width: 479px) {
.path-frontpage .block-views-blockactus-blocks-pages-block-1 div .view-actus-blocks-pages .view-content {
display: flex;
flex-direction: column;
width: 80%; } }
.path-frontpage .block-views-blockactus-blocks-pages-block-1 div .view-actus-blocks-pages .view-content .views-row .node-type-actualite { .path-frontpage .block-views-blockactus-blocks-pages-block-1 div .view-actus-blocks-pages .view-content .views-row .node-type-actualite {
color: black; color: black;
line-height: 1.5rem; line-height: 1.5rem;
width: 80%; width: 80%;
height: 600px; height: 600px;
margin: auto; } margin: auto; }
@media (max-width: 680px) {
.path-frontpage .block-views-blockactus-blocks-pages-block-1 div .view-actus-blocks-pages .view-content .views-row .node-type-actualite {
width: 65%; } }
.path-frontpage .block-views-blockactus-blocks-pages-block-1 div .view-actus-blocks-pages .view-content .views-row .node-type-actualite div:first-child { .path-frontpage .block-views-blockactus-blocks-pages-block-1 div .view-actus-blocks-pages .view-content .views-row .node-type-actualite div:first-child {
display: grid; display: grid;
grid-template-columns: 1fr repeat(9, 1fr) 1fr; } grid-template-columns: 1fr repeat(9, 1fr) 1fr; }
@media (max-width: 680px) {
.path-frontpage .block-views-blockactus-blocks-pages-block-1 div .view-actus-blocks-pages .view-content .views-row .node-type-actualite div:first-child {
display: flex;
flex-direction: column;
height: fit-content; } }
.path-frontpage .block-views-blockactus-blocks-pages-block-1 div .view-actus-blocks-pages .view-content .views-row .node-type-actualite div:first-child .field--name-field-images { .path-frontpage .block-views-blockactus-blocks-pages-block-1 div .view-actus-blocks-pages .view-content .views-row .node-type-actualite div:first-child .field--name-field-images {
order: 1; order: 1;
grid-column: 1 /span 9; grid-column: 1 /span 9;
@@ -454,7 +463,25 @@ a {
.path-frontpage .block-views-blockactus-blocks-pages-block-1 div .view-actus-blocks-pages .view-content .views-row .node-type-actualite div:first-child .field--name-field-images .field__item img { .path-frontpage .block-views-blockactus-blocks-pages-block-1 div .view-actus-blocks-pages .view-content .views-row .node-type-actualite div:first-child .field--name-field-images .field__item img {
width: inherit; width: inherit;
max-height: 550px; max-height: 550px;
object-fit: cover; } object-fit: cover;
padding-left: 1rem; }
@media (max-width: 852px) {
.path-frontpage .block-views-blockactus-blocks-pages-block-1 div .view-actus-blocks-pages .view-content .views-row .node-type-actualite div:first-child .field--name-field-images .field__item img {
max-height: 500px; } }
@media (max-width: 792px) {
.path-frontpage .block-views-blockactus-blocks-pages-block-1 div .view-actus-blocks-pages .view-content .views-row .node-type-actualite div:first-child .field--name-field-images .field__item img {
max-height: 450px; } }
@media (max-width: 724px) {
.path-frontpage .block-views-blockactus-blocks-pages-block-1 div .view-actus-blocks-pages .view-content .views-row .node-type-actualite div:first-child .field--name-field-images .field__item img {
max-height: 400px; } }
@media (max-width: 680px) {
.path-frontpage .block-views-blockactus-blocks-pages-block-1 div .view-actus-blocks-pages .view-content .views-row .node-type-actualite div:first-child .field--name-field-images .field__item img {
height: 200px;
object-fit: contain;
max-width: 70vw;
margin: auto;
padding-left: 0;
padding-bottom: 1rem; } }
.path-frontpage .block-views-blockactus-blocks-pages-block-1 div .view-actus-blocks-pages .view-content .views-row .node-type-actualite div:first-child .field--name-field-date { .path-frontpage .block-views-blockactus-blocks-pages-block-1 div .view-actus-blocks-pages .view-content .views-row .node-type-actualite div:first-child .field--name-field-date {
grid-column: 9 / span 9; grid-column: 9 / span 9;
grid-row: 2; grid-row: 2;
@@ -479,6 +506,12 @@ a {
.path-frontpage .block-views-blockactus-blocks-pages-block-1 div .view-actus-blocks-pages .view-content .views-row .node-type-actualite div:first-child .field--name-field-lieu::before { .path-frontpage .block-views-blockactus-blocks-pages-block-1 div .view-actus-blocks-pages .view-content .views-row .node-type-actualite div:first-child .field--name-field-lieu::before {
content: " | "; content: " | ";
margin-right: 2rem; } margin-right: 2rem; }
@media (max-width: 534px) {
.path-frontpage .block-views-blockactus-blocks-pages-block-1 div .view-actus-blocks-pages .view-content .views-row .node-type-actualite div:first-child .field--name-field-lieu::before {
display: none; } }
@media (max-width: 534px) {
.path-frontpage .block-views-blockactus-blocks-pages-block-1 div .view-actus-blocks-pages .view-content .views-row .node-type-actualite div:first-child .field--name-field-lieu {
order: 2; } }
.path-frontpage .block-views-blockactus-blocks-pages-block-1 div .view-actus-blocks-pages .view-content .views-row .node-type-actualite div:first-child .field--name-title { .path-frontpage .block-views-blockactus-blocks-pages-block-1 div .view-actus-blocks-pages .view-content .views-row .node-type-actualite div:first-child .field--name-title {
display: inline-flex; display: inline-flex;
grid-column: 9 / span 9; grid-column: 9 / span 9;
@@ -552,6 +585,9 @@ a {
align-items: center; } align-items: center; }
.path-frontpage .block-views-blockhome-nodes-block-2 .view-display-id-block_2:is(.view-id-home_nodes) .node-type-static .inline.links a:after { .path-frontpage .block-views-blockhome-nodes-block-2 .view-display-id-block_2:is(.view-id-home_nodes) .node-type-static .inline.links a:after {
content: url('data:image/svg+xml,<svg width="40" height="20" xmlns="http://www.w3.org/2000/svg" version="1.1"><polyline points="71.9,49 24.3,49 24.3,51 71.9,51 58.1,64.8 59.5,66.2 75.7,50 59.5,33.8 58.1,35.2" transform="scale(0.5) translate(0,-25)" fill="rgb(0,158,227)" stroke="rgb(0,158,227)" stroke-width="0.7"/></svg>'); } content: url('data:image/svg+xml,<svg width="40" height="20" xmlns="http://www.w3.org/2000/svg" version="1.1"><polyline points="71.9,49 24.3,49 24.3,51 71.9,51 58.1,64.8 59.5,66.2 75.7,50 59.5,33.8 58.1,35.2" transform="scale(0.5) translate(0,-25)" fill="rgb(0,158,227)" stroke="rgb(0,158,227)" stroke-width="0.7"/></svg>'); }
@media (max-width: 479px) {
.path-frontpage .block-views-blockhome-nodes-block-2 .view-display-id-block_2:is(.view-id-home_nodes) .node-type-static .field--name-field-images {
width: 100%; } }
.path-frontpage .block-views-blockhome-nodes-block-2 .view-display-id-block_2:is(.view-id-home_nodes) .node-type-static .field--name-field-images .field__item img { .path-frontpage .block-views-blockhome-nodes-block-2 .view-display-id-block_2:is(.view-id-home_nodes) .node-type-static .field--name-field-images .field__item img {
width: 15rem; width: 15rem;
height: auto; } height: auto; }
@@ -560,6 +596,11 @@ a {
.path-frontpage .block-views-blockhome-nodes-block-2 .view-display-id-block_2:is(.view-id-home_nodes) .node-type-static .field--name-field-accroche { .path-frontpage .block-views-blockhome-nodes-block-2 .view-display-id-block_2:is(.view-id-home_nodes) .node-type-static .field--name-field-accroche {
flex: 1 1 50px; flex: 1 1 50px;
padding-left: 1rem; } padding-left: 1rem; }
@media (max-width: 534px) {
.path-frontpage .block-views-blockhome-nodes-block-2 .view-display-id-block_2:is(.view-id-home_nodes) .node-type-static .field--name-field-accroche {
padding-left: 0em;
flex: 1 1 100%;
padding-right: 1rem; } }
@media (max-width: 479px) { @media (max-width: 479px) {
.path-frontpage .block-views-blockhome-nodes-block-2 .view-display-id-block_2:is(.view-id-home_nodes) .node-type-static .field--name-field-accroche { .path-frontpage .block-views-blockhome-nodes-block-2 .view-display-id-block_2:is(.view-id-home_nodes) .node-type-static .field--name-field-accroche {
padding-left: 0em; } } padding-left: 0em; } }
web/themes/custom/eql/scripts/main.js
-13
View File
@@ -162,12 +162,8 @@ jQuery(function($) {
// slideshow home // marche pas. attention ai rajouter des class dans template views.view.html.twig et views-view-actus-blocks-pages--block-1.html.twig // slideshow home // marche pas. attention ai rajouter des class dans template views.view.html.twig et views-view-actus-blocks-pages--block-1.html.twig
(function($, window) { (function($, window) {
console.log('hello') console.log('hello')
$(document).ready(function(){ $(document).ready(function(){
// if ('.view-id-actus_blocks_pages view-display-id-block_1'){
$('.path-frontpage .view-actus-blocks-pages .view-content').slick({ $('.path-frontpage .view-actus-blocks-pages .view-content').slick({
slidesToShow: 1, slidesToShow: 1,
// slidesToScroll: 1, // slidesToScroll: 1,
@@ -185,16 +181,11 @@ jQuery(function($) {
}] }]
}); });
console.log('salut slick home'); console.log('salut slick home');
$('.page-node-type-actualite .block-entity-fieldnodefield-images .field--type-image').slick({ $('.page-node-type-actualite .block-entity-fieldnodefield-images .field--type-image').slick({
dots: true, dots: true,
arrows: false, arrows: false,
}); });
console.log('salut slick actus'); console.log('salut slick actus');
$('.page-node-type-projet .block-entity-fieldnodefield-photo .field--type-image').slick({ $('.page-node-type-projet .block-entity-fieldnodefield-photo .field--type-image').slick({
slidesToShow: 1, slidesToShow: 1,
dots: true, dots: true,
@@ -203,10 +194,6 @@ jQuery(function($) {
adaptiveHeight: true, adaptiveHeight: true,
}); });
console.log('salut slick projets'); console.log('salut slick projets');
}); });
// console.log('salut slick actus');
})(jQuery, window); })(jQuery, window);
web/themes/custom/eql/scss/pages/_home.scss
+56 -15
View File
@@ -9,6 +9,12 @@
height: 600px; height: 600px;
border-bottom: 5px solid $blue-light; border-bottom: 5px solid $blue-light;
background: $background-actus; background: $background-actus;
@media(max-width:792px){
max-height: 500px;
}
@media(max-width:724px){
max-height: 470px;
}
div{ div{
height: 100%; height: 100%;
.view-actus-blocks-pages{ .view-actus-blocks-pages{
@@ -18,37 +24,58 @@
// flex-basis: auto; // flex-basis: auto;
height: 90%; height: 90%;
@media (max-width: 479px){ // @media (max-width: 479px){
display: flex; // display: flex;
flex-direction: column; // flex-direction: column;
width: 80%; // width: 80%;
} // }
.views-row{ .views-row{
// width: 80%;
// margin: auto;
.node-type-actualite{ .node-type-actualite{
color: $black; color: $black;
line-height: 1.5rem; line-height: 1.5rem;
width: 80%; width: 80%;
height: 600px; height: 600px;
margin: auto; margin: auto;
@media (max-width: 680px){
// background-color: burlywood; width: 65%;
}
div:first-child{ // block actu dans le bandeau div:first-child{ // block actu dans le bandeau
// display: flex;
// flex-direction: column;
// flex-wrap: wrap;
display: grid; display: grid;
grid-template-columns: 1fr repeat(9, 1fr) 1fr; grid-template-columns: 1fr repeat(9, 1fr) 1fr;
@media (max-width: 680px){
display: flex;
flex-direction: column;
height: fit-content;
}
.field--name-field-images { .field--name-field-images {
order: 1; order: 1;
grid-column: 1 /span 9; grid-column: 1 /span 9;
grid-row: 1 / span 6; grid-row: 1 / span 6;
.field__item img{ .field__item img{
width: inherit; width: inherit;
max-height: 550px; max-height: 550px;
object-fit: cover; object-fit: cover;
padding-left: 1rem;
@media(max-width:852px){
max-height: 500px;
}
@media(max-width:792px){
max-height: 450px;
}
@media(max-width:724px){
max-height: 400px;
}
@media (max-width: 680px){
height: 200px;
object-fit: contain;
max-width: 70vw;
margin: auto;
padding-left: 0;
padding-bottom: 1rem;
}
} }
} }
@@ -94,6 +121,12 @@
&::before{ &::before{
content: " | "; content: " | ";
margin-right: 2rem; margin-right: 2rem;
@media (max-width: 534px){
display: none;
}
}
@media (max-width: 534px){
order: 2;
} }
} }
@@ -257,6 +290,9 @@
} }
.field--name-field-images{ .field--name-field-images{
// grid-column: 2 / 4; // grid-column: 2 / 4;
@media (max-width: 479px) {
width: 100%;
}
.field__item{ .field__item{
img{ img{
width: 15rem; width: 15rem;
@@ -271,9 +307,14 @@
flex: 1 1 50px; flex: 1 1 50px;
// grid-column: 4 / 9; // grid-column: 4 / 9;
padding-left: 1rem; padding-left: 1rem;
@media (max-width: 534px){
padding-left: 0em;
flex: 1 1 100%;
padding-right: 1rem;
}
@media (max-width: 479px){ @media (max-width: 479px){
padding-left: 0em; padding-left: 0em;
} }
p{ p{
background-color: $white; background-color: $white;