- LooksLooks
- Four: Standard, Grouped, Key/value, Grid — every table in the apps uses one of themVier: Standard, Gruppiert, Schlüssel/Wert, Raster – jede Tabelle in den Apps nutzt einen davon
- HeaderKopfzeile
- Primary-200, 14 px Geist Medium, 40 px, titles up to two linesPrimary-200, 14 px Geist Medium, 40 px, Titel höchstens zweizeilig
- Sticky headerKlebende Kopfzeile
- Sticks under the toolbar while a long table scrolls with the page, also when the table scrolls sideways in its own boxKlebt unter der Toolbar, während eine lange Tabelle mit der Seite scrollt, auch wenn die Tabelle seitlich in ihrer eigenen Box scrollt
- RowsZeilen
- 40 px, 14 px Geist Light, cells up to three lines, then … with a tooltip; table rows stay 40 px, the 32 px list rows are for options, menus and navigation40 px, 14 px Geist Light, Zellen höchstens dreizeilig, dann … mit Tooltip; Tabellenzeilen bleiben 40 px, die 32-px-Listenzeilen gelten für Optionen, Menüs und Navigation
- NumbersZahlen
- Title, sort arrow and values right-aligned, the arrow before the title so the title lines up with the values; the menu icon sits at the left edge of the cell; values with tabular figuresTitel, Sortierpfeil und Werte rechtsbündig, der Pfeil vor dem Titel, damit der Titel mit den Werten fluchtet; das Menü-Icon sitzt am linken Rand der Zelle; Werte mit Tabellenziffern
- Empty cellLeere Zelle
- “–” in secondary-700, screen readers hear “No value”„–“ in secondary-700, Screenreader hören „No value“
- LinesLinien
- 1 px secondary-200 between rows, no stripes; frame 1 px secondary-200, radius 16 px like boxes1 px secondary-200 zwischen den Zeilen, keine Streifen; Rahmen 1 px secondary-200, Radius 16 px wie Boxen
- Column titleSpaltentitel
- The whole header cell is one button that opens the column menu; hover and open Primary-300 on the whole cell, no ring; on hover, focus and while open a 16 px icon in App-900 shows at the right edge of the cell (filter icon for columns with filter values, sort icon for the others), always on touch screens; Enter, Space or arrow down opens the menu, Esc closes it and returns to the titleDie ganze Kopfzelle ist ein Button, der das Spaltenmenü öffnet; Hover und offen Primary-300 auf der ganzen Zelle, ohne Ring; bei Hover, Fokus und solange offen erscheint am rechten Rand der Zelle ein 16-px-Icon in App-900 (Filter-Icon bei Spalten mit Filterwerten, Sortier-Icon bei den anderen), auf Touchscreens immer; Enter, Leertaste oder Pfeil nach unten öffnet das Menü, Esc schließt es und kehrt zum Titel zurück
- Column menuSpaltenmenü
- Floating panel like the selects (float surface, radius 16 px, float shadow, 8 px padding); columns with filter values: 256 px, column name 14 px Medium with Reset on the right, sort as segmented control Ascending | Descending, values as checkboxes with Select all / Deselect all, search from 10 values, Cancel | Apply; Reset sets the panel back to the defaults (all values, the table’s default sort); only Apply applies, Esc, Cancel and clicking outside discard; with no value selected Apply stays disabled: “Select at least one value”Schwebendes Panel wie bei den Selects (Fläche float, Radius 16 px, Float-Schatten, 8 px Innenabstand); Spalten mit Filterwerten: 256 px, Spaltenname 14 px Medium mit Reset rechts, Sortierung als Segmented control Ascending | Descending, Werte als Checkboxen mit Select all / Deselect all, Suche ab 10 Werten, Cancel | Apply; Reset setzt das Panel auf die Standards zurück (alle Werte, Standardsortierung der Tabelle); nur Apply übernimmt, Esc, Cancel und Klick daneben verwerfen; ist kein Wert gewählt, bleibt Apply deaktiviert: „Select at least one value“
- Sort onlyNur sortieren
- Columns without filter values (numbers, dates without a time frame filter) get a menu with Sort ascending and Sort descending, the current one checked, plus Reset sort while the column is sorted (back to the table’s default sort); a choice applies at onceSpalten ohne Filterwerte (Zahlen, Datum ohne Zeitraumfilter) bekommen ein Menü mit Sort ascending und Sort descending, die aktuelle Wahl mit Häkchen, dazu Reset sort solange die Spalte sortiert ist (zurück zur Standardsortierung der Tabelle); eine Wahl gilt sofort
- Date columnsDatumsspalten
- Date columns can get a time frame filter in their column menu: as wide as the Date selector, column name with Reset, sort Ascending | Descending, then the Date selector’s time frame chooser (Today, Last 7 days, Last 30 days, Older than 7 days, Older than 30 days, Custom time frame with start and end date and calendar), Cancel | Apply; Reset means no time frame and the table’s default sort; while it filters, the filter icon stays at the edge of the cell and the filter bar shows a removable filter button (Last update Last 7 days, a custom range as 2026-10-29 – 2026-11-04) that opens the same menu; in apps without a time frame in the filter group (e.g. Manage) every date column can have it; only when the page has a time frame, the one column it filters (e.g. Finished) stays sort onlyDatumsspalten können in ihrem Spaltenmenü einen Zeitraumfilter bekommen: so breit wie der Date selector, Spaltenname mit Reset, Sortierung Ascending | Descending, dann die Zeitraumauswahl des Date selectors (Today, Last 7 days, Last 30 days, Older than 7 days, Older than 30 days, Custom time frame mit Start- und Enddatum und Kalender), Cancel | Apply; Reset heißt kein Zeitraum und die Standardsortierung der Tabelle; solange er filtert, bleibt das Filter-Icon am Rand der Zelle und die Filter bar zeigt einen entfernbaren Filter-Button (Last update Last 7 days, ein eigener Zeitraum als 2026-10-29 – 2026-11-04), der dasselbe Menü öffnet; in Apps ohne Zeitraum in der Filtergruppe (z. B. Manage) kann jede Datumsspalte ihn haben; nur wenn die Seite einen Zeitraum hat, bleibt die eine Spalte, die er filtert (z. B. Finished), nur sortierbar
- Status marksStatuszeichen
- 16 px, secondary-900, not clickable on their own: the sort arrow next to the title only while the column is sorted; while it is filtered the filter icon at the edge of the cell stays visible in secondary-900 and turns App-900 on hover (never twice)16 px, secondary-900, selbst nicht klickbar: der Sortierpfeil neben dem Titel nur solange die Spalte sortiert ist; solange sie gefiltert ist, bleibt das Filter-Icon am Rand der Zelle in secondary-900 sichtbar und wird bei Hover App-900 (nie doppelt)
- Filter sectionFilter-Section
- Filter bar above the table: filter group with mode, time frame and vehicles, filter buttons for single columns, search on the rightFilter bar über der Tabelle: Filtergruppe mit Modus, Zeitraum und Fahrzeugen, Filter-Buttons für einzelne Spalten, Suche rechts
- In syncSynchron
- A filter set in the column menu and its filter button above always show the same valuesEin Filter im Spaltenmenü und sein Filter-Button oben zeigen immer dieselben Werte
- Active filtersAktive Filter
- The filter buttons show what is active; “x of y” with the table’s noun (e.g. 12 of 36 vehicles) and Clear filters sit at the end of the filter bar; a value set from somewhere else shows as a removable filter button, never as an input chipDie Filter-Buttons zeigen, was aktiv ist; „x of y“ mit dem Begriff der Tabelle (z. B. 12 of 36 vehicles) und Clear filters stehen am Ende der Filterleiste; ein woanders gesetzter Wert erscheint als entfernbarer Filter-Button, nie als Input-Chip
- Clickable rowKlickbare Zeile
- Hover secondary-100; opened row Primary-100, hover Primary-200; Tab reaches it, Enter opens it; a row that opens its own page (rowHref) is a link: a click or Enter goes there, Cmd/Ctrl-click opens a new tab; Edit, the row menu and other buttons in the row never doHover secondary-100; geöffnete Zeile Primary-100, Hover Primary-200; Tab erreicht sie, Enter öffnet sie; eine Zeile, die eine eigene Seite öffnet (rowHref), ist ein Link: Klick oder Enter führt dorthin, Cmd/Strg-Klick öffnet einen neuen Tab; Bearbeiten, das Zeilenmenü und andere Buttons in der Zeile nie
- ActionsAktionen
- Always the last column, 40 px, sticky; edge shadow while the table scrolls; Edit is the main action of the row, so its icon button is Tertiary in App-900Immer die letzte Spalte, 40 px, klebend; Kantenschatten, solange die Tabelle scrollt; Bearbeiten ist die Hauptaktion der Zeile, deshalb ist sein Icon-Button Tertiary in App-900
- Row menuZeilenmenü
- More actions of a row in a menu behind a dark tertiary “More actions” icon button in the last column, sticky like the actions and after Edit; the menu floats above the table; an action that deletes opens a small confirm modalWeitere Aktionen einer Zeile in einem Menü hinter einem dunklen Tertiary-Icon-Button „More actions“ in der letzten Spalte, klebend wie die Aktionen und nach Bearbeiten; das Menü schwebt über der Tabelle; eine Aktion, die löscht, öffnet ein kleines Bestätigungs-Modal
- Vehicle cellFahrzeug-Zelle
- Name, serial number below in 12 px secondary-700; one columnName, darunter die Seriennummer in 12 px secondary-700; eine Spalte
- Group rowGruppenzeile
- Secondary-100, hover Secondary-200, Medium, chevron left, the whole row opens and closes; Primary-100 stays for opened rowsSecondary-100, Hover Secondary-200, Medium, Pfeil links, die ganze Zeile klappt auf und zu; Primary-100 bleibt für geöffnete Zeilen
- Total rowSummenzeile
- White, Medium, line above, sticky at the bottomWeiß, Medium, Linie darüber, klebt unten
- Wide tablesBreite Tabellen
- Scroll sideways in their own box; header and actions stayScrollen seitlich in ihrer eigenen Box; Kopfzeile und Aktionen bleiben stehen