diff --git a/apps/client/src/translations/en/translation.json b/apps/client/src/translations/en/translation.json
index dfce263d0..f11ec921c 100644
--- a/apps/client/src/translations/en/translation.json
+++ b/apps/client/src/translations/en/translation.json
@@ -1750,8 +1750,8 @@
},
"note_title": {
"placeholder": "type note's title here...",
- "created_on": "Created on {{date}}",
- "last_modified": "Last modified on {{date}}"
+ "created_on": "Created on ",
+ "last_modified": "Last modified on "
},
"search_result": {
"no_notes_found": "No notes have been found for given search parameters.",
diff --git a/apps/client/src/widgets/NoteTitleDetails.tsx b/apps/client/src/widgets/NoteTitleDetails.tsx
index e0cfc00c6..9a7bb054b 100644
--- a/apps/client/src/widgets/NoteTitleDetails.tsx
+++ b/apps/client/src/widgets/NoteTitleDetails.tsx
@@ -2,9 +2,11 @@ import { type ComponentChild } from "preact";
import { t } from "../services/i18n";
import { formatDateTime } from "../utils/formatters";
-import { useNoteContext } from "./react/hooks";
+import { useNoteContext, useStaticTooltip } from "./react/hooks";
import { joinElements } from "./react/react_utils";
import { useNoteMetadata } from "./ribbon/NoteInfoTab";
+import { Trans } from "react-i18next";
+import { useRef } from "preact/hooks";
export default function NoteTitleDetails() {
const { note } = useNoteContext();
@@ -12,12 +14,18 @@ export default function NoteTitleDetails() {
const isHiddenNote = note?.noteId.startsWith("_");
const items: ComponentChild[] = [
- (!isHiddenNote && metadata?.dateCreated &&
- {t("note_title.created_on", { date: formatDateTime(metadata.dateCreated, "medium", "none")} )}
- ),
- (!isHiddenNote && metadata?.dateModified &&
- {t("note_title.last_modified", { date: formatDateTime(metadata.dateModified, "medium", "none")} )}
- )
+ (!isHiddenNote && metadata?.dateCreated &&
+ ),
+ (!isHiddenNote && metadata?.dateModified &&
+ )
].filter(item => !!item);
return (
@@ -26,3 +34,27 @@ export default function NoteTitleDetails() {
);
}
+
+function TextWithValue({ i18nKey, value, valueTooltip }: {
+ i18nKey: string;
+ value: string;
+ valueTooltip: string;
+}) {
+ const listItemRef = useRef(null);
+ useStaticTooltip(listItemRef, {
+ selector: "span.value",
+ title: valueTooltip,
+ popperConfig: { placement: "bottom" }
+ });
+
+ return (
+
+ {value} as React.ReactElement
+ }}
+ />
+
+ );
+}
diff --git a/apps/client/src/widgets/note_title.css b/apps/client/src/widgets/note_title.css
index d147e647d..52ca6cbb7 100644
--- a/apps/client/src/widgets/note_title.css
+++ b/apps/client/src/widgets/note_title.css
@@ -51,6 +51,10 @@ body.experimental-feature-new-layout {
margin: 0;
list-style-type: none;
margin-bottom: 2em;
+
+ span.value {
+ font-weight: 500;
+ }
}
.scrolling-container:has(> :is(.note-detail.full-height, .note-list-widget.full-height)) {