Skip to content

Instantly share code, notes, and snippets.

@christmasbeacon
Created December 22, 2017 09:31
Show Gist options
  • Star 0 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
  • Save christmasbeacon/5221dbeb83109bc271bc162ad8321bd3 to your computer and use it in GitHub Desktop.
Save christmasbeacon/5221dbeb83109bc271bc162ad8321bd3 to your computer and use it in GitHub Desktop.
map artists project
#map{
position:absolute;
top:0;
bottom:0;
width:50%;
left:0;
height:100vh;
}
#reset {
position: absolute;
top: 5%;
bottom: 0;
left: 12.5%;
width: 25%;
height: 40px;
padding: 10px;
border: none;
border-radius: 3px;
font-size: 12px;
color: #fff;
background: #ee8a65;
cursor: pointer;
}
#displays {
position: relative;
width: 50%;
margin-left: 50%;
font-family: sans-serif;
background-color: #fafafa;
}
#displays section #landing-content {
position:relative;
top: 50%;
transform: translateY(-50%);
}
#displays section #title {
font-family: 'Open Sans';
font-size: 44px!important;
background: rgb(202, 210, 211);
text-align: center;
color: rgb(107, 107, 107);
color: rgb(142, 156, 158);
margin: 20px;
padding: 20px;
}
#displays section #subtitle {
font-family: 'Open Sans';
font-size: 20px!important;
background: rgb(202, 210, 211);
text-align: center;
color: rgb(107, 107, 107);
color: rgb(142, 156, 158);
margin: 20px;
padding: 20px;
}
video {
background: #f6f6f4;
}
#displays section:not(.active) {
display:none;
}
#displays section {
display: block;
width:auto;
height: 100vh;
}
#display-img{
width:100%;
height:100%;
object-fit:contain;
}
.marker {
background-image: url('../img/mapbox-icon.png');
background-size: cover;
width: 40px;
height: 40px;
border-radius: 50%;
cursor: pointer;
}
.mapboxgl-popup {
max-width: 300px;
}
.mapboxgl-popup-content {
text-align: center;
font-family: 'Open Sans', sans-serif;
}
.mapboxgl-popup-content h2 {
margin: 0;
}
.mapboxgl-popup-content h3 {
margin: 0;
}
.mapboxgl-popup-content p {
margin: 0;
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment