app/javascript/stylesheets/maps.scss
.google-static-map,
.google-maps {
margin-bottom: 1rem;
border: 1px solid $input-border-color;
border-radius: $border-radius;
}
// Fix styles in Google Maps which do not play well with css reset
.gm-style {
img {
vertical-align: initial;
}
label {
margin-bottom: initial;
}
}
.gmaps-popup-image,
.gmaps-popup-text {
display: table-cell;
}
.gmaps-popup-image {
padding-right: 10px;
img {
display: block;
width: 50px;
height: 50px;
}
}
.gmaps-popup-text {
font-size: $small-font-size;
vertical-align: top;
}
.gmaps-popup-p-content {
margin: 0;
color: #666;
}
.gmaps-popup-div-details {
margin: 10px 0 0;
span {
display: inline-block;
margin-right: 12px;
text-align: center;
}
}
.arrow-box {
display: block;
cursor: pointer;
background-color: #fff;
border: 1px solid $gray-700;
box-shadow: 1px 1px 1px fade-out(#000, .8);
img {
position: relative;
top: 1px;
left: 1px;
}
&::after,
&::before {
position: absolute;
top: 100%;
width: 0;
height: 0;
pointer-events: none;
content: " ";
border: solid transparent;
}
&::after {
left: 50%;
margin-left: -4px;
border-width: 4px;
border-top-color: #fff;
}
&::before {
left: 50%;
margin-left: -5px;
border-width: 5px;
border-top-color: $gray-700;
}
}