diff options
Diffstat (limited to 'style.css')
-rw-r--r-- | style.css | 142 |
1 files changed, 142 insertions, 0 deletions
diff --git a/style.css b/style.css new file mode 100644 index 0000000..d8f884f --- /dev/null +++ b/style.css @@ -0,0 +1,142 @@ +@import url('https://fonts.googleapis.com/css2?family=Raleway&display=swap'); + +html { + --foreforeground: #3788ae; + --foreground: #082f41; + --background: #03141c; + color: white; + background: black; + /*padding: 1cm;*/ + font-size: 12pt; + font-family: 'Raleway', sans-serif; + + width: 100vw; + + overflow-x: hidden; + display: flex; + flex-direction: column; + justify-content: center; + align-items: center; +} +body > * { + width: max(60vw, 8cm); +} + +hr { + border: 0.5mm solid var(--foreforeground); + background: var(--foreforeground); + width: 100%; + height: 0%; +} + +.hide {display: none;} + +input, button, details{ + color: white; + background: var(--foreground); + padding: 1rem; + + border: none; + border-radius: 0.5cm; + font-size: 13pt; + margin: 0.5rem; +} + +input::placeholder { + color: var(--foreforeground); +} + +details :is(input, button) { + background: var(--background); +} + +details { + padding: 1rem; + background: var(--foreground); +} + +body { + height: calc(100% - 2cm); + margin: 1cm; + display: flex; + flex-direction: column; + justify-content: center; + align-items: center; + + width: max(60vw, 8cm); + + background: var(--background); + + padding: 1cm; + box-shadow: 0 0 5mm inset black; +} + +a:link { + color: white; +} +a:visited { + color: var(--foreforeground); +} + +kbd { + background: white; + color: black; + padding: 0.5mm; + border-radius: 1mm; + box-shadow: inset black -0.25mm -0.25mm 1mm; +} + +summary, +button, +:is(input[type=radio], input[type=checkbox]), +:is(input[type=radio], input[type=checkbox]) + label { + cursor: pointer; +} + +section#changelog { + height: 60vh; + overflow-y: auto; + overflow-x: hidden; + + box-shadow: inset 0mm 0mm 5mm #000; + +} + +section#changelog > article { + margin: 5mm; + margin-bottom 0; + box-shadow: 0mm 0mm 2.5mm #000; + padding: 2.5mm; + background: var(--foreground); +} + +#logo { + width: 5cm; + height: 5cm; + + position: relative; + z-index: 0; + + border-radius: 26px; + animation: logo 5s infinite ease; + overflow: hidden; + padding: none; +} +#logo > img { + width: 5cm; + z-index: -2; + margin: none; + position: relative; +} + +@keyframes logo { + 0% { + box-shadow: 0mm 0mm 1cm white, 0mm 0mm 0mm white; + } + 50% { + box-shadow: 0mm 0mm 5mm white, 0mm 0mm 1cm var(--foreforeground); + } + 100% { + box-shadow: 0mm 0mm 1cm white, 0mm 0mm 0mm white; + } +}
\ No newline at end of file |