diff --git a/studio/frontend/src/components/assistant-ui/markdown-text.tsx b/studio/frontend/src/components/assistant-ui/markdown-text.tsx index 45a0082a57..02418753fa 100644 --- a/studio/frontend/src/components/assistant-ui/markdown-text.tsx +++ b/studio/frontend/src/components/assistant-ui/markdown-text.tsx @@ -8,7 +8,8 @@ import { copyToClipboard } from "@/lib/copy-to-clipboard"; import { preprocessLaTeX } from "@/lib/latex"; import { openLink } from "@/lib/open-link"; import { INTERNAL, useAuiState, useMessagePartText } from "@assistant-ui/react"; -import { Copy01Icon, Download01Icon, Tick02Icon } from "@hugeicons/core-free-icons"; +import { Tick02Icon } from "@/lib/tick-icon"; +import { Copy01Icon, Download01Icon } from "@hugeicons/core-free-icons"; import { HugeiconsIcon } from "@hugeicons/react"; import { createMathPlugin } from "@streamdown/math"; import { mermaid } from "@streamdown/mermaid"; diff --git a/studio/frontend/src/components/assistant-ui/thread.tsx b/studio/frontend/src/components/assistant-ui/thread.tsx index a69e493b4f..b63915fa35 100644 --- a/studio/frontend/src/components/assistant-ui/thread.tsx +++ b/studio/frontend/src/components/assistant-ui/thread.tsx @@ -86,6 +86,7 @@ import { applyQwenThinkingParams } from "@/features/chat/utils/qwen-params"; import { isTauri } from "@/lib/api-base"; import { copyToClipboard } from "@/lib/copy-to-clipboard"; import { toast } from "@/lib/toast"; +import { Tick02Icon } from "@/lib/tick-icon"; import { cn } from "@/lib/utils"; import { ActionBarMorePrimitive, @@ -115,7 +116,6 @@ import { Image03Icon, McpServerIcon, PencilRulerIcon, - Tick02Icon, } from "@hugeicons/core-free-icons"; import { HugeiconsIcon } from "@hugeicons/react"; import { useNavigate } from "@tanstack/react-router"; diff --git a/studio/frontend/src/components/ui/checkbox.tsx b/studio/frontend/src/components/ui/checkbox.tsx index 32b639db63..edd8965348 100644 --- a/studio/frontend/src/components/ui/checkbox.tsx +++ b/studio/frontend/src/components/ui/checkbox.tsx @@ -4,8 +4,8 @@ import { Checkbox as CheckboxPrimitive } from "radix-ui"; import type * as React from "react"; +import { Tick02Icon } from "@/lib/tick-icon"; import { cn } from "@/lib/utils"; -import { Tick02Icon } from "@hugeicons/core-free-icons"; import { HugeiconsIcon } from "@hugeicons/react"; function Checkbox({ diff --git a/studio/frontend/src/components/ui/combobox.tsx b/studio/frontend/src/components/ui/combobox.tsx index 2a31affc22..7bf0d7bf75 100644 --- a/studio/frontend/src/components/ui/combobox.tsx +++ b/studio/frontend/src/components/ui/combobox.tsx @@ -17,11 +17,11 @@ import { InputGroupButton, InputGroupInput, } from "@/components/ui/input-group"; +import { Tick02Icon } from "@/lib/tick-icon"; import { cn } from "@/lib/utils"; import { ArrowDown01Icon, Cancel01Icon, - Tick02Icon, } from "@hugeicons/core-free-icons"; import { HugeiconsIcon } from "@hugeicons/react"; diff --git a/studio/frontend/src/components/ui/command.tsx b/studio/frontend/src/components/ui/command.tsx index 9fbf739bf7..72b15a712f 100644 --- a/studio/frontend/src/components/ui/command.tsx +++ b/studio/frontend/src/components/ui/command.tsx @@ -14,8 +14,9 @@ import { DialogTitle, } from "@/components/ui/dialog"; import { InputGroup, InputGroupAddon } from "@/components/ui/input-group"; +import { Tick02Icon } from "@/lib/tick-icon"; import { cn } from "@/lib/utils"; -import { Search01Icon, Tick02Icon } from "@hugeicons/core-free-icons"; +import { Search01Icon } from "@hugeicons/core-free-icons"; import { HugeiconsIcon } from "@hugeicons/react"; function Command({ diff --git a/studio/frontend/src/components/ui/context-menu.tsx b/studio/frontend/src/components/ui/context-menu.tsx index fbe0c2c741..f655fa4a16 100644 --- a/studio/frontend/src/components/ui/context-menu.tsx +++ b/studio/frontend/src/components/ui/context-menu.tsx @@ -6,8 +6,9 @@ import { ContextMenu as ContextMenuPrimitive } from "radix-ui"; import type * as React from "react"; +import { Tick02Icon } from "@/lib/tick-icon"; import { cn } from "@/lib/utils"; -import { ArrowRight01Icon, Tick02Icon } from "@hugeicons/core-free-icons"; +import { ArrowRight01Icon } from "@hugeicons/core-free-icons"; import { HugeiconsIcon } from "@hugeicons/react"; function ContextMenu({ diff --git a/studio/frontend/src/components/ui/copyable-error-chip.tsx b/studio/frontend/src/components/ui/copyable-error-chip.tsx index 1d956a23fc..d4b386d375 100644 --- a/studio/frontend/src/components/ui/copyable-error-chip.tsx +++ b/studio/frontend/src/components/ui/copyable-error-chip.tsx @@ -9,8 +9,9 @@ import { PopoverTrigger, } from "@/components/ui/popover"; import { copyToClipboard } from "@/lib/copy-to-clipboard"; +import { Tick02Icon } from "@/lib/tick-icon"; import { cn } from "@/lib/utils"; -import { Copy01Icon, Tick02Icon } from "@hugeicons/core-free-icons"; +import { Copy01Icon } from "@hugeicons/core-free-icons"; import { HugeiconsIcon } from "@hugeicons/react"; import { useEffect, useRef, useState } from "react"; diff --git a/studio/frontend/src/components/ui/dropdown-menu.tsx b/studio/frontend/src/components/ui/dropdown-menu.tsx index 8948e86f8b..a9ea730774 100644 --- a/studio/frontend/src/components/ui/dropdown-menu.tsx +++ b/studio/frontend/src/components/ui/dropdown-menu.tsx @@ -4,8 +4,9 @@ import { DropdownMenu as DropdownMenuPrimitive } from "radix-ui"; import type * as React from "react"; +import { Tick02Icon } from "@/lib/tick-icon"; import { cn } from "@/lib/utils"; -import { ArrowRight01Icon, Tick02Icon } from "@hugeicons/core-free-icons"; +import { ArrowRight01Icon } from "@hugeicons/core-free-icons"; import { HugeiconsIcon } from "@hugeicons/react"; function DropdownMenu({ diff --git a/studio/frontend/src/components/ui/menubar.tsx b/studio/frontend/src/components/ui/menubar.tsx index 39c29f3a12..face4c5f86 100644 --- a/studio/frontend/src/components/ui/menubar.tsx +++ b/studio/frontend/src/components/ui/menubar.tsx @@ -6,8 +6,9 @@ import { Menubar as MenubarPrimitive } from "radix-ui"; import type * as React from "react"; +import { Tick02Icon } from "@/lib/tick-icon"; import { cn } from "@/lib/utils"; -import { ArrowRight01Icon, Tick02Icon } from "@hugeicons/core-free-icons"; +import { ArrowRight01Icon } from "@hugeicons/core-free-icons"; import { HugeiconsIcon } from "@hugeicons/react"; function Menubar({ diff --git a/studio/frontend/src/components/ui/select.tsx b/studio/frontend/src/components/ui/select.tsx index bb8e6e4e69..f3a6a41b68 100644 --- a/studio/frontend/src/components/ui/select.tsx +++ b/studio/frontend/src/components/ui/select.tsx @@ -7,12 +7,12 @@ import { Select as SelectPrimitive } from "radix-ui"; import type * as React from "react"; import { createContext, useContext, useState } from "react"; +import { Tick02Icon } from "@/lib/tick-icon"; import { cn } from "@/lib/utils"; import { useDialogPortalContainer } from "@/components/ui/dialog"; import { ArrowDown01Icon, ArrowUp01Icon, - Tick02Icon, UnfoldMoreIcon, } from "@hugeicons/core-free-icons"; import { HugeiconsIcon } from "@hugeicons/react"; diff --git a/studio/frontend/src/features/chat/components/project-switcher.tsx b/studio/frontend/src/features/chat/components/project-switcher.tsx index 028a9a137e..c531523eeb 100644 --- a/studio/frontend/src/features/chat/components/project-switcher.tsx +++ b/studio/frontend/src/features/chat/components/project-switcher.tsx @@ -11,8 +11,8 @@ import { import { ArrowDown01Icon, Folder01Icon, - Tick02Icon, } from "@hugeicons/core-free-icons"; +import { Tick02Icon } from "@/lib/tick-icon"; import { HugeiconsIcon } from "@hugeicons/react"; import type { ReactElement } from "react"; import type { ProjectRecord } from "../types"; diff --git a/studio/frontend/src/features/chat/mcp-composer-button.tsx b/studio/frontend/src/features/chat/mcp-composer-button.tsx index aecfe9b430..15b8b1db0b 100644 --- a/studio/frontend/src/features/chat/mcp-composer-button.tsx +++ b/studio/frontend/src/features/chat/mcp-composer-button.tsx @@ -1,7 +1,8 @@ // SPDX-License-Identifier: AGPL-3.0-only // Copyright 2026-present the Unsloth AI Inc. team. All rights reserved. See /studio/LICENSE.AGPL-3.0 -import { McpServerIcon, Tick02Icon } from "@hugeicons/core-free-icons"; +import { Tick02Icon } from "@/lib/tick-icon"; +import { McpServerIcon } from "@hugeicons/core-free-icons"; import { HugeiconsIcon } from "@hugeicons/react"; import { XIcon } from "lucide-react"; import { type FC, useCallback, useEffect, useState } from "react"; diff --git a/studio/frontend/src/features/chat/shared-composer.tsx b/studio/frontend/src/features/chat/shared-composer.tsx index a8fa2360a0..8f547f8307 100644 --- a/studio/frontend/src/features/chat/shared-composer.tsx +++ b/studio/frontend/src/features/chat/shared-composer.tsx @@ -7,6 +7,7 @@ import { thinkToggleAriaLabel, } from "@/components/assistant-ui/think-aria-label"; import { Button } from "@/components/ui/button"; +import { Tick02Icon } from "@/lib/tick-icon"; import { cn } from "@/lib/utils"; import { DropdownMenu, @@ -46,7 +47,6 @@ import { Image03Icon, McpServerIcon, PencilRulerIcon, - Tick02Icon, } from "@hugeicons/core-free-icons"; import { useNavigate } from "@tanstack/react-router"; import { HugeiconsIcon } from "@hugeicons/react"; diff --git a/studio/frontend/src/features/hub/catalog/hub-option-menu.tsx b/studio/frontend/src/features/hub/catalog/hub-option-menu.tsx index 5d7532d2c0..5469c5833b 100644 --- a/studio/frontend/src/features/hub/catalog/hub-option-menu.tsx +++ b/studio/frontend/src/features/hub/catalog/hub-option-menu.tsx @@ -6,8 +6,9 @@ import { PopoverContent, PopoverTrigger, } from "@/components/ui/popover"; +import { Tick02Icon } from "@/lib/tick-icon"; import { cn } from "@/lib/utils"; -import { ArrowDown01Icon, Tick02Icon } from "@hugeicons/core-free-icons"; +import { ArrowDown01Icon } from "@hugeicons/core-free-icons"; import { HugeiconsIcon } from "@hugeicons/react"; import { type KeyboardEvent, diff --git a/studio/frontend/src/features/hub/catalog/model-inspector.tsx b/studio/frontend/src/features/hub/catalog/model-inspector.tsx index 371eebea9b..24909b38aa 100644 --- a/studio/frontend/src/features/hub/catalog/model-inspector.tsx +++ b/studio/frontend/src/features/hub/catalog/model-inspector.tsx @@ -13,6 +13,7 @@ import { } from "@/features/hub/hooks/use-hub-model-search"; import { useOnlineStatus } from "@/features/hub/hooks/use-online-status"; import { formatBytes, formatRelativeShort } from "@/features/hub/lib/format"; +import { Tick02Icon } from "@/lib/tick-icon"; import { cn, formatCompact } from "@/lib/utils"; import { confirmExternalLink } from "../stores/external-link-confirm"; import { useHfTokenStore } from "@/features/hub/stores/hf-token-store"; @@ -30,7 +31,6 @@ import { PackageIcon, RamMemoryIcon, Share05Icon, - Tick02Icon, } from "@hugeicons/core-free-icons"; import type { IconSvgElement } from "@hugeicons/react"; import { HugeiconsIcon } from "@hugeicons/react"; diff --git a/studio/frontend/src/features/hub/catalog/path-info-button.tsx b/studio/frontend/src/features/hub/catalog/path-info-button.tsx index c2c897412c..ac97d7a582 100644 --- a/studio/frontend/src/features/hub/catalog/path-info-button.tsx +++ b/studio/frontend/src/features/hub/catalog/path-info-button.tsx @@ -13,11 +13,11 @@ import { TooltipContent, TooltipTrigger, } from "@/components/ui/tooltip"; +import { Tick02Icon } from "@/lib/tick-icon"; import { cn } from "@/lib/utils"; import { Copy01Icon, FolderSearchIcon, - Tick02Icon, } from "@hugeicons/core-free-icons"; import { HugeiconsIcon } from "@hugeicons/react"; import type { MouseEvent } from "react"; diff --git a/studio/frontend/src/features/rag/components/knowledge-base-composer-button.tsx b/studio/frontend/src/features/rag/components/knowledge-base-composer-button.tsx index e3c9c9b41f..0e2ce48d68 100644 --- a/studio/frontend/src/features/rag/components/knowledge-base-composer-button.tsx +++ b/studio/frontend/src/features/rag/components/knowledge-base-composer-button.tsx @@ -2,8 +2,9 @@ // Copyright 2026-present the Unsloth AI Inc. team. All rights reserved. See /studio/LICENSE.AGPL-3.0 import { XIcon } from "lucide-react"; +import { Tick02Icon } from "@/lib/tick-icon"; import { HugeiconsIcon } from "@hugeicons/react"; -import { FileDatabaseIcon, Tick02Icon } from "@hugeicons/core-free-icons"; +import { FileDatabaseIcon } from "@hugeicons/core-free-icons"; import { type FC, useCallback, useEffect, useState } from "react"; import { diff --git a/studio/frontend/src/features/recipe-studio/components/block-sheet.tsx b/studio/frontend/src/features/recipe-studio/components/block-sheet.tsx index 0ec50d09d6..1b38f91d64 100644 --- a/studio/frontend/src/features/recipe-studio/components/block-sheet.tsx +++ b/studio/frontend/src/features/recipe-studio/components/block-sheet.tsx @@ -21,9 +21,9 @@ import { DocumentAttachmentIcon, PlusSignIcon, Search01Icon, - Tick02Icon, Upload01Icon, } from "@hugeicons/core-free-icons"; +import { Tick02Icon } from "@/lib/tick-icon"; import { HugeiconsIcon } from "@hugeicons/react"; import { useCallback, diff --git a/studio/frontend/src/features/settings/components/key-reveal-card.tsx b/studio/frontend/src/features/settings/components/key-reveal-card.tsx index bdcb861c1d..aa4f67348b 100644 --- a/studio/frontend/src/features/settings/components/key-reveal-card.tsx +++ b/studio/frontend/src/features/settings/components/key-reveal-card.tsx @@ -4,8 +4,9 @@ import { Button } from "@/components/ui/button"; import { useT } from "@/i18n"; import { copyToClipboard } from "@/lib/copy-to-clipboard"; +import { Tick02Icon } from "@/lib/tick-icon"; import { cn } from "@/lib/utils"; -import { Copy01Icon, Tick02Icon } from "@hugeicons/core-free-icons"; +import { Copy01Icon } from "@hugeicons/core-free-icons"; import { HugeiconsIcon } from "@hugeicons/react"; import { useState } from "react"; diff --git a/studio/frontend/src/features/settings/components/update-studio-instructions.tsx b/studio/frontend/src/features/settings/components/update-studio-instructions.tsx index ef6bbf3c18..2b7855127a 100644 --- a/studio/frontend/src/features/settings/components/update-studio-instructions.tsx +++ b/studio/frontend/src/features/settings/components/update-studio-instructions.tsx @@ -3,11 +3,11 @@ import { copyToClipboard } from "@/lib/copy-to-clipboard"; import { useT } from "@/i18n"; +import { Tick02Icon } from "@/lib/tick-icon"; import { cn } from "@/lib/utils"; import { ArrowUpRight01Icon, Copy01Icon, - Tick02Icon, } from "@hugeicons/core-free-icons"; import { HugeiconsIcon } from "@hugeicons/react"; import { AnimatePresence, motion, useReducedMotion } from "motion/react"; diff --git a/studio/frontend/src/features/settings/components/usage-examples.tsx b/studio/frontend/src/features/settings/components/usage-examples.tsx index 96437b4840..2fd387062f 100644 --- a/studio/frontend/src/features/settings/components/usage-examples.tsx +++ b/studio/frontend/src/features/settings/components/usage-examples.tsx @@ -1,13 +1,13 @@ // SPDX-License-Identifier: AGPL-3.0-only // Copyright 2026-present the Unsloth AI Inc. team. All rights reserved. See /studio/LICENSE.AGPL-3.0 +import { Tick02Icon } from "@/lib/tick-icon"; import { cn } from "@/lib/utils"; import { copyToClipboard } from "@/lib/copy-to-clipboard"; import { useT } from "@/i18n"; import { ArrowUpRight01Icon, Copy01Icon, - Tick02Icon, } from "@hugeicons/core-free-icons"; import { HugeiconsIcon } from "@hugeicons/react"; import { useMemo, useState } from "react"; diff --git a/studio/frontend/src/index.css b/studio/frontend/src/index.css index 9299545da9..085ddb81f7 100644 --- a/studio/frontend/src/index.css +++ b/studio/frontend/src/index.css @@ -1313,16 +1313,16 @@ /* Soft elevation; [data-slot] outranks the component ring-1, dropping the border. */ .unsloth-plus-menu[data-slot] { - /* Concentric with the item hover boxes, like Gemini: container radius = - item radius (12px) + side gutter (10px), so the curves run parallel. + /* Concentric with the item hover boxes: container radius = + item radius (12px) + side gutter (9px), so the curves run parallel. !important beats the global 14px dropdown radius. */ - border-radius: 22px !important; + border-radius: 21px !important; padding-top: 0.5rem; padding-bottom: 0.5rem; - /* Side gutter so item hover boxes sit inset from the menu edge, like - Gemini's menus (more breathing room than a hairline gutter). */ - padding-left: 10px; - padding-right: 10px; + /* Side gutter ~matches the 0.5rem top/bottom padding so the hover box + sits evenly inset on all four sides. */ + padding-left: 9px; + padding-right: 9px; box-shadow: 0 2px 8px -2px rgba(0, 0, 0, 0.16); } diff --git a/studio/frontend/src/lib/tick-icon.ts b/studio/frontend/src/lib/tick-icon.ts new file mode 100644 index 0000000000..4971079bd2 --- /dev/null +++ b/studio/frontend/src/lib/tick-icon.ts @@ -0,0 +1,22 @@ +// SPDX-License-Identifier: AGPL-3.0-only +// Copyright 2026-present the Unsloth AI Inc. team. All rights reserved. See /studio/LICENSE.AGPL-3.0 + +import type { IconSvgElement } from "@hugeicons/react"; + +// App-wide check mark. Plain tick geometry, sized a touch larger +// than the stock icon so it reads clearly in menus. +export const Tick02Icon: IconSvgElement = [ + [ + "path", + { + d: "M4.477 13.299L9.008 17.829L19.123 7.714", + stroke: "currentColor", + strokeLinecap: "round", + strokeLinejoin: "round", + // Fallback weight, matching the icon set; call sites with a + // strokeWidth prop override this. + strokeWidth: "1.5", + key: "0", + }, + ], +];