gaschz/trilium
1
0
Fork 0
mirror of https://github.com/zadam/trilium.git synced 2026-01-08 23:54:29 +01:00
Code Issues Actions 29 Packages Projects Releases Wiki Activity

style/menus: improve the icon-caption alignment

Browse Source
This commit is contained in:
Adorian Doran 2025-12-25 03:46:32 +02:00
parent 9c73b71feb
commit cc37da9f11
6 changed files with 14 additions and 11 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

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

@ -458,6 +458,7 @@ body.desktop .tabulator-popup-container,
} }
body.desktop .dropdown-menu:not(#context-menu-container) .dropdown-item, body.desktop .dropdown-menu:not(#context-menu-container) .dropdown-item,
body.desktop .dropdown-menu .dropdown-toggle,
body #context-menu-container .dropdown-item > span, body #context-menu-container .dropdown-item > span,
body.mobile .dropdown .dropdown-submenu > span { body.mobile .dropdown .dropdown-submenu > span {
display: flex; display: flex;

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

@ -128,6 +128,16 @@ body.backdrop-effects-disabled {
font-size: 0.9rem !important; font-size: 0.9rem !important;
} }
/* Use this class for non-legacy menus */
.dropdown-menu.tn-dropdown-menu {
--menu-item-icon-vert-offset: 0;
white-space-collapse: discard;
}
.dropdown-menu.tn-dropdown-menu .bx {
margin-inline-end: 6px;
}
.dropdown-menu.tn-dropdown-menu-scrollable { .dropdown-menu.tn-dropdown-menu-scrollable {
/* Note: scrollable dropdowns does not support submenus */ /* Note: scrollable dropdowns does not support submenus */
max-height: 90vh; max-height: 90vh;

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

@ -91,8 +91,6 @@
/* Icon */ /* Icon */
li > span:first-child { li > span:first-child {
opacity: .75; opacity: .75;
padding-inline-end: 4px;
translate: none;
}; };
} }

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

@ -127,7 +127,7 @@ export default function Dropdown({ id, className, buttonClassName, isStatic, chi
</button> </button>
<ul <ul
class={`dropdown-menu ${isStatic ? "static" : ""} ${dropdownContainerClassName ?? ""} ${!noDropdownListStyle ? "tn-dropdown-list" : ""}`} class={`dropdown-menu tn-dropdown-menu ${isStatic ? "static" : ""} ${dropdownContainerClassName ?? ""} ${!noDropdownListStyle ? "tn-dropdown-list" : ""}`}
style={dropdownContainerStyle} style={dropdownContainerStyle}
aria-labelledby={ariaId} aria-labelledby={ariaId}
ref={dropdownContainerRef} ref={dropdownContainerRef}

3
apps/client/src/widgets/react/FormList.tsx
View File

@ -231,7 +231,8 @@ export function FormDropdownSubmenu({ icon, title, children, dropStart, onDropdo
} }
}} }}
> >
<Icon icon={icon} />{" "} <Icon icon={icon} />
&nbsp;
{title} {title}
</span> </span>

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

@ -412,13 +412,6 @@ body[dir=rtl] .attribute-list-editor {
min-width: 15em; min-width: 15em;
} }
.note-actions .dropdown-item .bx {
position: relative;
top: 3px;
font-size: 120%;
margin-inline-end: 5px;
}
.note-actions .dropdown-item[disabled], .note-actions .dropdown-item[disabled]:hover { .note-actions .dropdown-item[disabled], .note-actions .dropdown-item[disabled]:hover {
color: var(--muted-text-color) !important; color: var(--muted-text-color) !important;
background-color: transparent !important; background-color: transparent !important;