diff --git a/apps/client/src/layouts/desktop_layout.tsx b/apps/client/src/layouts/desktop_layout.tsx index fc2ab1334..d5693ada7 100644 --- a/apps/client/src/layouts/desktop_layout.tsx +++ b/apps/client/src/layouts/desktop_layout.tsx @@ -131,7 +131,6 @@ export default class DesktopLayout { .child() ) .child() - .child() .child(new WatchedFileUpdateStatusWidget()) .child() .child( @@ -139,6 +138,7 @@ export default class DesktopLayout { .filling() .child(new ContentHeader() .child() + .child() ) .child(new PromotedAttributesWidget()) .child() diff --git a/apps/client/src/layouts/mobile_layout.tsx b/apps/client/src/layouts/mobile_layout.tsx index 153773ce6..8d1aeece8 100644 --- a/apps/client/src/layouts/mobile_layout.tsx +++ b/apps/client/src/layouts/mobile_layout.tsx @@ -151,7 +151,6 @@ export default class MobileLayout { .child() .child() ) - .child() .child() .child(new PromotedAttributesWidget()) .child( @@ -160,6 +159,7 @@ export default class MobileLayout { .contentSized() .child(new ContentHeader() .child() + .child() ) .child(new NoteDetailWidget()) .child() diff --git a/apps/client/src/widgets/react/InfoBar.css b/apps/client/src/widgets/react/InfoBar.css index 73e0aba25..200b1de13 100644 --- a/apps/client/src/widgets/react/InfoBar.css +++ b/apps/client/src/widgets/react/InfoBar.css @@ -1,5 +1,6 @@ .info-bar { margin-top: 4px; + contain: unset !important; padding: 8px 20px; color: var(--read-only-note-info-bar-color); font-size: .9em; diff --git a/apps/client/src/widgets/react/InfoBar.tsx b/apps/client/src/widgets/react/InfoBar.tsx index ba8c7226a..52435ab48 100644 --- a/apps/client/src/widgets/react/InfoBar.tsx +++ b/apps/client/src/widgets/react/InfoBar.tsx @@ -3,12 +3,13 @@ import { ComponentChildren } from "preact"; import "./InfoBar.css"; export type InfoBarParams = { - type: "prominent" | "subtle" + type: "prominent" | "subtle", + className: string; children: ComponentChildren; }; export default function InfoBar(props: InfoBarParams) { - return
+ return
{props?.children}
} diff --git a/apps/client/src/widgets/shared_info.css b/apps/client/src/widgets/shared_info.css new file mode 100644 index 000000000..bc44b4984 --- /dev/null +++ b/apps/client/src/widgets/shared_info.css @@ -0,0 +1,7 @@ +.shared-info-widget { + display: flex; +} + +.shared-info-widget button { + margin-inline-start: 8px; +} \ No newline at end of file diff --git a/apps/client/src/widgets/shared_info.tsx b/apps/client/src/widgets/shared_info.tsx index 15bf53b1a..fad905ddc 100644 --- a/apps/client/src/widgets/shared_info.tsx +++ b/apps/client/src/widgets/shared_info.tsx @@ -1,11 +1,12 @@ -import { useEffect, useState } from "preact/hooks"; +import "./shared_info.css"; import { t } from "../services/i18n"; -import Alert from "./react/Alert"; +import { useEffect, useState } from "preact/hooks"; import { useNoteContext, useTriliumEvent, useTriliumOption } from "./react/hooks"; -import FNote from "../entities/fnote"; import attributes from "../services/attributes"; -import RawHtml from "./react/RawHtml"; +import FNote from "../entities/fnote"; import HelpButton from "./react/HelpButton"; +import InfoBar from "./react/InfoBar"; +import RawHtml from "./react/RawHtml"; export default function SharedInfo() { const { note } = useNoteContext(); @@ -35,7 +36,7 @@ export default function SharedInfo() { link = `${location.protocol}//${host}${location.pathname}share/${shareId}`; } - setLink(`${link}`); + setLink(`${link}`); } useEffect(refresh, [ note ]); @@ -48,20 +49,14 @@ export default function SharedInfo() { }); return ( - + {link && ( )} - + ) }