okooooooo/edgeever
1
0 Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

refactor(web): optimize sidebar shortcut icons and attachments iconography

Browse Source
This commit is contained in:
tianma-if committed 2026-09-23 23:36:33 +08:00
1 parent 0f3aec1679
commit c00d0bdce2
6 files changed
+27 -25
Download Patch File Download Diff File Expand all files Collapse all files

No files matched your search

apps/web/src/components/AssetsPane.tsx
+3 -3
View File
@@ -9,7 +9,7 @@ import "yet-another-react-lightbox/styles.css";
import "yet-another-react-lightbox/plugins/thumbnails.css";
import {
Archive,
Paperclip,
HardDrive,
ExternalLink,
ChevronLeft,
@@ -207,7 +207,7 @@ export const AssetsPane = ({ onClose, repository, onOpenExecutionCenter }: Asset
</ButtonTooltip>
<div className="min-w-0">
<h1 className={`flex items-center gap-2 ${WORKSPACE_PAGE_TITLE_CLASSNAME}`}>
<Archive className="h-4.5 w-4.5 text-emerald-700" />
<Paperclip className="h-4.5 w-4.5 text-emerald-700" />
{t("assets.title")}
</h1>
<p className="mt-0.5 flex flex-wrap items-center gap-2 text-[10px] font-medium text-slate-400 uppercase tracking-wider">
@@ -309,7 +309,7 @@ export const AssetsPane = ({ onClose, repository, onOpenExecutionCenter }: Asset
</div>
) : filteredResources.length === 0 ? (
<div className="flex flex-col items-center justify-center rounded-xl border-2 border-dashed border-slate-200 bg-card px-6 py-24 text-center">
<Archive className="h-10 w-10 text-slate-350 mb-3 stroke-[1.5]" />
<Paperclip className="h-10 w-10 text-slate-350 mb-3 stroke-[1.5]" />
<p className="text-sm font-semibold text-slate-500">
{searchQuery || filterType !== "all" ? t("assets.noMatches") : t("assets.empty")}
</p>
apps/web/src/components/MemoListMobileSheets.tsx
+3 -3
View File
@@ -1,5 +1,5 @@
import { useEffect, useMemo, useRef, type ReactNode } from "react";
import { Archive, CheckSquare, FileDown, Folder as NotebookIcon, KeyRound, LayoutList, List, Merge, Star, Tags, Trash2, X } from "lucide-react";
import { CheckSquare, FileDown, Folder as NotebookIcon, KeyRound, LayoutList, List, Merge, Paperclip, Star, Tag, Trash2, X } from "lucide-react";
import { useTranslation } from "react-i18next";
import { Button } from "@/components/ui/button";
import {
@@ -173,8 +173,8 @@ export const MobileListActionsSheet = ({
))}
<div className="my-2 h-px bg-slate-100" />
<MobileListActionButton icon={<Tags className="h-4 w-4" />} label={t("mobileSheets.tags")} onClick={onOpenTags} />
<MobileListActionButton icon={<Archive className="h-4 w-4" />} label={t("mobileSheets.assets")} onClick={onOpenAssets} />
<MobileListActionButton icon={<Tag className="h-4 w-4" />} label={t("mobileSheets.tags")} onClick={onOpenTags} />
<MobileListActionButton icon={<Paperclip className="h-4 w-4" />} label={t("mobileSheets.assets")} onClick={onOpenAssets} />
{view === "trash" ? (
<MobileListActionButton icon={<Trash2 className="h-4 w-4" />} label={t("mobileSheets.emptyTrash")} onClick={onEmptyTrash} />
) : (
apps/web/src/components/MemoListPane.tsx
+5 -5
View File
@@ -21,8 +21,8 @@ import {
ChevronDown,
Search,
MoreHorizontal,
Tags,
Archive,
Tag,
Paperclip,
Trash2,
KeyRound,
CheckSquare,
@@ -261,7 +261,7 @@ export const MemoSelectionActionBar = ({
const getMobileFilterIcon = (filterMode: MemoFilterMode) => {
if (filterMode === "tagged") {
return <Tags className="h-4 w-4" />;
return <Tag className="h-4 w-4" />;
}
if (filterMode === "untagged") {
return <TagX className="h-4 w-4" />;
@@ -1337,14 +1337,14 @@ export const MemoListPane = ({
className="flex h-9 w-full items-center gap-2 px-3 text-left text-sm text-slate-700 hover:bg-slate-50 cursor-pointer outline-none"
onClick={onOpenTags}
>
<Tags className="h-4 w-4 text-slate-500" />
<Tag className="h-4 w-4 text-slate-500" />
{t("memoList.tags")}
</DropdownMenuItem>
<DropdownMenuItem
className="flex h-9 w-full items-center gap-2 px-3 text-left text-sm text-slate-700 hover:bg-slate-50 cursor-pointer outline-none"
onClick={onOpenAssets}
>
<Archive className="h-4 w-4 text-slate-500" />
<Paperclip className="h-4 w-4 text-slate-500" />
{t("memoList.assets")}
</DropdownMenuItem>
<DropdownMenuItem
apps/web/src/components/NotebookPane.tsx
+7 -8
View File
@@ -15,8 +15,8 @@ import {
Boxes,
ArrowDownWideNarrow,
Notebook as NotebookIcon,
Tags,
Archive,
Tag,
Paperclip,
Trash2,
KeyRound,
LogOut,
@@ -670,14 +670,14 @@ export const NotebookPane = ({
<TooltipProvider delayDuration={0} skipDelayDuration={0}>
<nav className="grid shrink-0 grid-cols-2 gap-0.5 border-b border-slate-100 px-2 py-1.5 sm:grid-cols-3 lg:grid-cols-5" aria-label={t("notebookPane.secondaryEntries")}>
<SidebarShortcutButton icon={<Tags className="h-4 w-4" />} label={t("mobileSheets.tags")} onClick={onOpenTags} />
<SidebarShortcutButton icon={<Archive className="h-4 w-4" />} label={t("mobileSheets.assets")} onClick={onOpenAssets} />
<SidebarShortcutButton icon={<Tag className="h-4 w-4" />} label={t("mobileSheets.tags")} onClick={onOpenTags} />
<SidebarShortcutButton icon={<Paperclip className="h-4 w-4" />} label={t("mobileSheets.assets")} onClick={onOpenAssets} />
{showTemplateEntry && <SidebarShortcutButton icon={<LayoutTemplate className="h-4 w-4" />} label={t("nav.templates")} onClick={onOpenTemplates} />}
<PluginToolbarMenu
host={pluginHost}
onManage={onOpenPluginManager}
align="start"
className="h-9 w-full rounded-md px-0 text-slate-600"
className="h-9 w-full rounded-md px-0 text-slate-600 hover:bg-slate-50 hover:text-slate-950"
/>
<SidebarTrashShortcut active={view === "trash"} onOpenTrash={onOpenTrash} onEmptyTrash={onEmptyTrash} />
</nav>
@@ -745,7 +745,6 @@ export const NotebookPane = ({
<button
className="mb-1 hidden h-8 w-full items-center justify-start gap-2 rounded-md px-3 text-xs font-medium text-slate-500 transition-colors hover:bg-slate-50 hover:text-slate-800 disabled:cursor-not-allowed disabled:opacity-50 lg:flex"
type="button"
title={t("templates.useTemplate")}
onClick={onOpenTemplates}
disabled={isCreatingMemo}
>
@@ -899,8 +898,8 @@ export const NotebookPane = ({
label={t("notebookPane.notebooks")}
onClick={onToggleCollapsed}
/>
<SidebarRailButton icon={<Tags className="h-4 w-4" />} label={t("mobileSheets.tags")} onClick={onOpenTags} />
<SidebarRailButton icon={<Archive className="h-4 w-4" />} label={t("mobileSheets.assets")} onClick={onOpenAssets} />
<SidebarRailButton icon={<Tag className="h-4 w-4" />} label={t("mobileSheets.tags")} onClick={onOpenTags} />
<SidebarRailButton icon={<Paperclip className="h-4 w-4" />} label={t("mobileSheets.assets")} onClick={onOpenAssets} />
{showTemplateEntry ? (
<SidebarRailButton icon={<LayoutTemplate className="h-4 w-4" />} label={t("nav.templates")} onClick={onOpenTemplates} />
) : null}
apps/web/src/components/TagsPane.tsx
+8 -5
View File
@@ -1,8 +1,9 @@
import { useState } from "react";
import { useMutation, useQuery, useQueryClient } from "@tanstack/react-query";
import { ChevronLeft, Pencil, Tags, Trash2 } from "lucide-react";
import { ChevronLeft, Pencil, Tag, Trash2 } from "lucide-react";
import { useTranslation } from "react-i18next";
import { Button } from "@/components/ui/button";
import { ButtonTooltip } from "@/components/ui/button-tooltip";
import { Input } from "@/components/ui/input";
import { cn, formatDateTime } from "@/lib/utils";
import { WORKSPACE_PAGE_TITLE_CLASSNAME } from "@/lib/workspace-ui";
@@ -54,11 +55,13 @@ export const TagsPane = ({
<div className="flex h-full min-h-0 min-w-0 flex-col bg-card">
<header className="flex h-[calc(4rem+env(safe-area-inset-top))] shrink-0 items-end justify-between border-b border-slate-200 px-6 pb-3 pt-[env(safe-area-inset-top)] lg:h-16 lg:items-center lg:pb-0 lg:pt-0">
<div className="flex min-w-0 items-center gap-3">
<Button size="icon" variant="ghost" title={t("common.back")} aria-label={t("common.back")} onClick={onClose} className="h-9 w-9 rounded-lg hover:bg-slate-100">
<ChevronLeft className="h-5 w-5 text-slate-500" />
</Button>
<ButtonTooltip title={t("common.back")}>
<Button size="icon" variant="ghost" aria-label={t("common.back")} onClick={onClose} className="h-9 w-9 rounded-lg hover:bg-slate-100">
<ChevronLeft className="h-5 w-5 text-slate-500" />
</Button>
</ButtonTooltip>
<div className="min-w-0">
<h1 className={`flex items-center gap-2 ${WORKSPACE_PAGE_TITLE_CLASSNAME}`}><Tags className="h-4 w-4 text-emerald-700" />{t("tagsDialog.title")}</h1>
<h1 className={`flex items-center gap-2 ${WORKSPACE_PAGE_TITLE_CLASSNAME}`}><Tag className="h-4 w-4 text-emerald-700" />{t("tagsDialog.title")}</h1>
<p className="mt-0.5 text-xs text-slate-500">{t("tagsDialog.count", { count: tags.length })}</p>
</div>
</div>
apps/web/src/components/plugins/PluginToolbarMenu.tsx
+1 -1
View File
@@ -113,7 +113,7 @@ export const PluginToolbarMenu = ({
<TooltipTrigger asChild>
<DropdownMenuTrigger asChild>
<Button
className={cn("relative hidden h-8 w-8 text-slate-500 hover:bg-slate-100 hover:text-slate-950 focus-visible:ring-2 focus-visible:ring-emerald-500/70 lg:inline-flex", className)}
className={cn("relative hidden h-8 w-8 text-slate-600 hover:bg-slate-50 hover:text-slate-950 focus-visible:ring-2 focus-visible:ring-emerald-500/70 lg:inline-flex", className)}
size="icon"
variant="ghost"
aria-label={t("plugins.toolbar.open")}