Re: [sympa-fr] CCS non responsive pour les abonnements comprenant des attributs personnalisés

[Gautier Auburtin <adresse@cachée>]

Bonjour,

Il me semble que cette demande est sans réponse.

J'ai tenté de modifier la CSS d'une liste en copiant css.tt2 vers css_responsive.tt2 et en surchargeant la CSS par defaut par qq règles.

La CSS complémentaire n'est pas appelée dans le code HTML

Je n'ai que:

<link rel="stylesheet" href=""/static-sympa/css/listes.campus-condorcet.fr/style.css?version=6.2.16"" media="screen" title="Sympa CSS" />

Est-ce parce que j'ai installé la CSS statique au niveau du serveur (par erreur, d'ailleurs, mais je crois que ça n'a eu aucun effet).

Cordialement,

Gautier Auburtin

---

De: "Gautier Auburtin" <adresse@cachée>
À: adresse@cachée
Envoyé: Vendredi 28 Avril 2017 10:43:53
Objet: [sympa-fr] CCS non responsive pour les abonnements comprenant des attributs personnalisés

Bonjour,

J'ai constaté que l'abonnement à une liste comprenant des attributs personnalisés (custom attributes) posait de réelles difficultés pour les téléphones.

En effet, le formulaire de saisie des attributs (2e étape, de confirmation, après la saisie de l'adresse email) n'est pas responsive.

Or, beaucoup d'utilisateurs utilisent leur téléphone pour s'abonner (environ 15 %)

Concrètement, on ne voit pas les libellés des champs et la saisie est incohérente, voire absente (ce qui est étrange s'agissant des champs obligatoires, soit dit en passant)

Voici une copie d'écran :

SI on trifouille la CSS, on améliore un peu mais guère mieux

J'aimerais savoir si vous avez déjà rencontré ce problème et si oui comment vous l'avez résolu.

Bizarrement, la classe CSS responsive pour le tableau est spécifiée mais n'a pas de propriété.

Chez bootstrap, on utilise une barre de scroll : ça fonctionne, au moins, même si ce n'est pas terrible,

Mais avec quelques aménagements en plus, ça pourrait fonctionner : encore faut-il savoir commenté éditer la CSS et de fait, préférer qu'elle soit nativement responsive ;-)

Voici le code Html concerné :

Bien cordialement,

Gautier Auburtin

    <table class="responsive">

    <tbody><tr><td class="text_right" style=""><label for=""custom_attribute.nom">Nom" :<br>
    <i></i>
    </label></td><td>

    <input name="custom_attribute.nom" id="custom_attribute.nom" value="" size="40" type="text">
     *
    <!-- (k.id:nom) (m:) (k.type:string) --></td></tr>
    <tr><td class="text_right" style=""><label for=""custom_attribute.prenom">Prénom" :<br>
    <i></i>
    </label></td><td>

    <input name="custom_attribute.prenom" id="custom_attribute.prenom" value="" size="40" type="text">
     *
    <!-- (k.id:prenom) (m:) (k.type:string) --></td></tr>
    <tr><td class="text_right" style=""><label for=""custom_attribute.naissance">Date" de naissance : JJ/MM/AA :<br>
    <i>Précisez (contrôle d'identité à l'entrée)</i>
    </label></td><td>

    <input name="custom_attribute.naissance" id="custom_attribute.naissance" value="" size="40" type="text">
     *
    <!-- (k.id:naissance) (m:) (k.type:string) --></td></tr>
    <tr><td class="text_right" style=""><label for=""custom_attribute.origine">Votre" rattachement (précisez) : :<br>
    <i>ex. : Entreprise, Collectivité locale, Ecole, Organisme, Université ...</i>
    </label></td><td>

    <input name="custom_attribute.origine" id="custom_attribute.origine" value="" size="40" type="text">
     *
    <!-- (k.id:origine) (m:) (k.type:string) --></td></tr>
    </tbody>
    </table>

Gautier Auburtin
Chargé d'urbanisation numérique

Campus Condorcet
20 avenue George Sand - 93210 Saint-Denis La Plaine
01 55 93 93 89

www.campus-condorcet.fr
Abonnez-vous à la Lettre d'information