gaschz/trilium
1
0
Fork 0
mirror of https://github.com/zadam/trilium.git synced 2025-11-09 16:08:58 +01:00
Code Issues Actions 7 Packages Projects Releases Wiki Activity

client/read-only note info bar: refactor

Browse Source
This commit is contained in:
Adorian Doran 2025-11-09 01:35:33 +02:00
parent 285a7253e3
commit 220aab2b76
5 changed files with 10 additions and 14 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
apps/client/src/layouts/desktop_layout.tsx
View File

@ -24,7 +24,7 @@ import options from "../services/options.js";
import PasswordNoteSetDialog from "../widgets/dialogs/password_not_set.js"; import PasswordNoteSetDialog from "../widgets/dialogs/password_not_set.js";
import PromotedAttributesWidget from "../widgets/promoted_attributes.js"; import PromotedAttributesWidget from "../widgets/promoted_attributes.js";
import QuickSearchWidget from "../widgets/quick_search.js"; import QuickSearchWidget from "../widgets/quick_search.js";
import ReadOnlyNoteInfoBar from "../widgets/read_only_note_info_bar.jsx"; import ReadOnlyNoteInfoBar from "../widgets/ReadOnlyNoteInfoBar.jsx";
import Ribbon from "../widgets/ribbon/Ribbon.jsx"; import Ribbon from "../widgets/ribbon/Ribbon.jsx";
import RightPaneContainer from "../widgets/containers/right_pane_container.js"; import RightPaneContainer from "../widgets/containers/right_pane_container.js";
import RootContainer from "../widgets/containers/root_container.js"; import RootContainer from "../widgets/containers/root_container.js";

2
apps/client/src/layouts/mobile_layout.tsx
View File

@ -16,7 +16,7 @@ import NoteTreeWidget from "../widgets/note_tree.js";
import NoteWrapperWidget from "../widgets/note_wrapper.js"; import NoteWrapperWidget from "../widgets/note_wrapper.js";
import PromotedAttributesWidget from "../widgets/promoted_attributes.js"; import PromotedAttributesWidget from "../widgets/promoted_attributes.js";
import QuickSearchWidget from "../widgets/quick_search.js"; import QuickSearchWidget from "../widgets/quick_search.js";
import ReadOnlyNoteInfoBar from "../widgets/read_only_note_info_bar.jsx"; import ReadOnlyNoteInfoBar from "../widgets/ReadOnlyNoteInfoBar.jsx";
import RootContainer from "../widgets/containers/root_container.js"; import RootContainer from "../widgets/containers/root_container.js";
import ScreenContainer from "../widgets/mobile_widgets/screen_container.js"; import ScreenContainer from "../widgets/mobile_widgets/screen_container.js";
import ScrollingContainer from "../widgets/containers/scrolling_container.js"; import ScrollingContainer from "../widgets/containers/scrolling_container.js";

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

@ -2043,7 +2043,6 @@ body.zen .ribbon-container:has(.classic-toolbar-widget) .ribbon-top-row,
body.zen .ribbon-container .ribbon-body:not(:has(.classic-toolbar-widget)), body.zen .ribbon-container .ribbon-body:not(:has(.classic-toolbar-widget)),
body.zen .note-icon-widget, body.zen .note-icon-widget,
body.zen .title-row .icon-action, body.zen .title-row .icon-action,
body.zen .read-only-note-info-bar-widget:not(.zen-mode-only),
body.zen .promoted-attributes-widget, body.zen .promoted-attributes-widget,
body.zen .floating-buttons-children > *:not(.bx-edit-alt), body.zen .floating-buttons-children > *:not(.bx-edit-alt),
body.zen .action-button, body.zen .action-button,

13
apps/client/src/widgets/read_only_note_info_bar.css → apps/client/src/widgets/ReadOnlyNoteInfoBar.css
View File

@ -2,25 +2,22 @@ div.read-only-note-info-bar-widget {
contain: none; contain: none;
} }
div.read-only-note-info-bar-widget.zen-mode-only { body.zen div.read-only-note-info-bar-widget {
display: none; width: fit-content;
max-width: var(--max-content-width); max-width: var(--max-content-width);
margin: 0 auto; margin: 0 auto;
} }
div.read-only-note-info-bar-widget.zen-mode-only .info-bar { body.zen div.read-only-note-info-bar-widget .info-bar {
border-radius: 8px; border-radius: 8px;
} border: unset;
body.zen div.read-only-note-info-bar-widget.zen-mode-only {
display: block;
} }
.read-only-note-info-bar-widget-content { .read-only-note-info-bar-widget-content {
display: flex; display: flex;
justify-content: space-between; justify-content: space-between;
align-items: center; align-items: center;
gap: 8px; gap: 20px;
} }
:root div.read-only-note-info-bar-widget button { :root div.read-only-note-info-bar-widget button {

6
apps/client/src/widgets/read_only_note_info_bar.tsx → apps/client/src/widgets/ReadOnlyNoteInfoBar.tsx
View File

@ -1,15 +1,15 @@
import "./read_only_note_info_bar.css"; import "./ReadOnlyNoteInfoBar.css";
import { t } from "../services/i18n"; import { t } from "../services/i18n";
import { useIsNoteReadOnly, useNoteContext, useTriliumEvent } from "./react/hooks" import { useIsNoteReadOnly, useNoteContext, useTriliumEvent } from "./react/hooks"
import Button from "./react/Button"; import Button from "./react/Button";
import InfoBar from "./react/InfoBar"; import InfoBar from "./react/InfoBar";
export default function ReadOnlyNoteInfoBar(props: {zenModeOnly?: boolean}) { export default function ReadOnlyNoteInfoBar(props: {}) {
const {note, noteContext} = useNoteContext(); const {note, noteContext} = useNoteContext();
const {isReadOnly, enableEditing} = useIsNoteReadOnly(note, noteContext); const {isReadOnly, enableEditing} = useIsNoteReadOnly(note, noteContext);
const isExplicitReadOnly = note?.isLabelTruthy("readOnly"); const isExplicitReadOnly = note?.isLabelTruthy("readOnly");
return <div class={`read-only-note-info-bar-widget ${(isReadOnly) ? "visible" : ""} ${(props.zenModeOnly) ? "zen-mode-only" : ""}`}> return <div class={`read-only-note-info-bar-widget ${(isReadOnly) ? "visible" : ""}`}>
{isReadOnly && <InfoBar type={(isExplicitReadOnly ? "subtle" : "prominent")}> {isReadOnly && <InfoBar type={(isExplicitReadOnly ? "subtle" : "prominent")}>
<div class="read-only-note-info-bar-widget-content"> <div class="read-only-note-info-bar-widget-content">
{(isExplicitReadOnly) ? ( {(isExplicitReadOnly) ? (