Fix drill icons on marker medias

This commit is contained in:
2019-07-02 22:48:51 +02:00
parent 78febf4711
commit 456c45236c
3 changed files with 90 additions and 67 deletions

View File

@@ -195,6 +195,24 @@ $legend-color: #222;
@extend .fa-post;
}
}
a.drill {
position: relative;
@extend .fa;
overflow: hidden;
text-decoration: none;
&:before {
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%,-50%);
font-size: 3em;
color: transparent;
transition: all 0.3s;
cursor: pointer;
}
}
#feed {
position: absolute;
@@ -226,7 +244,7 @@ $legend-color: #222;
color: $post-color;
}
}
#posts {
position: absolute;
transition: all 0.5s;
@@ -299,21 +317,6 @@ $legend-color: #222;
width: 100%;
line-height: 0;
margin: 0;
position: relative;
@extend .fa;
overflow: hidden;
text-decoration: none;
&:before {
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%,-50%);
font-size: 3em;
color: transparent;
transition: all 0.3s;
cursor: pointer;
}
}
}
&.headerless {
@@ -331,12 +334,12 @@ $legend-color: #222;
a.drill {
&.video {
@extend .fa-drill-video;
&:hover:before {
color: rgba($media-bg, 0.75);
}
&:before {
color: rgba(255, 255, 255, 0.5);
}
&:hover:before {
color: rgba($media-bg, 0.75);
}
}
&.picture {
@@ -390,50 +393,69 @@ $legend-color: #222;
}
}
}
}
#elems {
display: none;
}
/* Info Window */
/* Info Window */
.info-window {
h1 {
font-size: 1.2em;
margin: 1em 0;
}
p {
font-size: 1.0em;
margin: 0.5em 0 0 0;
}
i {
padding-right: 0.5em;
font-size: 1.33333333em;
line-height: 0.75em;
vertical-align: -15%;
}
.pics {
margin-top: 0.5em;
.info-window {
h1 {
font-size: 1.2em;
margin: 1em 0;
}
a {
display: inline-block;
margin-right: 15px;
p {
font-size: 1.0em;
margin: 0.5em 0 0 0;
}
i {
padding-right: 0.5em;
font-size: 1.33333333em;
line-height: 0.75em;
vertical-align: -15%;
}
.medias {
margin-top: 0.5em;
img {
max-width: 200px;
max-height: 100px;
border-radius: 3px;
image-orientation: from-image;
transition: All 0.2s;
a {
display: inline-block;
margin-right: 15px;
&.drill {
&.video {
@extend .fa-drill-video;
&:before {
color: rgba(255, 255, 255, 0.5);
}
&:hover:before {
color: rgba(255, 255, 255, 0.75);
}
}
&:hover {
box-shadow: 2px 2px 3px 0px rgba(0, 0, 0, 0.5);
&.picture {
@extend .fa-drill-picture;
&:before {
color: transparent;
}
&:hover:before {
color: rgba(255, 255, 255, 0.75);
}
}
}
img {
max-width: 200px;
max-height: 100px;
border-radius: 3px;
image-orientation: from-image;
transition: All 0.2s;
}
}
}
}
}
#elems {
display: none;
}