gaschz/trilium
1
0
Fork 0
mirror of https://github.com/zadam/trilium.git synced 2026-02-11 00:04:27 +01:00
Code Issues Actions 9 Packages Projects Releases Wiki Activity

feat(mobile/tab_switcher): improve display of collections

Browse Source
This commit is contained in:
Elian Doran 2026-01-31 19:43:53 +02:00
parent bec7943e05
commit 8f6cfe8a04
No known key found for this signature in database
3 changed files with 25 additions and 10 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

5
apps/client/src/widgets/mobile_widgets/TabSwitcher.css
View File

@ -78,6 +78,7 @@
padding: 10px;
}
&.type-book,
&.type-contentWidget,
&.type-search {
display: flex;
@ -87,6 +88,10 @@
color: var(--muted-text-color);
}
.preview-placeholder {
font-size: 500%;
}
p { margin-bottom: 0.2em;}
h2 { font-size: 1.20em; }
h3 { font-size: 1.15em; }

25
apps/client/src/widgets/mobile_widgets/TabSwitcher.tsx
View File

@ -11,6 +11,7 @@ import froca from "../../services/froca";
import { t } from "../../services/i18n";
import { NoteContent } from "../collections/legacy/ListOrGridView";
import { LaunchBarActionButton } from "../launch_bar/launch_bar_widgets";
import { ICON_MAPPINGS } from "../note_bars/CollectionProperties";
import ActionButton from "../react/ActionButton";
import { useActiveNoteContext, useNoteIcon, useTriliumEvents } from "../react/hooks";
import Icon from "../react/Icon";
@ -142,17 +143,29 @@ function Tab({ noteContext, containerRef, selectTab, activeNtxId }: {
/>
</header>
<div className={clsx("tab-preview", `type-${note?.type ?? "empty"}`)}>
{note && <NoteContent
note={note}
highlightedTokens={undefined}
trim
includeArchivedNotes={false}
/>}
{note?.type === "book"
? <PreviewPlaceholder icon={ICON_MAPPINGS[note.getLabelValue("viewType") ?? ""] ?? "bx bx-book"} />
: note && <NoteContent
note={note}
highlightedTokens={undefined}
trim
includeArchivedNotes={false}
/>}
</div>
</div>
);
}
function PreviewPlaceholder({ icon}: {
icon: string;
}) {
return (
<div className="preview-placeholder">
<Icon icon={icon} />
</div>
);
}
function getWorkspaceTabBackgroundColorHue(noteContext: NoteContext) {
if (!noteContext.hoistedNoteId) return;
const hoistedNote = froca.getNoteFromCache(noteContext.hoistedNoteId);

5
apps/client/src/widgets/note_bars/CollectionProperties.tsx
View File

@ -6,10 +6,7 @@ import { useContext, useRef } from "preact/hooks";
import { Fragment } from "preact/jsx-runtime";
import FNote from "../../entities/fnote";
import { getHelpUrlForNote } from "../../services/in_app_help";
import { openInAppHelpFromUrl } from "../../services/utils";
import { ViewTypeOptions } from "../collections/interface";
import ActionButton from "../react/ActionButton";
import Dropdown from "../react/Dropdown";
import { FormDropdownDivider, FormDropdownSubmenu, FormListItem, FormListToggleableItem } from "../react/FormList";
import FormTextBox from "../react/FormTextBox";
@ -19,7 +16,7 @@ import { ParentComponent } from "../react/react_utils";
import { bookPropertiesConfig, BookProperty, ButtonProperty, CheckBoxProperty, ComboBoxItem, ComboBoxProperty, NumberProperty, SplitButtonProperty } from "../ribbon/collection-properties-config";
import { useViewType, VIEW_TYPE_MAPPINGS } from "../ribbon/CollectionPropertiesTab";
const ICON_MAPPINGS: Record<ViewTypeOptions, string> = {
export const ICON_MAPPINGS: Record<ViewTypeOptions, string> = {
grid: "bx bxs-grid",
list: "bx bx-list-ul",
calendar: "bx bx-calendar",