Universally Thin Scrollbars for Right Pane (#959)

icssc · Apr 15, 2024 · f14bfc2 · f14bfc2
1 parent 49d8d50
commit f14bfc2
Show file tree

Hide file tree

Showing 2 changed files with 16 additions and 10 deletions.
diff --git a/apps/antalmanac/src/components/RightPane/CoursePane/CourseRenderPane.tsx b/apps/antalmanac/src/components/RightPane/CoursePane/CourseRenderPane.tsx
@@ -1,25 +1,28 @@
-import { useCallback, useEffect, useState } from 'react';
-import LazyLoad from 'react-lazyload';
 
-import { Alert, Box, GlobalStyles, IconButton, useMediaQuery } from '@mui/material';
 import { Close } from '@mui/icons-material';
+import { Alert, Box, IconButton, useMediaQuery } from '@mui/material';
 import { AACourse, AASection } from '@packages/antalmanac-types';
 import { WebsocDepartment, WebsocSchool, WebsocAPIResponse, GE } from 'peterportal-api-next-types';
+import { useCallback, useEffect, useState } from 'react';
+import LazyLoad from 'react-lazyload';
+
 import RightPaneStore from '../RightPaneStore';
 import GeDataFetchProvider from '../SectionTable/GEDataFetchProvider';
 import SectionTableLazyWrapper from '../SectionTable/SectionTableLazyWrapper';
+
 import SchoolDeptCard from './SchoolDeptCard';
 import darkModeLoadingGif from './SearchForm/Gifs/dark-loading.gif';
 import loadingGif from './SearchForm/Gifs/loading.gif';
 import darkNoNothing from './static/dark-no_results.png';
 import noNothing from './static/no_results.png';
-import AppStore from '$stores/AppStore';
-import { useThemeStore } from '$stores/SettingsStore';
-import Grades from '$lib/grades';
-import analyticsEnum from '$lib/analytics';
+
 import { openSnackbar } from '$actions/AppStoreActions';
+import analyticsEnum from '$lib/analytics';
+import Grades from '$lib/grades';
 import WebSOC from '$lib/websoc';
+import AppStore from '$stores/AppStore';
 import { useHoveredStore } from '$stores/HoveredStore';
+import { useThemeStore } from '$stores/SettingsStore';
 
 function getColors() {
     const courseColors = AppStore.schedule.getCurrentCourses().reduce(
@@ -285,7 +288,6 @@ export default function CourseRenderPane(props: { id?: number }) {
                     <RecruitmentBanner />
                     <Box>
                         <Box sx={{ height: '50px', marginBottom: '5px' }} />
-                        <GlobalStyles styles={{ '*::-webkit-scrollbar': { height: '8px' } }} />
                         {courseData.map((_: WebsocSchool | WebsocDepartment | AACourse, index: number) => {
                             let heightEstimate = 200;
                             if ((courseData[index] as AACourse).sections !== undefined)

diff --git a/apps/antalmanac/src/components/RightPane/RightPaneRoot.tsx b/apps/antalmanac/src/components/RightPane/RightPaneRoot.tsx
@@ -1,14 +1,17 @@
-import { Link } from 'react-router-dom';
 import { Box, Paper, Tab, Tabs, Typography } from '@material-ui/core';
 import { FormatListBulleted, MyLocation, Search } from '@material-ui/icons';
+import { GlobalStyles } from '@mui/material';
 import React, { Suspense } from 'react';
+import { Link } from 'react-router-dom';
 
 import AddedCoursePane from './AddedCourses/AddedCoursePane';
 import CoursePane from './CoursePane/CoursePaneRoot';
 import darkModeLoadingGif from './CoursePane/SearchForm/Gifs/dark-loading.gif';
 import loadingGif from './CoursePane/SearchForm/Gifs/loading.gif';
-import { useTabStore } from '$stores/TabStore';
+
 import { useThemeStore } from '$stores/SettingsStore';
+import { useTabStore } from '$stores/TabStore';
+
 
 const UCIMap = React.lazy(() => import('../Map'));
 
@@ -60,6 +63,7 @@ export default function Desktop({ style }: DesktopTabsProps) {
 
     return (
         <Box style={{ ...style, margin: '0 4px' }}>
+            <GlobalStyles styles={{ '*::-webkit-scrollbar': { height: '8px' } }} />
             <Paper elevation={0} variant="outlined" square style={{ borderRadius: '4px 4px 0 0' }}>
                 <Tabs
                     value={activeTab}