From 583da4fc7051b2d221fbd80928bec968c75b46f3 Mon Sep 17 00:00:00 2001 From: Bachir Soussi Chiadmi Date: Tue, 13 Mar 2018 15:00:54 +0100 Subject: [PATCH] production menu, fixes #16 --- .../edlptheme/assets/dist/styles/app.min.css | 38 ++++++++++--------- .../custom/edlptheme/assets/styles/app.scss | 9 ++++- .../edlptheme/assets/styles/base/_layout.scss | 3 +- 3 files changed, 30 insertions(+), 20 deletions(-) diff --git a/sites/all/themes/custom/edlptheme/assets/dist/styles/app.min.css b/sites/all/themes/custom/edlptheme/assets/dist/styles/app.min.css index e8a90e957..bb0e7515a 100644 --- a/sites/all/themes/custom/edlptheme/assets/dist/styles/app.min.css +++ b/sites/all/themes/custom/edlptheme/assets/dist/styles/app.min.css @@ -1128,7 +1128,7 @@ main[role="main"] { pointer-events: auto; } footer[role="contentinfo"] { - z-index: 1; + z-index: 5; position: fixed; bottom: 0; -webkit-box-sizing: content-box; @@ -1768,28 +1768,31 @@ footer { footer .block-language ul li.is-active a { color: red; } footer #block-productions { + position: relative; pointer-events: none; } body:not(.path-productions) footer #block-productions { display: none; } footer #block-productions ul { margin-left: -3em; white-space: nowrap; } - footer #block-productions ul li a { - pointer-events: all; - background-color: #fff; - padding-right: 0.4em; } - footer #block-productions ul li a:before { - content: ""; - display: inline-block; - width: 7px; - height: 7px; - border: 1px solid red; - margin-right: 0.5em; } - footer #block-productions ul li a:hover:before { - background-color: red; } - footer #block-productions ul li a.ajax-loading:before { - -webkit-animation: rotation 2s infinite linear; - animation: rotation 2s infinite linear; } + footer #block-productions ul li { + height: 200px; } + footer #block-productions ul li a { + pointer-events: all; + background-color: #fff; + padding-right: 0.4em; } + footer #block-productions ul li a:before { + content: ""; + display: inline-block; + width: 7px; + height: 7px; + border: 1px solid red; + margin-right: 0.5em; } + footer #block-productions ul li a:hover:before { + background-color: red; } + footer #block-productions ul li a.ajax-loading:before { + -webkit-animation: rotation 2s infinite linear; + animation: rotation 2s infinite linear; } @keyframes rotation { from { @@ -1828,6 +1831,7 @@ footer { font-size: 0.756em; white-space: nowrap; } footer .block-block-edlp-entrees ul li span.oblique-wrapper { + height: 120px; display: inline-block; vertical-align: bottom; position: relative; diff --git a/sites/all/themes/custom/edlptheme/assets/styles/app.scss b/sites/all/themes/custom/edlptheme/assets/styles/app.scss index ea9d896dd..133e7780b 100644 --- a/sites/all/themes/custom/edlptheme/assets/styles/app.scss +++ b/sites/all/themes/custom/edlptheme/assets/styles/app.scss @@ -709,8 +709,9 @@ footer{ >.wrapper{ white-space: nowrap; - + // height:100%; >.region{ + // height:100%; // display: table-cell; display: inline-block; vertical-align: baseline; @@ -793,14 +794,16 @@ footer{ } #block-productions{ - + position: relative; pointer-events: none; body:not(.path-productions) & {display:none} ul{ margin-left: -3em; white-space: nowrap; + li{ + height:200px; // this is needed to respect the height of oblique links :( a{ // outline: 1px solid blue; pointer-events: all; @@ -832,6 +835,7 @@ footer{ display: inline-block; // vertical-align: top; ul{ + margin:0; white-space: nowrap; li{ @@ -840,6 +844,7 @@ footer{ white-space: nowrap; pointer-events: none; span.oblique-wrapper{ + height:120px; // this is needed to respect the height of oblique links :( display: inline-block; vertical-align: bottom; position: relative; diff --git a/sites/all/themes/custom/edlptheme/assets/styles/base/_layout.scss b/sites/all/themes/custom/edlptheme/assets/styles/base/_layout.scss index 433792e3c..56eea7a9f 100644 --- a/sites/all/themes/custom/edlptheme/assets/styles/base/_layout.scss +++ b/sites/all/themes/custom/edlptheme/assets/styles/base/_layout.scss @@ -58,11 +58,12 @@ main[role="main"]{ footer[role="contentinfo"]{ // outline: 1px solid pink; - z-index: 1; + z-index: 5; position:fixed; bottom:0; box-sizing: content-box; width:100%; + // min-height:110px; padding:0.5em 1em; }