fix: CSS Cleanup (#752)

Co-authored-by: Eric Pedley <[email protected]>
icssc · Oct 23, 2023 · 8086e10 · 8086e10
1 parent 485c412
commit 8086e10
Show file tree

Hide file tree

Showing 7 changed files with 19 additions and 11 deletions.
diff --git a/apps/antalmanac/src/components/Calendar/CalendarRoot.tsx b/apps/antalmanac/src/components/Calendar/CalendarRoot.tsx
@@ -36,7 +36,7 @@ CalendarRoot
 
 const styles: Styles<Theme, object> = {
     container: {
-        margin: '0px 4px 4px 4px',
+        margin: '0px 4px',
         borderRadius: '1px',
     },
     firstLineContainer: {

diff --git a/apps/antalmanac/src/components/Calendar/CalendarToolbar.tsx b/apps/antalmanac/src/components/Calendar/CalendarToolbar.tsx
@@ -273,7 +273,14 @@ function CalendarPaneToolbar(props: CalendarPaneToolbarProps) {
         <Paper
             elevation={0}
             variant="outlined"
-            sx={{ display: 'flex', flexWrap: 'wrap', gap: 1, alignItems: 'center', padding: 1 }}
+            sx={{
+                display: 'flex',
+                flexWrap: 'wrap',
+                gap: 1,
+                alignItems: 'center',
+                padding: 1,
+                borderRadius: '4px 4px 0 0',
+            }}
         >
             <Box gap={1} display="flex" alignItems="center">
                 <SelectSchedulePopover scheduleNames={scheduleNames} />

diff --git a/apps/antalmanac/src/components/RightPane/AddedCourses/AddedCoursePane.tsx b/apps/antalmanac/src/components/RightPane/AddedCourses/AddedCoursePane.tsx
@@ -375,5 +375,5 @@ export default function AddedCoursePaneFunctionComponent() {
         };
     }, []);
 
-    return <Box padding={1}>{skeletonMode ? <SkeletonSchedule /> : <AddedSectionsGrid />}</Box>;
+    return <Box>{skeletonMode ? <SkeletonSchedule /> : <AddedSectionsGrid />}</Box>;
 }
diff --git a/apps/antalmanac/src/components/RightPane/CoursePane/CoursePaneRoot.tsx b/apps/antalmanac/src/components/RightPane/CoursePane/CoursePaneRoot.tsx
@@ -57,7 +57,7 @@ function RightPane() {
     }, []);
 
     return (
-        <div style={{ height: '100%', padding: 8 }}>
+        <div style={{ height: '100%' }}>
             <CoursePaneButtonRow
                 showSearch={!RightPaneStore.getDoDisplaySearch()}
                 onDismissSearchResults={toggleSearch}

diff --git a/apps/antalmanac/src/components/RightPane/CoursePane/CourseRenderPane.tsx b/apps/antalmanac/src/components/RightPane/CoursePane/CourseRenderPane.tsx
@@ -42,6 +42,7 @@ function flattenSOCObject(SOCObject: WebsocAPIResponse): (WebsocSchool | WebsocD
         return accumulator;
     }, []);
 }
+
 const RecruitmentBanner = () => {
     const [bannerVisibility, setBannerVisibility] = React.useState<boolean>(true);
 

diff --git a/apps/antalmanac/src/components/RightPane/RightPaneRoot.tsx b/apps/antalmanac/src/components/RightPane/RightPaneRoot.tsx
@@ -48,8 +48,8 @@ export default function Desktop({ style }: DesktopTabsProps) {
     const { activeTab, setActiveTab } = useTabStore();
 
     return (
-        <div style={style}>
-            <Paper elevation={0} variant="outlined" square>
+        <Box style={{ ...style, margin: '0 4px' }}>
+            <Paper elevation={0} variant="outlined" square style={{ borderRadius: '4px 4px 0 0' }}>
                 <Tabs
                     value={activeTab}
                     onChange={(_event, value) => setActiveTab(value)}
@@ -69,12 +69,12 @@ export default function Desktop({ style }: DesktopTabsProps) {
                                 </div>
                             }
                             to={tab.href}
-                            style={{ minHeight: 'auto', height: '44px', padding: 3 }}
+                            style={{ minHeight: 'auto', height: '44px', padding: 3, minWidth: '33%' }}
                         />
                     ))}
                 </Tabs>
             </Paper>
-            <Box height="calc(100% - 54px)" overflow="auto">
+            <Box height="calc(100% - 54px)" overflow="auto" style={{ margin: '8px 4px 0px' }}>
                 {activeTab === 0 && <CoursePane />}
                 {activeTab === 1 && <AddedCoursePane />}
                 {activeTab === 2 && (
@@ -89,6 +89,6 @@ export default function Desktop({ style }: DesktopTabsProps) {
                     </Suspense>
                 )}
             </Box>
-        </div>
+        </Box>
     );
 }
diff --git a/apps/antalmanac/src/components/RightPane/SectionTable/SectionTable.tsx b/apps/antalmanac/src/components/RightPane/SectionTable/SectionTable.tsx
@@ -13,6 +13,7 @@ import {
     useMediaQuery,
 } from '@material-ui/core';
 import { Assessment, Help, RateReview, ShowChart as ShowChartIcon } from '@material-ui/icons';
+import { GlobalStyles } from '@mui/material';
 import { MOBILE_BREAKPOINT } from '../../../globals';
 import CourseInfoBar from './CourseInfoBar';
 import CourseInfoButton from './CourseInfoButton';
@@ -21,7 +22,6 @@ import { SectionTableProps } from './SectionTable.types';
 import SectionTableBody from './SectionTableBody';
 import useColumnStore, { SECTION_TABLE_COLUMNS, type SectionTableColumn } from '$stores/ColumnStore';
 import analyticsEnum from '$lib/analytics';
-import { GlobalStyles } from '@mui/material';
 
 const TOTAL_NUM_COLUMNS = SECTION_TABLE_COLUMNS.length;
 
@@ -128,7 +128,7 @@ function SectionTable(props: SectionTableProps) {
 
     return (
         <>
-            <GlobalStyles styles={{'*::-webkit-scrollbar': {height: '8px'}}}/>
+            <GlobalStyles styles={{ '*::-webkit-scrollbar': { height: '8px' } }} />
             <Box style={{ display: 'flex', gap: 4, marginTop: 4, marginBottom: 8 }}>
                 <CourseInfoBar
                     deptCode={courseDetails.deptCode}
-Original file line number
+Diff line change
@@ Expand Up @@
             };
         }, []);
-        return <Box padding={1}>{skeletonMode ? <SkeletonSchedule /> : <AddedSectionsGrid />}</Box>;
+        return <Box>{skeletonMode ? <SkeletonSchedule /> : <AddedSectionsGrid />}</Box>;
     }