Ryan/Reactive-Resume
1
0
Fork 0
mirror of https://github.com/AmruthPillai/Reactive-Resume.git synced 2025-11-19 03:01:53 +10:00
Code Issues Packages Projects Releases Wiki Activity

fix(mobile): check for responsiveness, add scrollarea support

Browse Source
This commit is contained in:
Amruth Pillai
2023-11-14 11:43:28 +01:00
parent 6303071410
commit 888b4db0bb
40 changed files with 491 additions and 397 deletions
Download Patch File Download Diff File Expand all files Collapse all files

2
apps/client/src/pages/dashboard/layout.tsx
View File

@ -11,7 +11,7 @@ export const DashboardLayout = () => {
return (
<div>
<div className="sticky top-0 z-50 flex items-center justify-between p-4 lg:hidden">
<div className="sticky top-0 z-50 flex items-center justify-between p-4 pb-0 lg:hidden">
<Sheet open={open} onOpenChange={setOpen}>
<SheetTrigger asChild>
<Button size="icon" variant="ghost" className="bg-background">

12
apps/client/src/pages/dashboard/resumes/page.tsx
View File

@ -1,6 +1,6 @@
import { t } from "@lingui/macro";
import { List, SquaresFour } from "@phosphor-icons/react";
import { Tabs, TabsContent, TabsList, TabsTrigger } from "@reactive-resume/ui";
import { ScrollArea, Tabs, TabsContent, TabsList, TabsTrigger } from "@reactive-resume/ui";
import { motion } from "framer-motion";
import { useState } from "react";
import { Helmet } from "react-helmet-async";
@ -21,7 +21,11 @@ export const ResumesPage = () => {
</title>
</Helmet>
<Tabs value={layout} onValueChange={(value) => setLayout(value as Layout)}>
<Tabs
value={layout}
onValueChange={(value) => setLayout(value as Layout)}
className="space-y-4"
>
<div className="flex items-center justify-between">
<motion.h1
initial={{ opacity: 0, x: -50 }}
@ -43,14 +47,14 @@ export const ResumesPage = () => {
</TabsList>
</div>
<div className="mt-12 md:mt-8">
<ScrollArea className="h-[calc(100vh-140px)] lg:h-[calc(100vh-88px)]">
<TabsContent value="grid">
<GridView />
</TabsContent>
<TabsContent value="list">
<ListView />
</TabsContent>
</div>
</ScrollArea>
</Tabs>
</>
);

26
apps/client/src/pages/dashboard/settings/page.tsx
View File

@ -1,5 +1,5 @@
import { t } from "@lingui/macro";
import { Separator } from "@reactive-resume/ui";
import { ScrollArea, Separator } from "@reactive-resume/ui";
import { motion } from "framer-motion";
import { Helmet } from "react-helmet-async";
@ -17,7 +17,7 @@ export const SettingsPage = () => (
</title>
</Helmet>
<div className="max-w-2xl space-y-8 pb-12">
<div className="max-w-2xl space-y-4">
<motion.h1
initial={{ opacity: 0, x: -50 }}
animate={{ opacity: 1, x: 0 }}
@ -26,15 +26,19 @@ export const SettingsPage = () => (
{t`Settings`}
</motion.h1>
<AccountSettings />
<Separator />
<SecuritySettings />
<Separator />
<ProfileSettings />
<Separator />
<OpenAISettings />
<Separator />
<DangerZoneSettings />
<ScrollArea hideScrollbar className="h-[calc(100vh-140px)] lg:h-[calc(100vh-88px)]">
<div className="space-y-6">
<AccountSettings />
<Separator />
<SecuritySettings />
<Separator />
<ProfileSettings />
<Separator />
<OpenAISettings />
<Separator />
<DangerZoneSettings />
</div>
</ScrollArea>
</div>
</>
);