[Design] Fixed bottom spacing.

This commit is contained in:
Ceda EI 2020-01-26 06:43:02 +05:30
parent 2507bc7596
commit c54b12e2b1
1 changed files with 15 additions and 6 deletions

View File

@ -44,7 +44,7 @@ body {
} }
.bottom_bg { .bottom_bg {
background-image: linear-gradient(#26a4c4, #afdde9); background-image: linear-gradient(#26a4c4, #afdde9);
height: 100 - $top-height; height: 100vh - $top-height;
width: 100vw; width: 100vw;
position: fixed; position: fixed;
top: $top-height; top: $top-height;
@ -77,11 +77,12 @@ body {
} }
.bottom { .bottom {
min-height: 100vh - $top-height; min-height: 95vh - $top-height;
margin-bottom: 5vh;
.wrapper { .wrapper {
min-height: 100vh - $top-height; min-height: 95vh - $top-height;
align-items: center; align-items: center;
justify-content: space-around; justify-content: space-between;
flex-direction: column; flex-direction: column;
padding-top: 2em; padding-top: 2em;
height: 100%; height: 100%;
@ -100,6 +101,7 @@ body {
text-decoration: none; text-decoration: none;
} }
.button:hover, .button:active { .button:hover, .button:active {
transition-duration: 0.4s;
background-color: #000; background-color: #000;
color: #FFF; color: #FFF;
} }
@ -145,6 +147,13 @@ h1 {
@media (max-width: 600px) { @media (max-width: 600px) {
body { body {
.top_bg {
height: $top-height-phone;
}
.bottom_bg {
height: 100vh - $top-height-phone;
top: $top-height-phone;
}
.top { .top {
min-height: $top-height-phone; min-height: $top-height-phone;
.wrapper { .wrapper {
@ -159,9 +168,9 @@ h1 {
} }
} }
.bottom { .bottom {
min-height: 100vh - $top-height-phone; min-height: 95vh - $top-height-phone;
.wrapper { .wrapper {
min-height: 100vh - $top-height-phone; min-height: 95vh - $top-height-phone;
.content { .content {
.button { .button {
font-size: 1em; font-size: 1em;