Version
V7+
Description
Bonjour,
Pour un outil sur lequel les listes vont être très utilisées, j’ai essayé de faire un peu de mise en page.
Je n’ai pas pu utiliser le template de liste car j’ai besoin que ma mise en page fonctionne aussi en Edit list et je me suis heurtée à un certain nombre de limites
- je n’ai pas trouvé comment prolonger les bordures d’Areas en CSS donc j’ai également utilisé le getStyle
- le getStyle s’applique sur
<td>en lecture mais sur la<div>en edit list - les Area imbriquées s’affichent à la suite les unes des autres, je n’ai pas trouvé de solution simple pour les afficher avec des
colspan
Il serait utile d’avoir un moyen de faire ceci de façon centralisée (CSS, paramétrage ou code).
Je n’ai pas d’idée précise de solution, je poste ce ticket en guise de brainstorming.
Mes bricolages ci-dessous
@Override
public String getStyle(ObjectField field, String[] row) {
FieldArea area = field.getFieldArea();
List<ObjectField> areaFlds = area.getFields();
if (areaFlds.get(0).getName().equals(field.getName()))
return "firstCell";
/* if (areaFlds.get(areaFlds.size() - 1).getName().equals(field.getName()))
return "lastCell";*/
return super.getStyle(field, row);
}
.table {
tr:not(.col-area) {
border-right: solid .05rem !important;
border-top: solid .05rem !important;
border-bottom: solid .05rem !important;
.head {
border-left: solid .05rem !important;
}
}
tr.head, .search {
th:not(th[data-name$="Na"]):not(.col-action) {
border-left: solid .05rem !important;
}
}
td[role="cell"]:not(.col-action):not(.firstCell) {
border-left: solid .1rem #E8E8E8;
}
td.firstCell, td:has(div.firstCell) {
border-left: solid .05rem !important;
padding-left: .5rem !important;
}
tbody > tr > * {
background-color: #ffffff;
color: #303030
}
}