
Recherche avancée
Médias (2)
-
Exemple de boutons d’action pour une collection collaborative
27 février 2013, par
Mis à jour : Mars 2013
Langue : français
Type : Image
-
Exemple de boutons d’action pour une collection personnelle
27 février 2013, par
Mis à jour : Février 2013
Langue : English
Type : Image
Autres articles (69)
-
MediaSPIP version 0.1 Beta
16 avril 2011, parMediaSPIP 0.1 beta est la première version de MediaSPIP décrétée comme "utilisable".
Le fichier zip ici présent contient uniquement les sources de MediaSPIP en version standalone.
Pour avoir une installation fonctionnelle, il est nécessaire d’installer manuellement l’ensemble des dépendances logicielles sur le serveur.
Si vous souhaitez utiliser cette archive pour une installation en mode ferme, il vous faudra également procéder à d’autres modifications (...) -
Amélioration de la version de base
13 septembre 2013Jolie sélection multiple
Le plugin Chosen permet d’améliorer l’ergonomie des champs de sélection multiple. Voir les deux images suivantes pour comparer.
Il suffit pour cela d’activer le plugin Chosen (Configuration générale du site > Gestion des plugins), puis de configurer le plugin (Les squelettes > Chosen) en activant l’utilisation de Chosen dans le site public et en spécifiant les éléments de formulaires à améliorer, par exemple select[multiple] pour les listes à sélection multiple (...) -
Mise à jour de la version 0.1 vers 0.2
24 juin 2013, parExplications des différents changements notables lors du passage de la version 0.1 de MediaSPIP à la version 0.3. Quelles sont les nouveautés
Au niveau des dépendances logicielles Utilisation des dernières versions de FFMpeg (>= v1.2.1) ; Installation des dépendances pour Smush ; Installation de MediaInfo et FFprobe pour la récupération des métadonnées ; On n’utilise plus ffmpeg2theora ; On n’installe plus flvtool2 au profit de flvtool++ ; On n’installe plus ffmpeg-php qui n’est plus maintenu au (...)
Sur d’autres sites (12574)
-
Anomalie #4770 : ENV et second argument
5 mai 2021, par Maïeul RouquetteAinsi que je l’avais dit, j’hésitais sur le lieu de correction : squelette mal écrit, ou core qui applique le filtre indifférement à tout ce qui provient de #ENV, sans savoir où #ENV a été cherché l’info. Après tout, pourquoi ce ne serait pas #ENV qui appliquerait le filtre si nécessaire ?
Mais du coup ok pour corriger dans le plugin du coup.
-
Anomalie #4562 : Suite #4468 : Unification des CSS pour les boutons et les icônes
17 février 2021Bon bon bon, on a pas mal réfléchi au sujet avec rastapopoulos, et je crois qu’on est arrivé à une solution satisfaisante.
En tout cas une solution qui répond complètement aux problèmes et besoins soulevés dans ce ticket, en ce qui me concerne.Le problème était de ne traiter des icônes que sous l’angle d’une utilisation dans des boutons, de ne le faire qu’à moitié en proposant un jeu d’icônes très restreint, et avec des icônes pas toutes prévues pour cette utilisation qui plus est.
Dans l’immédiat, pour clôturer ce ticket au plus vite, il s’agirait de faire ça :
- dans le CSS, retirer complètement les variantes de boutons avec icônes :
.bouton_add
,.bouton_supprimer
, etc. (ça sera fait différemment et mieux). - renommer la classe
.bouton
en.btn
: c’est moins verbeux et on comprend aussi bien. - préfixer les variantes génériques qui restent :
.btn_mini
au lieu de.btn mini
, etc. - finir les derniers petits ajustement visuels.
Avec ça le ticket pourra enfin être fermé.
Mais alors comment fait-on pour avoir des icônes dans les boutons ?
C’est l’étape suivante.Des icônes¶
On s’est dit, tant qu’à faire, autant proposer tout de suite un jeu complet d’icônes symboliques.
Les besoins sont multiples pour pleins d’éléments d’interface, dans les plugins et dans le core : plier/déplier des trucs, dupliquer un contenu, afficher un menu, remonter dans la hiérarchie, etc., etc. (je fais vite).
Et chacun doit réimplémenter ça un peu à sa sauce.On reprendrait un jeu d’icônes existant, qu’on n’aura pas à maintenir, optimisé, et qui fournit des icônes cohérentes visuellement, utilisables dans tous les contextes.
Il y a plusieurs choix de jeux d’icônes libres : Bootstrap-icons, Octicon, Material, Entypo, etc.Ces icônes seraient utilisables de 2 façons :
1. Des classes¶
Quand il s’agit d’icônes purement décoratives, des classes que l’on peut ajouter à n’importe quel élément inline.
Pour éviter les conflits, on propose la contraption de spip + icon = spicon.
Cette solution utilise une fontface, l’icône hérite de la taille et de la couleur du texte.Pour les boutons, même principe : la classe signifie « ajoute une icône dans cet élément »
Exemples :
<span class="CodeRay"><span class="tag">span> <span class="attribute-name">class</span>=<span class="string"><span class="delimiter">"</span><span class="content">spicon_menu</span><span class="delimiter">"</span></span><span class="tag">></span>Ouvrir le menu<span class="tag"></span>
<span class="tag">span> <span class="attribute-name">class</span>=<span class="string"><span class="delimiter">"</span><span class="content">spicon_truc</span><span class="delimiter">"</span></span><span class="tag">></span><span class="tag"></span> Du texte
<span class="tag">span> <span class="attribute-name">class</span>=<span class="string"><span class="delimiter">"</span><span class="content">titrem spicon_machin</span><span class="delimiter">"</span></span><span class="tag">></span>Mon titre<span class="tag"></span>
</span></span></span></span>2. Une balise #ICON¶
En complément, on peut vouloir embarquer une icône svg dans le HTML.
On propose de reprendre et d’adapter la super balise #ICON du plugin Zcore, qui fait ça très bien.
Cette balise permet d’embarquer une icône du set par défaut, mais également n’importe quelle autre (je rentre pas dans les détails).Un modèle correspondant permettra aussi d’inclure des icônes svg dans les textes :
<span class="CodeRay">#ICONE{identifiant}
#ICONE{chemin/vers/mon_icone.svg}
#ICONE{#identifiant_autre_set}
</span>Identifiants sémantiques¶
Les identifiants des icônes seront directement ceux du jeu d’icônes choisi.
Mais ils peuvent avoir des noms un peu barbares :chevron-double-right
,eye-slash
,grip-vertical
, etc.Dans tous les cas on pourra les utiliser tels quels, mais en plus de ça, on propose de faire une correspondance sémantique pour les icônes correspondants aux actions les plus courantes. Par exemple au lieu de faire
#ICONE{chevron-double-down}
on pourra faire#ICONE{deplier}
.La liste initiale est visible ici : https://demo.hedgedoc.org/3zIXkcFLTVSwV0nKC1_qcA?both
Voilà, je crois que c’est tout, rastapopoulos tu complètera si j’ai oublié des trucs.
Peut-être qu’on peut partir sur un nouveau ticket pour ce sujet et la branche dev qui ira avec.À vous les studios.
- dans le CSS, retirer complètement les variantes de boutons avec icônes :
-
Anomalie #4764 : Menu actions rapides des plugins non dist : comment intégrer les SVG sans perdre...
19 mai 2021Je relance le ticket qui avait dévié
Actuellement j’ai les plugins pages, formidable, gis, tickets, jeux ... qui ont le problème
La barre d’ajout rapide prend les vieux png au lieu des svg qui sont pourtant là.