Refactor: Decrease visual shortcut font size

This commit is contained in:
igorrCarvalho 2024-06-10 20:32:45 -03:00
commit 420bf4ba4d
3 changed files with 13 additions and 13 deletions

View file

@ -12,35 +12,35 @@ export default function RenderIcons({
shortcutWPlus: string[]; shortcutWPlus: string[];
}): JSX.Element { }): JSX.Element {
return hasShift ? ( return hasShift ? (
<> <span className="flex gap-0.5 text-xs">
{isMac ? ( {isMac ? (
<ForwardedIconComponent name="Command" className="h-4 w-4" /> <ForwardedIconComponent name="Command" className="h-3 w-3" />
) : ( ) : (
filteredShortcut[0] filteredShortcut[0]
)} )}
<ForwardedIconComponent name="ArrowBigUp" className="ml-1 h-5 w-5" /> <ForwardedIconComponent name="ArrowBigUp" className=" h-4 w-4" />
{filteredShortcut.map((key, idx) => { {filteredShortcut.map((key, idx) => {
if (idx > 0) { if (idx > 0) {
return <span className="ml-1"> {key.toUpperCase()} </span>; return <span className=""> {key.toUpperCase()} </span>;
} }
})} })}
</> </span>
) : ( ) : (
<> <span className="flex gap-1 text-xs">
{shortcutWPlus[0].toLowerCase() === "space" ? ( {shortcutWPlus[0].toLowerCase() === "space" ? (
"Space" "Space"
) : shortcutWPlus[0].length <= 1 ? ( ) : shortcutWPlus[0].length <= 1 ? (
shortcutWPlus[0] shortcutWPlus[0]
) : isMac ? ( ) : isMac ? (
<ForwardedIconComponent name="Command" className="h-4 w-4" /> <ForwardedIconComponent name="Command" className="h-3 w-3" />
) : ( ) : (
shortcutWPlus[0] shortcutWPlus[0]
)} )}
{shortcutWPlus.map((key, idx) => { {shortcutWPlus.map((key, idx) => {
if (idx > 0) { if (idx > 0) {
return <span className="ml-0.5"> {key.toUpperCase()} </span>; return <span className=""> {key.toUpperCase()} </span>;
} }
})} })}
</> </span>
); );
} }

View file

@ -352,7 +352,7 @@ export default function NodeToolbarComponent({
<div className="flex justify-center"> <div className="flex justify-center">
<span> {name} </span> <span> {name} </span>
<span <span
className={`ml-3 flex items-center rounded-sm bg-muted px-1 py-[0.2] text-muted-foreground`} className={`ml-3 flex items-center rounded-sm bg-muted px-1.5 py-[0.1em] text-lg text-muted-foreground`}
> >
<RenderIcons <RenderIcons
isMac={isMac} isMac={isMac}
@ -707,7 +707,7 @@ export default function NodeToolbarComponent({
/>{" "} />{" "}
<span className="">Delete</span>{" "} <span className="">Delete</span>{" "}
<span <span
className={`justify absolute right-2 top-2 flex items-center rounded-sm px-1 py-[0.2] ${deleteIsFocus ? " " : "bg-muted"}`} className={` absolute right-2 top-2 flex items-center justify-center rounded-sm px-1 py-[0.2] ${deleteIsFocus ? " " : "bg-muted"}`}
> >
<IconComponent <IconComponent
name="Delete" name="Delete"

View file

@ -19,7 +19,7 @@ export default function ToolbarSelectItem({
} }
}); });
const filteredShortcut = fixedShortcut.filter( const filteredShortcut = fixedShortcut.filter(
(key) => !key.toLowerCase().includes("shift") (key) => !key.toLowerCase().includes("shift"),
); );
let shortcutWPlus: string[] = []; let shortcutWPlus: string[] = [];
if (!hasShift) shortcutWPlus = filteredShortcut.join("+").split(" "); if (!hasShift) shortcutWPlus = filteredShortcut.join("+").split(" ");
@ -38,7 +38,7 @@ export default function ToolbarSelectItem({
{value} {value}
</span> </span>
<span <span
className={`absolute right-2 top-[0.43em] flex items-center rounded-sm bg-muted px-1 py-[0.2] text-muted-foreground `} className={`absolute right-2 top-[0.43em] flex items-center rounded-sm bg-muted px-1.5 py-[0.1em] text-muted-foreground `}
> >
<RenderIcons <RenderIcons
isMac={isMac} isMac={isMac}