Fix overflow on narrow screens

This commit is contained in:
Adrian Rumpold
2025-05-21 12:46:16 +02:00
parent 6ad3ad8044
commit 7ccaa531e1
2 changed files with 3 additions and 7 deletions

View File

@@ -33,7 +33,7 @@ function App() {
}); });
return ( return (
<div> <>
<StringFilter onChange={setStringFilter} /> <StringFilter onChange={setStringFilter} />
<AlphabeticalFilter onChange={setAlphabeticalFilter} /> <AlphabeticalFilter onChange={setAlphabeticalFilter} />
{entries.length} entries found {entries.length} entries found
@@ -45,7 +45,7 @@ function App() {
onClose={() => setSelectedCitation(null)} onClose={() => setSelectedCitation(null)}
/> />
)} )}
<dl> <dl style={{ maxWidth: "min(100vw, 64ch)" }}>
{entries.map((term) => ( {entries.map((term) => (
<GlossaryEntry <GlossaryEntry
term={term} term={term}
@@ -54,7 +54,7 @@ function App() {
/> />
))} ))}
</dl> </dl>
</div> </>
); );
} }
export default App; export default App;

View File

@@ -2,10 +2,6 @@ dt {
font-weight: bold; font-weight: bold;
} }
dd {
max-width: 64ch;
}
dd + dd { dd + dd {
margin-top: 1rem; margin-top: 1rem;
border-top: 1px solid var(--color-border); border-top: 1px solid var(--color-border);