From eda5b12ca6a6ecc10b2f752bc2810c62a3b9628b Mon Sep 17 00:00:00 2001 From: Wirlaburla Date: Sun, 8 Jan 2023 23:56:04 -0600 Subject: [PATCH] fix styles --- index.html | 8 ++++---- radio.css | 56 +++++++++++++++++++++++++++++++++++++++++++++--------- 2 files changed, 51 insertions(+), 13 deletions(-) diff --git a/index.html b/index.html index 7cb7e42..bfa2795 100644 --- a/index.html +++ b/index.html @@ -22,12 +22,12 @@ - - + + - + - + diff --git a/radio.css b/radio.css index a2639d0..5d8df5a 100644 --- a/radio.css +++ b/radio.css @@ -1,6 +1,21 @@ -:root { - --background: #b3a99e; +@import url('//assets.worlio.com/style/css/theme.css'); +@font-face { + font-family:Pixio; + src:url(//assets.worlio.com/fonts/Pixio/Pixio.woff2), + url(//assets.worlio.com/fonts/Pixio/Pixio.woff), + url(//assets.worlio.com/fonts/Pixio/Pixio.ttf) format("truetype"); +} + +@font-face { + font-family:nk57; + src:url(../fonts/nk57/nk57-monospace-cd-rg.ttf) format("truetype"), + url(../fonts/nk57/nk57-monospace-cd-bd.ttf) format("truetype"), + url(../fonts/nk57/nk57-monospace-cd-it.ttf) format("truetype"), + url(../fonts/nk57/nk57-monospace-cd-lt.ttf) format("truetype"); +} + +:root { --primary: #0079b5; --primary-border: #009ae6; @@ -26,12 +41,14 @@ html { } body { - background: var(--background); + background: var(--background-image) var(--main-background); background-repeat: repeat; height: 100%; margin: 0; } +body, button, fakebutton, input { font-family: Pixio; } + .container, .player-container { background: var(--primary); border: 2px outset var(--primary-border); @@ -95,18 +112,18 @@ slider input { background: lightgray; -webkit-appearance: none; appearance: none; - height: 4px; - margin: 6 2; + height: 50%; + margin: auto 4px; width: 96px; } -slider input::-moz-range-thumb, -slider input::-webkit-slider-thumb { +slider input::-webkit-slider-thumb, +slider input::-moz-range-thumb { background: gray; -webkit-appearance: none; appearance: none; width: 8px; - height: 16px; + height: 100%; border: none; border-radius: 0; } @@ -282,13 +299,15 @@ history .track a { favorites, history { height: 240px; } + + body.old panel#favorites, body.old panel#history { display: none; } } @media only screen and (orientation: landscape) { .container, .footer { width: calc(100% - 64px); - height: calc(100% - 212px); } + body:not(.old) .container { height: calc(100% - 212px); } .banner { margin: auto; @@ -301,4 +320,23 @@ history .track a { .player-container { margin-top: 48px; } + + /* OLD */ + body.old .container, body.old .footer { + flex-direction: column; + width: 320px; + } + + body.old .banner { flex-direction: column-reverse; } + body.old .banner img, body.old .player-container { + margin: auto; + } + body.old .banner > img { flex-shrink: 0; } + body.old .player-container { margin-bottom: -2px; } + + body.old panel { + max-height: 480px; + } + + body.old panel#favorites, body.old panel#history { display: none; } } \ No newline at end of file