Dockery/Trilium
1
0
Fork 0
mirror of https://github.com/zadam/trilium.git synced 2025-10-26 07:46:30 +01:00
Code Issues Packages Projects Releases Activity

chore(react/ribbon): fix 3px height of the ribbon when collapsed

Browse Source
This commit is contained in:
Elian Doran
2025-08-27 13:12:51 +03:00
parent 82bdb76d75
commit 3a3fed4314
2 changed files with 25 additions and 31 deletions
Download Patch File Download Diff File Expand all files Collapse all files

12
apps/client/src/widgets/ribbon/FormattingToolbar.tsx
View File

@@ -1,4 +1,3 @@
import { CSSProperties } from "preact/compat";
import { useTriliumOption } from "../react/hooks";
/**
@@ -10,17 +9,10 @@ import { useTriliumOption } from "../react/hooks";
*
* ! The toolbar is not only used in the ribbon, but also in the quick edit feature.
*/
export default function FormattingToolbar({ hidden }: { hidden?: boolean }) {
export default function FormattingToolbar() {
const [ textNoteEditorType ] = useTriliumOption("textNoteEditorType");
const style: CSSProperties = {};
if (hidden) {
style.display = "none";
}
return (textNoteEditorType === "ckeditor-classic" &&
<div className="classic-toolbar-widget" style={style}>
</div>
<div className="classic-toolbar-widget" />
)
};

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

@@ -214,28 +214,30 @@ export default function Ribbon() {
</div>
</div>
<div className="ribbon-body-container">
<div className="ribbon-body">
{filteredTabs.map(tab => {
const isActive = tab.index === activeTabIndex;
if (!isActive && !tab.stayInDom) {
return;
}
<div className="ribbon-body-container">
{filteredTabs.map(tab => {
const isActive = tab.index === activeTabIndex;
if (!isActive && !tab.stayInDom) {
return;
}
return tab?.content && tab.content({
note,
hidden: !isActive,
ntxId,
hoistedNoteId,
notePath,
noteContext,
componentId,
activate: useCallback(() => {
setActiveTabIndex(tab.index)
}, [setActiveTabIndex])
});
})}
</div>
return (
<div className={`ribbon-body ${!isActive ? "hidden-ext" : ""}`}>
{tab?.content && tab.content({
note,
hidden: !isActive,
ntxId,
hoistedNoteId,
notePath,
noteContext,
componentId,
activate: useCallback(() => {
setActiveTabIndex(tab.index)
}, [setActiveTabIndex])
})}
</div>
);
})}
</div>
</>
)}