[Design] Responsive buttons. Minor fixes.

This commit is contained in:
Ceda EI 2020-01-21 02:31:26 +05:30
parent ed9c40eefd
commit 5cfae7e9ba
1 changed files with 23 additions and 3 deletions

View File

@ -2,6 +2,10 @@ $cloud_width: 200px;
@import 'fonts'; @import 'fonts';
* {
box-sizing: border-box;
}
body { body {
margin: 0; margin: 0;
padding: 0; padding: 0;
@ -34,7 +38,7 @@ body {
display: flex; display: flex;
align-items: end; align-items: end;
.wrapper { .wrapper {
height: 100%; min-height: 70vh;
align-items: flex-end; align-items: flex-end;
padding-bottom: 3em; padding-bottom: 3em;
} }
@ -44,8 +48,9 @@ body {
background-image: linear-gradient(#26a4c4, #afdde9); background-image: linear-gradient(#26a4c4, #afdde9);
min-height: 30vh; min-height: 30vh;
.wrapper { .wrapper {
min-height: 30vh;
align-items: center; align-items: center;
justify-content: space-between; justify-content: space-around;
flex-direction: column; flex-direction: column;
padding-top: 3em; padding-top: 3em;
height: 100%; height: 100%;
@ -69,7 +74,7 @@ body {
} }
} }
footer { footer {
margin-top: 3em; margin-top: 1em;
padding: 0 1em; padding: 0 1em;
text-align: center; text-align: center;
color: #292929; color: #292929;
@ -107,6 +112,21 @@ h1 {
text-align: center; text-align: center;
} }
@media (max-width: 600px) {
body {
.bottom {
.wrapper {
.content {
.button {
font-size: 1em;
padding: 0.5em;
}
}
}
}
}
}
@keyframes move_right { @keyframes move_right {
from {left: 0} from {left: 0}