Fix metadata display not wrapping long lines. Add LaTeX support

This commit is contained in:
Kylian Schmidt
2025-07-29 14:05:22 +02:00
parent fc4928fef1
commit c6882b2a48
7 changed files with 137 additions and 36 deletions
+39 -23
View File
@@ -187,53 +187,69 @@
.metadata-grid {
padding: 1rem;
display: grid;
grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
gap: 0.5rem 1rem;
grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
gap: 1rem 1.5rem; /* Increased gaps to prevent overlapping */
}
/* Metadata Items */
.metadata-item {
display: flex;
align-items: flex-start;
gap: 0.5rem;
padding: 0.25rem 0;
flex-direction: column; /* Stack key and value vertically to prevent overlap */
gap: 0.25rem;
padding: 0.75rem;
background: var(--card-bg);
border-radius: 6px;
border: 1px solid var(--border-color);
word-wrap: break-word; /* Ensure long text wraps */
overflow-wrap: break-word; /* Additional word wrapping */
}
.metadata-key {
font-weight: 600;
color: var(--link-color);
white-space: nowrap;
min-width: fit-content;
font-size: 0.9rem;
margin-bottom: 0.25rem;
}
.metadata-value {
color: var(--text-color);
word-break: break-word;
flex: 1;
overflow-wrap: break-word;
line-height: 1.4;
font-size: 0.9rem;
}
/* Tags for list items */
/* LaTeX content styling */
.latex-content {
color: var(--text-color);
line-height: 1.6;
font-family: 'Times New Roman', serif;
}
/* Simple list items - no special formatting */
.metadata-list {
display: flex;
flex-wrap: wrap;
gap: 0.25rem;
color: var(--text-color);
line-height: 1.4;
}
/* Remove the blue box styling for tags */
.metadata-tag {
background: var(--link-color);
color: white;
padding: 0.2rem 0.5rem;
border-radius: 12px;
font-size: 0.8rem;
white-space: nowrap;
display: inline;
background: none;
color: var(--text-color);
padding: 0;
border-radius: 0;
font-size: inherit;
white-space: normal;
}
/* Nested metadata */
/* Simplified nested metadata */
.metadata-nested {
background: var(--card-bg);
padding: 0.5rem;
border-radius: 4px;
border-left: 3px solid var(--link-color);
background: none;
padding: 0;
border-radius: 0;
border-left: none;
color: var(--text-color);
}
.metadata-nested-item {