|
@@ -1001,7 +1001,9 @@ main[role="main"]{
|
|
opacity:1;
|
|
opacity:1;
|
|
transition: opacity 0.2s ease-in-out;
|
|
transition: opacity 0.2s ease-in-out;
|
|
.entrees{
|
|
.entrees{
|
|
- @include entree-micro-square;
|
|
|
|
|
|
+ // body:not(.domain-expo-encyclopediedelaparole-org) &{
|
|
|
|
+ @include entree-micro-square;
|
|
|
|
+ // }
|
|
}
|
|
}
|
|
h2.node-title{
|
|
h2.node-title{
|
|
margin:0.2em 0 0;
|
|
margin:0.2em 0 0;
|
|
@@ -1110,7 +1112,7 @@ main[role="main"]{
|
|
transform: translate(-50%, -50%);
|
|
transform: translate(-50%, -50%);
|
|
background-color: rgba(255,255,255, 0.8);
|
|
background-color: rgba(255,255,255, 0.8);
|
|
outline: 1px solid red;
|
|
outline: 1px solid red;
|
|
- padding:2em 1em 2em 2em; margin:0;
|
|
|
|
|
|
+ padding:0.5em 0.5em 0 0.5em; margin:0;
|
|
.btns,
|
|
.btns,
|
|
.actions,
|
|
.actions,
|
|
.favoris{
|
|
.favoris{
|
|
@@ -1120,15 +1122,76 @@ main[role="main"]{
|
|
margin:0.80em 0 0;
|
|
margin:0.80em 0 0;
|
|
}
|
|
}
|
|
.time{
|
|
.time{
|
|
- margin:0.75em 0 0;
|
|
|
|
|
|
+ margin:1.055em 0 0;
|
|
|
|
+ >*{
|
|
|
|
+ width:50px;
|
|
|
|
+ }
|
|
|
|
+ .current-time{
|
|
|
|
+ font-size: 1em;
|
|
|
|
+ }
|
|
|
|
+ .duration{
|
|
|
|
+ margin-top:0.28em;
|
|
|
|
+ }
|
|
}
|
|
}
|
|
.cartel{
|
|
.cartel{
|
|
margin-top: 0;
|
|
margin-top: 0;
|
|
width:calc(100% - 190px);
|
|
width:calc(100% - 190px);
|
|
|
|
+ .entrees{
|
|
|
|
+ span.entree{
|
|
|
|
+
|
|
|
|
+ }
|
|
|
|
+ }
|
|
}
|
|
}
|
|
* {
|
|
* {
|
|
background-color: transparent;
|
|
background-color: transparent;
|
|
}
|
|
}
|
|
|
|
+
|
|
|
|
+ $w:60px; // diagonal length
|
|
|
|
+ $s:($w *1.4)*0.5; // side given the diagonal (1.4 is the square root of 2)
|
|
|
|
+ &:before{
|
|
|
|
+ content:"";
|
|
|
|
+ position: absolute;
|
|
|
|
+ width: $w; height:0;
|
|
|
|
+ border-top: 1px solid red;
|
|
|
|
+ }
|
|
|
|
+ // pos attributes refers to where the popup appears
|
|
|
|
+ &[pos="bottom-right"]{
|
|
|
|
+ transform: translateY($s) translateX($s);
|
|
|
|
+ &:before{
|
|
|
|
+ top:-1px;
|
|
|
|
+ left: -$w - 1px;
|
|
|
|
+ transform-origin: bottom right;
|
|
|
|
+ transform: rotateZ(45deg);
|
|
|
|
+ }
|
|
|
|
+ }
|
|
|
|
+ &[pos="bottom-left"]{
|
|
|
|
+ transform: translateX(-100%) translateY($s) translateX(-$s);
|
|
|
|
+ &:before{
|
|
|
|
+ // top:calc(100% + 1px);*
|
|
|
|
+ top:0;
|
|
|
|
+ left: 100%;
|
|
|
|
+ transform-origin: top left;
|
|
|
|
+ transform: rotateZ(-45deg);
|
|
|
|
+ }
|
|
|
|
+ }
|
|
|
|
+ &[pos="top-left"]{
|
|
|
|
+ transform: translateY(-100%) translateX(-100%) translateY(-$s) translateX(-$s);
|
|
|
|
+ &:before{
|
|
|
|
+ bottom:0;
|
|
|
|
+ left: 100%;
|
|
|
|
+ transform-origin: top left;
|
|
|
|
+ transform: rotateZ(45deg);
|
|
|
|
+ }
|
|
|
|
+ }
|
|
|
|
+ &[pos="top-right"]{
|
|
|
|
+ transform: translateY(-100%) translateY(-$s) translateX($s);
|
|
|
|
+ &:before{
|
|
|
|
+ top:calc(100% + 1px);
|
|
|
|
+ left: - ($w +1px);
|
|
|
|
+ transform-origin: top right;
|
|
|
|
+ transform: rotateZ(-45deg);
|
|
|
|
+ }
|
|
|
|
+ }
|
|
}
|
|
}
|
|
body.expo-black &{
|
|
body.expo-black &{
|
|
background-color: $expo-black-bg;
|
|
background-color: $expo-black-bg;
|