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

refactor(v4.0.0-alpha): beginning of a new era

Browse Source
This commit is contained in:
Amruth Pillai
2023-11-05 12:31:42 +01:00
parent 0ba6a444e2
commit 22933bd412
505 changed files with 81829 additions and 0 deletions
Download Patch File Download Diff File Expand all files Collapse all files

97
apps/client/src/pages/builder/sidebars/right/sections/page.tsx Normal file
View File

@ -0,0 +1,97 @@
import {
Label,
Select,
SelectContent,
SelectItem,
SelectTrigger,
SelectValue,
Slider,
Switch,
} from "@reactive-resume/ui";
import { useResumeStore } from "@/client/stores/resume";
import { getSectionIcon } from "../shared/section-icon";
export const PageSection = () => {
const setValue = useResumeStore((state) => state.setValue);
const page = useResumeStore((state) => state.resume.data.metadata.page);
return (
<section id="theme" className="grid gap-y-6">
<header className="flex items-center justify-between">
<div className="flex items-center gap-x-4">
{getSectionIcon("page")}
<h2 className="line-clamp-1 text-3xl font-bold">Page</h2>
</div>
</header>
<main className="grid gap-y-4">
<div className="space-y-1.5">
<Label>Format</Label>
<Select
value={page.format}
onValueChange={(value) => {
setValue("metadata.page.format", value);
}}
>
<SelectTrigger>
<SelectValue placeholder="Format" />
</SelectTrigger>
<SelectContent>
<SelectItem value="a4">A4</SelectItem>
<SelectItem value="letter">Letter</SelectItem>
</SelectContent>
</Select>
</div>
<div className="space-y-1.5">
<Label>Margin</Label>
<div className="flex items-center gap-x-4 py-1">
<Slider
min={0}
max={48}
step={2}
value={[page.margin]}
onValueChange={(value) => {
setValue("metadata.page.margin", value[0]);
}}
/>
<span className="text-base font-bold">{page.margin}</span>
</div>
</div>
<div className="space-y-1.5">
<Label>Options</Label>
<div className="py-2">
<div className="flex items-center gap-x-4">
<Switch
id="metadata.page.options.breakLine"
checked={page.options.breakLine}
onCheckedChange={(checked) => {
setValue("metadata.page.options.breakLine", checked);
}}
/>
<Label htmlFor="metadata.page.options.breakLine">Show Break Line</Label>
</div>
</div>
<div className="py-2">
<div className="flex items-center gap-x-4">
<Switch
id="metadata.page.options.pageNumbers"
checked={page.options.pageNumbers}
onCheckedChange={(checked) => {
setValue("metadata.page.options.pageNumbers", checked);
}}
/>
<Label htmlFor="metadata.page.options.pageNumbers">Show Page Numbers</Label>
</div>
</div>
</div>
</main>
</section>
);
};