diff --git a/web/themes/custom/eql/css-compiled/styles.css b/web/themes/custom/eql/css-compiled/styles.css index b335386..023c559 100644 --- a/web/themes/custom/eql/css-compiled/styles.css +++ b/web/themes/custom/eql/css-compiled/styles.css @@ -209,7 +209,7 @@ a { justify-content: flex-end; position: -webkit-sticky; position: sticky; - top: 9rem; } + top: 10rem; } @media (max-width: 810px) { .path-node.page-node-type-static .layout-container .layout-content .layout__region--first .block-region-first { display: none; } } @@ -258,7 +258,10 @@ a { margin-top: 1rem; display: flex; flex-direction: column; - width: 70%; } + width: 70%; + position: -webkit-sticky; + position: sticky; + top: 9rem; } @media (max-width: 810px) { .path-node.page-node-type-static .layout-container .layout-content .layout__region--third .block-region-third { margin: auto; } } @@ -392,7 +395,19 @@ a { grid-template-columns: 1fr repeat(4, 2fr) 1fr; grid-template-rows: repeat(4, auto); } .path-frontpage .block-region-content .block-views-blockhome-nodes-block-1 .node-type-static div:first-child .field--name-field-images { - display: none; } + grid-column: 4 / span 6; + grid-row: 2; } + .path-frontpage .block-region-content .block-views-blockhome-nodes-block-1 .node-type-static div:first-child .field--name-field-images .field__item { + display: block; + width: 400px; + height: 400px; } + @media (max-width: 1517px) { + .path-frontpage .block-region-content .block-views-blockhome-nodes-block-1 .node-type-static div:first-child .field--name-field-images .field__item { + width: 300px; + height: 300px; } } + .path-frontpage .block-region-content .block-views-blockhome-nodes-block-1 .node-type-static div:first-child .field--name-field-images .field__item img { + max-width: 100%; + max-height: 100%; } .path-frontpage .block-region-content .block-views-blockhome-nodes-block-1 .node-type-static div:first-child .field--name-field-accroche { grid-column: 2 /span 3; grid-row: 2 / span 2; @@ -419,8 +434,8 @@ a { .path-frontpage .block-region-content .block-views-blockhome-nodes-block-1 .node-type-static div:first-child .field--name-field-accroche p { margin-top: 0rem; } } .path-frontpage .block-region-content .block-views-blockhome-nodes-block-1 .node-type-static div:first-child .field--name-title { - grid-column: 4; - grid-row: 2; + grid-column: 2; + grid-row: 1 / span 2; margin-top: 3rem; } .path-frontpage .block-region-content .block-views-blockhome-nodes-block-1 .node-type-static div:first-child .field--name-title h2 { background-color: white; } diff --git a/web/themes/custom/eql/scripts/main.js b/web/themes/custom/eql/scripts/main.js index 3587768..50339f9 100644 --- a/web/themes/custom/eql/scripts/main.js +++ b/web/themes/custom/eql/scripts/main.js @@ -141,8 +141,84 @@ jQuery(function($) { // var speed = 750; // gérer la vitesse de défliement // // Ici on retranche la hauteur du bandeau (201px dans ta feuille de styles) -// document.querySelector('html, body').animate( { scrollTop: page.offset().top - 201 }, speed ); +// document.querySelector('html, body').animate( { scrollTop: page.offset().top - 500 }, speed ); // return false; // }); +// /////////////////////////////// +// (function(document, history, location) { +// var HISTORY_SUPPORT = !!(history && history.pushState); + +// var anchorScrolls = { +// ANCHOR_REGEX: /^#[^ ]+$/, +// OFFSET_HEIGHT_PX: 50, + +// /** +// * Establish events, and fix initial scroll position if a hash is provided. +// */ +// init: function() { +// this.scrollToCurrent(); +// $(window).on('hashchange', $.proxy(this, 'scrollToCurrent')); +// $('body').on('click', 'a', $.proxy(this, 'delegateAnchors')); +// }, + +// /** +// * Return the offset amount to deduct from the normal scroll position. +// * Modify as appropriate to allow for dynamic calculations +// */ +// getFixedOffset: function() { +// return this.OFFSET_HEIGHT_PX; +// }, + +// /** +// * If the provided href is an anchor which resolves to an element on the +// * page, scroll to it. +// * @param {String} href +// * @return {Boolean} - Was the href an anchor. +// */ +// scrollIfAnchor: function(href, pushToHistory) { +// var match, anchorOffset; + +// if(!this.ANCHOR_REGEX.test(href)) { +// return false; +// } + +// match = document.getElementById(href.slice(1)); + +// if(match) { +// anchorOffset = $(match).offset().top - this.getFixedOffset(); +// $('html, body').animate({ scrollTop: anchorOffset}); + +// // Add the state to history as-per normal anchor links +// if(HISTORY_SUPPORT && pushToHistory) { +// history.pushState({}, document.title, location.pathname + href); +// } +// } + +// return !!match; +// }, + +// /** +// * Attempt to scroll to the current location's hash. +// */ +// scrollToCurrent: function(e) { +// if(this.scrollIfAnchor(window.location.hash) && e) { +// e.preventDefault(); +// } +// }, + +// /** +// * If the click event's target was an anchor, fix the scroll position. +// */ +// delegateAnchors: function(e) { +// var elem = e.target; + +// if(this.scrollIfAnchor(elem.getAttribute('href'), true)) { +// e.preventDefault(); +// } +// } +// }; + +// $(document).ready($.proxy(anchorScrolls, 'init')); +// })(window.document, window.history, window.location); diff --git a/web/themes/custom/eql/scss/pages/_home.scss b/web/themes/custom/eql/scss/pages/_home.scss index 709fd3f..220a190 100644 --- a/web/themes/custom/eql/scss/pages/_home.scss +++ b/web/themes/custom/eql/scss/pages/_home.scss @@ -39,7 +39,22 @@ grid-template-columns: 1fr repeat(4, 2fr) 1fr; grid-template-rows: repeat(4, auto); .field--name-field-images{ - display: none; + // display: none; + grid-column: 4 / span 6; + grid-row: 2; + .field__item{ + display: block; + width: 400px; + height: 400px; + @media (max-width: 1517px){ + width: 300px; + height: 300px; + } + img{ + max-width:100%; + max-height: 100%; + } + } } .field--name-field-accroche{ @@ -76,8 +91,10 @@ } .field--name-title{ - grid-column: 4; - grid-row: 2; + // grid-column: 4; + // grid-row: 2; + grid-column: 2; + grid-row: 1 / span 2; margin-top: 3rem; h2{ @@ -93,6 +110,9 @@ // background-color: $white; } + } + @media (max-width: 1517px){ + } @media (max-width: 810px){ margin-top: 1rem; diff --git a/web/themes/custom/eql/scss/pages/_static.scss b/web/themes/custom/eql/scss/pages/_static.scss index f7bc631..526813d 100644 --- a/web/themes/custom/eql/scss/pages/_static.scss +++ b/web/themes/custom/eql/scss/pages/_static.scss @@ -41,7 +41,6 @@ // } } - // menu ancres a gauche .layout__region--first{ // menu ancres a gauche position: relative; @@ -50,7 +49,7 @@ justify-content: flex-end; position: -webkit-sticky; position: sticky; - top: 9rem; + top: 10rem; @media (max-width: 810px){ display: none; } @@ -123,9 +122,9 @@ display: flex; flex-direction: column; width: 70%; - // position: -webkit-sticky; - // position: sticky; - // top: 11rem; + position: -webkit-sticky; + position: sticky; + top: 9rem; @media (max-width: 810px){ margin: auto; }