---
name: project_subnet_ui_details
description: Détails UI subnet.php — subnets triés alpha, colonnes alignées entre groupes (table-layout fixed)
metadata:
  type: project
---

Petits ajustements durables sur l'affichage des subnets/réservations :

- **Subnets triés par ordre alphabétique** (nom), sidebar ET page subnets :
  `Subnet::getAll()` fait `ORDER BY s.name` (avant : `kea_subnet_id`). Collation utf8mb4 `_ci`
  → insensible à la casse. Pas d'option de tri (décision produit).
- **Colonnes alignées entre groupes** (mode groupé de `subnet.php`) : chaque groupe rend sa
  propre `<table>`, donc `table-layout:auto` les dimensionnait indépendamment → désalignement.
  Fix : classe `.res-table` + `table-layout:fixed` + largeurs fixes par colonne dans le JS
  (`COL_WIDTH` dans `makeTable`). Colonnes à contenu constant (IP/MAC/date) en `.nowrap-col`
  (nowrap + ellipsis) ; Description = seule colonne fluide ; Hostname borné (200px, word-break) ;
  colonne actions préservée (`td.text-end` nowrap + overflow visible). Régler les largeurs via
  `COL_WIDTH`. **Colonne « Adresse IP » = 150px** (une IPv4 complète type `192.168.100.123` en
  monospace tronquait en ellipsis à 130px).
- **Colorer une ligne de tableau Bootstrap** : un `background` posé sur le `<tr>` est **recouvert**
  par le fond de table Bootstrap (`--bs-table-bg` appliqué en `box-shadow` sur chaque `td`). Pour
  un fond fiable, viser `... > td { --bs-table-bg: <couleur>; }` (pas `tr { background }`). Utilisé
  par la recoloration live de la copie ([[project_copie_reservations]], classes `vis-*`).
- **Barre de sélection multiple** (`.selection-bar`, sticky en bas) : fond `#e7ecfb` + bordure
  2px + ombre portée vers le haut pour la détacher du contenu défilant (le fond `#f8f9ff`
  d'origine manquait de contraste). Variante sombre ajustée.

Lié à [[project_reservation_groups]] (2 modes d'affichage) et [[project_mass_export_delete]]
(la barre de sélection porte aussi export + mass delete).