feat: modal base styling complete

This commit is contained in:
Smigz 2023-11-21 23:08:09 -05:00
parent 72997086cc
commit 068639b1fc
3 changed files with 57 additions and 6 deletions

View file

@ -1,5 +1,18 @@
:root {
--background-color: #000000;
--spacing-sm: 16px;
--spacing-md: 20px;
}
body, html {
font-size: 16px;
margin: 0;
padding: 0;
font-family: 'Roboto', sans-serif;
}
button {
font-size: 1.3rem;
}
.container {
@ -52,22 +65,51 @@
.modal {
display: flex;
flex-direction: column;
min-height: 50vh;
min-height: 43vh;
min-width: 20vw;
border: none;
padding: 20px 40px;
}
.form {
display: flex;
flex-direction: column;
gap: 10px;
}
.form input {
min-height: 2.2rem;
font-size: 1.2rem;
}
.form-header {
margin-top: 10px;
display: flex;
justify-content: space-around;
}
.form-item {
display: flex;
justify-content: center;
align-items: center;
gap: 20px;
}
.form-item input {
transform: scale(1.5);
}
.form-item label {
font-weight: 500;
font-size: 1.3rem;
}
.close-btn {
height: 30px;
align-self: center;
}
.btn {
padding: var(--spacing-sm) var(--spacing-md);
}