feat: add widget preview pages (#9)

* feat: add widget definition system

* fix: wrong typecheck command in turbo generator

* chore: fix formatting

* feat: add widget preview page

* chore: fix formatting and type errors

* chore: fix from widget edit modal and remove some never casts

* chore: address pull request feedback
This commit is contained in:
Meier Lukas
2024-01-02 15:36:59 +01:00
committed by GitHub
parent fa19966fcc
commit 782897527f
48 changed files with 1226 additions and 81 deletions

View File

@@ -1,5 +1,6 @@
import Image from "next/image";
import type { TitleOrder } from "@homarr/ui";
import { Group, Title } from "@homarr/ui";
interface LogoProps {
@@ -7,12 +8,26 @@ interface LogoProps {
}
export const Logo = ({ size = 60 }: LogoProps) => (
<Image src="/logo/homarr.png" alt="homarr logo" width={size} height={size} />
<Image src="/logo/homarr.png" alt="Homarr logo" width={size} height={size} />
);
export const LogoWithTitle = () => (
<Group gap={0}>
<Logo size={48} />
<Title order={1}>lparr</Title>
</Group>
);
const logoWithTitleSizes = {
lg: { logoSize: 48, titleOrder: 1 },
md: { logoSize: 32, titleOrder: 2 },
sm: { logoSize: 24, titleOrder: 3 },
} satisfies Record<string, { logoSize: number; titleOrder: TitleOrder }>;
interface LogoWithTitleProps {
size: keyof typeof logoWithTitleSizes;
}
export const LogoWithTitle = ({ size }: LogoWithTitleProps) => {
const { logoSize, titleOrder } = logoWithTitleSizes[size];
return (
<Group gap={0} wrap="nowrap">
<Logo size={logoSize} />
<Title order={titleOrder}>lparr</Title>
</Group>
);
};