diff options
| author | RblSb <msrblsb@gmail.com> | 2020-05-22 23:01:59 +0300 |
|---|---|---|
| committer | RblSb <msrblsb@gmail.com> | 2020-05-22 23:01:59 +0300 |
| commit | fc8fbc601c05e1caa671dfd94a48fe402bc39723 (patch) | |
| tree | d727a716a5a764635ff6bc80449ed5b8c406f6c4 /res | |
| parent | a5f39c0deafc61bab42a895fe6febf0409d8f9ce (diff) | |
Remove simplebar
Cause other problems and doesn't always work
Diffstat (limited to 'res')
| -rw-r--r-- | res/css/des.css | 68 | ||||
| -rw-r--r-- | res/index.html | 8 |
2 files changed, 19 insertions, 57 deletions
diff --git a/res/css/des.css b/res/css/des.css index d179f15..c528ef3 100644 --- a/res/css/des.css +++ b/res/css/des.css @@ -461,18 +461,6 @@ footer#footer { padding: 1rem; border-radius: 1rem; height: 12rem; - scrollbar-color: var(--border) var(--background-video); - scrollbar-width: thin; -} - -#userlist::-webkit-scrollbar { - width: .5rem; -} -#userlist::-webkit-scrollbar-track { - background: var(--background-video); -} -#userlist::-webkit-scrollbar-thumb { - background-color: var(--border); } .userlist_item { @@ -522,18 +510,6 @@ footer#footer { left: 1rem; bottom: 1rem; right: 1rem; - scrollbar-color: var(--border) var(--background-chat); - scrollbar-width: thin; -} - -#optionsPanel::-webkit-scrollbar { - width: .5rem; -} -#optionsPanel::-webkit-scrollbar-track { - background: var(--background-chat); -} -#optionsPanel::-webkit-scrollbar-thumb { - background-color: var(--border); } #optionsPanel div { @@ -569,18 +545,6 @@ footer#footer { word-wrap: break-word; width: 100%; height: 100%; - scrollbar-color: var(--border) var(--background-chat); - scrollbar-width: thin; -} - -#messagebuffer::-webkit-scrollbar { - width: .5rem; -} -#messagebuffer::-webkit-scrollbar-track { - background: var(--background-chat); -} -#messagebuffer::-webkit-scrollbar-thumb { - background-color: var(--border); } #messagebuffer > * { @@ -647,18 +611,6 @@ footer#footer { grid-gap: .5rem; gap: .5rem; box-sizing: border-box; - scrollbar-color: var(--border) var(--background-video); - scrollbar-width: thin; -} - -#smileswrap::-webkit-scrollbar { - width: .5rem; -} -#smileswrap::-webkit-scrollbar-track { - background: var(--background-video); -} -#smileswrap::-webkit-scrollbar-thumb { - background-color: var(--border); } .smile-preview { @@ -707,11 +659,23 @@ footer#footer { */ /* - * Simple scrollbar + * Scrollbar */ - -.simplebar-scrollbar::before { - background-color: var(--foreground); +html { + scrollbar-color: rgba(255, 255, 255, 0.1) transparent; + scrollbar-width: thin; +} +::-webkit-scrollbar { + width: 5px; +} +::-webkit-scrollbar-track { + background: transparent; +} +::-webkit-scrollbar-thumb { + background: rgba(255, 255, 255, 0.1); +} +::-webkit-scrollbar-thumb:hover { + background: rgba(255, 255, 255, 0.2); } /* diff --git a/res/index.html b/res/index.html index b5128eb..8a8f516 100644 --- a/res/index.html +++ b/res/index.html @@ -6,7 +6,6 @@ <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>SyncTube</title> <link rel="icon" type="image/png" href="img/favicon.png" /> - <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/simplebar@latest/dist/simplebar.css" /> <link id="usertheme" href="css/des.css" rel="stylesheet"> <link id="customcss" href="css/custom.css" rel="stylesheet"> <script type="module" src="https://cdn.jsdelivr.net/npm/ionicons@5.0.0/dist/ionicons/ionicons.esm.js"></script> @@ -14,7 +13,7 @@ </head> <body style="grid-template-columns: 1fr 4px 300px;"> <!-- Video --> - <main id="video" data-simplebar> + <main id="video"> <!-- Player --> <section id="player" > <div id="ytapiplayer" class="embed-responsive embed-responsive-16by9"></div> @@ -133,13 +132,13 @@ </div> </ul> <!-- Messages --> - <div id="messagebuffer" data-simplebar></div> + <div id="messagebuffer"></div> <!-- Message input --> <div id="chatbox"> <input id="chatline" type="text" placeholder="${chatlinePlaceholder}"> <button id="smilesbtn" title="${emotes}"><ion-icon name="happy"></ion-icon></button> </div> - <div id="smileswrap" data-simplebar></div> + <div id="smileswrap"></div> <!-- Guest login --> <div id="guestlogin" style="display: none;"> <label>${enterAsGuest}</label> @@ -157,6 +156,5 @@ <script src="https://cdn.jsdelivr.net/npm/split-grid@1.0.9/dist/split-grid.js"></script> <script src="client.js"></script> <script src="js/custom.js"></script> - <script src="https://cdn.jsdelivr.net/npm/simplebar@5.2.0/dist/simplebar.min.js"></script> </body> </html> |
