jurassic-park-interface/sass/components/_vehicle-display.scss
Max Stevenson 5734442835 Done for the day.
- Adjusted spacing in margin bars on vehicle page.
2020-09-10 15:24:05 -05:00

87 lines
1.4 KiB
SCSS

#vehicle-display__inner {
flex-direction: column;
}
.vehicle-display__left-wrapper,
.vehicle-display__right-wrapper {
display: flex;
flex-direction: column;
flex: 1 0 10%;
justify-content: space-between;
}
.vehicle-display__upper-wrapper {
display: flex;
flex-direction: row;
flex: 1 0 77%;
padding: 0.5vw 0;
justify-content: space-between;
}
.vehicle-display__centre-wrapper {
flex: 0 0 78%;
padding: 0 .75vw;
}
.vehicle-display__lower-wrapper {
display: flex;
flex-direction: column;
flex: 1;
}
#island-img {
border: solid 0.1vw #3b6285;
object-fit: cover;
width: 100%;
height: 100%;
}
.left-wrapper__location, .left-wrapper__labels, .left-wrapper__area, .right-wrapper__keys, .right-wrapper__level {
display: flex;
flex-direction: column;
background-color: black;
justify-content: space-evenly;
align-items: center;
p {
color: white;
font-size: .5vw;
font-weight: 500;
margin: 0;
padding: .2vw 0;
}
h4 {
width: 100%;
margin: 0;
}
}
.black-font-white-background {
color: black;
background-color: white;
margin: 0;
font-size: .55vw;
font-weight: 700;
}
.left-wrapper__group, .right-wrapper__group {
width: 100%;
text-align: center;
margin: 0 0 .5vw 0;
}
.right-wrapper__level div:last-child h4 {
color: white;
}
.left-wrapper__labels {
background: none;
h4 {
border: .1vw solid black;
margin: .25vw 0;
text-align: center;
}
}