mirror of
https://github.com/zadam/trilium.git
synced 2025-11-09 07:58:59 +01:00
client/read only note info bar: add support for zen mode
This commit is contained in:
parent
95e5c2563e
commit
b52e615f0c
@ -137,6 +137,7 @@ export default class DesktopLayout {
|
||||
.child(
|
||||
new ScrollingContainer()
|
||||
.filling()
|
||||
.child(<ReadOnlyNoteInfoBar zenModeOnly />)
|
||||
.child(new PromotedAttributesWidget())
|
||||
.child(<SqlTableSchemas />)
|
||||
.child(new NoteDetailWidget())
|
||||
|
||||
@ -153,6 +153,7 @@ export default class MobileLayout {
|
||||
.child(<SharedInfoWidget />)
|
||||
.child(<ReadOnlyNoteInfoBar />)
|
||||
.child(<FloatingButtons items={MOBILE_FLOATING_BUTTONS} />)
|
||||
.child(<ReadOnlyNoteInfoBar zenModeOnly />)
|
||||
.child(new PromotedAttributesWidget())
|
||||
.child(
|
||||
new ScrollingContainer()
|
||||
|
||||
@ -2043,6 +2043,7 @@ body.zen .ribbon-container:has(.classic-toolbar-widget) .ribbon-top-row,
|
||||
body.zen .ribbon-container .ribbon-body:not(:has(.classic-toolbar-widget)),
|
||||
body.zen .note-icon-widget,
|
||||
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 .floating-buttons-children > *:not(.bx-edit-alt),
|
||||
body.zen .action-button,
|
||||
|
||||
@ -17,6 +17,14 @@ div.read-only-note-info-bar-widget.visible {
|
||||
transition: opacity 300ms ease-out;
|
||||
}
|
||||
|
||||
div.read-only-note-info-bar-widget.zen-mode-only {
|
||||
display: none;
|
||||
}
|
||||
|
||||
body.zen div.read-only-note-info-bar-widget.zen-mode-only {
|
||||
display: flex;
|
||||
}
|
||||
|
||||
:root div.read-only-note-info-bar-widget button {
|
||||
white-space: nowrap;
|
||||
padding: 2px 8px;
|
||||
|
||||
@ -3,11 +3,11 @@ import { t } from "../services/i18n";
|
||||
import { useIsNoteReadOnly, useNoteContext, useTriliumEvent } from "./react/hooks"
|
||||
import Button from "./react/Button";
|
||||
|
||||
export default function ReadOnlyNoteInfoBar() {
|
||||
export default function ReadOnlyNoteInfoBar(props: {zenModeOnly?: boolean}) {
|
||||
const {isReadOnly, enableEditing} = useIsNoteReadOnly();
|
||||
const {note} = useNoteContext();
|
||||
|
||||
return <div class={`read-only-note-info-bar-widget ${(isReadOnly) ? " visible" : ""}`}>
|
||||
return <div class={`read-only-note-info-bar-widget ${(isReadOnly) ? "visible" : ""} ${(props.zenModeOnly) ? "zen-mode-only" : ""}`}>
|
||||
{isReadOnly && <>
|
||||
{note?.isLabelTruthy("readOnly") ? (
|
||||
<div>{t("read-only-info.read-only-note")}</div>
|
||||
|
||||
Loading…
x
Reference in New Issue
Block a user