feat(artboard): implement 8 new templates

This commit is contained in:
Amruth Pillai
2023-11-09 21:01:01 +01:00
parent 9acf7e8d22
commit 92bb9f96a0
37 changed files with 5422 additions and 1810 deletions

View File

@ -24,8 +24,8 @@ export const Page = ({ mode = "preview", pageNumber, children }: Props) => {
style={{
fontFamily,
padding: page.margin,
width: `${pageSizeMap[page.format].width * MM_TO_PX * window.devicePixelRatio}px`,
minHeight: `${pageSizeMap[page.format].height * MM_TO_PX * window.devicePixelRatio}px`,
width: `${pageSizeMap[page.format].width * MM_TO_PX}px`,
minHeight: `${pageSizeMap[page.format].height * MM_TO_PX}px`,
}}
>
{mode === "builder" && page.options.pageNumbers && (
@ -40,7 +40,7 @@ export const Page = ({ mode = "preview", pageNumber, children }: Props) => {
<div
className="absolute inset-x-0 border-b border-dashed"
style={{
top: `${pageSizeMap[page.format].height * MM_TO_PX * window.devicePixelRatio}px`,
top: `${pageSizeMap[page.format].height * MM_TO_PX}px`,
}}
/>
)}

View File

@ -1,8 +1,12 @@
import { isUrl } from "@reactive-resume/utils";
import { cn, isUrl } from "@reactive-resume/utils";
import { useArtboardStore } from "../store/artboard";
export const Picture = () => {
type PictureProps = {
className?: string;
};
export const Picture = ({ className }: PictureProps) => {
const picture = useArtboardStore((state) => state.resume.basics.picture);
if (!isUrl(picture.url) || picture.effects.hidden) return null;
@ -11,7 +15,7 @@ export const Picture = () => {
<img
src={picture.url}
alt="Profile"
className="object-cover"
className={cn("relative z-20 object-cover", className)}
style={{
maxWidth: `${picture.size}px`,
aspectRatio: `${picture.aspectRatio}`,