colouring-montreal/app/src/frontend/sidebar.css
2018-10-01 17:20:25 +01:00

61 lines
1.2 KiB
CSS

.info-container {
position: absolute;
top: 50%;
left: 0;
right: 0;
bottom: 3rem;
padding: 0.25em 0em;
background: #fff;
background-color: rgba(255,255,255,0.98);
z-index: 1000;
overflow-y: auto;
}
.info-container .h2:first-child {
margin-bottom: 0.5rem;
margin-top: 0.5rem;
margin-left: -0.1em;
padding: 0 0.75rem;
}
#root .leaflet-container .leaflet-control-attribution {
width: 100%;
height: 3rem;
background: #fff;
background: rgba(255, 255, 255, 0.7);
}
.leaflet-right{
left: 0;
}
@media (min-width: 380px){
.info-container {
bottom: 2rem;
}
#root .leaflet-container .leaflet-control-attribution {
height: 2rem;
}
}
@media (min-width: 768px){
.info-container {
top: 0;
left: 0;
width: 20rem;
bottom: 0;
}
.leaflet-right{
left: 20rem;
}
#root .leaflet-container .leaflet-control-attribution {
height: auto;
}
}
.sidebar-header .h2 {
display: inline-block;
}
.sidebar-header .icon-button {
margin-left: 0.25rem;
margin-top: 0.4rem;
}
.sidebar-header .icon-button:hover {
background-color: #eee;
}