wordle/src/app.css

87 lines
1.4 KiB
CSS

:root {
font-family: 'Montseratt', Inter, system-ui, Avenir, Helvetica, Arial, sans-serif;
line-height: 1.5;
font-weight: 400;
color-scheme: light dark;
color: rgba(255, 255, 255, 0.87);
background-color: #141414;
font-synthesis: none;
text-rendering: optimizeLegibility;
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
-webkit-text-size-adjust: 100%;
}
a {
font-weight: 500;
color: #646cff;
text-decoration: inherit;
}
a:hover {
color: #535bf2;
}
h1 {
font-size: 3.2em;
line-height: 1.1;
}
button {
background: #181818;
border: 1px solid #343434;
border-radius: 10px;
padding: 10px 14px;
transition: 250ms ease;
cursor: pointer;
}
button:hover {
background: #202020;
}
button:active {
background: #161616;
}
input[type=text] {
background: #181818;
border: 1px solid #343434;
border-radius: 6px;
margin: 0 4px;
padding: 4px 6px;
outline: none;
min-width: 80px;
width: 80px;
max-width: 100%;
}
@media (prefers-color-scheme: light) {
:root {
color: #213547;
background-color: #ffffff;
}
a:hover {
color: #747bff;
}
button {
background-color: #f9f9f9;
}
}
.no-anim {
animation: none !important;
}
main {
margin: 0px auto;
text-align: center;
width: fit-content;
}
@media (max-width:667px) {
main {
margin: 0px !important;
text-align: center;
width: 100vw;
}
}