feat(design): neon polish — rating bars, destructive colors, active nav glow

2026-08-06 07:52:58 +02:00
parent d777ee9211
commit 23e8ac702e
45 changed files with 4745 additions and 14 deletions
@@ -0,0 +1,66 @@
+
+# Find & browse tools
+
+The **Browse tools** section (`/tools`) is your entry point to the catalog.
+Here you combine search, filters and sorting to find exactly the tools
+you are interested in.
+
+## Search
+
+- The **search bar** searches name and description (full text).
+- Shortcut: Press **`/`** to focus the search.
+- The input is debounced so that filtering happens immediately with each
+  keystroke.
+
+## Filter
+
+Via the **Filter** button (with a badge for the number of active filters)
+you open the filter popover with:
+
+- **Tags** — selection via checkboxes (scrollable list).
+- **Features** — selection via checkboxes.
+- **Minimum rating** — slider from 0 to 5 (in steps of 0.5); shows
+  e.g. "3.0+".
+
+Active filters appear as **removable chips** above the result list.
+Use **Reset filters** or **Remove all** to clear them again.
+
+## Sort
+
+The **Sort** dropdown offers the following options:
+
+| Sort | Description |
+| --- | --- |
+| Newest | New tools first |
+| Top rated | By combined rating |
+| Most rated | By number of ratings |
+| Name (A–Z) | Alphabetically ascending |
+| Name (Z–A) | Alphabetically descending |
+| Last updated | By last update |
+
+## View & density
+
+- **Switch view:** grid / table / rows.
+- **Density:** comfortable / compact (slider).
+
+Your selection is saved — locally in the browser and, for logged-in users,
+additionally on the server in the preferences. View, density, search, filters
+and sorting are reflected in the URL so you can share results.
+
+## Table view
+
+In the table view the columns **Tool**, **Rating** and **Number of
+ratings** are sortable. Hovering over a row shows a preview
+with rating details, tags and mini bars.
+
+## Selecting for comparison & watchlist
+
+- On every card/row you find a **compare icon** that lets you add tools to the
+  [compare bar](/docs/handbook/vergleichen).
+- The **bookmark icon** saves tools to your
+  [watchlist](/docs/handbook/watchlist) (only with the corresponding plan).
+
+## API
+
+All search, filter and sort parameters correspond to the query parameters of
+[`GET /tools`](/docs/reference/endpoints/tools#listTools).