Projet

Général

Profil

Development #64320

style pour select2 multiple

Ajouté par Frédéric Péters il y a environ 2 ans. Mis à jour il y a presque 2 ans.

Statut:
Fermé
Priorité:
Normal
Assigné à:
Version cible:
-
Début:
19 avril 2022
Echéance:
% réalisé:

0%

Temps estimé:
Patch proposed:
Oui
Planning:
Non

Description

Voilà basique c'est pour accompagner #46161.

Il y a un bout du padding bas que j'aurais bien vu dégagé mais je n'arrive pas à capter d'où ça vient et je vais m'en contenter.


Fichiers

select2-multiple.png (4,12 ko) select2-multiple.png Frédéric Péters, 19 avril 2022 15:28
0001-scss-add-style-for-multi-choices-select2-64320.patch (1,66 ko) 0001-scss-add-style-for-multi-choices-select2-64320.patch Frédéric Péters, 19 avril 2022 15:30

Demandes liées

Lié à w.c.s. - Development #46161: Champ liste à choix multiple en autocomplétionFermé

Actions
Lié à Intégrations graphiques Publik - Development #64965: Retirer l'espace en dessous du select2 multipleFermé06 mai 2022

Actions
Lié à Intégrations graphiques Publik - Development #64967: select2 : ajouter un espacement vertical quand les choix sont sur plusieurs lignesFermé06 mai 2022

Actions

Révisions associées

Révision 8b59667c (diff)
Ajouté par Frédéric Péters il y a presque 2 ans

scss: add style for multi-choices select2 (#64320)

Historique

#1

Mis à jour par Frédéric Péters il y a environ 2 ans

et je vais m'en contenter

(mais une fois que ça sera poussé, avec le patch wcs, totalement pour que quelqu'un de curieux y passe du temps).

#2

Mis à jour par Frédéric Péters il y a environ 2 ans

#3

Mis à jour par Corentin Séchet il y a presque 2 ans

Le ul.select2-selection__rendered est en display: inline-block, il est aligné sur la baseline, d'où l'espace en dessous (je sais pas si ça se fait de citer du stack overflow ici, mais j'ai pas trouvé mieux : https://stackoverflow.com/questions/17905827/why-does-my-image-have-space-underneath).

span.select2-selection--multiple .select2-selection__rendered {
    display: block;
}

Règle le souci sans bricolages, à moins que je sois passé à côté de la bonne raison de mettre le ul en inline-block.

Quand on sélectionne des éléments sur plusieurs lignes, ils sont collés verticalement, mais j'ai pas mieux que quelque chose comme ça pour que $widget-padding soit bien appliqué :

    span.select2-selection--multiple {
        padding: calc(#extract-height($widget-padding) - 0.2rem) #extract-width($widget-padding);
        &.select2-selection__choice {
            margin: 0.2rem 0.5rem 0.2rem 0;
        }
    }

Ce qui demande de définir une nouvelle fonction extract-height, qui ne fonctionne pas si on fait "$widget-padding: 1rem 2rem 3rem 4rem" et qui n'est pas très joli.

#4

Mis à jour par Frédéric Péters il y a presque 2 ans

  • Statut changé de Solution proposée à Résolu (à déployer)

Ce commit a été poussé par erreur (j'imagine que tu l'avais en local), il va rester dans le dépôt. (on n'a pas encore en front d'utilisation de ce select2 multiple donc pas grave)

Tu peux cependant faire un ticket supplémentaire avec tes suggestions ?

#5

Mis à jour par Corentin Séchet il y a presque 2 ans

#6

Mis à jour par Corentin Séchet il y a presque 2 ans

  • Lié à Development #64967: select2 : ajouter un espacement vertical quand les choix sont sur plusieurs lignes ajouté
#7

Mis à jour par Transition automatique il y a presque 2 ans

  • Statut changé de Résolu (à déployer) à Solution déployée
#8

Mis à jour par Transition automatique il y a presque 2 ans

Automatic expiration

Formats disponibles : Atom PDF