mirror of
https://github.com/AmruthPillai/Reactive-Resume.git
synced 2025-11-18 10:41:56 +10:00
feat(artboard): implement 8 new templates
This commit is contained in:
@ -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`,
|
||||
}}
|
||||
/>
|
||||
)}
|
||||
|
||||
@ -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}`,
|
||||
|
||||
Reference in New Issue
Block a user