diff --git a/frontend/index.html b/frontend/index.html
index cf5f4588c98..d42de24fd7f 100644
--- a/frontend/index.html
+++ b/frontend/index.html
@@ -1,5 +1,5 @@
-
+
-
+
diff --git a/frontend/package.json b/frontend/package.json
index 20d65d8ae3f..7f209ff52c1 100644
--- a/frontend/package.json
+++ b/frontend/package.json
@@ -39,7 +39,6 @@
"langs": "2.0.0",
"lodash-es": "4.17.21",
"mux.js": "6.1.0",
- "overlayscrollbars": "2.0.1",
"screenfull": "6.0.1",
"shaka-player": "4.1.1",
"swiper": "8.3.2",
diff --git a/frontend/src/assets/styles/global.scss b/frontend/src/assets/styles/global.scss
index 99679efca31..5725435cfec 100644
--- a/frontend/src/assets/styles/global.scss
+++ b/frontend/src/assets/styles/global.scss
@@ -1,17 +1,14 @@
* {
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
-
- /**
- * Remove native scrollbars: we're using OverlayScrollbars for that
- * That also removes the need for scroll-behaviour: smooth
- */
- /* W3C standard scrollbars (Firefox-only for now) */
- scrollbar-width: none;
}
-/* Reproduce something similar on Chrome/Edge/Safari */
+
*::-webkit-scrollbar {
- display: none;
+ width: 5px;
+}
+
+*::-webkit-scrollbar-thumb {
+ background: #666;
}
/* Vuetify overrides */
diff --git a/frontend/src/main.ts b/frontend/src/main.ts
index 28b42a7d34d..58ebcaf16e9 100644
--- a/frontend/src/main.ts
+++ b/frontend/src/main.ts
@@ -10,7 +10,6 @@
*/
import { createApp } from 'vue';
-import { OverlayScrollbars, ClickScrollPlugin } from 'overlayscrollbars';
import Root from '@/App.vue';
/* eslint-disable no-restricted-imports */
import { createRemote, i18n, router, vuetify } from '@/plugins';
@@ -22,7 +21,6 @@ import { hideDirective } from '@/plugins/directives';
*/
import '@/assets/styles/global.scss';
import '@/assets/styles/transitions.scss';
-import 'overlayscrollbars/overlayscrollbars.css';
/**
* - VUE PLUGINS, STORE AND DIRECTIVE -
@@ -51,31 +49,8 @@ await router.isReady();
* splash screen gets frozen an small (but noticeable) amount of time.
*/
const appDOM = document.querySelector('#app') as HTMLDivElement;
-const bodyDOM = document.querySelector('body') as HTMLBodyElement;
const splashDOM = document.querySelector('.splashBackground') as HTMLDivElement;
-OverlayScrollbars.plugin(ClickScrollPlugin);
-window.setTimeout(() => {
- window.requestAnimationFrame(() => {
- OverlayScrollbars(
- {
- target: bodyDOM
- },
- {
- update: {
- debounce: 0
- },
- scrollbars: {
- autoHide: 'move',
- autoHideDelay: 1000,
- clickScroll: true,
- dragScroll: true
- }
- }
- );
- });
-});
-
/**
* Once we reach this point, the bundle and the app will be completely loaded and mounted,
* so we add a loadFinished class (defined in index.html) that fires the defined transition
diff --git a/package-lock.json b/package-lock.json
index 86460804abe..c9e9df91912 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -34,7 +34,6 @@
"langs": "2.0.0",
"lodash-es": "4.17.21",
"mux.js": "6.1.0",
- "overlayscrollbars": "2.0.1",
"screenfull": "6.0.1",
"shaka-player": "4.1.1",
"swiper": "8.3.2",
@@ -11868,11 +11867,6 @@
"node": ">=0.10.0"
}
},
- "node_modules/overlayscrollbars": {
- "version": "2.0.1",
- "resolved": "https://registry.npmjs.org/overlayscrollbars/-/overlayscrollbars-2.0.1.tgz",
- "integrity": "sha512-tER9iKasFqcJiYdtspHbzlhJJg8kicyj/Oag/GRAK658rDouat2BGFfSFg3AgIw/Yc9CQ78AuX6ieHgg1wQw7Q=="
- },
"node_modules/p-cancelable": {
"version": "3.0.0",
"resolved": "https://registry.npmjs.org/p-cancelable/-/p-cancelable-3.0.0.tgz",