remove scrollbar

mui · Aug 26, 2022 · 29daa29 · 29daa29
1 parent 922222e
commit 29daa29
Show file tree

Hide file tree

Showing 2 changed files with 63 additions and 56 deletions.
diff --git a/docs/src/components/productCore/CoreStyling.tsx b/docs/src/components/productCore/CoreStyling.tsx
@@ -56,9 +56,9 @@ const code = `
         borderRadius: 1,
         display: 'flex',
         typography: 'caption',
-        bgcolor: (theme) => 
+        bgcolor: (theme) =>
           theme.palette.mode === 'dark' ? 'primary.900' : 'primary.50',
-        color: (theme) => 
+        color: (theme) =>
           theme.palette.mode === 'dark' ? '#fff' : 'primary.700',
       }}
     >

diff --git a/docs/src/components/productCore/CoreTheming.tsx b/docs/src/components/productCore/CoreTheming.tsx
@@ -18,63 +18,70 @@ import MarkdownElement from 'docs/src/components/markdown/MarkdownElement';
 const lightTheme = createTheme();
 const darkTheme = createTheme({ palette: { mode: 'dark' } });
 
-const code = `        <Card
-variant="outlined"
-sx={{
-  p: 1,
-  display: 'flex',
-  flexDirection: { xs: 'column', sm: 'row' },
-}}
->
-<CardMedia
-  component="img"
-  width="124"
-  height="124"
-  alt="Beside Myself album cover"
-  src="/static/images/cards/basement-beside-myself.jpeg"
+const code = `
+<Card
+  variant="outlined"
   sx={{
-    borderRadius: 0.5,
-    width: 'clamp(124px, (304px - 100%) * 999 , 100%)',
+    p: 1,
+    display: 'flex',
+    flexDirection: { xs: 'column', sm: 'row' },
   }}
-/>
-<Box sx={{ alignSelf: 'center', px: { xs: 0, sm: 2 } }}>
-  <Typography
-    variant="body1"
-    color="text.primary"
-    fontWeight={600}
-    sx={{ textAlign: { xs: 'center', sm: 'start' }, mt: { xs: 1.5, sm: 0 } }}
-  >
-    Ultraviolet
-  </Typography>
-  <Typography
-    component="div"
-    variant="caption"
-    color="text.secondary"
-    fontWeight={500}
-    sx={{ textAlign: { xm: 'center', sm: 'start' } }}
-  >
-    Basement • Beside Myself
-  </Typography>
-  <Stack
-    direction="row"
-    spacing={1}
-    sx={{ mt: 2, justifyContent: { xs: 'space-between', sm: 'flex-start' } }}
-  >
-    <IconButton aria-label="fast rewind" disabled>
-      <FastRewindRounded />
-    </IconButton>
-    <IconButton
-      aria-label={paused ? 'play' : 'pause'}
-      sx={{ mx: 1 }}
-      onClick={() => setPaused((val) => !val)}
+>
+  <CardMedia
+    component="img"
+    width="124"
+    height="124"
+    alt="Beside Myself album cover"
+    src="/static/images/cards/basement-beside-myself.jpeg"
+    sx={{
+      borderRadius: 0.5,
+      width: 'clamp(124px, (304px - 100%) * 999 , 100%)',
+    }}
+  />
+  <Box sx={{ alignSelf: 'center', px: { xs: 0, sm: 2 } }}>
+    <Typography
+      variant="body1"
+      color="text.primary"
+      fontWeight={600}
+      sx={{
+        textAlign: { xs: 'center', sm: 'start' },
+        mt: { xs: 1.5, sm: 0 },
+      }}
+    >
+      Ultraviolet
+    </Typography>
+    <Typography
+      component="div"
+      variant="caption"
+      color="text.secondary"
+      fontWeight={500}
+      sx={{ textAlign: { xm: 'center', sm: 'start' } }}
+    >
+      Basement • Beside Myself
+    </Typography>
+    <Stack
+      direction="row"
+      spacing={1}
+      sx={{
+        mt: 2,
+        justifyContent: { xs: 'space-between', sm: 'flex-start' },
+      }}
     >
-      {paused ? <PlayArrowRounded /> : <PauseRounded />}
-    </IconButton>
-    <IconButton aria-label="fast forward" disabled>
-      <FastForwardRounded />
-    </IconButton>
-  </Stack>
-</Box>
+      <IconButton aria-label="fast rewind" disabled>
+        <FastRewindRounded />
+      </IconButton>
+      <IconButton
+        aria-label={paused ? 'play' : 'pause'}
+        sx={{ mx: 1 }}
+        onClick={() => setPaused((val) => !val)}
+      >
+        {paused ? <PlayArrowRounded /> : <PauseRounded />}
+      </IconButton>
+      <IconButton aria-label="fast forward" disabled>
+        <FastForwardRounded />
+      </IconButton>
+    </Stack>
+  </Box>
 </Card>`;
 
 export default function CoreTheming() {