mirror of https://github.com/jetkvm/kvm.git
revert info on field label
This commit is contained in:
parent
10dbdf783f
commit
95eb908fcf
|
@ -1,5 +1,4 @@
|
||||||
import React from "react";
|
import React from "react";
|
||||||
import { LuInfo } from "react-icons/lu";
|
|
||||||
|
|
||||||
import { cx } from "@/cva.config";
|
import { cx } from "@/cva.config";
|
||||||
|
|
||||||
|
@ -9,7 +8,6 @@ interface Props {
|
||||||
as?: "label" | "span";
|
as?: "label" | "span";
|
||||||
description?: string | React.ReactNode | null;
|
description?: string | React.ReactNode | null;
|
||||||
disabled?: boolean;
|
disabled?: boolean;
|
||||||
info?: string;
|
|
||||||
}
|
}
|
||||||
export default function FieldLabel({
|
export default function FieldLabel({
|
||||||
label,
|
label,
|
||||||
|
@ -17,36 +15,7 @@ export default function FieldLabel({
|
||||||
as = "label",
|
as = "label",
|
||||||
description,
|
description,
|
||||||
disabled,
|
disabled,
|
||||||
info,
|
|
||||||
}: Props) {
|
}: Props) {
|
||||||
const labelContent = (
|
|
||||||
<>
|
|
||||||
<div className="flex items-center gap-1">
|
|
||||||
{label}
|
|
||||||
{info && (
|
|
||||||
<div className="group relative cursor-pointer">
|
|
||||||
<LuInfo className={cx(
|
|
||||||
"h-4 w-4",
|
|
||||||
"text-blue-500 hover:text-blue-600 dark:text-blue-400 dark:hover:text-blue-300"
|
|
||||||
)} />
|
|
||||||
<div className={cx(
|
|
||||||
"absolute left-1/2 top-full z-10 mt-1 hidden w-64 -translate-x-1/2",
|
|
||||||
"rounded-md bg-slate-800 px-3 py-2 text-xs text-white shadow-lg",
|
|
||||||
"group-hover:block dark:bg-slate-700"
|
|
||||||
)}>
|
|
||||||
<p>{info}</p>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
)}
|
|
||||||
</div>
|
|
||||||
{description && (
|
|
||||||
<span className="my-0.5 text-[13px] font-normal text-slate-600 dark:text-slate-400">
|
|
||||||
{description}
|
|
||||||
</span>
|
|
||||||
)}
|
|
||||||
</>
|
|
||||||
);
|
|
||||||
|
|
||||||
if (as === "label") {
|
if (as === "label") {
|
||||||
return (
|
return (
|
||||||
<label
|
<label
|
||||||
|
@ -56,15 +25,25 @@ export default function FieldLabel({
|
||||||
disabled && "opacity-50",
|
disabled && "opacity-50",
|
||||||
)}
|
)}
|
||||||
>
|
>
|
||||||
{labelContent}
|
{label}
|
||||||
|
{description && (
|
||||||
|
<span className="my-0.5 text-[13px] font-normal text-slate-600 dark:text-slate-400">
|
||||||
|
{description}
|
||||||
|
</span>
|
||||||
|
)}
|
||||||
</label>
|
</label>
|
||||||
);
|
);
|
||||||
} else if (as === "span") {
|
} else if (as === "span") {
|
||||||
return (
|
return (
|
||||||
<div className="flex select-none flex-col">
|
<div className="flex select-none flex-col">
|
||||||
<span className="font-display text-[13px] font-medium leading-snug text-black dark:text-white">
|
<span className="font-display text-[13px] font-medium leading-snug text-black dark:text-white">
|
||||||
{labelContent}
|
{label}
|
||||||
</span>
|
</span>
|
||||||
|
{description && (
|
||||||
|
<span className="my-0.5 text-[13px] font-normal text-slate-600 dark:text-slate-400">
|
||||||
|
{description}
|
||||||
|
</span>
|
||||||
|
)}
|
||||||
</div>
|
</div>
|
||||||
);
|
);
|
||||||
} else {
|
} else {
|
||||||
|
|
Loading…
Reference in New Issue