wkc/lcm-potty-chart
Archived
1
0
Fork 0
Code Issues Pull Requests 2 Actions Packages Projects Releases Wiki Activity

Responsive layout

Browse Source
This commit is contained in:
Lucid Kobold
2022-06-22 15:20:09 -05:00
parent ac316918fe
commit a05f830407
2 changed files with 8 additions and 7 deletions
Download Patch File Download Diff File Expand all files Collapse all files

6
src/components/tutorial/CalenderExample.tsx
View File

@@ -72,7 +72,7 @@ const CalenderExample = ({ type }: CalenderExampleProps): JSX.Element => {
return (
<VStack h="8.5rem" w="100%" spacing={0}>
<HStack
px={6}
px={{ base: 1, sm: 2, md: 6 }}
spacing={0}
w="100%"
h="auto"
@@ -108,7 +108,7 @@ const CalenderExample = ({ type }: CalenderExampleProps): JSX.Element => {
);
})}
</HStack>
<SimpleGrid px={6} w="100%" h="100%" columns={7} alignItems="center">
<SimpleGrid px={{ base: 1, sm: 2, md: 6 }} w="100%" h="100%" columns={7} alignItems="center">
{currWeek.map((day: MonthDay) => {
const { date, isOverflow, overflowDirection } = day;
@@ -142,7 +142,7 @@ const CalenderExample = ({ type }: CalenderExampleProps): JSX.Element => {
id.length
? id
: format(toDateObj, "yyyyddLL") +
`/${sticker === null ? 0 : sticker}`
`/${sticker === null ? 0 : sticker}`
}
/>
);