feat(layout/inline-title): add an intro text

This commit is contained in:
Elian Doran 2025-12-13 12:55:24 +02:00
parent 7666f44b7a
commit 87666005a6
No known key found for this signature in database
3 changed files with 9 additions and 3 deletions

View File

@ -1753,7 +1753,8 @@
"note_title": { "note_title": {
"placeholder": "type note's title here...", "placeholder": "type note's title here...",
"created_on": "Created on <Value />", "created_on": "Created on <Value />",
"last_modified": "Last modified on <Value />" "last_modified": "Last modified on <Value />",
"note_type_switcher_label": "Switch from {{type}} to:"
}, },
"search_result": { "search_result": {
"no_notes_found": "No notes have been found for given search parameters.", "no_notes_found": "No notes have been found for given search parameters.",

View File

@ -50,10 +50,13 @@ body.prefers-centered-content .inline-title {
min-height: 60px; min-height: 60px;
--badge-radius: 12px; --badge-radius: 12px;
>* {
flex-shrink: 0;
}
.ext-badge { .ext-badge {
--color: var(--input-background-color); --color: var(--input-background-color);
color: var(--main-text-color); color: var(--main-text-color);
flex-shrink: 0;
font-size: 0.9rem; font-size: 0.9rem;
} }
} }

View File

@ -6,7 +6,7 @@ import { ComponentChild } from "preact";
import { useEffect, useMemo, useRef, useState } from "preact/hooks"; import { useEffect, useMemo, useRef, useState } from "preact/hooks";
import { Trans } from "react-i18next"; import { Trans } from "react-i18next";
import FNote from "../../entities/fnote"; import { t } from "../../services/i18n";
import { ViewScope } from "../../services/link"; import { ViewScope } from "../../services/link";
import { NOTE_TYPES } from "../../services/note_types"; import { NOTE_TYPES } from "../../services/note_types";
import server from "../../services/server"; import server from "../../services/server";
@ -135,12 +135,14 @@ function NoteTypeSwitcher() {
const blob = useNoteBlob(note); const blob = useNoteBlob(note);
const currentNoteType = useNoteProperty(note, "type"); const currentNoteType = useNoteProperty(note, "type");
const noteTypes = useMemo(() => NOTE_TYPES.filter((nt) => !nt.reserved && !nt.static), []); const noteTypes = useMemo(() => NOTE_TYPES.filter((nt) => !nt.reserved && !nt.static), []);
const currentNoteTypeData = useMemo(() => noteTypes.find(t => t.type === currentNoteType), [ noteTypes, currentNoteType ]);
return (note?.type === "text" && return (note?.type === "text" &&
<div <div
className="note-type-switcher" className="note-type-switcher"
onWheel={onWheelHorizontalScroll} onWheel={onWheelHorizontalScroll}
> >
<div className="intro">{t("note_title.note_type_switcher_label", { type: currentNoteTypeData?.title.toLocaleLowerCase() })}</div>
{blob?.contentLength === 0 && noteTypes.map(noteType => noteType.type !== currentNoteType && ( {blob?.contentLength === 0 && noteTypes.map(noteType => noteType.type !== currentNoteType && (
<Badge <Badge
key={noteType.type} key={noteType.type}