starred/zenblog
1
0
Fork 0
mirror of https://github.com/jordienr/zenblog.git synced 2026-09-26 09:10:44 -04:00
Code Issues Packages Projects Releases Wiki Activity

improve checkbox

Browse Source
This commit is contained in:
Jordi Enric
2024-05-03 02:34:41 +02:00
parent 152bc80113
commit ce59e46502
2 changed files with 6 additions and 4 deletions
Download Patch File Download Diff File Expand all files Collapse all files
apps/web/src/components/Editor/ZendoEditor.tsx
+5 -3
View File
@@ -43,6 +43,7 @@ import { Database } from "@/types/supabase";
import { useBlogTags } from "./Editor.queries";
import { TagPicker } from "../Tags/TagPicker";
import { cn } from "@/lib/utils";
import { Checkbox } from "../ui/checkbox";
const formSchema = z.object({
title: z.string(),
@@ -364,16 +365,17 @@ export const ZendoEditor = (props: Props) => {
)}
</div>
<div className="actions">
<Checkbox id="published" {...register("published")} />
<Label
className="mr-2 flex items-center gap-2 text-sm font-semibold"
className="flex cursor-pointer items-center py-1.5 text-xs font-medium text-zinc-600 transition-all hover:text-zinc-800"
htmlFor="published"
>
<input
{/* <input
type="checkbox"
id="published"
{...register("published")}
className="h-4 w-4 rounded-lg border-none border-zinc-200 bg-transparent p-2 text-zinc-800 outline-none transition-all hover:bg-zinc-50 focus-visible:bg-zinc-100"
/>
/> */}
Publish
</Label>
<Sheet>
apps/web/src/components/ui/checkbox.tsx
+1 -1
View File
@@ -11,7 +11,7 @@ const Checkbox = React.forwardRef<
<CheckboxPrimitive.Root
ref={ref}
className={cn(
"peer h-5 w-5 shrink-0 rounded-md border border-slate-400 ring-offset-white transition-all focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-slate-950 focus-visible:ring-offset-2 disabled:cursor-not-allowed disabled:opacity-50 data-[state=checked]:border-orange-700 data-[state=checked]:bg-orange-500 data-[state=checked]:text-slate-50 dark:border-slate-800 dark:ring-offset-slate-950 dark:focus-visible:ring-slate-300 dark:data-[state=checked]:bg-slate-50 dark:data-[state=checked]:text-slate-900",
"peer h-[18px] w-[18px] shrink-0 rounded-md border border-zinc-300 ring-offset-white transition-all focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-zinc-950 focus-visible:ring-offset-2 disabled:cursor-not-allowed disabled:opacity-50 data-[state=checked]:border-orange-500 data-[state=checked]:bg-orange-500 data-[state=checked]:text-zinc-50 dark:border-zinc-800 dark:ring-offset-zinc-950 dark:focus-visible:ring-zinc-300 dark:data-[state=checked]:bg-zinc-50 dark:data-[state=checked]:text-zinc-900",
className
)}
{...props}