Work out some basic styling for a phone screen

This commit is contained in:
Savanni D'Gerinel 2023-10-06 23:59:02 -04:00
parent 78c017ede7
commit 2d2e82f41a
1 changed files with 21 additions and 6 deletions

View File

@ -17,8 +17,7 @@ body {
.card { .card {
border: 1px solid black; border: 1px solid black;
border-radius: 5px; border-radius: 5px;
border-shadow: var(--hover-low); box-shadow: var(--hover-low);
padding: var(--px-12);
margin: var(--space-large); margin: var(--space-large);
padding: var(--space-medium); padding: var(--space-medium);
@ -67,7 +66,7 @@ body {
} }
.thumbnail { .thumbnail {
max-width: 300px; width: 300px;
display: flex; display: flex;
flex-direction: column; flex-direction: column;
justify-content: space-between; justify-content: space-between;
@ -123,12 +122,28 @@ body {
} }
*/ */
/* @media screen and (max-width: 980px) { /* This is the screen width of a OnePlus 5t */
@media screen and (max-width: 980px) { /* This is the screen width of a OnePlus 5t
body { body {
font-size: xx-large; font-size: xx-large;
} }
.authentication-form {
width: 100%;
}
.upload-form__selector {
font-size: larger;
}
.upload-form__button {
font-size: larger;
}
.thumbnail {
width: 100%;
}
/*
[type="submit"] { [type="submit"] {
font-size: xx-large; font-size: xx-large;
width: 100%; width: 100%;
@ -152,5 +167,5 @@ body {
flex-direction: column; flex-direction: column;
width: 100%; width: 100%;
} }
}
*/ */
}