diff --git a/qt/aqt/data/web/css/webview.scss b/qt/aqt/data/web/css/webview.scss index 3ce0b5eb3..31710c8c8 100644 --- a/qt/aqt/data/web/css/webview.scss +++ b/qt/aqt/data/web/css/webview.scss @@ -17,10 +17,12 @@ body { transition: opacity 0.5s ease-out; margin: 2em; overscroll-behavior: none; + &:not(.isMac), + &:not(.isMac) * { + @include scrollbar.custom; + } } -@include scrollbar.custom; - a { color: var(--accent-link); text-decoration: none; diff --git a/sass/_functions.scss b/sass/_functions.scss index a639b4e4c..2c0496bed 100644 --- a/sass/_functions.scss +++ b/sass/_functions.scss @@ -21,8 +21,7 @@ create-vars-from-map($value, $theme, #{$name}-#{$key}, $output) ); } - } - @else if $key == "default" { + } @else if $key == "default" { @return map.set($output, $name, map.get($map, $key)); } } diff --git a/sass/base.scss b/sass/base.scss index d5ce13df0..1338de448 100644 --- a/sass/base.scss +++ b/sass/base.scss @@ -32,11 +32,22 @@ $utilities: ( flex-basis: 75%; } +html, body { - overscroll-behavior: none; + height: 100%; } -@include scrollbar.custom; +html { + overflow-x: hidden; +} + +body { + overscroll-behavior: none; + &:not(.isMac), + &:not(.isMac) * { + @include scrollbar.custom; + } +} button { /* override transition for instant hover response */ diff --git a/sass/scrollbar.scss b/sass/scrollbar.scss index ebe35594e..fbb38515b 100644 --- a/sass/scrollbar.scss +++ b/sass/scrollbar.scss @@ -4,48 +4,45 @@ @use "vars"; @mixin custom { - .isWin, - .isLin { - ::-webkit-scrollbar { - background-color: vars.color(canvas); + &::-webkit-scrollbar { + background-color: vars.color(canvas); - &:horizontal { - height: 12px; - } - - &:vertical { - width: 12px; - } + &:horizontal { + height: 12px; } - ::-webkit-scrollbar-thumb { - background: vars.color(scrollbar-bg); - border-radius: vars.prop(border-radius); - - &:horizontal { - min-width: 50px; - } - - &:vertical { - min-height: 50px; - } - - &:hover { - background: vars.color(scrollbar-bg-hover); - } - - &:active { - background: vars.color(scrollbar-bg-active); - } - } - - ::-webkit-scrollbar-corner { - background-color: vars.color(canvas); - } - - ::-webkit-scrollbar-track { - border-radius: 5px; - background-color: transparent; + &:vertical { + width: 12px; } } + + &::-webkit-scrollbar-thumb { + background: vars.color(scrollbar-bg); + border-radius: vars.prop(border-radius); + + &:horizontal { + min-width: 50px; + } + + &:vertical { + min-height: 50px; + } + + &:hover { + background: vars.color(scrollbar-bg-hover); + } + + &:active { + background: vars.color(scrollbar-bg-active); + } + } + + &::-webkit-scrollbar-corner { + background-color: vars.color(canvas); + } + + &::-webkit-scrollbar-track { + border-radius: 5px; + background-color: transparent; + } } diff --git a/ts/change-notetype/change-notetype-base.scss b/ts/change-notetype/change-notetype-base.scss index 081bb3c5d..4172fdd13 100644 --- a/ts/change-notetype/change-notetype-base.scss +++ b/ts/change-notetype/change-notetype-base.scss @@ -23,11 +23,6 @@ html { overflow-x: hidden; } -html, -body { - height: 100%; -} - #main { padding: 0.5em 0.5em 1em 0.5em; height: 100vh; diff --git a/ts/editable/editable-base.scss b/ts/editable/editable-base.scss index ea21d81f4..de754052e 100644 --- a/ts/editable/editable-base.scss +++ b/ts/editable/editable-base.scss @@ -18,7 +18,8 @@ p { display: none; } -:host(body) { +:host(body), +:host(body) * { @include scrollbar.custom; } diff --git a/ts/editor/editor-base.scss b/ts/editor/editor-base.scss index 79175fea6..1e942aa3e 100644 --- a/ts/editor/editor-base.scss +++ b/ts/editor/editor-base.scss @@ -12,8 +12,3 @@ $btn-disabled-opacity: 0.4; html { overflow: hidden; } - -html, -body { - height: 100%; -} diff --git a/ts/import-csv/import-csv-base.scss b/ts/import-csv/import-csv-base.scss index 85cadcf75..6b4114e4b 100644 --- a/ts/import-csv/import-csv-base.scss +++ b/ts/import-csv/import-csv-base.scss @@ -22,10 +22,6 @@ body { padding-bottom: 5em; } -html { - overflow-x: hidden; -} - // override the default down arrow colour in