j40-cejst-2/client/src/components/J40Map.module.scss
Vim USDS 40e7b80f27 Align Geolocate icon and Search
- align geolocate and search according to mock for desktop and mobile
2022-08-01 23:40:59 -07:00

61 lines
1 KiB
SCSS

@use '../styles/design-system.scss' as *;
@import "./utils.scss";
.j40Map {
// width < 1024
@include at-media-max("desktop") {
height: 55vh;
}
.mapHeaderRow{
@include u-display("flex");
@include u-padding-left(1.5);
justify-content: flex-start;
.geolocateBox {
flex: 1 2 47%;
align-self: flex-end;
margin-bottom: 30px;
margin-left: 1rem;
.geolocateMessage {
visibility: visible;
background-color: white;
margin-bottom: 3px;
max-width: fit-content;
}
.geolocateMessageHide {
visibility: hidden;
margin-bottom: 3px;
}
.geolocateIcon{
align-self: flex-end;
}
}
}
.navigationControl {
left: .75em;
top: units(15);
}
//These classes are behind feature flags:
.fullscreenControl {
right: 1.25em;
top: 2.5em;
}
.j40Popup {
width: 375px;
}
}
.mapInfoPanel {
border: 1px solid $sidePanelBorderColor;
overflow-y: auto;
height: 90vh;
}