Différences

Ci-dessous, les différences entre deux révisions de la page.

--- issue92:command_conquer [2015/03/05 19:11] – frangi
+++ issue92:command_conquer [2015/03/08 17:55] (Version actuelle) – [2] auntiee
@@ Ligne 12: / Ligne 12: @@
 • flexbox.html file
-The flexbox.html file and the css folder are used only as an example. In the stylus folder, you’ll see an example.styl folder, as well as a flexbox.styl file. The flexbox.styl file is the only file you need to copy to use the functions.
+The flexbox.html file and the css folder are used only as an example. In the stylus folder, you’ll see an example.styl folder, as well as a flexbox.styl file. The flexbox.styl file is the only file you need to copy to use the functions.**
-What is Flexbox?
+Le mois dernier, nous avons parlé de Jeet et j'ai mentionné Stylus. Depuis, j'ai aussi commencé à utiliser Flexbox sur quelques sites Web. Après un seul site, j'étais fatigué d'écrire tous les préfixes des fournisseurs à la main et j'ai conçu un fichier Stylus contenant des fonctions pour minimiser la quantité de saisie requise. Une fois arrivé à un point satisfaisant, je l'ai publié sur github.
+Lien : https://github.com/lswest/flexbox-stylus
+Ce que vous y trouverez :
+ • Des dossiers avec les fichiers CSS et Stylus.
+ • Un fichier LICENSE.
+ • Readme.md.
+ • Un fichier flexbox.html.
+Le fichier flexbox.html et le dossier CSS ne sont utilisés qu'à titre d'exemple. Dans le dossier stylus, vous verrez un dossier example.styl, ainsi qu'un fichier flexbox.styl. Le fichier flexbox.styl est le seul fichier que vous devez copier pour pouvoir utiliser les fonctions.
+**What is Flexbox?
 Flexbox is a new layout system introduced in CSS3, and is currently supported in one form or another in most commonly used versions of Firefox, Chrome, Safari and Opera. It’s also supported by IE 10 & 11. See here for a thorough breakdown: http://caniuse.com/#search=flexbox
@@ Ligne 25: / Ligne 38: @@
 **
-Le mois dernier, nous avons parlé de Jeet, et j'ai mentionné Stylus. Depuis, j'ai aussi commencé à utiliser Flexbox sur quelques sites web. Après un seul site, j'étais fatigué d'écrire tous les préfixes des fournisseurs à la main, et j'ai conçu un fichier Stylus contenant des fonctions pour minimiser la quantité de saisie requise. Une fois arrivé à un point satisfaisant, je l'ai publié sur github.
+Qu'est-ce que Flexbox ?
-Lien: https://github.com/lswest/flexbox-stylus
-Ce que vous y trouverez
- • Des dossiers avec les fichiers CSS et Stylus
- • Un fichier LICENSE
- • Readme.md
- • un fichier flexbox.html
-Le fichier flexbox.html et le dossier CSS ne sont utilisés qu'à titre d'exemple. Dans le dossier stylus, vous verrez un dossier example.styl, ainsi qu'un fichier flexbox.styl. Le fichier flexbox.styl est le seul fichier que vous devez copier pour utiliser les fonctions.
-Qu'est-ce que Flexbox?
-Flexbox est un nouveau système de mise en page introduit en CSS3, et est actuellement pris en charge dans une forme ou une autre dans les versions les plus couramment utilisés de Firefox, Chrome, Safari et Opera. Il est aussi pris en charge par IE 10 et 11. Regardez ici pour une description approfondie:
+Flexbox est un nouveau système de mise en page introduit en CSS3 ; il est actuellement pris en charge dans une forme ou une autre dans les versions les plus couramment utilisés de Firefox, Chrome, Safari et Opera. Il est aussi pris en charge par IE 10 et 11. Regardez ici pour une description approfondie :
 http://caniuse.com/#search=flexbox
-Flexbox facilite l'alignement des éléments (verticalement et horizontalement), ainsi que la capacité des éléments à croitre ou décroitre en fonction de son parent. Et le meilleur, c'est qu'il est possible d'ordonner les éléments dans le CSS seul. Cela signifie que votre barre latérale gauche peut arriver après votre élément de contenu sur les smartphones, au lieu d'être contraints de travailler avec des «floats» ou des «display:none».
+Flexbox facilite l'alignement des éléments (verticalement et horizontalement), ainsi que la capacité des éléments à croître ou décroître en fonction de la taille de son parent. Et le meilleur, c'est qu'il est possible d'ordonner les éléments dans le CSS seul. Cela signifie que la barre latérale gauche peut venir après votre élément de contenu sur les smartphones, au lieu d'être contraints de travailler avec des « floats » ou des « display:none ».
-Liens:
+Liens :
-• http://the-echoplex.net/flexyboxes/ - Un outil pour aider à comprendre les paramètres de votre flexbox.
+• http://the-echoplex.net/flexyboxes/ - Un outil pour aider à comprendre les paramètres de votre Flexbox.
 • http://css-tricks.com/snippets/css/a-guide-to-flexbox/ - Guide complet de Flexbox (Astuces CSS)
@@ Ligne 70: / Ligne 70: @@
 Utilisation
-Il suffit de placer le fichier flexbox.styl dans votre projet, puis importez-le dans votre fichier Stylus avec @import 'flexBox'. Chaque fonction essaie d'accepter autant de valeurs officielles (selon la norme Flexbox), mais nécessite en fait quelques changements.
+Il suffit de placer le fichier flexbox.styl dans votre projet, puis de l'importer dans votre fichier Stylus avec @import 'flexBox'. Chaque fonction essaie d'accepter autant de valeurs officielles que possible (selon la norme Flexbox), mais nécessite en fait quelques changements.
 Fonctions
 • flexbox(valeur) ou la valeur est soit flex, soit inline-flex.
-• flex(size, grow, shrink, basis) chaque valueur, sauf grow, est optionelle. Size est utilisé pour l'attribut width (pour les vieux navigateurs). Pour positionner seulement la valeur grow, utiliser flex(grow: 1). Le même format peut être utilisé pour positionner n'importe quel argument précis.
+• flex(size, grow, shrink, basis) chaque valeur, sauf grow, est optionnelle. Size est utilisé pour l'attribut width (pour les vieux navigateurs). Pour ne régler que la valeur grow, utiliser flex(grow: 1). Le même format peut être utilisé pour régler n'importe quel argument précis.
-• flex-direction(valeur) la valeur peut être: row, row-reverse, column ou column-reverse - fonction pour la flex-direction de Flexbox.
+• flex-direction(valeur) la valeur peut être: row, row-reverse, column ou column-reverse - Fonction pour la flex-direction de Flexbox.
-• flex-wrap(valeur) Accepte les 3 options: nowrap, wrap, wrap-reverse - Fonction pour le flex-wrap de Flexbox
+• flex-wrap(valeur) Accepte les 3 options: nowrap, wrap, wrap-reverse - Fonction pour le flex-wrap de Flexbox.
-• flex-justify(valeur) la valeur peut etre: start, end, center, space-bottom ou space-around - Fonction pour le justify-content de Flexbox.
+• flex-justify(valeur) la valeur peut être: start, end, center, space-bottom ou space-around - Fonction pour le justify-content de Flexbox.
 • flex-content(valeur) la valeur peut être la même option que pour flex-justify(value) - Fonction pour l'align-content de Flexbox.
-• flex-align(valeur) la valeur peut être: start, end, stretch, center, baseline - Fonction pour l'align-items de Flexbox.
+• flex-align(valeur) la valeur peut être : start, end, stretch, center, baseline - Fonction pour l'align-items de Flexbox.
 • flex-self(valeur) accepte start, end, auto, center, baseline, stretch - Fonction pour l'align-self de Flexbox.
 • flex-group(valeur) accepte tout nombre positif - Fonction pour l'attribut order de Flexbox.
-• flex-firefox() fontion d'aide pour les vieux Firefox (où les Flexboxes étaient traitées comme des éléments en ligne). Placez le dans le sélecteur firefox-only (@-moz-document url-prefix()). Voir le fichier example.styl par example.
+• flex-firefox() fontion d'aide pour les vieux Firefox (où les Flexboxes étaient traitées comme des éléments en ligne). Placez-le dans le sélecteur firefox-only (@-moz-document url-prefix()). Voir par exemple le fichier example.styl.
 ===== 2 =====
@@ Ligne 107: / Ligne 107: @@
 Bonus de vacances
-Et, en raison de la période de l'année, j'ai un petit conseil utile pour ceux qui ont besoin d'envoyer beaucoup de cartes ou de lettres à l'aide d'adresses dans votre liste de contacts. Une fois que ce numéro sera sorti, il sera certes un peu trop tard pour les cartes de Noël, mais si toutefois...
+Et, en raison de la période de l'année, j'ai un petit conseil utile pour ceux qui ont besoin d'envoyer beaucoup de cartes ou de lettres en utilisant des adresses dans votre liste de contacts. Une fois que ce numéro sera sorti, il sera certes un peu trop tard pour les cartes de Noël, mais si toutefois...
-Cette année, ma solution pour ceci était d'utiliser Python pour analyser un fichier CSV (valeurs séparées par des virgules), et pour sortir un fichier .txt contenant les adresses dans le format:
+Cette année, ma solution pour ceci était d'utiliser Python pour analyser un fichier CSV (valeurs séparées par des virgules), et pour sortir un fichier .txt contenant les adresses dans le format :
 Nom
@@ Ligne 118: / Ligne 118: @@
 Pays
-Le seule petite information dans le csv nécessaire pour que cela fonctionne est la position des champs que vous souhaitez utiliser dans l'adresse (c'est à dire si le champ de nom est le premier, il aura la position 0). Vous pouvez enregistrer ceci dans des variables si vous voulez.
+La seule petite information dans le csv nécessaire pour que cela fonctionne est la position des champs que vous souhaitez utiliser dans l'adresse (c'est-à-dire si le champ de nom est le premier, il aura la position 0). Vous pouvez enregistrer ceci dans des variables si vous voulez.
 Une ébauche (pas un programme qui fonctionne) est montré en haut à droite.
@@ Ligne 132: / Ligne 132: @@
 **
-Il crée une liste où chaque élément est une autre liste contenant les valeurs des champs de cette ligne du fichier csv. En d'autres termes, c'est une liste à deux dimensions. Je parcours la liste en utilisant le code qui suit, puis j'écris les sections nécessaires au fichier addresses.txt.
+Ceci crée une liste où chaque élément est une autre liste contenant les valeurs des champs de cette ligne du fichier csv. En d'autres termes, c'est une liste à deux dimensions. Je parcours la liste en utilisant le code qui suit, puis j'écris les sections nécessaires au fichier addresses.txt.
 Une fois que le fichier est créé, vous pouvez copier le texte dans un autre programme pour le formater (ou l'imprimer directement sur des enveloppes ou des étiquettes).
-Un exemplaire complet d'un script qui marche peut être trouvé ici: http://pastebin.com/bZmanQAc. Les seuls changements nécessaires seront les variables d'indice, selon le fichier CSV que vous souhaitez prendre en compte.
+Un exemplaire complet d'un script qui fonctionne peut être trouvé ici : http://pastebin.com/bZmanQAc. Les seuls changements nécessaires seront les variables d'indice, selon le fichier CSV que vous souhaitez prendre en compte.
-J'espère que cela a été intéressant pour au moins certains utilisateurs; et peut-être qu'envoyer un grand nombre de cartes pour la nouvelle année sera plus facile. Si vous avez des corrections, des questions, des commentaires ou des suggestions, je peux toujours être joint à lswest34+fcm@gmail.com.
+J'espère que cela a été intéressant pour au moins certains utilisateurs - et peut-être qu'envoyer un grand nombre de cartes au cours de la nouvelle année sera plus facile. Si vous avez des corrections, des questions, des commentaires ou des suggestions, je peux toujours être joint à lswest34+fcm@gmail.com.