diff --git a/src/mixins/webkitVisibleScrollbar.js b/src/mixins/webkitVisibleScrollbar.js index 69636bc3..678bba12 100644 --- a/src/mixins/webkitVisibleScrollbar.js +++ b/src/mixins/webkitVisibleScrollbar.js @@ -10,19 +10,19 @@ export default css` } &::-webkit-scrollbar-track { border-radius: ${getSizeBy(0.5)}; - background-color: ${getRgbColor("border", 0.1)}; + background-color: ${getRgbColor("scrollbarTrack", 1)}; } &::-webkit-scrollbar-thumb { border-radius: ${getSizeBy(1)}; - background-color: ${getRgbColor("border", 0.3)}; + background-color: ${getRgbColor("scrollbarThumb", 0.8)}; } &::-webkit-scrollbar-thumb:hover { - background-color: ${getRgbColor("border", 0.5)}; + background-color: ${getRgbColor("scrollbarThumb", 1)}; } &::-webkit-scrollbar-track-piece { - background-color: ${getRgbColor("border", 0.3)}; + background-color: ${getRgbColor("scrollbarTrack", 0.3)}; } &::-webkit-scrollbar-corner { - background-color: ${getRgbColor("border", 0.3)}; + background-color: ${getRgbColor("scrollbarTrack", 0.3)}; } ` diff --git a/src/theme/dark/colors.js b/src/theme/dark/colors.js index 524e16f3..56177ca0 100644 --- a/src/theme/dark/colors.js +++ b/src/theme/dark/colors.js @@ -20,6 +20,8 @@ const appColors = { modalInfoBackground: rawColors.neutral.grey50, menuItemSelected: rawColors.green.green30, menuItemHover: rawColors.green.green10, + scrollbarThumb: rawColors.neutral.grey80, + scrollbarTrack: rawColors.neutral.grey35, //links link: rawColors.green.green110, linkHover: rawColors.green.green120, diff --git a/src/theme/default/colors.js b/src/theme/default/colors.js index d666d3e2..e103fbd2 100644 --- a/src/theme/default/colors.js +++ b/src/theme/default/colors.js @@ -20,6 +20,9 @@ const appColors = { modalInfoBackground: rawColors.neutral.blackhaze, menuItemSelected: rawColors.green.green196, menuItemHover: rawColors.green.green190, + scrollbarThumb: rawColors.neutral.grey160, + scrollbarTrack: rawColors.neutral.grey190, + //links link: rawColors.green.green100, linkHover: rawColors.green.green110,