From 7376838746ff44e0d6bcd363735225541dd051f1 Mon Sep 17 00:00:00 2001 From: Jason San Jose Date: Thu, 5 Sep 2013 16:19:54 -0700 Subject: [PATCH 01/12] squashed from larz/linux-scrollbar --- src/styles/brackets.less | 24 ++++++++++++++++++++++-- src/styles/brackets_theme_default.less | 6 +++++- 2 files changed, 27 insertions(+), 3 deletions(-) diff --git a/src/styles/brackets.less b/src/styles/brackets.less index 01350e0e074..f297acb2672 100644 --- a/src/styles/brackets.less +++ b/src/styles/brackets.less @@ -65,8 +65,28 @@ html, body { backface-visibility: hidden; } -body { - height: 100%; +.platform-linux { + ::-webkit-scrollbar { + width: 8px; + height: 8px; + } + + ::-webkit-scrollbar-track-piece { + background: none; + } + + ::-webkit-scrollbar-thumb { + background: @custom-scrollbar-thumb; + border-radius: 4px; + } + + ::-webkit-scrollbar-corner { + background: none; + } + + ::-webkit-scrollbar-thumb:window-inactive { + background: @custom-scrollbar-thumb-inactive; + } } .resizing-container { diff --git a/src/styles/brackets_theme_default.less b/src/styles/brackets_theme_default.less index 21fbfb71ab0..16f2ae1d255 100644 --- a/src/styles/brackets_theme_default.less +++ b/src/styles/brackets_theme_default.less @@ -107,13 +107,17 @@ @open-working-file-name-highlight: #8fddff; @open-working-file-ext-highlight: #8fddff; -/* Selection colors */ +/* selection colors */ @selection-color-focused: #D9EFF7; @selection-color-unfocused: #e9e9e9; /* background color of the line that has the cursor */ @activeline-bgcolor: #e6e9e9; +/* custom scrollbar colors */ +@custom-scrollbar-thumb: rgba(0, 0, 0, 0.24); +@custom-scrollbar-thumb-inactive: rgba(0, 0, 0, 0.12); + /* Code font formatting * * NOTE (JRB): In order to get the web font to load early enough, we have a div called "dummy-text" that From 18369b4036beb16270325da3c341106f9fb1329d Mon Sep 17 00:00:00 2001 From: Lawrence Hsu Date: Thu, 5 Sep 2013 16:57:55 -0700 Subject: [PATCH 02/12] Updated based on Jason's feedback. --- src/styles/brackets.less | 10 +++++++--- 1 file changed, 7 insertions(+), 3 deletions(-) diff --git a/src/styles/brackets.less b/src/styles/brackets.less index f297acb2672..560c1342e6b 100644 --- a/src/styles/brackets.less +++ b/src/styles/brackets.less @@ -65,14 +65,18 @@ html, body { backface-visibility: hidden; } -.platform-linux { +.platform-linux, .platform-mac { ::-webkit-scrollbar { width: 8px; height: 8px; } - ::-webkit-scrollbar-track-piece { - background: none; + ::-webkit-scrollbar-track:vertical { + margin: 0 0 8px 0; + } + + ::-webkit-scrollbar-track:horizontal { + margin: 0 8px 0 0; } ::-webkit-scrollbar-thumb { From 2c0eaf67efacad9887648fc51eabbed89e65fa7f Mon Sep 17 00:00:00 2001 From: Lawrence Hsu Date: Thu, 5 Sep 2013 16:59:07 -0700 Subject: [PATCH 03/12] Removed test selector. --- src/styles/brackets.less | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/styles/brackets.less b/src/styles/brackets.less index 560c1342e6b..00f9ae2c864 100644 --- a/src/styles/brackets.less +++ b/src/styles/brackets.less @@ -65,7 +65,7 @@ html, body { backface-visibility: hidden; } -.platform-linux, .platform-mac { +.platform-linux { ::-webkit-scrollbar { width: 8px; height: 8px; From 7ba72407369c3066ffad249cdaf901f6b9fd6835 Mon Sep 17 00:00:00 2001 From: larz0 Date: Thu, 5 Sep 2013 20:11:29 -0700 Subject: [PATCH 04/12] Added @TomMalbran's new less file that consolidates all scrollbar styles. --- src/styles/brackets_scrollbars.less | 102 ++++++++++++++++++++++++++++ 1 file changed, 102 insertions(+) create mode 100644 src/styles/brackets_scrollbars.less diff --git a/src/styles/brackets_scrollbars.less b/src/styles/brackets_scrollbars.less new file mode 100644 index 00000000000..63c903bbbfe --- /dev/null +++ b/src/styles/brackets_scrollbars.less @@ -0,0 +1,102 @@ +/* + * Copyright (c) 2012 Adobe Systems Incorporated. All rights reserved. + * + * Permission is hereby granted, free of charge, to any person obtaining a + * copy of this software and associated documentation files (the "Software"), + * to deal in the Software without restriction, including without limitation + * the rights to use, copy, modify, merge, publish, distribute, sublicense, + * and/or sell copies of the Software, and to permit persons to whom the + * Software is furnished to do so, subject to the following conditions: + * + * The above copyright notice and this permission notice shall be included in + * all copies or substantial portions of the Software. + * + * THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR + * IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, + * FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE + * AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER + * LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING + * FROM, OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER + * DEALINGS IN THE SOFTWARE. + * + */ + +/* Temporary implementation of unobtrusive scrollbars. + FUTURE: These currently rely on nonstandard WebKit styles, and don't have all the right behavior. + Longer-term, we'll need to implement custom scrollbars. */ + +.platform-mac .quiet-scrollbars, +.platform-win .quiet-scrollbars, +.platform-linux .quiet-scrollbars { + + ::-webkit-scrollbar { + width: 9px; + height: 9px; + } + + ::-webkit-scrollbar-corner { + background-color: transparent; + } + + ::-webkit-scrollbar-thumb { + background-color: rgba(0,0,0,0); + box-shadow: none; + border: none; + } + + /* This looks like a dupe, but without it the thumb doesn't fade in + * properly, probably due to flakiness in how these styles are handled + * in the build of WebKit that's in CEF. + */ + ::-webkit-scrollbar-corner { + background-color: transparent; + } + + /* The data URIs for the thumb were generated from the Fireworks files in + * styles/vertical-thumb-fw-outline.png and styles/horiz-thumb-fw-outline.png. + */ + :hover::-webkit-scrollbar-thumb:vertical, + :focus::-webkit-scrollbar-thumb:vertical { + -webkit-border-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAkAAAAUCAYAAABf2RdVAAAABHNCSVQICAgIfAhkiAAAAAlwSFlzAAALEgAACxIB0t1+/AAAABV0RVh0Q3JlYXRpb24gVGltZQA0LzIzLzEyckCqugAAABx0RVh0U29mdHdhcmUAQWRvYmUgRmlyZXdvcmtzIENTNXG14zYAAACPSURBVCiR7ZIhDoNAEEXfkJCsxKBJimTPwA3mDHvqsXWrquqaIH5FKUk3XKAJT87789U3SQkYgZ5fNuABvDpgrLUOOefZzBYzW3LOc6112J/pgL6UMkZE+lZERCqlHO0m6WZmCydICuDencmWK/Tfoc3dn63YbxsAkpKkyd1XwD/eV0nT7jBJAO2Ej+kCvAFNxTqyZCNcEQAAAABJRU5ErkJggg==") 9 0; + border-color: transparent; + border-width: 9px 0; + min-height: 20px; + } + + :hover::-webkit-scrollbar-thumb:horizontal, + :focus::-webkit-scrollbar-thumb:horizontal { + -webkit-border-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABQAAAAJCAYAAAAywQxIAAAABHNCSVQICAgIfAhkiAAAAAlwSFlzAAALEgAACxIB0t1+/AAAABV0RVh0Q3JlYXRpb24gVGltZQA0LzIzLzEyckCqugAAABx0RVh0U29mdHdhcmUAQWRvYmUgRmlyZXdvcmtzIENTNXG14zYAAACLSURBVCiRrdIxCgIxEEbhfxYFOyuxCCLazjGmTu6YKyRV7hFLCzshlcXCQoqxMWCd5B3gqx6pKgAcAJwA7NFfBVB2P+zsnLvGGI89kois3vtijAGp6sU5d+vFWsy85ZyfpKp3IuIRrKWqj2UG9N8CoFprP6MQM28NLCGE1wgqImtK6Q2g0uxtGjitL9E6N1T9Wl8CAAAAAElFTkSuQmCC") 0 9; + border-color: transparent; + border-width: 0 9px; + min-width: 20px; + } +} + +.platform-linux, .platform-mac { + ::-webkit-scrollbar { + width: 12px; + height: 12px; + } + + ::-webkit-scrollbar-track:vertical { + margin: 0 0 8px 0; + } + + ::-webkit-scrollbar-track:horizontal { + margin: 0 8px 0 0; + } + + ::-webkit-scrollbar-thumb { + border-radius: 999px; + box-shadow: 0 0 0 4px @custom-scrollbar-thumb inset; + border: 2px solid rgba(0, 0, 0, 0); + } + + ::-webkit-scrollbar-corner { + background: none; + } + + ::-webkit-scrollbar-thumb:window-inactive { + box-shadow: 0 0 0 5px @custom-scrollbar-thumb-inactive inset; + } +} From ee13a996e46e27c7813705ee48ecc2f33395e7e4 Mon Sep 17 00:00:00 2001 From: larz0 Date: Thu, 5 Sep 2013 20:12:30 -0700 Subject: [PATCH 05/12] Removed quiet scrollbar styles as they're all in brackets_scrollbars.less now. --- src/styles/quiet-scrollbars.css | 66 --------------------------------- 1 file changed, 66 deletions(-) delete mode 100644 src/styles/quiet-scrollbars.css diff --git a/src/styles/quiet-scrollbars.css b/src/styles/quiet-scrollbars.css deleted file mode 100644 index 85374ef4663..00000000000 --- a/src/styles/quiet-scrollbars.css +++ /dev/null @@ -1,66 +0,0 @@ -/* - * Copyright (c) 2012 Adobe Systems Incorporated. All rights reserved. - * - * Permission is hereby granted, free of charge, to any person obtaining a - * copy of this software and associated documentation files (the "Software"), - * to deal in the Software without restriction, including without limitation - * the rights to use, copy, modify, merge, publish, distribute, sublicense, - * and/or sell copies of the Software, and to permit persons to whom the - * Software is furnished to do so, subject to the following conditions: - * - * The above copyright notice and this permission notice shall be included in - * all copies or substantial portions of the Software. - * - * THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR - * IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, - * FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE - * AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER - * LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING - * FROM, OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER - * DEALINGS IN THE SOFTWARE. - * - */ - -/* Temporary implementation of unobtrusive scrollbars. - FUTURE: These currently rely on nonstandard WebKit styles, and don't have all the right behavior. - Longer-term, we'll need to implement custom scrollbars. */ - -.quiet-scrollbars ::-webkit-scrollbar { - width: 9px; - height: 9px; -} - -.quiet-scrollbars ::-webkit-scrollbar-corner { - background-color: transparent; -} - -.quiet-scrollbars ::-webkit-scrollbar-thumb { - background-color: rgba(0,0,0,0); -} - -/* This looks like a dupe, but without it the thumb doesn't fade in - * properly, probably due to flakiness in how these styles are handled - * in the build of WebKit that's in CEF. - */ -.quiet-scrollbars ::-webkit-scrollbar-corner { - background-color: transparent; -} - -/* The data URIs for the thumb were generated from the Fireworks files in - * styles/vertical-thumb-fw-outline.png and styles/horiz-thumb-fw-outline.png. - */ -.quiet-scrollbars :hover::-webkit-scrollbar-thumb:vertical, -.quiet-scrollbars :focus::-webkit-scrollbar-thumb:vertical { - -webkit-border-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAkAAAAUCAYAAABf2RdVAAAABHNCSVQICAgIfAhkiAAAAAlwSFlzAAALEgAACxIB0t1+/AAAABV0RVh0Q3JlYXRpb24gVGltZQA0LzIzLzEyckCqugAAABx0RVh0U29mdHdhcmUAQWRvYmUgRmlyZXdvcmtzIENTNXG14zYAAACPSURBVCiR7ZIhDoNAEEXfkJCsxKBJimTPwA3mDHvqsXWrquqaIH5FKUk3XKAJT87789U3SQkYgZ5fNuABvDpgrLUOOefZzBYzW3LOc6112J/pgL6UMkZE+lZERCqlHO0m6WZmCydICuDencmWK/Tfoc3dn63YbxsAkpKkyd1XwD/eV0nT7jBJAO2Ej+kCvAFNxTqyZCNcEQAAAABJRU5ErkJggg==") 9 0; - border-color: transparent; - border-width: 9px 0; - min-height: 20px; -} - -.quiet-scrollbars :hover::-webkit-scrollbar-thumb:horizontal, -.quiet-scrollbars :focus::-webkit-scrollbar-thumb:horizontal { - -webkit-border-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABQAAAAJCAYAAAAywQxIAAAABHNCSVQICAgIfAhkiAAAAAlwSFlzAAALEgAACxIB0t1+/AAAABV0RVh0Q3JlYXRpb24gVGltZQA0LzIzLzEyckCqugAAABx0RVh0U29mdHdhcmUAQWRvYmUgRmlyZXdvcmtzIENTNXG14zYAAACLSURBVCiRrdIxCgIxEEbhfxYFOyuxCCLazjGmTu6YKyRV7hFLCzshlcXCQoqxMWCd5B3gqx6pKgAcAJwA7NFfBVB2P+zsnLvGGI89kois3vtijAGp6sU5d+vFWsy85ZyfpKp3IuIRrKWqj2UG9N8CoFprP6MQM28NLCGE1wgqImtK6Q2g0uxtGjitL9E6N1T9Wl8CAAAAAElFTkSuQmCC") 0 9; - border-color: transparent; - border-width: 0 9px; - min-width: 20px; -} From 181ead8f1ae31f494d629e0414e5429a5124a792 Mon Sep 17 00:00:00 2001 From: larz0 Date: Thu, 5 Sep 2013 20:14:30 -0700 Subject: [PATCH 06/12] Updated link. --- src/index.html | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/index.html b/src/index.html index d52432056c2..9233b4bd850 100644 --- a/src/index.html +++ b/src/index.html @@ -31,7 +31,7 @@ - + From 3561353803b05cf241f971815df8ad58b93b74de Mon Sep 17 00:00:00 2001 From: larz0 Date: Thu, 5 Sep 2013 20:17:43 -0700 Subject: [PATCH 07/12] Cleaned up a bit. --- src/styles/brackets_scrollbars.less | 6 +++--- 1 file changed, 3 insertions(+), 3 deletions(-) diff --git a/src/styles/brackets_scrollbars.less b/src/styles/brackets_scrollbars.less index 63c903bbbfe..fa5678839ed 100644 --- a/src/styles/brackets_scrollbars.less +++ b/src/styles/brackets_scrollbars.less @@ -25,8 +25,8 @@ FUTURE: These currently rely on nonstandard WebKit styles, and don't have all the right behavior. Longer-term, we'll need to implement custom scrollbars. */ -.platform-mac .quiet-scrollbars, -.platform-win .quiet-scrollbars, +.platform-mac .quiet-scrollbars, +.platform-win .quiet-scrollbars, .platform-linux .quiet-scrollbars { ::-webkit-scrollbar { @@ -72,7 +72,7 @@ } } -.platform-linux, .platform-mac { +.platform-linux { ::-webkit-scrollbar { width: 12px; height: 12px; From c17548703329a8e09a585dfa5c5a161079ed525b Mon Sep 17 00:00:00 2001 From: larz0 Date: Thu, 5 Sep 2013 20:19:35 -0700 Subject: [PATCH 08/12] Removed linux scrollbar style. --- src/styles/brackets.less | 28 ---------------------------- 1 file changed, 28 deletions(-) diff --git a/src/styles/brackets.less b/src/styles/brackets.less index 00f9ae2c864..8d1598586a8 100644 --- a/src/styles/brackets.less +++ b/src/styles/brackets.less @@ -65,34 +65,6 @@ html, body { backface-visibility: hidden; } -.platform-linux { - ::-webkit-scrollbar { - width: 8px; - height: 8px; - } - - ::-webkit-scrollbar-track:vertical { - margin: 0 0 8px 0; - } - - ::-webkit-scrollbar-track:horizontal { - margin: 0 8px 0 0; - } - - ::-webkit-scrollbar-thumb { - background: @custom-scrollbar-thumb; - border-radius: 4px; - } - - ::-webkit-scrollbar-corner { - background: none; - } - - ::-webkit-scrollbar-thumb:window-inactive { - background: @custom-scrollbar-thumb-inactive; - } -} - .resizing-container { position: absolute; top: 0; From 62834b31a2297856a785c92f43889b610edbf0c7 Mon Sep 17 00:00:00 2001 From: larz0 Date: Thu, 5 Sep 2013 20:37:45 -0700 Subject: [PATCH 09/12] Fixed based on @TomMalbran's feedback. --- src/index.html | 4 ---- src/styles/brackets_shared.less | 5 ++++- 2 files changed, 4 insertions(+), 5 deletions(-) diff --git a/src/index.html b/src/index.html index 9233b4bd850..18196b418c4 100644 --- a/src/index.html +++ b/src/index.html @@ -29,10 +29,6 @@ - - - diff --git a/src/styles/brackets_shared.less b/src/styles/brackets_shared.less index 61689c7ad42..3b6a7c0efa9 100644 --- a/src/styles/brackets_shared.less +++ b/src/styles/brackets_shared.less @@ -58,5 +58,8 @@ // Codemirror styling overrides @import url(brackets_codemirror_override.less); -// styling for file tree +// Styling for file tree @import url(jsTreeTheme.less); + +// Styling for scrollbars +@import url(brackets_scrollbars.less); From d3e359fa3a93e72b3f7c6538cea99fc7f822b659 Mon Sep 17 00:00:00 2001 From: larz0 Date: Thu, 5 Sep 2013 20:38:33 -0700 Subject: [PATCH 10/12] Updated year. --- src/styles/brackets_scrollbars.less | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/styles/brackets_scrollbars.less b/src/styles/brackets_scrollbars.less index fa5678839ed..b4729b7103e 100644 --- a/src/styles/brackets_scrollbars.less +++ b/src/styles/brackets_scrollbars.less @@ -1,5 +1,5 @@ /* - * Copyright (c) 2012 Adobe Systems Incorporated. All rights reserved. + * Copyright (c) 2013 Adobe Systems Incorporated. All rights reserved. * * Permission is hereby granted, free of charge, to any person obtaining a * copy of this software and associated documentation files (the "Software"), From 4ce40aa212249f58afe19ea610b3f99719930da1 Mon Sep 17 00:00:00 2001 From: larz0 Date: Thu, 5 Sep 2013 20:55:11 -0700 Subject: [PATCH 11/12] Removed base64 PNGs as they're no longer required. --- src/styles/brackets_scrollbars.less | 2 -- 1 file changed, 2 deletions(-) diff --git a/src/styles/brackets_scrollbars.less b/src/styles/brackets_scrollbars.less index b4729b7103e..125d04da1a6 100644 --- a/src/styles/brackets_scrollbars.less +++ b/src/styles/brackets_scrollbars.less @@ -57,7 +57,6 @@ */ :hover::-webkit-scrollbar-thumb:vertical, :focus::-webkit-scrollbar-thumb:vertical { - -webkit-border-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAkAAAAUCAYAAABf2RdVAAAABHNCSVQICAgIfAhkiAAAAAlwSFlzAAALEgAACxIB0t1+/AAAABV0RVh0Q3JlYXRpb24gVGltZQA0LzIzLzEyckCqugAAABx0RVh0U29mdHdhcmUAQWRvYmUgRmlyZXdvcmtzIENTNXG14zYAAACPSURBVCiR7ZIhDoNAEEXfkJCsxKBJimTPwA3mDHvqsXWrquqaIH5FKUk3XKAJT87789U3SQkYgZ5fNuABvDpgrLUOOefZzBYzW3LOc6112J/pgL6UMkZE+lZERCqlHO0m6WZmCydICuDencmWK/Tfoc3dn63YbxsAkpKkyd1XwD/eV0nT7jBJAO2Ej+kCvAFNxTqyZCNcEQAAAABJRU5ErkJggg==") 9 0; border-color: transparent; border-width: 9px 0; min-height: 20px; @@ -65,7 +64,6 @@ :hover::-webkit-scrollbar-thumb:horizontal, :focus::-webkit-scrollbar-thumb:horizontal { - -webkit-border-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABQAAAAJCAYAAAAywQxIAAAABHNCSVQICAgIfAhkiAAAAAlwSFlzAAALEgAACxIB0t1+/AAAABV0RVh0Q3JlYXRpb24gVGltZQA0LzIzLzEyckCqugAAABx0RVh0U29mdHdhcmUAQWRvYmUgRmlyZXdvcmtzIENTNXG14zYAAACLSURBVCiRrdIxCgIxEEbhfxYFOyuxCCLazjGmTu6YKyRV7hFLCzshlcXCQoqxMWCd5B3gqx6pKgAcAJwA7NFfBVB2P+zsnLvGGI89kois3vtijAGp6sU5d+vFWsy85ZyfpKp3IuIRrKWqj2UG9N8CoFprP6MQM28NLCGE1wgqImtK6Q2g0uxtGjitL9E6N1T9Wl8CAAAAAElFTkSuQmCC") 0 9; border-color: transparent; border-width: 0 9px; min-width: 20px; From edce885f6170bcb7897cbc782d41e6b1769bed79 Mon Sep 17 00:00:00 2001 From: larz0 Date: Thu, 5 Sep 2013 21:32:26 -0700 Subject: [PATCH 12/12] Fixed quiet scrollbar based on @TomMalbran's feedback. --- src/styles/brackets_scrollbars.less | 17 ++++++++--------- 1 file changed, 8 insertions(+), 9 deletions(-) diff --git a/src/styles/brackets_scrollbars.less b/src/styles/brackets_scrollbars.less index 125d04da1a6..31dcbc4cd0c 100644 --- a/src/styles/brackets_scrollbars.less +++ b/src/styles/brackets_scrollbars.less @@ -39,7 +39,6 @@ } ::-webkit-scrollbar-thumb { - background-color: rgba(0,0,0,0); box-shadow: none; border: none; } @@ -52,20 +51,20 @@ background-color: transparent; } - /* The data URIs for the thumb were generated from the Fireworks files in - * styles/vertical-thumb-fw-outline.png and styles/horiz-thumb-fw-outline.png. - */ + :hover::-webkit-scrollbar-thumb, + :focus::-webkit-scrollbar-thumb { + border-radius: 999px; + box-shadow: 0 0 0 3px rgba(0, 0, 0, 0.6) inset; + border: 2px solid transparent; + } + :hover::-webkit-scrollbar-thumb:vertical, :focus::-webkit-scrollbar-thumb:vertical { - border-color: transparent; - border-width: 9px 0; min-height: 20px; } :hover::-webkit-scrollbar-thumb:horizontal, :focus::-webkit-scrollbar-thumb:horizontal { - border-color: transparent; - border-width: 0 9px; min-width: 20px; } } @@ -87,7 +86,7 @@ ::-webkit-scrollbar-thumb { border-radius: 999px; box-shadow: 0 0 0 4px @custom-scrollbar-thumb inset; - border: 2px solid rgba(0, 0, 0, 0); + border: 2px solid transparent; } ::-webkit-scrollbar-corner {