bachir/drupal-reha
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

design actus

Browse Source
This commit is contained in:
ouidade
2024-08-07 19:17:51 +02:00
parent 869db4c869
commit 1dc1b04302
6 changed files with 191 additions and 149 deletions
Download Patch File Download Diff File Expand all files Collapse all files
web/themes/custom/reha/dist/bundle.js
Vendored
+1 -1
View File
File diff suppressed because one or more lines are too long
web/themes/custom/reha/dist/css/bundle.css
Vendored
+49 -31
View File
@@ -2544,72 +2544,78 @@ html.js body.node-type-operation.node-id-7 div.dialog-off-canvas-main-canvas div
margin: auto; margin: auto;
} }
.block-views-blockactus-block-1 .view-id-actus .views-row { .block-views-blockactus-block-1 .view-id-actus .views-row {
width: 30vw !important; width: 35vw !important;
margin-left: 1rem; margin-left: 1rem;
} }
.block-views-blockactus-block-1 .view-id-actus .views-row:first-of-type { .block-views-blockactus-block-1 .view-id-actus .views-row:first-of-type {
padding-left: 15%; padding-left: 15%;
} }
.block-views-blockactus-block-1 .view-id-actus .views-row .node-type-actualite { .block-views-blockactus-block-1 .view-id-actus .views-row .node-type-actualite {
width: 84%;
display: flex;
flex-direction: column;
height: 100%;
}
.block-views-blockactus-block-1 .view-id-actus .views-row .node-type-actualite p.field__item {
display: none;
}
.block-views-blockactus-block-1 .view-id-actus .views-row .node-type-actualite .image-actualite {
width: 80%;
height: 250px;
margin-left: 1rem;
}
.block-views-blockactus-block-1 .view-id-actus .views-row .node-type-actualite .image-actualite .field--name-field-image {
height: 100%;
}
.block-views-blockactus-block-1 .view-id-actus .views-row .node-type-actualite .image-actualite .field--name-field-image .field__items {
height: 100%;
}
.block-views-blockactus-block-1 .view-id-actus .views-row .node-type-actualite .image-actualite .field--name-field-image .field__items .field__item {
width: 100%; width: 100%;
height: 100%; height: 100%;
} }
.block-views-blockactus-block-1 .view-id-actus .views-row .node-type-actualite .image-actualite .field--name-field-image .field__items .field__item img { .block-views-blockactus-block-1 .view-id-actus .views-row .node-type-actualite > .entete_actu {
display: flex;
flex-direction: column;
}
.block-views-blockactus-block-1 .view-id-actus .views-row .node-type-actualite > .entete_actu p.field__item {
display: none;
}
.block-views-blockactus-block-1 .view-id-actus .views-row .node-type-actualite > .entete_actu .image-actualite {
width: 75%;
height: 250px;
right: 10%;
position: relative;
}
.block-views-blockactus-block-1 .view-id-actus .views-row .node-type-actualite > .entete_actu .image-actualite .field--name-field-image {
height: 100%;
}
.block-views-blockactus-block-1 .view-id-actus .views-row .node-type-actualite > .entete_actu .image-actualite .field--name-field-image .field__items {
height: 100%;
}
.block-views-blockactus-block-1 .view-id-actus .views-row .node-type-actualite > .entete_actu .image-actualite .field--name-field-image .field__items .field__item {
width: 100%;
height: 100%;
}
.block-views-blockactus-block-1 .view-id-actus .views-row .node-type-actualite > .entete_actu .image-actualite .field--name-field-image .field__items .field__item img {
width: 100%; width: 100%;
height: auto; height: auto;
object-fit: cover; object-fit: cover;
height: 100%; height: 100%;
} }
.block-views-blockactus-block-1 .view-id-actus .views-row .node-type-actualite .infos-content { .block-views-blockactus-block-1 .view-id-actus .views-row .node-type-actualite > .entete_actu .infos-content {
position: relative; position: relative;
display: flex; display: flex;
flex-direction: column; flex-direction: column;
border: solid #fdc300 1px; border: solid #fdc300 1px;
background-color: rgb(255, 255, 255); background-color: rgb(255, 255, 255);
padding: 1rem; padding: 1rem;
width: 100%;
right: 0%;
height: auto;
} }
.block-views-blockactus-block-1 .view-id-actus .views-row .node-type-actualite .infos-content h2 { .block-views-blockactus-block-1 .view-id-actus .views-row .node-type-actualite > .entete_actu .infos-content h2 {
order: 2; order: 2;
margin: 0; margin: 0;
font-size: 1.5rem; font-size: 1.5rem;
font-weight: 600; font-weight: 600;
padding: 0; padding: 0;
} }
.block-views-blockactus-block-1 .view-id-actus .views-row .node-type-actualite .infos-content .field--name-field-sous-titre { .block-views-blockactus-block-1 .view-id-actus .views-row .node-type-actualite > .entete_actu .infos-content .field--name-field-sous-titre {
order: 3; order: 3;
font-size: 1.3rem; font-size: 1.3rem;
} }
.block-views-blockactus-block-1 .view-id-actus .views-row .node-type-actualite .infos-content .field--name-field-date { .block-views-blockactus-block-1 .view-id-actus .views-row .node-type-actualite > .entete_actu .infos-content .field--name-field-date {
order: 4; order: 4;
font-weight: 900; font-weight: 900;
padding-bottom: 1rem; padding-bottom: 1rem;
} }
.block-views-blockactus-block-1 .view-id-actus .views-row .node-type-actualite .infos-content .field--name-field-type-d-actualite { .block-views-blockactus-block-1 .view-id-actus .views-row .node-type-actualite > .entete_actu .infos-content .field--name-field-type-d-actualite {
order: 1; order: 1;
text-transform: uppercase; text-transform: uppercase;
font-size: 1.2rem; font-size: 1.2rem;
} }
.block-views-blockactus-block-1 .view-id-actus .views-row .node-type-actualite .infos-content .field--name-field-site { .block-views-blockactus-block-1 .view-id-actus .views-row .node-type-actualite > .entete_actu .infos-content .field--name-field-site {
order: 5; order: 5;
background-color: rgb(153, 147, 174); background-color: rgb(153, 147, 174);
color: white; color: white;
@@ -2617,18 +2623,18 @@ html.js body.node-type-operation.node-id-7 div.dialog-off-canvas-main-canvas div
width: fit-content; width: fit-content;
padding: 0.2rem 0.9rem; padding: 0.2rem 0.9rem;
} }
.block-views-blockactus-block-1 .view-id-actus .views-row .node-type-actualite .infos-content .field--name-field-site .field__item { .block-views-blockactus-block-1 .view-id-actus .views-row .node-type-actualite > .entete_actu .infos-content .field--name-field-site .field__item {
display: inline; display: inline;
color: white; color: white;
font-weight: 900; font-weight: 900;
font-size: 0.8rem; font-size: 0.8rem;
vertical-align: top; vertical-align: top;
} }
.block-views-blockactus-block-1 .view-id-actus .views-row .node-type-actualite .infos-content ul.links { .block-views-blockactus-block-1 .view-id-actus .views-row .node-type-actualite > .entete_actu .infos-content ul.links {
order: 6; order: 6;
display: none; display: none;
} }
.block-views-blockactus-block-1 .view-id-actus .views-row .node-type-actualite .body-content { .block-views-blockactus-block-1 .view-id-actus .views-row .node-type-actualite > .entete_actu .body-content {
display: none; display: none;
} }
.block-views-blockactus-block-1 .view-id-actus .slick-dots { .block-views-blockactus-block-1 .view-id-actus .slick-dots {
@@ -3316,3 +3322,15 @@ html.js body.node-type-operation.node-id-7 div.dialog-off-canvas-main-canvas div
.page-mon-espace-de-travail .layout-content .js-form-type-textfield label { .page-mon-espace-de-travail .layout-content .js-form-type-textfield label {
margin-right: 1rem; margin-right: 1rem;
} }
.page-actualites .node-type-actualite {
width: 30vw !important;
}
.page-actualites .node-type-actualite .entete_actu {
flex-direction: column;
}
.page-actualites .node-type-actualite .entete_actu .infos-content {
width: 100%;
height: 250px;
right: 0;
}
web/themes/custom/reha/js/reha.js
+45 -45
View File
@@ -135,13 +135,13 @@ jQuery(document).ready(function($){
$(document).ready(function(){ $(document).ready(function(){
$('.view-id-actus.view-display-id-block_1 ').slick({ $('.view-id-actus.view-display-id-block_1 ').slick({
// slidesToShow: 1, slidesToShow: 1,
// slidesToScroll: 1, slidesToScroll: 1,
// dots: true, // dots: true,
arrows: true, arrows: true,
// centerMode: true, // centerMode: true,
draggable: true, draggable: true,
// centerPadding: '100px', centerPadding: '100px',
responsive: [ responsive: [
{ {
breakpoint: 810, breakpoint: 810,
@@ -188,53 +188,53 @@ jQuery(document).ready(function($){
// ///////////////// // /////////////////
//// ancre dans texte au click parragraphe correspondant arrive en dessous du header //// ancre dans texte au click parragraphe correspondant arrive en dessous du header
function adjustAnchor() { function adjustAnchor() {
var $anchor = $(window.location.hash); // Select the anchor element based on the hash in the URL var $anchor = $(window.location.hash); // Select the anchor element based on the hash in the URL
var fixedElementHeight = $('.block-region-first').outerHeight(); // Get the height of the sticky element var fixedElementHeight = $('.block-region-first').outerHeight(); // Get the height of the sticky element
if ($anchor.length > 0) { if ($anchor.length > 0) {
$('html, body').stop().animate({ $('html, body').stop().animate({
scrollTop: $anchor.offset().top - fixedElementHeight // Adjust the scroll position to account for the sticky element height scrollTop: $anchor.offset().top - fixedElementHeight // Adjust the scroll position to account for the sticky element height
}, 0); }, 0);
} }
}
// Call the function on page load if there's a hash
if (window.location.hash) {
adjustAnchor();
}
// Adjust the anchor on hash change
$(window).on('hashchange', function() {
adjustAnchor();
});
//////////////////////////////////////////
// menu ancre paragraphe quand actif
jQuery(function($) {
// Function to set the active class based on the current path
function setActiveLink() {
var path = window.location.href;
console.log(path);
$(".layout__region--first .block-region-first li a").each(function() {
if (this.href === path) {
$(this).closest('a').addClass('active');
}
});
} }
// Initially set the active link based on the current URL // Call the function on page load if there's a hash
setActiveLink(); if (window.location.hash) {
adjustAnchor();
}
// Update the active link on click // Adjust the anchor on hash change
$(".layout__region--first .block-region-first li a").on('click', function() { $(window).on('hashchange', function() {
$(".layout__region--first .block-region-first li a").removeClass('active'); adjustAnchor();
$(this).addClass('active'); });
//////////////////////////////////////////
// menu ancre paragraphe quand actif
jQuery(function($) {
// Function to set the active class based on the current path
function setActiveLink() {
var path = window.location.href;
console.log(path);
$(".layout__region--first .block-region-first li a").each(function() {
if (this.href === path) {
$(this).closest('a').addClass('active');
}
});
}
// Initially set the active link based on the current URL
setActiveLink();
// Update the active link on click
$(".layout__region--first .block-region-first li a").on('click', function() {
$(".layout__region--first .block-region-first li a").removeClass('active');
$(this).addClass('active');
});
}); });
});
})(jQuery, window); })(jQuery, window);
web/themes/custom/reha/scss/pages/home/home-view-actualites.scss
+76 -66
View File
@@ -16,92 +16,102 @@
width: 100%; width: 100%;
margin: auto; margin: auto;
.views-row{ .views-row{
width: 30vw !important; width: 35vw !important;
margin-left: 1rem; margin-left: 1rem;
&:first-of-type{ &:first-of-type{
padding-left: 15%; padding-left: 15%;
} }
.node-type-actualite{ .node-type-actualite{
width: 84%; width: 100%;
display: flex; // display: flex;
flex-direction: column; // flex-direction: column;
height: 100%; height: 100%;
p.field__item{ > .entete_actu{
display: none; display: flex;
} flex-direction: column;
.image-actualite{ p.field__item{
width: 80%; display: none;
height: 250px; }
margin-left: 1rem; .image-actualite{
.field--name-field-image{ width: 75%;
height: 100%; height: 250px;
.field__items{ right: 10%;
position: relative;
// margin-left: 1rem;
.field--name-field-image{
height: 100%; height: 100%;
.field__item{ .field__items{
width: 100%;
height: 100%; height: 100%;
img{ .field__item{
width: 100%; width: 100%;
height: auto;
object-fit: cover;
height: 100%; height: 100%;
img{
width: 100%;
height: auto;
object-fit: cover;
height: 100%;
}
} }
} }
} }
} }
} .infos-content{
.infos-content{ position: relative;
position: relative; display: flex;
display: flex; flex-direction: column;
flex-direction: column; border: solid $yellow-puca 1px;
border: solid $yellow-puca 1px; background-color: $white-button;
background-color: $white-button; padding: 1rem;
padding: 1rem; width: 100%;
h2{ right: 0%;
order: 2; height: auto;
margin: 0; h2{
font-size: 1.5rem; order: 2;
font-weight: 600; margin: 0;
padding: 0;; font-size: 1.5rem;
} font-weight: 600;
.field--name-field-sous-titre { padding: 0;;
order: 3; }
font-size: 1.3rem; .field--name-field-sous-titre {
} order: 3;
.field--name-field-date{ font-size: 1.3rem;
order: 4; }
font-weight: 900; .field--name-field-date{
padding-bottom: 1rem; order: 4;
}
.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-weight: 900;
font-size: 0.8rem; padding-bottom: 1rem;
vertical-align: top; }
.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;
} }
} }
ul.links{ .body-content{
order: 6;
display: none; display: none;
} }
} }
.body-content{
display: none;
}
} }
} }
.slick-dots{ .slick-dots{
web/themes/custom/reha/scss/pages/page-actualites.scss
+13
View File
@@ -0,0 +1,13 @@
.page-actualites{
.node-type-actualite{
width: 30vw !important;
.entete_actu{
flex-direction: column;
.infos-content{
width: 100%;
height: 250px;
right: 0;
}
}
}
}
web/themes/custom/reha/scss/reha.scss
+1
View File
@@ -43,3 +43,4 @@
@import "pages/actualites"; @import "pages/actualites";
@import "pages/node-actualite"; @import "pages/node-actualite";
@import "pages/page-mon-espace-de-travail"; @import "pages/page-mon-espace-de-travail";
@import "pages/page-actualites";