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

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
@@ -1968,19 +1968,52 @@ footer {
footer > .wrapper .region-footer-right {
min-width: 12%;
text-align: right; }
footer nav.block-menu {
display: inline-block; }
footer nav.block-menu ul {
footer #block-footer {
display: inline-block;
margin-bottom: 1em; }
footer #block-footer ul {
margin: 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;
display: inline-block;
position: relative;
list-style: none;
margin: 0 1.5em 0 0;
padding: 0; }
footer nav.block-menu ul li a {
footer nav#block-productions.block-menu ul li a {
position: absolute;
bottom: 0;
-webkit-transform-origin: left bottom;
@@ -1992,18 +2025,18 @@ footer {
text-transform: uppercase;
font-size: 0.756em;
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; }
footer nav.block-menu ul li a:before {
footer nav#block-productions.block-menu ul li a:before {
content: "";
display: inline-block;
width: 7px;
height: 7px;
border: 1px solid black;
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; }
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;
animation: rotation 2s infinite linear; }
@@ -2014,34 +2047,6 @@ footer {
to {
-webkit-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 {
position: relative;
pointer-events: none; }
@@ -2240,6 +2245,7 @@ footer {
width: 350px;
opacity: 1; }
footer #block-studiolinkblock {
margin-bottom: 1em;
pointer-events: all;
margin-left: 0.5em; }
footer #block-studiolinkblock a {
@@ -2260,6 +2266,7 @@ footer {
footer #block-studiolinkblock a.is-active {
background-color: red; }
footer .block.random-player {
margin-bottom: 1em;
pointer-events: all;
margin-left: 0.5em; }
footer .block.random-player a {
@@ -2280,6 +2287,7 @@ footer {
footer .block.random-player a.is-active {
background-color: red; }
footer #block-userlogin {
margin-bottom: 1em;
pointer-events: all;
position: relative;
width: 20px;
@@ -2332,8 +2340,10 @@ footer {
opacity: 1;
pointer-events: auto; }
footer #block-edlpsearchlinkblock {
margin-bottom: 1em;
pointer-events: all;
margin-left: 0.5em; }
margin-left: 0.5em;
margin-left: 0.2em; }
footer #block-edlpsearchlinkblock a {
display: block;
width: 20px;
@@ -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;
ul{
margin:0;
@@ -986,39 +1022,39 @@ footer{
}
}
.block-language{
display: inline-block;
position: relative;
ul{
position: absolute;
bottom:0;
margin:0;
padding:0;
transform-origin: left bottom;
transform: rotateZ(-45deg);
white-space: nowrap;
pointer-events: all;
li{
margin:0; padding:0;
list-style: none;
display: inline-block;
&:last-of-type{
&:before{
content:"/";
margin:0 0.2em;
}
}
a{
color: inherit;
text-decoration: none;
font-size: 0.756em;
}
&.is-active{
a{color: red;}
}
}
}
}
// .block-language{
// display: inline-block;
// position: relative;
// ul{
// position: absolute;
// bottom:0;
// margin:0;
// padding:0;
// transform-origin: left bottom;
// transform: rotateZ(-45deg);
// white-space: nowrap;
// pointer-events: all;
// li{
// margin:0; padding:0;
// list-style: none;
// display: inline-block;
// &:last-of-type{
// &:before{
// content:"/";
// margin:0 0.2em;
// }
// }
// a{
// color: inherit;
// text-decoration: none;
// font-size: 0.756em;
// }
// &.is-active{
// a{color: red;}
// }
// }
// }
// }
#block-productions{
position: relative;
@@ -1265,14 +1301,17 @@ footer{
}
}
#block-studiolinkblock{
margin-bottom: 1em;
@include iconlinkblock(url(../img/studio.svg));
}
.block.random-player{
margin-bottom: 1em;
@include iconlinkblock(url(../img/random.svg));
}
#block-userlogin{
margin-bottom: 1em;
pointer-events: all;
// outline: 1px solid blue;
$wh:$icons_w;
@@ -1340,7 +1379,9 @@ footer{
#block-edlpsearchlinkblock{
margin-bottom: 1em;
@include iconlinkblock(url(../img/search.svg));
margin-left: 0.2em;
}
}