gaschz/trilium
1
0
Fork 0
mirror of https://github.com/zadam/trilium.git synced 2025-12-29 02:34:25 +01:00
Code Issues Actions 11 Packages Projects Releases Wiki Activity

fix(icon_packs): references to .bx for icon selection

Browse Source
This commit is contained in:
Elian Doran 2025-12-28 13:42:45 +02:00
parent c14d95f561
commit e730378b27
No known key found for this signature in database
25 changed files with 102 additions and 96 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

4
apps/client/src/entities/fnote.ts
View File

@ -582,6 +582,10 @@ export default class FNote {
}
getIcon() {
return `tn-icon ${this.#getIconInternal()}`;
}
#getIconInternal() {
const iconClassLabels = this.getLabels("iconClass");
const workspaceIconClass = this.getWorkspaceIconClass();

13
apps/client/src/stylesheets/style.css
View File

@ -1796,7 +1796,7 @@ button.close:hover {
display: none;
}
.reference-link .bx {
.reference-link .tn-icon {
position: relative;
top: 1px;
margin-inline-end: 3px;
@ -2415,7 +2415,7 @@ footer.webview-footer button {
gap: 5px;
}
.right-pane-tab .tab-title .bx {
.right-pane-tab .tab-title .tn-icon {
font-size: 1.1em;
}
@ -2543,18 +2543,11 @@ footer.webview-footer button {
inset-inline-end: 10px;
}
.content-floating-buttons button.bx {
.content-floating-buttons button.tn-icon {
font-size: 130%;
padding: 1px 10px 1px 10px;
}
/* Customized icons */
.bx-tn-toc::before {
content: "\ec24";
transform: rotate(180deg);
}
/* CK Editor */
/* Insert text snippet: limit the width of the listed items to avoid overly long names */

12
apps/client/src/stylesheets/theme-next/base.css
View File

@ -134,7 +134,7 @@ body.backdrop-effects-disabled {
white-space-collapse: discard;
}
.dropdown-menu.tn-dropdown-menu .dropdown-item .bx {
.dropdown-menu.tn-dropdown-menu .dropdown-item .tn-icon {
margin-inline-end: 6px;
}
@ -249,7 +249,7 @@ html body .dropdown-item[disabled] {
}
/* Menu item icon */
.dropdown-item .bx {
.dropdown-item .tn-icon {
translate: 0 var(--menu-item-icon-vert-offset);
color: var(--menu-item-icon-color) !important;
font-size: 1.1em;
@ -496,7 +496,7 @@ li.dropdown-item a.dropdown-item-button {
border: unset;
}
li.dropdown-item a.dropdown-item-button.bx {
li.dropdown-item a.dropdown-item-button.tn-icon {
color: var(--menu-text-color) !important;
}
@ -557,13 +557,13 @@ li.dropdown-item a.dropdown-item-button:focus-visible {
padding-top: 0;
}
#toast-container .toast:not(.no-title) .bx {
#toast-container .toast:not(.no-title) .tn-icon {
margin-inline-end: 0.5em;
font-size: 1.1em;
opacity: 0.85;
}
#toast-container .toast.no-title .bx {
#toast-container .toast.no-title .tn-icon {
margin-inline-end: 0;
font-size: 1.3em;
}
@ -754,7 +754,7 @@ li.dropdown-item a.dropdown-item-button:focus-visible {
margin-bottom: 0;
}
.note-list-wrapper .note-book-card .bx {
.note-list-wrapper .note-book-card .tn-icon {
color: var(--left-pane-icon-color) !important;
}

4
apps/client/src/stylesheets/theme-next/dialogs.css
View File

@ -423,6 +423,6 @@ div.tn-tool-dialog {
font-size: unset;
}
.note-type-chooser-dialog div.note-type-dropdown .dropdown-item span.bx {
.note-type-chooser-dialog div.note-type-dropdown .dropdown-item span.tn-icon {
margin-inline-end: .25em;
}
}

8
apps/client/src/stylesheets/theme-next/forms.css
View File

@ -62,10 +62,10 @@ button.ck.ck-button:is(.ck-button-action, .ck-button-save, .ck-button-cancel, .c
}
/* Button's icon */
button.btn.btn-primary span.bx,
button.btn.btn-secondary span.bx,
button.btn.btn-sm span.bx,
button.btn.btn-success span.bx {
button.btn.btn-primary span.tn-icon,
button.btn.btn-secondary span.tn-icon,
button.btn.btn-sm span.tn-icon,
button.btn.btn-success span.tn-icon {
color: var(--cmd-button-icon-color);
padding-inline-end: 0.35em;
font-size: 1.2em;

2
apps/client/src/stylesheets/theme-next/shell.css
View File

@ -497,7 +497,7 @@ div.bookmark-folder-widget .note-link:hover a {
}
/* The item's icon */
div.bookmark-folder-widget .note-link .bx {
div.bookmark-folder-widget .note-link .tn-icon {
color: var(--menu-item-icon-color);
font-size: 1.2em;
}

6
apps/client/src/stylesheets/tree.css
View File

@ -229,11 +229,11 @@ span.fancytree-node.archived {
opacity: 0.6;
}
.fancytree-node:hover .bx.tree-item-button {
.fancytree-node:hover .tn-icon.tree-item-button {
display: inline-block;
}
.bx.tree-item-button {
.tn-icon.tree-item-button {
display: none;
font-size: 120%;
cursor: pointer;
@ -243,7 +243,7 @@ span.fancytree-node.archived {
border-radius: 5px;
}
.unhoist-button.bx.tree-item-button {
.unhoist-button.tn-icon.tree-item-button {
margin-inline-start: 0; /* unhoist button is on the left and doesn't need more margin */
display: block; /* keep always visible */
}

2
apps/client/src/widgets/FloatingButtonsDefinitions.tsx
View File

@ -142,7 +142,7 @@ function ShowTocWidgetButton({ note, noteContext, isDefaultViewMode }: FloatingB
return isEnabled && <FloatingButton
text={t("show_toc_widget_button.show_toc")}
icon="bx bx-tn-toc"
icon="bx bx-spreadsheet bx-rotate-180"
onClick={() => {
if (noteContext?.viewScope && noteContext.noteId) {
noteContext.viewScope.tocTemporarilyHidden = false;

2
apps/client/src/widgets/collections/geomap/index.css
View File

@ -40,7 +40,7 @@
z-index: -1;
}
.geo-map-container .leaflet-div-icon .bx {
.geo-map-container .leaflet-div-icon .tn-icon {
position: absolute;
top: 3px;
inset-inline-start: 2px;

4
apps/client/src/widgets/layout/Breadcrumb.css
View File

@ -35,7 +35,7 @@
align-items: center;
min-width: 0;
.bx {
.tn-icon {
margin-inline: 6px;
}
@ -55,7 +55,7 @@
.icon-action {
font-size: .9rem !important;
.bxs-chevron-right {
&.breadcrumb-separator {
transform: translateY(8%);
&::before {

2
apps/client/src/widgets/layout/Breadcrumb.tsx
View File

@ -191,7 +191,7 @@ function BreadcrumbSeparator(props: BreadcrumbSeparatorProps) {
<Dropdown
text={<Icon icon="bx bxs-chevron-right" />}
noSelectButtonStyle
buttonClassName="icon-action"
buttonClassName="icon-action breadcrumb-separator"
hideToggleArrow
dropdownContainerClassName="tn-dropdown-menu-scrollable breadcrumb-child-list"
dropdownOptions={{ popperConfig: { strategy: "fixed", placement: "top" } }}

10
apps/client/src/widgets/layout/StatusBar.css
View File

@ -9,7 +9,7 @@
background-color: var(--left-pane-background-color);
padding-inline: 0.25em;
font-size: 0.85em;
> .breadcrumb {
flex-grow: 1;
--icon-button-size: 23px;
@ -104,7 +104,7 @@
/* Note path card */
li {
--border-radius: 6px;
position: relative;
background: var(--card-background-color);
padding: 8px 20px 8px 25px;
@ -120,7 +120,7 @@
& + li {
margin-top: 2px;
}
/* Current path arrow */
&.path-current::before {
position: absolute;
@ -180,7 +180,7 @@
&:last-child {
border-radius: 0 0 var(--border-radius) var(--border-radius);
}
/* Card header */
& > span:first-child {
display: block;
@ -202,7 +202,7 @@
}
/* Note icon */
> .bx {
> .tn-icon {
color: var(--menu-item-icon-color);
}

2
apps/client/src/widgets/note_title.css
View File

@ -92,7 +92,7 @@ body.experimental-feature-new-layout {
height: var(--size);
padding: 0;
.bx {
.tn-icon {
opacity: 1;
margin: 0;
}

93
apps/client/src/widgets/note_tree.ts
View File

@ -1,38 +1,39 @@
import hoistedNoteService from "../services/hoisted_note.js";
import treeService from "../services/tree.js";
import utils from "../services/utils.js";
import contextMenu from "../menus/context_menu.js";
import froca from "../services/froca.js";
import branchService from "../services/branches.js";
import ws from "../services/ws.js";
import NoteContextAwareWidget from "./note_context_aware_widget.js";
import server from "../services/server.js";
import noteCreateService from "../services/note_create.js";
import toastService from "../services/toast.js";
import appContext, { type CommandListenerData, type EventData } from "../components/app_context.js";
import keyboardActionsService from "../services/keyboard_actions.js";
import clipboard from "../services/clipboard.js";
import protectedSessionService from "../services/protected_session.js";
import linkService from "../services/link.js";
import options from "../services/options.js";
import protectedSessionHolder from "../services/protected_session_holder.js";
import dialogService from "../services/dialog.js";
import shortcutService from "../services/shortcuts.js";
import { t } from "../services/i18n.js";
import type FBranch from "../entities/fbranch.js";
import type LoadResults from "../services/load_results.js";
import type FNote from "../entities/fnote.js";
import type { NoteType } from "../entities/fnote.js";
import type { AttributeRow, BranchRow } from "../services/load_results.js";
import type { SetNoteOpts } from "../components/note_context.js";
import type { TouchBarItem } from "../components/touch_bar.js";
import type { TreeCommandNames } from "../menus/tree_context_menu.js";
import "jquery.fancytree";
import "jquery.fancytree/dist/modules/jquery.fancytree.dnd5.js";
import "jquery.fancytree/dist/modules/jquery.fancytree.clones.js";
import "jquery.fancytree/dist/modules/jquery.fancytree.filter.js";
import "../stylesheets/tree.css";
import appContext, { type CommandListenerData, type EventData } from "../components/app_context.js";
import type { SetNoteOpts } from "../components/note_context.js";
import type { TouchBarItem } from "../components/touch_bar.js";
import type FBranch from "../entities/fbranch.js";
import type FNote from "../entities/fnote.js";
import type { NoteType } from "../entities/fnote.js";
import contextMenu from "../menus/context_menu.js";
import type { TreeCommandNames } from "../menus/tree_context_menu.js";
import branchService from "../services/branches.js";
import clipboard from "../services/clipboard.js";
import dialogService from "../services/dialog.js";
import froca from "../services/froca.js";
import hoistedNoteService from "../services/hoisted_note.js";
import { t } from "../services/i18n.js";
import keyboardActionsService from "../services/keyboard_actions.js";
import linkService from "../services/link.js";
import type LoadResults from "../services/load_results.js";
import type { AttributeRow, BranchRow } from "../services/load_results.js";
import noteCreateService from "../services/note_create.js";
import options from "../services/options.js";
import protectedSessionService from "../services/protected_session.js";
import protectedSessionHolder from "../services/protected_session_holder.js";
import server from "../services/server.js";
import shortcutService from "../services/shortcuts.js";
import toastService from "../services/toast.js";
import treeService from "../services/tree.js";
import utils from "../services/utils.js";
import ws from "../services/ws.js";
import NoteContextAwareWidget from "./note_context_aware_widget.js";
const TPL = /*html*/`
<div class="tree-wrapper">
<style>
@ -242,7 +243,7 @@ export default class NoteTreeWidget extends NoteContextAwareWidget {
e.preventDefault();
appContext.tabManager.openTabWithNoteWithHoisting(notePath, {
activate: e.shiftKey ? true : false
activate: !!e.shiftKey
});
}
}
@ -402,7 +403,7 @@ export default class NoteTreeWidget extends NoteContextAwareWidget {
} else if (ctrlKey) {
const notePath = treeService.getNotePath(node);
appContext.tabManager.openTabWithNoteWithHoisting(notePath, {
activate: event.shiftKey ? true : false
activate: !!event.shiftKey
});
} else if (event.altKey) {
node.setSelected(!node.isSelected());
@ -499,9 +500,9 @@ export default class NoteTreeWidget extends NoteContextAwareWidget {
return ["before", "after"];
} else if (["_lbAvailableLaunchers", "_lbVisibleLaunchers"].includes(node.data.noteId)) {
return ["over"];
} else {
return true;
}
return true;
},
dragDrop: async (node, data) => {
if (
@ -597,7 +598,7 @@ export default class NoteTreeWidget extends NoteContextAwareWidget {
clones: {
highlightActiveClones: true
},
enhanceTitle: async function (
async enhanceTitle (
event: Event,
data: {
node: Fancytree.FancytreeNode;
@ -627,7 +628,7 @@ export default class NoteTreeWidget extends NoteContextAwareWidget {
const isHoistedNote = activeNoteContext && activeNoteContext.hoistedNoteId === note.noteId && note.noteId !== "root";
if (note.hasLabel("workspace") && !isHoistedNote) {
const $enterWorkspaceButton = $(`<span class="tree-item-button enter-workspace-button bx bx-door-open" title="${t("note_tree.hoist-this-note-workspace")}"></span>`).on(
const $enterWorkspaceButton = $(`<span class="tree-item-button tn-icon enter-workspace-button bx bx-door-open" title="${t("note_tree.hoist-this-note-workspace")}"></span>`).on(
"click",
cancelClickPropagation
);
@ -636,7 +637,7 @@ export default class NoteTreeWidget extends NoteContextAwareWidget {
}
if (note.type === "search") {
const $refreshSearchButton = $(`<span class="tree-item-button refresh-search-button bx bx-refresh" title="${t("note_tree.refresh-saved-search-results")}"></span>`).on(
const $refreshSearchButton = $(`<span class="tree-item-button tn-icon refresh-search-button bx bx-refresh" title="${t("note_tree.refresh-saved-search-results")}"></span>`).on(
"click",
cancelClickPropagation
);
@ -650,7 +651,7 @@ export default class NoteTreeWidget extends NoteContextAwareWidget {
&& !note.isLaunchBarConfig()
&& !note.noteId.startsWith("_help")
) {
const $createChildNoteButton = $(`<span class="tree-item-button add-note-button bx bx-plus" title="${t("note_tree.create-child-note")}"></span>`).on(
const $createChildNoteButton = $(`<span class="tree-item-button tn-icon add-note-button bx bx-plus" title="${t("note_tree.create-child-note")}"></span>`).on(
"click",
cancelClickPropagation
);
@ -659,7 +660,7 @@ export default class NoteTreeWidget extends NoteContextAwareWidget {
}
if (isHoistedNote) {
const $unhoistButton = $(`<span class="tree-item-button unhoist-button bx bx-door-open" title="${t("note_tree.unhoist")}"></span>`).on("click", cancelClickPropagation);
const $unhoistButton = $(`<span class="tree-item-button tn-icon unhoist-button bx bx-door-open" title="${t("note_tree.unhoist")}"></span>`).on("click", cancelClickPropagation);
$span.append($unhoistButton);
}
@ -1281,7 +1282,7 @@ export default class NoteTreeWidget extends NoteContextAwareWidget {
// activeNode is supposed to be moved when we find out activeNode is deleted but not all branches are deleted. save it for fixing activeNodePath after all nodes loaded.
let movedActiveNode: Fancytree.FancytreeNode | null = null;
let parentsOfAddedNodes: Fancytree.FancytreeNode[] = [];
const parentsOfAddedNodes: Fancytree.FancytreeNode[] = [];
for (const branchRow of branchRows) {
if (branchRow.noteId) {
@ -1452,10 +1453,10 @@ export default class NoteTreeWidget extends NoteContextAwareWidget {
if (branchId && branchId.startsWith("virt")) {
// in case of virtual branches there's nothing to update
return;
} else {
logError(`Cannot find branch=${branchId}`);
return;
}
logError(`Cannot find branch=${branchId}`);
return;
}
branch.isExpanded = isExpanded;
@ -1594,7 +1595,7 @@ export default class NoteTreeWidget extends NoteContextAwareWidget {
// Trigger the event with the selected branch IDs
appContext.triggerEvent("editBranchPrefix", {
selectedOrActiveBranchIds: branchIds,
node: node
node
});
}
@ -1779,12 +1780,12 @@ export default class NoteTreeWidget extends NoteContextAwareWidget {
#moveLaunchers(selectedOrActiveBranchIds: string[], desktopParent: string, mobileParent: string) {
const desktopLaunchersToMove = selectedOrActiveBranchIds.filter((branchId) => !branchId.startsWith("_lbMobile"));
if (desktopLaunchersToMove) {
branchService.moveToParentNote(desktopLaunchersToMove, "_lbRoot_" + desktopParent);
branchService.moveToParentNote(desktopLaunchersToMove, `_lbRoot_${ desktopParent}`);
}
const mobileLaunchersToMove = selectedOrActiveBranchIds.filter((branchId) => branchId.startsWith("_lbMobile"));
if (mobileLaunchersToMove) {
branchService.moveToParentNote(mobileLaunchersToMove, "_lbMobileRoot_" + mobileParent);
branchService.moveToParentNote(mobileLaunchersToMove, `_lbMobileRoot_${ mobileParent}`);
}
}
@ -1829,7 +1830,7 @@ export default class NoteTreeWidget extends NoteContextAwareWidget {
selectedOrActiveBranchIds: this.getSelectedOrActiveBranchIds(node),
selectedOrActiveNoteIds: this.getSelectedOrActiveNoteIds(node)
});
}
};
const items: TouchBarItem[] = [
new TouchBar.TouchBarButton({

2
apps/client/src/widgets/react/Badge.css
View File

@ -22,7 +22,7 @@
}
}
.bx {
.tn-icon {
font-size: 1.2em;
margin-inline-end: 4px;
opacity: .6;

2
apps/client/src/widgets/react/FormList.css
View File

@ -5,7 +5,7 @@
white-space: normal;
}
span.bx {
span.tn-icon {
flex-shrink: 0;
}

2
apps/client/src/widgets/react/Icon.tsx
View File

@ -9,7 +9,7 @@ interface IconProps extends Pick<HTMLAttributes<HTMLSpanElement>, "className" |
export default function Icon({ icon, className, ...restProps }: IconProps) {
return (
<span
class={clsx(icon ?? "bx bx-empty", className)}
class={clsx(icon ?? "bx bx-empty", className, "tn-icon")}
{...restProps}
/>
);

2
apps/client/src/widgets/ribbon/Ribbon.tsx
View File

@ -135,7 +135,7 @@ function RibbonTab({ icon, title, active, onClick, toggleCommand }: { icon: stri
>
<span
ref={iconRef}
className={`ribbon-tab-title-icon ${icon}`}
className={`ribbon-tab-title-icon tn-icon ${icon}`}
/>
&nbsp;
{ active && <span class="ribbon-tab-title-label">{title}</span> }

2
apps/client/src/widgets/ribbon/style.css
View File

@ -38,7 +38,7 @@
padding-top: 2px;
}
.ribbon-tab-title .bx {
.ribbon-tab-title .tn-icon {
font-size: 150%;
position: relative;
}

4
apps/client/src/widgets/sidebar/RightPanelContainer.css
View File

@ -28,7 +28,7 @@ body.experimental-feature-new-layout #right-pane {
border-bottom: 0;
}
&.collapsed .card-header > .bx {
&.collapsed .card-header > .tn-icon {
transform: rotate(-90deg);
}
}
@ -50,7 +50,7 @@ body.experimental-feature-new-layout #right-pane {
padding: 0.75em;
color: var(--muted-text-color);
.bx {
.tn-icon {
font-size: 3em;
}

2
apps/client/src/widgets/type_widgets/Attachment.css
View File

@ -131,7 +131,7 @@
width: 20em;
}
.attachment-actions .dropdown-item .bx {
.attachment-actions .dropdown-item .tn-icon {
position: relative;
top: 3px;
font-size: 120%;

4
apps/client/src/widgets/type_widgets/options/appearance.css
View File

@ -20,7 +20,7 @@
margin-bottom: 5px;
}
.bx {
.tn-icon {
margin: 4px 0;
font-size: 12px;
opacity: 0.5;
@ -78,7 +78,7 @@
.ribbon {
padding: 0 5px;
.bx {
.tn-icon {
font-size: 10px;
}

6
apps/server/src/becca/entities/bnote.ts
View File

@ -1697,8 +1697,12 @@ class BNote extends AbstractBeccaEntity<BNote> {
return pojo;
}
// TODO: Deduplicate with fnote
getIcon() {
return `tn-icon ${this.#getIconInternal()}`;
}
// TODO: Deduplicate with fnote
#getIconInternal() {
const iconClassLabels = this.getLabels("iconClass");
if (iconClassLabels && iconClassLabels.length > 0) {

4
apps/server/src/share/shaca/entities/snote.ts
View File

@ -528,6 +528,10 @@ class SNote extends AbstractShacaEntity {
}
getIcon(filterByPrefix: string[] = []) {
return `tn-icon ${this.#getIconInternal(filterByPrefix)}`;
}
#getIconInternal(filterByPrefix: string[] = []) {
const iconClassLabels = this.getLabels("iconClass").filter(label => {
if (filterByPrefix.length === 0) {
return true;

4
packages/share-theme/src/styles/content.css
View File

@ -50,7 +50,7 @@
height: auto;
}
a.reference-link > span > .bx {
a.reference-link > span > .tn-icon {
margin-inline-end: 3px;
}
@ -79,4 +79,4 @@ body.type-webView {
border: 0;
}
}
}
}