fix(sapScrollBar): use correct height for horizontal scrollbar (#587)

Author: MarcusNotheis

packages/main/src/components/AnalyticalTable/AnayticalTable.jss.ts

@@ -12,13 +12,7 @@ const styles = {
     minHeight: '3rem',
     fontFamily: ThemingParameters.sapFontFamily,
     fontSize: ThemingParameters.sapFontSize,
-    fontWeight: 'normal',
-    '&::-webkit-scrollbar': {
-      height: ThemingParameters.sapScrollBar_Dimension
-    },
-    '&::-webkit-scrollbar-thumb': {
-      height: ThemingParameters.sapScrollBar_Dimension
-    }
+    fontWeight: 'normal'
   },
   tableHeaderRow: {
     height: CssSizeVariables.sapWcrAnalyticalTableRowHeight,

packages/main/src/components/ThemeProvider/GlobalStyleClasses.jss.ts

@@ -6,14 +6,24 @@ export const GlobalStyleClassesStyles = {
     [`.${GlobalStyleClasses.sapScrollBar}`]: {
       '&::-webkit-scrollbar': {
         backgroundColor: ThemingParameters.sapScrollBar_TrackColor,
-        width: ThemingParameters.sapScrollBar_Dimension
+        '&:horizontal': {
+          height: ThemingParameters.sapScrollBar_Dimension
+        },
+        '&:vertical': {
+          width: ThemingParameters.sapScrollBar_Dimension
+        }
       },
       '&::-webkit-scrollbar-thumb': {
         backgroundColor: ThemingParameters.sapScrollBar_FaceColor,
-        width: ThemingParameters.sapScrollBar_Dimension,
         borderRadius: '0.25rem',
         '&:hover': {
           backgroundColor: ThemingParameters.sapScrollBar_Hover_FaceColor
+        },
+        '&:horizontal': {
+          height: ThemingParameters.sapScrollBar_Dimension
+        },
+        '&:vertical': {
+          width: ThemingParameters.sapScrollBar_Dimension
         }
       },
       '&::-webkit-scrollbar-corner': {