Adding the Value column pushed the table past max-w-4xl: roughly 624px of declared column widths inside an 896px dialog, leaving Slice and Note to fight over the rest. With auto table layout the cells won and the table grew wider than its container, so the dialog got a horizontal scrollbar along the bottom. table-fixed makes the declared widths hold and the free-text columns truncate instead of widening the table -- which is what the truncate classes on them already assumed. Dialog widened to max-w-6xl, gutters down from px-4 to px-3, and Note given an explicit share rather than whatever was left. max-w-xs on the slice and note cells was doing nothing useful under fixed layout and is now overflow-hidden, which is what makes truncate work in a table cell. Co-Authored-By: Claude Opus 5 (1M context) <noreply@anthropic.com> |
||
|---|---|---|
| .. | ||
| public | ||
| src | ||
| vendor | ||
| .gitignore | ||
| eslint.config.js | ||
| index.html | ||
| package-lock.json | ||
| package.json | ||
| README.md | ||
| vite.config.js | ||
React + Vite
This template provides a minimal setup to get React working in Vite with HMR and some ESLint rules.
Currently, two official plugins are available:
- @vitejs/plugin-react uses Oxc
- @vitejs/plugin-react-swc uses SWC
React Compiler
The React Compiler is not enabled on this template because of its impact on dev & build performances. To add it, see this documentation.
Expanding the ESLint configuration
If you are developing a production application, we recommend using TypeScript with type-aware lint rules enabled. Check out the TS template for information on how to integrate TypeScript and typescript-eslint in your project.