cleaner styling, display start game prompt

This commit is contained in:
Alec
2021-11-16 22:42:44 -05:00
parent d9ae7db7b9
commit b6edc941fc
19 changed files with 320 additions and 52 deletions

View File

@@ -23,23 +23,20 @@ th, thead, tr, tt, u, ul, var {
html {
font-family: 'signika-negative', sans-serif !important;
background-color: #23282b !important;
background-color: #121314 !important;
}
body {
display: flex;
flex-direction: column;
align-items: flex-start;
width: 95%;
margin: 0 auto;
max-width: 68em;
}
h1 {
font-family: 'diavlo', sans-serif;
color: #ab2626;
filter: drop-shadow(2px 2px 4px black);
font-size: 50px;
margin: 0.5em 0;
}
@@ -79,12 +76,13 @@ textarea, input {
button, input[type="submit"] {
font-family: 'signika-negative', sans-serif !important;
padding: 10px;
background-color: black;
background-color: #722c2c;
border-radius: 3px;
color: whitesmoke;
font-size: 18px;
cursor: pointer;
border: 2px solid transparent;
transition: background-color 0.3s ease-out;
}
button:active, input[type=submit]:active {
@@ -97,11 +95,13 @@ button:active, input[type=submit]:active {
display: flex;
flex-direction: column;
justify-content: center;
width: 100%;
width: 95%;
max-width: 68em;
margin: 0 auto;
}
button:hover, input[type="submit"]:hover {
background-color: #4f4f4f;
button:hover, input[type="submit"]:hover, #game-link:hover {
background-color: #333243;
}
input {
@@ -122,7 +122,7 @@ input {
left: 0;
right: 0;
width: fit-content;
max-width: 30em;
max-width: 80%;
min-width: 15em;
font-size: 20px;
margin: 0 auto;
@@ -134,8 +134,14 @@ input {
#navbar {
display: flex;
align-items: center;
padding: 5px;
padding: 5px 0;
width: 100%;
background-color: #333243;
}
#navbar img {
margin: 0 1em;
width: 50px;
}
#navbar a {
@@ -143,6 +149,7 @@ input {
text-decoration: none;
cursor: pointer;
font-size: 25px;
font-family: 'diavlo', sans-serif;
}
#navbar a:hover {
@@ -253,3 +260,23 @@ input {
transform: translateY(-20px);
}
}
@media(max-width: 550px) {
h1 {
font-size: 35px;
}
#step-1 div {
font-size: 20px;
}
}
@media(min-width: 551px) {
h1 {
font-size: 50px;
}
#step-1 div {
font-size: 25px;
}
}