matt/dashboard
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Fix app mobile layout

Browse Source
This commit is contained in:
Matt
2024-12-22 21:51:36 -05:00
parent c73cf57673
commit 3abd63b836
3 changed files with 12 additions and 9 deletions
Download Patch File Download Diff File Expand all files Collapse all files

15
dashboard/src/App.jsx
View File

@@ -82,29 +82,32 @@ const SmallLayout = () => {
const DashboardLayout = () => {
return (
<ScrollProvider>
<div className="min-h-screen max-w-[1800px] mx-auto">
<div className="min-h-screen max-w-[1600px] mx-auto">
<div className="p-4">
<Header />
</div>
<Navigation />
<div className="p-4 space-y-4">
<div className="grid grid-cols-12 gap-4">
<div className="col-span-8">
<div className="grid grid-cols-1 xl:grid-cols-6 gap-4">
<div className="2xl:col-span-4 col-span-6">
<div className="space-y-4 h-full w-full">
<StatCards />
</div>
</div>
<div className="col-span-4 h-[530px]">
<div className="xl:col-span-2 col-span-6 h-[530px] 2xl:block hidden">
<div className="h-full">
<div className="h-full"><EventFeed /></div>
</div>
</div>
</div>
<div className="grid grid-cols-12 gap-4">
<div className="col-span-4 h-[740px]">
<div className="col-span-12 lg:col-span-6 xl:col-span-6 2xl:hidden h-[740px]">
<EventFeed />
</div>
<div className="col-span-12 lg:col-span-6 xl:col-span-6 2xl:col-span-4 h-[740px]">
<ProductGrid />
</div>
<div className="col-span-8 h-full w-full flex">
<div className="col-span-12 2xl:col-span-8 h-full w-full flex">
<SalesChart className="w-full h-full"/>
</div>
</div>

2
dashboard/src/components/dashboard/EventFeed.jsx
View File

@@ -1387,7 +1387,7 @@ const EventFeed = ({
);
return (
<Card className="flex flex-col h-full bg-white dark:bg-gray-900/60 backdrop-blur-sm">
<Card className="flex flex-col h-full bg-white dark:bg-gray-900/60 backdrop-blur-sm w-full">
<CardHeader className="p-6">
<div className="flex justify-between items-start">
<div>

4
dashboard/src/components/dashboard/Header.jsx
View File

@@ -133,7 +133,7 @@ const Header = () => {
)}
>
<CardContent className="p-4">
<div className="flex flex-col justify-between lg:flex-row items-left sm:items-center flex-wrap">
<div className="flex flex-col justify-between lg:flex-row items-center sm:items-center flex-wrap">
<div className="flex items-center space-x-4">
<div className="flex space-x-2">
<div
@@ -154,7 +154,7 @@ const Header = () => {
</h1>
</div>
</div>
<div className="flex items-left sm:items-center justify-start flex-wrap mt-2 sm:mt-0">
<div className="flex items-left sm:items-center justify-center flex-wrap mt-2 sm:mt-0">
{weather?.main && (
<>
<div className="flex-col items-center text-center">