bachir/edlp_d8
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

static footer menu is now in-line (not oblique)

Browse Source
This commit is contained in:
Bachir Soussi Chiadmi
2018-03-20 20:29:45 +01:00
parent 55a8452d49
commit 174df0818a
2 changed files with 123 additions and 72 deletions
Download Patch File Download Diff File Expand all files Collapse all files
sites/all/themes/custom/edlptheme/assets/dist/styles/app.min.css
Vendored
+48 -38
View File
@@ -1968,19 +1968,52 @@ footer {
footer > .wrapper .region-footer-right { footer > .wrapper .region-footer-right {
min-width: 12%; min-width: 12%;
text-align: right; } text-align: right; }
footer nav.block-menu { footer #block-footer {
display: inline-block; } display: inline-block;
footer nav.block-menu ul { margin-bottom: 1em; }
footer #block-footer ul {
margin: 0; margin: 0;
padding: 0; } padding: 0; }
footer nav.block-menu ul li { footer #block-footer ul li {
pointer-events: all;
display: inline-block; }
footer #block-footer ul li:first-of-type {
margin-left: 1em; }
footer #block-footer ul li a {
font-size: 0.756em; }
footer #block-footer ul li a:before {
content: "";
display: inline-block;
width: 7px;
height: 7px;
border: 1px solid black;
margin-right: 0.5em; }
footer #block-footer ul li a:hover:before, footer #block-footer ul li a.is-active:before {
background-color: black; }
footer #block-footer ul li a.ajax-loading:before {
-webkit-animation: rotation 2s infinite linear;
animation: rotation 2s infinite linear; }
@keyframes rotation {
from {
-webkit-transform: rotate(0deg);
transform: rotate(0deg); }
to {
-webkit-transform: rotate(359deg);
transform: rotate(359deg); } }
footer nav#block-productions.block-menu {
display: inline-block; }
footer nav#block-productions.block-menu ul {
margin: 0;
padding: 0; }
footer nav#block-productions.block-menu ul li {
pointer-events: all; pointer-events: all;
display: inline-block; display: inline-block;
position: relative; position: relative;
list-style: none; list-style: none;
margin: 0 1.5em 0 0; margin: 0 1.5em 0 0;
padding: 0; } padding: 0; }
footer nav.block-menu ul li a { footer nav#block-productions.block-menu ul li a {
position: absolute; position: absolute;
bottom: 0; bottom: 0;
-webkit-transform-origin: left bottom; -webkit-transform-origin: left bottom;
@@ -1992,18 +2025,18 @@ footer {
text-transform: uppercase; text-transform: uppercase;
font-size: 0.756em; font-size: 0.756em;
white-space: nowrap; } white-space: nowrap; }
footer nav.block-menu ul li:first-of-type { footer nav#block-productions.block-menu ul li:first-of-type {
margin-left: 1em; } margin-left: 1em; }
footer nav.block-menu ul li a:before { footer nav#block-productions.block-menu ul li a:before {
content: ""; content: "";
display: inline-block; display: inline-block;
width: 7px; width: 7px;
height: 7px; height: 7px;
border: 1px solid black; border: 1px solid black;
margin-right: 0.5em; } margin-right: 0.5em; }
footer nav.block-menu ul li a:hover:before, footer nav.block-menu ul li a.is-active:before { footer nav#block-productions.block-menu ul li a:hover:before, footer nav#block-productions.block-menu ul li a.is-active:before {
background-color: black; } background-color: black; }
footer nav.block-menu ul li a.ajax-loading:before { footer nav#block-productions.block-menu ul li a.ajax-loading:before {
-webkit-animation: rotation 2s infinite linear; -webkit-animation: rotation 2s infinite linear;
animation: rotation 2s infinite linear; } animation: rotation 2s infinite linear; }
@@ -2014,34 +2047,6 @@ footer {
to { to {
-webkit-transform: rotate(359deg); -webkit-transform: rotate(359deg);
transform: rotate(359deg); } } transform: rotate(359deg); } }
footer .block-language {
display: inline-block;
position: relative; }
footer .block-language ul {
position: absolute;
bottom: 0;
margin: 0;
padding: 0;
-webkit-transform-origin: left bottom;
transform-origin: left bottom;
-webkit-transform: rotateZ(-45deg);
transform: rotateZ(-45deg);
white-space: nowrap;
pointer-events: all; }
footer .block-language ul li {
margin: 0;
padding: 0;
list-style: none;
display: inline-block; }
footer .block-language ul li:last-of-type:before {
content: "/";
margin: 0 0.2em; }
footer .block-language ul li a {
color: inherit;
text-decoration: none;
font-size: 0.756em; }
footer .block-language ul li.is-active a {
color: red; }
footer #block-productions { footer #block-productions {
position: relative; position: relative;
pointer-events: none; } pointer-events: none; }
@@ -2240,6 +2245,7 @@ footer {
width: 350px; width: 350px;
opacity: 1; } opacity: 1; }
footer #block-studiolinkblock { footer #block-studiolinkblock {
margin-bottom: 1em;
pointer-events: all; pointer-events: all;
margin-left: 0.5em; } margin-left: 0.5em; }
footer #block-studiolinkblock a { footer #block-studiolinkblock a {
@@ -2260,6 +2266,7 @@ footer {
footer #block-studiolinkblock a.is-active { footer #block-studiolinkblock a.is-active {
background-color: red; } background-color: red; }
footer .block.random-player { footer .block.random-player {
margin-bottom: 1em;
pointer-events: all; pointer-events: all;
margin-left: 0.5em; } margin-left: 0.5em; }
footer .block.random-player a { footer .block.random-player a {
@@ -2280,6 +2287,7 @@ footer {
footer .block.random-player a.is-active { footer .block.random-player a.is-active {
background-color: red; } background-color: red; }
footer #block-userlogin { footer #block-userlogin {
margin-bottom: 1em;
pointer-events: all; pointer-events: all;
position: relative; position: relative;
width: 20px; width: 20px;
@@ -2332,8 +2340,10 @@ footer {
opacity: 1; opacity: 1;
pointer-events: auto; } pointer-events: auto; }
footer #block-edlpsearchlinkblock { footer #block-edlpsearchlinkblock {
margin-bottom: 1em;
pointer-events: all; pointer-events: all;
margin-left: 0.5em; } margin-left: 0.5em;
margin-left: 0.2em; }
footer #block-edlpsearchlinkblock a { footer #block-edlpsearchlinkblock a {
display: block; display: block;
width: 20px; width: 20px;
sites/all/themes/custom/edlptheme/assets/styles/app.scss
+75 -34
View File
@@ -954,7 +954,43 @@ footer{
} }
} }
nav.block-menu{ #block-footer{
display: inline-block;
margin-bottom: 1em;
ul{
margin:0;
padding:0;
li{
pointer-events: all;
// @include oblique-list;
display: inline-block;
&:first-of-type{
margin-left: 1em;
}
a{
font-size: 0.756em;
&:before{
content: "";
display:inline-block;
$sq:7px;
width: $sq; height:$sq;
border: 1px solid black;
margin-right: 0.5em;
}
&:hover:before,
&.is-active:before{
background-color: black;
}
&.ajax-loading:before{
@include spining-loader-square;
}
}
}
}
}
// remove #block-productions to enable again oblique style for all block-menu
nav#block-productions.block-menu{
display: inline-block; display: inline-block;
ul{ ul{
margin:0; margin:0;
@@ -986,39 +1022,39 @@ footer{
} }
} }
.block-language{ // .block-language{
display: inline-block; // display: inline-block;
position: relative; // position: relative;
ul{ // ul{
position: absolute; // position: absolute;
bottom:0; // bottom:0;
margin:0; // margin:0;
padding:0; // padding:0;
transform-origin: left bottom; // transform-origin: left bottom;
transform: rotateZ(-45deg); // transform: rotateZ(-45deg);
white-space: nowrap; // white-space: nowrap;
pointer-events: all; // pointer-events: all;
li{ // li{
margin:0; padding:0; // margin:0; padding:0;
list-style: none; // list-style: none;
display: inline-block; // display: inline-block;
&:last-of-type{ // &:last-of-type{
&:before{ // &:before{
content:"/"; // content:"/";
margin:0 0.2em; // margin:0 0.2em;
} // }
} // }
a{ // a{
color: inherit; // color: inherit;
text-decoration: none; // text-decoration: none;
font-size: 0.756em; // font-size: 0.756em;
} // }
&.is-active{ // &.is-active{
a{color: red;} // a{color: red;}
} // }
} // }
} // }
} // }
#block-productions{ #block-productions{
position: relative; position: relative;
@@ -1265,14 +1301,17 @@ footer{
} }
} }
#block-studiolinkblock{ #block-studiolinkblock{
margin-bottom: 1em;
@include iconlinkblock(url(../img/studio.svg)); @include iconlinkblock(url(../img/studio.svg));
} }
.block.random-player{ .block.random-player{
margin-bottom: 1em;
@include iconlinkblock(url(../img/random.svg)); @include iconlinkblock(url(../img/random.svg));
} }
#block-userlogin{ #block-userlogin{
margin-bottom: 1em;
pointer-events: all; pointer-events: all;
// outline: 1px solid blue; // outline: 1px solid blue;
$wh:$icons_w; $wh:$icons_w;
@@ -1340,7 +1379,9 @@ footer{
#block-edlpsearchlinkblock{ #block-edlpsearchlinkblock{
margin-bottom: 1em;
@include iconlinkblock(url(../img/search.svg)); @include iconlinkblock(url(../img/search.svg));
margin-left: 0.2em;
} }
} }