Skip to content

Commit 28f770c

Browse files
aidanCQaidanCQ
committed
fix(): Replace bg-transpernt with card.
1 parent b60e80c commit 28f770c

File tree

11 files changed

+271
-269
lines changed

11 files changed

+271
-269
lines changed

‎src/custom/docs/components/header/CodeCopy.tsx

+29-21
Original file line numberDiff line numberDiff line change
@@ -1,32 +1,40 @@
1-
'use client'
2-
import React from "react"
1+
"use client";
2+
import React from "react";
33

4-
import {Button, cn} from 'src'
5-
import { Check, Copy } from "lucide-react"
6-
export const CodeCopy = (props: {textToCopy: string, className?: string}) => {
4+
import { Button, cn } from "src";
5+
import { Check, Copy } from "lucide-react";
6+
export const CodeCopy = (props: { textToCopy: string; className?: string }) => {
7+
const [copied, setHasCopied] = React.useState(false);
78

8-
const [copied, setHasCopied] = React.useState(false)
9-
10-
return <div className="dark:text-foreground text-background w-full flex items-center justify-center self-start whitespace-nowrap rounded bg-gradient-to-r from-zinc-600 to-slate-600 py-0.5 pl-4 text-center text-sm font-semibold dark:from-zinc-600 dark:to-slate-600">
11-
<code className="font-mono">{props.textToCopy}</code>
9+
return (
10+
<div className='dark:text-foreground text-background w-full flex items-center justify-center self-start whitespace-nowrap rounded bg-gradient-to-r from-zinc-600 to-slate-600 py-0.5 pl-4 text-center text-sm font-semibold dark:from-zinc-600 dark:to-slate-600'>
11+
<code className='font-mono'>{props.textToCopy}</code>
1212

13-
<Button
14-
variant="ghost"
15-
size="icon"
16-
className={cn(`${copied ? ' hover:bg-transparent' : 'hover:bg-background/50 hover:text-foreground/75'} ml-1`, props.className)}
13+
<Button
14+
variant='ghost'
15+
size='icon'
16+
className={cn(
17+
`${
18+
copied
19+
? " hover:bg-card"
20+
: "hover:bg-background/50 hover:text-foreground/75"
21+
} ml-1`,
22+
props.className
23+
)}
1724
onClick={() => {
18-
window.navigator.clipboard.writeText(props.textToCopy)
19-
setHasCopied(true)
25+
window.navigator.clipboard.writeText(props.textToCopy);
26+
setHasCopied(true);
2027
setTimeout(() => {
21-
setHasCopied(false)
22-
}, 2500)
28+
setHasCopied(false);
29+
}, 2500);
2330
}}
2431
>
2532
{copied ? (
26-
<Check className="text-background h-5 w-5"></Check>
33+
<Check className='text-background h-5 w-5'></Check>
2734
) : (
28-
<Copy className="aspect-square h-4 w-4"></Copy>
35+
<Copy className='aspect-square h-4 w-4'></Copy>
2936
)}
3037
</Button>
31-
</div>
32-
}
38+
</div>
39+
);
40+
};

‎src/shadcn/ui/button.tsx

+1-1
Original file line numberDiff line numberDiff line change
@@ -14,7 +14,7 @@ const buttonVariants = cva(
1414
destructive:
1515
"bg-destructive text-destructive-foreground shadow-sm hover:bg-destructive/90",
1616
outline:
17-
"border border-input bg-transparent shadow-sm hover:bg-accent hover:text-accent-foreground",
17+
"border border-input bg-card shadow-sm hover:bg-accent hover:text-accent-foreground",
1818
secondary:
1919
"bg-secondary text-secondary-foreground shadow-sm hover:bg-secondary/80",
2020
ghost: "hover:bg-accent hover:text-accent-foreground",

‎src/shadcn/ui/calendar.tsx

+3-3
Original file line numberDiff line numberDiff line change
@@ -27,7 +27,7 @@ function Calendar({
2727
nav: "space-x-1 flex items-center",
2828
nav_button: cn(
2929
buttonVariants({ variant: "outline" }),
30-
"h-7 w-7 bg-transparent p-0 opacity-50 hover:opacity-100"
30+
"h-7 w-7 bg-card p-0 opacity-50 hover:opacity-100"
3131
),
3232
nav_button_previous: "absolute left-1",
3333
nav_button_next: "absolute right-1",
@@ -60,8 +60,8 @@ function Calendar({
6060
...classNames,
6161
}}
6262
components={{
63-
IconLeft: ({ ...props }) => <ChevronLeftIcon className="h-4 w-4" />,
64-
IconRight: ({ ...props }) => <ChevronRightIcon className="h-4 w-4" />,
63+
IconLeft: ({ ...props }) => <ChevronLeftIcon className='h-4 w-4' />,
64+
IconRight: ({ ...props }) => <ChevronRightIcon className='h-4 w-4' />,
6565
}}
6666
{...props}
6767
/>

‎src/shadcn/ui/command.tsx

+8-8
Original file line numberDiff line numberDiff line change
@@ -28,8 +28,8 @@ interface CommandDialogProps extends DialogProps {}
2828
const CommandDialog = ({ children, ...props }: CommandDialogProps) => {
2929
return (
3030
<Dialog {...props}>
31-
<DialogContent className="overflow-hidden p-0">
32-
<Command className="[&_[cmdk-group-heading]]:px-2 [&_[cmdk-group-heading]]:font-medium [&_[cmdk-group-heading]]:text-muted-foreground [&_[cmdk-group]:not([hidden])_~[cmdk-group]]:pt-0 [&_[cmdk-group]]:px-2 [&_[cmdk-input-wrapper]_svg]:h-5 [&_[cmdk-input-wrapper]_svg]:w-5 [&_[cmdk-input]]:h-12 [&_[cmdk-item]]:px-2 [&_[cmdk-item]]:py-3 [&_[cmdk-item]_svg]:h-5 [&_[cmdk-item]_svg]:w-5">
31+
<DialogContent className='overflow-hidden p-0'>
32+
<Command className='[&_[cmdk-group-heading]]:px-2 [&_[cmdk-group-heading]]:font-medium [&_[cmdk-group-heading]]:text-muted-foreground [&_[cmdk-group]:not([hidden])_~[cmdk-group]]:pt-0 [&_[cmdk-group]]:px-2 [&_[cmdk-input-wrapper]_svg]:h-5 [&_[cmdk-input-wrapper]_svg]:w-5 [&_[cmdk-input]]:h-12 [&_[cmdk-item]]:px-2 [&_[cmdk-item]]:py-3 [&_[cmdk-item]_svg]:h-5 [&_[cmdk-item]_svg]:w-5'>
3333
{children}
3434
</Command>
3535
</DialogContent>
@@ -41,12 +41,12 @@ const CommandInput = React.forwardRef<
4141
React.ElementRef<typeof CommandPrimitive.Input>,
4242
React.ComponentPropsWithoutRef<typeof CommandPrimitive.Input>
4343
>(({ className, ...props }, ref) => (
44-
<div className="flex items-center border-b px-3" cmdk-input-wrapper="">
45-
<MagnifyingGlassIcon className="mr-2 h-4 w-4 shrink-0 opacity-50" />
44+
<div className='flex items-center border-b px-3' cmdk-input-wrapper=''>
45+
<MagnifyingGlassIcon className='mr-2 h-4 w-4 shrink-0 opacity-50' />
4646
<CommandPrimitive.Input
4747
ref={ref}
4848
className={cn(
49-
"flex h-10 w-full rounded-md bg-transparent py-3 text-sm outline-none placeholder:text-muted-foreground disabled:cursor-not-allowed disabled:opacity-50",
49+
"flex h-10 w-full rounded-md bg-card py-3 text-sm outline-none placeholder:text-muted-foreground disabled:cursor-not-allowed disabled:opacity-50",
5050
className
5151
)}
5252
{...props}
@@ -75,7 +75,7 @@ const CommandEmpty = React.forwardRef<
7575
>((props, ref) => (
7676
<CommandPrimitive.Empty
7777
ref={ref}
78-
className="py-6 text-center text-sm"
78+
className='py-6 text-center text-sm'
7979
{...props}
8080
/>
8181
));
@@ -117,8 +117,8 @@ const CommandItem = React.forwardRef<
117117
<CommandPrimitive.Item
118118
ref={ref}
119119
className={cn(
120-
'relative flex cursor-default select-none items-center rounded-sm px-2 py-1.5 text-sm outline-none aria-selected:bg-accent aria-selected:text-accent-foreground data-[disabled=true]:pointer-events-none data-[disabled=true]:opacity-50',
121-
props.disabled ? 'opacity-50 pointer-events-none' : '',
120+
"relative flex cursor-default select-none items-center rounded-sm px-2 py-1.5 text-sm outline-none aria-selected:bg-accent aria-selected:text-accent-foreground data-[disabled=true]:pointer-events-none data-[disabled=true]:opacity-50",
121+
props.disabled ? "opacity-50 pointer-events-none" : "",
122122
className
123123
)}
124124
{...props}

‎src/shadcn/ui/input.tsx

+1-1
Original file line numberDiff line numberDiff line change
@@ -11,7 +11,7 @@ const Input = React.forwardRef<HTMLInputElement, InputProps>(
1111
<input
1212
type={type}
1313
className={cn(
14-
"flex h-9 w-full rounded-md border border-input bg-transparent px-3 py-1 text-sm shadow-sm transition-colors file:border-0 file:text-sm file:font-medium placeholder:text-muted-foreground focus-visible:outline-none focus-visible:ring-1 focus-visible:ring-ring disabled:cursor-not-allowed disabled:opacity-50",
14+
"flex h-9 w-full rounded-md border border-input bg-card px-3 py-1 text-sm shadow-sm transition-colors file:border-0 file:text-sm file:font-medium placeholder:text-muted-foreground focus-visible:outline-none focus-visible:ring-1 focus-visible:ring-ring disabled:cursor-not-allowed disabled:opacity-50",
1515
className
1616
)}
1717
ref={ref}

0 commit comments

Comments
 (0)