Fix drill icons on marker medias
This commit is contained in:
@@ -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;
|
||||
}
|
||||
Reference in New Issue
Block a user