diff --git a/src/Css/Application.css b/src/Css/Application.css index 66d0f6ea..f4afcce0 100644 --- a/src/Css/Application.css +++ b/src/Css/Application.css @@ -1,6 +1,5 @@ @charset "UTF-8"; - /* Imports ------- */ @@ -12,8 +11,6 @@ @import "Logo.css"; @import "Notifications.css"; - - /* 🛠 ----- */ @@ -27,8 +24,6 @@ } } - - /* Base ---- */ @@ -45,8 +40,6 @@ body { html, body, .screen-height { - /* TODO: Remove support for older browsers */ - height: calc(var(--vh, 1vh) * 100); height: 100dvh; } @@ -66,19 +59,19 @@ body { } .align-sub { - vertical-align: sub + vertical-align: sub; } .all-small-caps { - font-variant-caps: all-small-caps + font-variant-caps: all-small-caps; } .flex-basis-0 { - flex-basis: 0 + flex-basis: 0; } .smooth-scrolling { - scroll-behavior: smooth + scroll-behavior: smooth; } @screen dark { @@ -87,8 +80,6 @@ body { } } - - /* Buttons ------- */ @@ -97,8 +88,6 @@ button { font-family: inherit; } - - /* Dragging -------- */ @@ -108,11 +97,9 @@ button { } .dragging-something * { - cursor: grabbing !important + cursor: grabbing !important; } - - /* Forms ----- */ @@ -139,7 +126,6 @@ select:-moz-focusring { } @screen dark { - input::placeholder, textarea::placeholder { @apply text-base03; @@ -152,8 +138,6 @@ select:-moz-focusring { } } - - /* Loading ------- */ @@ -162,7 +146,8 @@ select:-moz-focusring { } .loading-animation__circle { - animation: loading-dash 1.5s ease-in-out infinite, + animation: + loading-dash 1.5s ease-in-out infinite, loading-colors 6s ease-in-out infinite; stroke-dasharray: 1, 86.25; stroke-dashoffset: 0; @@ -218,47 +203,43 @@ select:-moz-focusring { } } - - /* Overrides --------- */ -.no-tracks-view>div { +.no-tracks-view > div { /* CSS fix for a scrolling issue: Element would appear scrolled even though it's not (virtual-dom issue probably) */ overflow: visible !important; } - - /* Range slider ------------ */ .range-slider { - @apply appearance-none bg-gray-400 rounded w-24; + @apply w-24 appearance-none rounded bg-gray-400; height: 4px; } .range-slider::-webkit-slider-thumb { - @apply appearance-none bg-base02; + @apply bg-base02 appearance-none; border-radius: 100%; height: 10px; - width: 10px + width: 10px; } .range-slider::-moz-range-thumb { - @apply appearance-none bg-darkest-hour; + @apply bg-darkest-hour appearance-none; border-radius: 100%; height: 10px; - width: 10px + width: 10px; } .range-slider::-ms-thumb { - @apply appearance-none bg-darkest-hour; + @apply bg-darkest-hour appearance-none; border-radius: 100%; height: 10px; - width: 10px + width: 10px; } @screen dark { @@ -277,4 +258,4 @@ select:-moz-focusring { .range-slider::-ms-thumb { @apply bg-base07; } -} \ No newline at end of file +} diff --git a/src/Javascript/index.ts b/src/Javascript/index.ts index 79c34ece..a7ecd58e 100644 --- a/src/Javascript/index.ts +++ b/src/Javascript/index.ts @@ -962,24 +962,3 @@ function viableForUpgrade() { // The end return viable_v1 } - - - - -// Vertical Height -// --------------- -// TODO: Remove support for older browsers -// Replaced by `dvh` CSS unit - -setVerticalHeightUnit() - - -window.addEventListener("resize", () => { - setTimeout(setVerticalHeightUnit, 0) -}) - - -function setVerticalHeightUnit() { - const vh = document.documentElement.clientHeight * 0.01 - document.documentElement.style.setProperty("--vh", `${vh}px`) -}