style: sizing and break points for workout grid dashboard
This commit is contained in:
parent
db89c3e551
commit
0f5f6409cc
@ -3,14 +3,14 @@ import { DashboardContent, DashboardContentSection } from '@/components/Dashboar
|
|||||||
|
|
||||||
const WorkoutsPage = () => {
|
const WorkoutsPage = () => {
|
||||||
return (
|
return (
|
||||||
<DashboardContent className="grid grid-cols-2">
|
<DashboardContent className="grid grid-cols-1 xl:grid-cols-2">
|
||||||
<DashboardContentSection className="col-span-1">
|
<DashboardContentSection className="col-span-1 xl:max-w-lg md:ml-0">
|
||||||
<h1>Workouts</h1>
|
<h1>Workouts</h1>
|
||||||
</DashboardContentSection>
|
</DashboardContentSection>
|
||||||
<DashboardContentSection className="col-span-1">
|
<DashboardContentSection className="col-span-1 xl:max-w-lg md:mr-0">
|
||||||
<h1>Exercises</h1>
|
<h1>Exercises</h1>
|
||||||
</DashboardContentSection>
|
</DashboardContentSection>
|
||||||
<DashboardContentSection className="col-span-2">
|
<DashboardContentSection className="col-span-1 xl:col-span-2">
|
||||||
<h1>Clients</h1>
|
<h1>Clients</h1>
|
||||||
</DashboardContentSection>
|
</DashboardContentSection>
|
||||||
</DashboardContent>
|
</DashboardContent>
|
||||||
|
@ -9,7 +9,7 @@ type Props = {
|
|||||||
const DashboardContent = (props: Props) => {
|
const DashboardContent = (props: Props) => {
|
||||||
const { children, className } = props
|
const { children, className } = props
|
||||||
return (
|
return (
|
||||||
<div className={cn('flex flex-1 flex-col gap-4 p-4 mx-auto w-full max-w-5xl', className || '')}>
|
<div className={cn('flex flex-1 flex-col gap-4 p-4 mx-auto w-full max-w-6xl', className || '')}>
|
||||||
{children}
|
{children}
|
||||||
</div>
|
</div>
|
||||||
)
|
)
|
||||||
|
Loading…
x
Reference in New Issue
Block a user