elseifplayer/src/style/base.css
2021-03-02 01:28:45 +05:00

92 lines
1.3 KiB
CSS

html, body {
margin: 0;
height: 100%;
font-family: 'Open Sans', sans-serif;
}
#root {
height: 100%;
}
.app {
height: 100%;
box-sizing: border-box;
display: flex;
flex-direction: column;
justify-content: center;
align-items: center;
font-size: 18px;
line-height: 27px;
background-color: var(--bg-color);
color: var(--main-color);
}
.app > main {
flex: 1 1 auto;
height: 100%;
width: 100%;
box-sizing: border-box;
}
@media (min-width: 800px) {
.app > main {
height: 90%;
max-height: 90%;
max-width: 800px;
}
}
/* Common */
a {
border-bottom: 2px solid currentColor;
color: inherit;
text-decoration: none;
}
a:focus {
background-color: hsl(0, 0%, 0%, 0.1);
}
/* Dirty views */
.app > main.home {
padding: var(--inner-padding);
max-height: unset;
height: 200%;
}
.home input,
.home select {
padding: 4px 8px;
color: var(--main-color);
background-color: var(--bg-color);
border: 2px solid var(--main-color);
outline-offset: 0;
font: inherit;
}
.home summary {
display: inline-block;
padding-right: 4px;
cursor: pointer;
}
.home details > ul {
border-left: 4px solid currentColor;
}
.home .play label {
display: block;
margin-bottom: 16px;
}
.home .play input {
box-sizing: border-box;
width: 100%;
max-width: 400px;
}