css cleanup for blockquotes, images, sidebar nav

mimecuvalo · Apr 28, 2024 · 8ae5e17 · 8ae5e17
1 parent aeda5eb
commit 8ae5e17
Show file tree

Hide file tree

Showing 2 changed files with 8 additions and 8 deletions.
diff --git a/components/ItemWrapper.tsx b/components/ItemWrapper.tsx
@@ -19,19 +19,16 @@ const StyledItemWrapper = styled('div', { label: 'ItemWrapper' })`
 
   // HTML Normalization below, used for Content and ContentRemote
   & p {
-    margin-block-start: ${(props) => props.theme.spacing(0.5)};
-    margin-block-end: ${(props) => props.theme.spacing(0.5)};
-    margin-inline-start: 0;
-    margin-inline-end: 0;
+    margin-block: ${(props) => props.theme.spacing(0.5)};
+    margin-inline: 0;
   }
 
   & ul,
   & ol,
   & blockquote {
-    margin-block-start: ${(props) => props.theme.spacing(0.5)};
-    margin-block-end: ${(props) => props.theme.spacing(0.5)};
-    margin-inline-start: 0;
-    margin-inline-end: 0;
+    margin-block: ${(props) => props.theme.spacing(0.5)};
+    margin-inline: 0;
+    padding-left: ${(props) => props.theme.spacing(2)};
   }
 
   ${(props) => props.theme.breakpoints.down('sm')} {
@@ -84,6 +81,7 @@ const StyledItemWrapper = styled('div', { label: 'ItemWrapper' })`
 
   & img:not([alt='thumbnail']) {
     max-height: calc(100vh - 50px);
+    height: auto;
   }
 
   ${(props) => props.theme.breakpoints.down('md')} {

diff --git a/components/content/SiteMap.tsx b/components/content/SiteMap.tsx
@@ -20,6 +20,8 @@ import { Drawer, useMediaQuery } from '@mui/material';
 export const SITE_MAP_WIDTH = 175;
 
 const Nav = styled('nav', transientOptions)`
+  position: sticky;
+  top: ${(props) => props.theme.spacing(1)};
   height: calc(100vh - ${(props) => props.theme.spacing(1)} * 2);
   width: ${SITE_MAP_WIDTH}px;
   overflow: auto;