feat: basic mobile layout

This commit is contained in:
Mike 2023-11-06 11:47:56 -05:00
parent a6b1c0f6e8
commit 4ea49a9e74

View file

@ -8,6 +8,7 @@
.container { .container {
justify-content: center; justify-content: center;
display: flex; display: flex;
flex-direction: column;
align-items: center; align-items: center;
align-content: center; align-content: center;
height: 100vh; height: 100vh;
@ -15,10 +16,37 @@
background-color: var(--light-bg); background-color: var(--light-bg);
} }
/* .sidebar { .sidebar {
height: 100%;
background-image: url(../static/background.jpg);
background-position: center;
background-size: auto;
background-repeat: no-repeat;
height: 100%;
}
.logo {
position: relative; position: relative;
} */ background-color: rgb(22, 72, 99, 0.7);
top: 15vh;
height: 200px;
display: flex;
align-items: center;
justify-content: center;
}
.logo img {
height: 14vh;
}
.logo img {
height: 14vh;
}
.logo h1 {
font-weight: 900;
font-size: 3rem;
color: var(--light-bg);
}
.form { .form {
width: 60vw; width: 60vw;
@ -47,6 +75,12 @@
} }
@media only screen and (min-width: 700px) { @media only screen and (min-width: 700px) {
.container {
flex-direction: row;
justify-content: center;
align-items: center;
align-content: center;
}
.sidebar { .sidebar {
width: 50vw; width: 50vw;
margin-right: 10px; margin-right: 10px;