Dockery/Trilium
1
0
Fork 0
mirror of https://github.com/zadam/trilium.git synced 2025-12-15 20:59:54 +01:00
Code Issues Packages Projects Releases Activity

fix(global_menu): alignment of advanced button

Browse Source
This commit is contained in:
Elian Doran
2025-12-15 07:53:34 +02:00
parent 016389df68
commit ca39282269
1 changed files with 19 additions and 21 deletions
Download Patch File Download Diff File Expand all files Collapse all files

40
apps/client/src/widgets/buttons/global_menu.tsx
View File

@@ -38,7 +38,7 @@ export default function GlobalMenu({ isHorizontalLayout }: { isHorizontalLayout:
text={<>
{isVerticalLayout && <VerticalLayoutIcon />}
{isUpdateAvailable && <div class="global-menu-button-update-available">
<span className="bx bxs-down-arrow-alt global-menu-button-update-available-button" title={t("update_available.update_available")}></span>
<span className="bx bxs-down-arrow-alt global-menu-button-update-available-button" title={t("update_available.update_available")} />
</div>}
</>}
noDropdownListStyle
@@ -57,7 +57,7 @@ export default function GlobalMenu({ isHorizontalLayout }: { isHorizontalLayout:
<SwitchToOptions />
<MenuItem command="showLaunchBarSubtree" icon={`bx ${isMobile() ? "bx-mobile" : "bx-sidebar"}`} text={t("global_menu.configure_launchbar")} />
<AdvancedMenu />
<AdvancedMenu dropStart={!isVerticalLayout} />
<MenuItem command="showOptions" icon="bx bx-cog" text={t("global_menu.options")} />
<FormDropdownDivider />
@@ -68,19 +68,19 @@ export default function GlobalMenu({ isHorizontalLayout }: { isHorizontalLayout:
{isUpdateAvailable && <>
<FormListHeader text={t("global_menu.new-version-available")} />
<MenuItem command={() => window.open("https://github.com/TriliumNext/Trilium/releases/latest")}
icon="bx bx-download"
text={t("global_menu.download-update", {latestVersion})} />
icon="bx bx-download"
text={t("global_menu.download-update", {latestVersion})} />
</>}
{!isElectron() && <BrowserOnlyOptions />}
{glob.isDev && <DevelopmentOptions />}
{glob.isDev && <DevelopmentOptions dropStart={!isVerticalLayout} />}
</Dropdown>
);
}
function AdvancedMenu() {
function AdvancedMenu({ dropStart }: { dropStart: boolean }) {
return (
<FormDropdownSubmenu icon="bx bx-chip" title={t("global_menu.advanced")}>
<FormDropdownSubmenu icon="bx bx-chip" title={t("global_menu.advanced")} dropStart={dropStart}>
<MenuItem command="showHiddenSubtree" icon="bx bx-hide" text={t("global_menu.show_hidden_subtree")} />
<MenuItem command="showSearchHistory" icon="bx bx-search-alt" text={t("global_menu.open_search_history")} />
<FormDropdownDivider />
@@ -103,13 +103,11 @@ function BrowserOnlyOptions() {
</>;
}
function DevelopmentOptions() {
const [ layoutOrientation ] = useTriliumOption("layoutOrientation");
function DevelopmentOptions({ dropStart }: { dropStart: boolean }) {
return <>
<FormDropdownDivider />
<FormListItem disabled>Development Options</FormListItem>
<FormDropdownSubmenu icon="bx bx-test-tube" title="Experimental features" dropStart={layoutOrientation === "horizontal"}>
<FormDropdownSubmenu icon="bx bx-test-tube" title="Experimental features" dropStart={dropStart}>
{experimentalFeatures.map((feature) => (
<ExperimentalFeatureToggle key={feature.id} experimentalFeature={feature as ExperimentalFeature} />
))}
@@ -136,10 +134,10 @@ function SwitchToOptions() {
if (isElectron()) {
return;
} else if (!isMobile()) {
return <MenuItem command="switchToMobileVersion" icon="bx bx-mobile" text={t("global_menu.switch_to_mobile_version")} />
} else {
return <MenuItem command="switchToDesktopVersion" icon="bx bx-desktop" text={t("global_menu.switch_to_desktop_version")} />
}
return <MenuItem command="switchToMobileVersion" icon="bx bx-mobile" text={t("global_menu.switch_to_mobile_version")} />;
}
return <MenuItem command="switchToDesktopVersion" icon="bx bx-desktop" text={t("global_menu.switch_to_desktop_version")} />;
}
function MenuItem({ icon, text, title, command, disabled, active }: MenuItemProps<KeyboardActionNames | CommandNames | (() => void)>) {
@@ -150,7 +148,7 @@ function MenuItem({ icon, text, title, command, disabled, active }: MenuItemProp
onClick={typeof command === "function" ? command : undefined}
disabled={disabled}
active={active}
>{text}</FormListItem>
>{text}</FormListItem>;
}
function KeyboardActionMenuItem({ text, command, ...props }: MenuItemProps<KeyboardActionNames>) {
@@ -158,7 +156,7 @@ function KeyboardActionMenuItem({ text, command, ...props }: MenuItemProps<Keybo
{...props}
command={command}
text={<>{text} <KeyboardShortcut actionName={command as KeyboardActionNames} /></>}
/>
/>;
}
function VerticalLayoutIcon() {
@@ -181,7 +179,7 @@ function VerticalLayoutIcon() {
<path className="st8" d="m66.3 52.2c15.3 12.8 23.3 33.6 26.1 48.9l-50.6-22 48.8 24.9c-12.2 6-29.6 11.8-46.5 10-19.8-16.4-40.2-46.4-42.6-61.5 12.4-6.5 41.5-5.8 64.8-0.3z"/>
</g>
</svg>
)
);
}
function ZoomControls({ parentComponent }: { parentComponent?: Component | null }) {
@@ -205,7 +203,7 @@ function ZoomControls({ parentComponent }: { parentComponent?: Component | null
}}
className={`dropdown-item-button ${icon}`}
>{children}</a>
)
);
}
return isElectron() ? (
@@ -246,7 +244,7 @@ function ToggleWindowOnTop() {
setIsAlwaysOnTop(newState);
}}
/>
)
);
}
function useTriliumUpdateStatus() {
@@ -257,7 +255,7 @@ function useTriliumUpdateStatus() {
async function updateVersionStatus() {
const RELEASES_API_URL = "https://api.github.com/repos/TriliumNext/Trilium/releases/latest";
let latestVersion: string | undefined = undefined;
let latestVersion: string | undefined;
try {
const resp = await fetch(RELEASES_API_URL);
const data = await resp.json();