Scarriffle/Vorrania
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Web: Kategorie-Tabelle bekommt mehr Breite (kein Seitwaerts-Scrollen)

Browse Source 
Durch die neue Spalte "Uebergeordnet" wurde die Kategorie-Tabelle im halben Grid
zu breit und scrollte seitwaerts. Die Kategorien-Seite nutzt jetzt das
wide-aside-Layout; dessen Block daneben ist zudem schmal gedeckelt (clamp), damit
die Tabelle den restlichen Platz bekommt. Gilt auch fuer die Gruppen-Seite.

Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>
This commit is contained in:
Scarriffle
2026-07-26 00:07:23 +02:00
parent 928342d352
commit 68e27c1868
2 changed files with 4 additions and 2 deletions
Download Patch File Download Diff File Expand all files Collapse all files

2
web/src/pages/Categories.jsx
View File

@@ -140,7 +140,7 @@ export default function Categories() {
<button type="button" className={typFilter === "object" ? "active" : ""} onClick={() => setTypFilter("object")}>Gegenstände</button> <button type="button" className={typFilter === "object" ? "active" : ""} onClick={() => setTypFilter("object")}>Gegenstände</button>
</div> </div>
<div className="grid-2"> <div className="grid-2 wide-aside">
<div className="card" style={{ padding: 0 }}> <div className="card" style={{ padding: 0 }}>
<div className="table-wrap"> <div className="table-wrap">
<table className="table"> <table className="table">

4
web/src/styles.css
View File

@@ -166,7 +166,9 @@ h2 { font-size: 0.95rem; font-weight: 650; margin: 0 0 var(--sp-3); letter-spaci
/* Tabelle plus Block daneben: Die Tabelle hat mehr Spalten und bekommt /* Tabelle plus Block daneben: Die Tabelle hat mehr Spalten und bekommt
deshalb den groesseren Anteil - sonst rutscht sie unnoetig frueh in die deshalb den groesseren Anteil - sonst rutscht sie unnoetig frueh in die
Kartenansicht, obwohl daneben Platz frei waere. */ Kartenansicht, obwohl daneben Platz frei waere. */
.grid-2.wide-aside { grid-template-columns: minmax(0, 1.5fr) minmax(340px, 1fr); } /* Tabelle bekommt den ganzen restlichen Platz, der Block daneben bleibt schmal
und gedeckelt - so scrollt die (breite) Tabelle nicht seitwaerts. */
.grid-2.wide-aside { grid-template-columns: minmax(0, 1fr) clamp(300px, 26%, 360px); align-items: start; }
@media (max-width: 1000px) { @media (max-width: 1000px) {
.grid-2.wide-aside { grid-template-columns: minmax(0, 1fr); } .grid-2.wide-aside { grid-template-columns: minmax(0, 1fr); }
} }