feat: collapsed metadata for posts
This commit is contained in:
@@ -115,6 +115,32 @@
|
||||
gap: 16px;
|
||||
}
|
||||
|
||||
.metadata-toggle {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: 8px;
|
||||
width: 100%;
|
||||
padding: 6px 4px;
|
||||
background: none;
|
||||
border: none;
|
||||
color: var(--vscode-descriptionForeground);
|
||||
font-size: 11px;
|
||||
font-weight: 500;
|
||||
text-transform: uppercase;
|
||||
letter-spacing: 0.5px;
|
||||
cursor: pointer;
|
||||
transition: color 0.15s;
|
||||
}
|
||||
|
||||
.metadata-toggle:hover {
|
||||
color: var(--vscode-foreground);
|
||||
}
|
||||
|
||||
.metadata-toggle-chevron {
|
||||
font-size: 10px;
|
||||
transition: transform 0.15s;
|
||||
}
|
||||
|
||||
.editor-header-row {
|
||||
display: flex;
|
||||
gap: 16px;
|
||||
|
||||
@@ -189,6 +189,7 @@ export const PostEditor: React.FC<PostEditorProps> = ({ postId }) => {
|
||||
const [lightboxIndex, setLightboxIndex] = useState(0);
|
||||
const [showPostSearch, setShowPostSearch] = useState(false);
|
||||
const [showMediaSearch, setShowMediaSearch] = useState(false);
|
||||
const [metadataExpanded, setMetadataExpanded] = useState(true);
|
||||
const editorRef = useRef<unknown>(null);
|
||||
|
||||
const isDirty = checkIsDirty(postId);
|
||||
@@ -298,6 +299,9 @@ export const PostEditor: React.FC<PostEditorProps> = ({ postId }) => {
|
||||
setAuthor(post.author || '');
|
||||
setTags(post.tags);
|
||||
setSelectedCategories(post.categories.length > 0 ? post.categories : ['article']);
|
||||
if (!isInitialized) {
|
||||
setMetadataExpanded(post.title === '');
|
||||
}
|
||||
markClean(postId);
|
||||
// Mark as initialized AFTER setting local state
|
||||
setIsInitialized(true);
|
||||
@@ -718,6 +722,14 @@ export const PostEditor: React.FC<PostEditorProps> = ({ postId }) => {
|
||||
</div>
|
||||
|
||||
<div className="editor-content">
|
||||
<button
|
||||
className={`metadata-toggle ${metadataExpanded ? 'expanded' : ''}`}
|
||||
onClick={() => setMetadataExpanded(v => !v)}
|
||||
>
|
||||
<span className="metadata-toggle-chevron">{metadataExpanded ? '▼' : '▶'}</span>
|
||||
<span>{tr('editor.metadata.toggle')}</span>
|
||||
</button>
|
||||
{metadataExpanded && (
|
||||
<div className="editor-header-row">
|
||||
<div className="editor-meta">
|
||||
<div className="editor-field">
|
||||
@@ -768,18 +780,19 @@ export const PostEditor: React.FC<PostEditorProps> = ({ postId }) => {
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
<PostLinks
|
||||
postId={postId}
|
||||
updatedAt={post.updatedAt}
|
||||
onPostClick={(id) => useAppStore.getState().setSelectedPost(id)}
|
||||
/>
|
||||
</div>
|
||||
|
||||
|
||||
<div className="editor-media-panel">
|
||||
<LinkedMediaPanel postId={postId} />
|
||||
</div>
|
||||
</div>
|
||||
)}
|
||||
|
||||
<div className="editor-body">
|
||||
<div className="editor-toolbar">
|
||||
|
||||
@@ -510,6 +510,7 @@
|
||||
"editor.insertMediaTitle": "Bild aus Medienbibliothek einfügen",
|
||||
"editor.previewFrameTitle": "Beitragsvorschau",
|
||||
"editor.previewLoading": "Vorschau wird geladen...",
|
||||
"editor.metadata.toggle": "Metadaten",
|
||||
"editor.footer.created": "Erstellt",
|
||||
"editor.footer.updated": "Aktualisiert",
|
||||
"editor.footer.published": "Veröffentlicht",
|
||||
|
||||
@@ -510,6 +510,7 @@
|
||||
"editor.insertMediaTitle": "Insert image from media library",
|
||||
"editor.previewFrameTitle": "Post preview",
|
||||
"editor.previewLoading": "Loading preview...",
|
||||
"editor.metadata.toggle": "Metadata",
|
||||
"editor.footer.created": "Created",
|
||||
"editor.footer.updated": "Updated",
|
||||
"editor.footer.published": "Published",
|
||||
|
||||
@@ -510,6 +510,7 @@
|
||||
"editor.insertMediaTitle": "Insertar imagen desde la biblioteca multimedia",
|
||||
"editor.previewFrameTitle": "Vista previa de la entrada",
|
||||
"editor.previewLoading": "Cargando vista previa...",
|
||||
"editor.metadata.toggle": "Metadatos",
|
||||
"editor.footer.created": "Creado",
|
||||
"editor.footer.updated": "Actualizado",
|
||||
"editor.footer.published": "Publicado",
|
||||
|
||||
@@ -507,7 +507,8 @@
|
||||
"editor.insertPostLinkTitle": "Lier à un article (Ctrl+K)",
|
||||
"editor.insertMediaTitle": "Insérer une image depuis la bibliothèque média",
|
||||
"editor.previewFrameTitle": "Aperçu de l’article",
|
||||
"editor.previewLoading": "Chargement de l’aperçu...",
|
||||
"editor.previewLoading": "Chargement de l'aperçu...",
|
||||
"editor.metadata.toggle": "Métadonnées",
|
||||
"editor.footer.created": "Créé",
|
||||
"editor.footer.updated": "Mis à jour",
|
||||
"editor.footer.published": "Publié",
|
||||
|
||||
@@ -508,6 +508,7 @@
|
||||
"editor.insertMediaTitle": "Inserisci immagine dalla libreria media",
|
||||
"editor.previewFrameTitle": "Anteprima post",
|
||||
"editor.previewLoading": "Caricamento anteprima...",
|
||||
"editor.metadata.toggle": "Metadati",
|
||||
"editor.footer.created": "Creato",
|
||||
"editor.footer.updated": "Aggiornato",
|
||||
"editor.footer.published": "Pubblicato",
|
||||
|
||||
Reference in New Issue
Block a user