lib/styles/_media.scss
/* Landscape phones and down */
@media (max-width: 480px) {
.main-container {
.layout {
max-width: 320px;
padding: 40px 20px 25px;
.input-wrapper {
&:first-child {
margin-bottom: 0;
}
}
#calculator-wrapper {
#aspect-ratio-buttons-wrapper {
.aspect-ratio-button {
margin-bottom: 10px;
}
}
#values-wrapper {
margin: 0;
padding: 0;
#original-values {
margin-bottom: 15px;
&:after {
display: none;
}
.input-wrapper {
margin-right: 0;
}
}
#new-values {
margin-bottom: 15px;
.input-wrapper {
margin-left: 0;
}
}
}
#reset-button {
border: 2px solid $color_2;
border-radius: 4px;
margin-top: 10px;
}
}
footer {
margin-top: 0;
}
}
}
}