LESS « The Dynamic Stylesheet language
►http://lesscss.org
La documentation de less : un langage pour génération de feuilles de style dynamiques
Nombreux exemples
- #DOM
-
-
hint.css - A tooltip library in CSS
http://kushagragour.in/lab/hintHint.css is a tooltip library written in SASS which uses only HTML/CSS to create simple tooltips.
It does not rely on any JavaScript and rather uses data-* attribute, pseudo elements, content property and CSS3 transitions to create the tooltips. Also it uses BEM naming convention particularly for the modifiers.
- #HTML
-
#SASS : Syntactically Awesome Stylesheets : un métalangage de feuilles de style en cascade (CSS). C’est un langage de script interprété en tant que CSS.
http://en.wikipedia.org/wiki/Sass_(stylesheet_language)
#maitre_capello ^^
-
-
Alors je continue :)
#BEM (pour Block, Element, Modifier) : Une convention de nommage des styles CSS avec une approche « Orienté Objet »...
http://bem.info/method/definitions#LESS : un langage pour programmer des feuilles de styles dynamiques (traitées en javascript pour produire des feuilles de styles statiques).
►http://lesscss.org- #DOM
-
Intéressante faille de #sécurité dans le résolveur #DNS d’#Android. L’intérêt de cette faille est double : 1) les problèmes de nonces trop prévisibles dans le DNS se sont jusqu’à présente focalisés sur les serveurs DNS, alors que les « stub resolvers » comme celui d’Android ont été peu étudiés 2) le risque pour un « stub resolver » est faible si son résolveur est proche et sur un réseau fermé (cas courant) alors qu’en téléphonie, le serveur est souvent très loin, ce qui rend l’attaque réaliste.
L’article original :
http://blog.watchfire.com/files/androiddnsweakprng.pdf
Les mêmes informations, par les mêmes auteurs, mais sous la forme « blog » et pas « article scientifique ». D’avantage de couleurs :
-
Confessions of a recovering Objectivist
http://www.guardian.co.uk/commentisfree/2012/jun/10/confessions-recovering-objectivist-ayn-randWhen, as a self-absorbed college freshman, I first came across the Russian emigre author of The Fountainhead and Atlas Shrugged, she seemed like the coolest thinker ever – what selfish person doesn’t want to hear that being selfish doesn’t just feel good, but actually is good, too?
-
The OpenPhoto Project
http://theopenphotoproject.org« A photo application that lets you store your photos on Dropbox, Amazon S3 or in your garage. »
Un projet opensource pour se monter un pseudo flickr perso dans lequel il y a des bonnes idées à pomper pour geodiversite (outil d’import/export pour flickr, applis mobiles, etc). Tout le code est sur github.
#photo #api #geodiversite
-
What’s the Deal With :Target in CSS? | Design Shack
http://designshack.net/articles/css/targetcssNow that we’ve got a simple demo up and running that utilizes unique IDs and fragment identifiers, it’s time to pull out our :target pseudo class. Anything within a :target style block will be activated only when a fragment identifier is currently active in the URI. In a way, :target can be used to create the ever elusive CSS click event.
-
[How To] Record And Share Terminal Screencasts Quickly
http://www.omgubuntu.co.uk/2012/04/how-to-record-and-share-terminal-screencasts-quicklyUn outil pour faire des screencasts de terminal qu’on peut ensuite publier sur le site du projet (avec possibilité de commenter les screencasts). Le code du client et celui du site de publication des screencasts sont dispos sur github.
C’est assez rigolo de voir le json utilisé pour la lecture d’un screencast : http://shelr.tv/records/4f4ca2a43cd1090001000002.json
@kent1 ça pourrait être sympa pour technique.arscenic.org
-
(Better) #Tabs with Round Out Borders | #CSS-Tricks
http://css-tricks.com/better-tabs-with-round-out-bordersA good-looking tab control usually has one feature that I’ve always found impossible to reproduce without images: borders that bend to the outside at the bottom of each tab. In this article I would like to show how you can use the CSS :before and :after pseudo elements to create this effect without using images.
-
-
Intéressant. Mais faudrait vérifier que ça se dégrade bien sous MSIE, parce que cette remarque n’est pas rassurante :
Since IE8 and IE9 do support :before and :after but not border-radius you’ll have to create a separate stylesheet for them if you want to give their users a nice visual experience.
-
Testé à l’instant :
– Avec IE7 on ne voit que Lorem
– Avec IE8 on a des onglets classiques sans arrondis mais propres -
Avec IE6, c’est comme dans IE7, pas glorieux...
-
-
Cross Browser #HTML5 Progress Bars In Depth
http://www.useragentman.com/blog/2012/01/03/cross-browser-html5-progress-bars-in-depthI used to create progress bars using <div> tags, #CSS and a litle bit of math, but now I like to do it the HTML5 way using the <progress> tag. This article will discuss how this tag is rendered by default in all operating systems and browsers and how to style the progress tag with CSS, even in browsers that don’t officially support the it.
-
Knockout 2.0.0 released - Steve Sanderson’s blog - As seen on YouTube™
http://blog.stevensanderson.com/2011/12/21/knockout-2-0-0-releasedHere it is at last! Knockout 2.0.0 contains a huge set of improvements since the 1.2.x line. If you’re using KO already, see below for some of the highlights.
New to all this? Now’s a great time to check it out. Knockout is an MVVM library for JavaScript – it makes rich dynamic web UIs easier and cleaner to build. The best place to start learning is with the interactive tutorials.
-
In girum imus nocte et consumimur igni (1978) | Guy Debord (La Revue des Ressources)
►http://www.larevuedesressources.org/spip.php?article2204Ils meurent par séries sur les routes, à chaque épidémie de grippe, à chaque vague de chaleur, à chaque erreur de ceux qui falsifient leurs aliments, à chaque innovation technique profitable aux multiples entrepreneurs d’un décor dont ils essuient les plâtres. Leurs éprouvantes conditions d’existence entraînent leur dégénérescence physique, intellectuelle, mentale. On leur parle toujours comme à des enfants obéissants, à qui il suffit de dire : « il faut », et ils veulent bien le croire. Mais surtout on les traite comme des enfants stupides, devant qui bafouillent et délirent des dizaines de spécialisations paternalistes, improvisées de la veille, leur faisant admettre n’importe quoi en le leur disant n’importe comment ; et aussi bien le contraire le lendemain. (...) Source : La Revue des Ressources
-
La RdR - La Revue des Ressources : In girum imus nocte et consumimur igni (1978)
►http://www.larevuedesressources.org/spip.php?article2204Ils meurent par séries sur les routes, à chaque épidémie de grippe, à chaque vague de chaleur, à chaque erreur de ceux qui falsifient leurs aliments, à chaque innovation technique profitable aux multiples entrepreneurs d’un décor dont ils essuient les plâtres. Leurs éprouvantes conditions d’existence entraînent leur dégénérescence physique, intellectuelle, mentale. On leur parle toujours comme à des enfants obéissants, à qui il suffit de dire : « il faut », et ils veulent bien le croire. Mais surtout on les traite comme des enfants stupides, devant qui bafouillent et délirent des dizaines de spécialisations paternalistes, improvisées de la veille, leur faisant admettre n’importe quoi en le leur disant n’importe comment ; et aussi bien le contraire le lendemain.
-
CSS3 Image Styles
http://webdesignerwall.com/tutorials/css3-image-stylesWhen applying CSS3 inset box-shadow or border-radius directly to the image element, the browser doesn’t render the CSS style perfectly. However, if the image is applied as background-image, you can add any style to it and have it rendered properly. Darcy Clarke and I put a quick tutorial together on how to use jQuery to make perfect rounded corner images dynamically.
-
A Call for ::nth-everything
CSS-Trickshttp://css-tricks.com/14771-a-call-for-nth-everything
With CSS3, we have positional pseudo class selectors to help us select specific elements when there are no other distinguishing characteristics other than where it is in the DOM in relation to it’s siblings.
-
11 Reasons why responsive web design isn’t that cool !
http://www.webdesignshock.com/responsive-design-problemsBut speaking of sources against responsive web design, I realize I have found, though, only one article published in the blog Cloud Four pointing out important flaws to consider. Most of the rest consider the subject as the ultimate solution for web design. Negative points of view are as important as positive ones because the existence of a counterpart offers a vision to equilibrate the charges. It creates a debate and ultimately it helps us consider whether a proposal is good or bad. With that in mind, we’re going to point out the negative aspects we’ve encountered about responsive web design.
L’article n’est pas (du tout) une provocation, la liste de « défauts » du #responsive_web_design est très intéressante.
-
Coda to an open letter
http://socialismandorbarbarism.blogspot.com/2011/08/coda-to-open-letter.htmlThree follow-up comments on the London riots, drawn in part from astute comments from friends and strangers.
-
Une suite donc du texte très intéressant d’Evan Calder Williams : ►http://socialismandorbarbarism.blogspot.com/2011/08/open-letter-to-those-who-condemn.html
-
-
What’s new in CSS Selectors Level 4 | Shi Chuan’s blog
http://www.blog.highub.com/css/whats-new-in-css-selectors-level-4The latest CSS Selectors Level 4 Working Draft was released on 29 September 2011. Lots of new and exciting additions in the Level 4 draft. Below is a walk-through of the new stuff in Selectors Level 4.
J’ai tilté sur les « Grid-Structural pseudo-classes », à cause de ce que je fais en ce moment, mais il y en a d’autres. (Ça donne un peu le tournis, pour certains sélecteurs, je ne suis pas sûr de leur utilité profonde).
Voir aussi : http://www.w3.org/TR/2011/WD-selectors4-20110929
-
Prise de contrôle abrupte du pseudo-TLD gb.com (ou plutôt « suffixe ») par un tiers :
Thousands of gb.com sites go dark
http://www.theregister.co.uk/2011/08/01/thousands_of_gb_dot_com_sites_go_dark
It is like having a long lease on an office (our business) and another party coming along and erecting a fence around it, demanding money to get back in.#domaine #tld #sous-domaine #gb.com #suffixe
-
Pourquoi pseudo-TLD ? Ce n’est pas un TLD du tout. Ce terme ne fait que semer la confusion. Le terme correcte serait « Prise de contrôle abrupte du domaine gb.com par un tiers ».
-
Parce que pour le non initié que je suis, le terme « pseudo-TLD » correspond à l’usage que l’on fait de ce domaine, et que je ne maîtrise pas suffisamment les subtilités distinguant les domaines de premier et de second niveau pour les employer correctement.
Toutefois, @stephane, j’ai ajouté l’étiquette « #suffixe » telle que préconisée, semble-t-il, sur :
A “public suffix” is one under which Internet users can directly register names. Some examples of public suffixes are .com, .co.uk and pvt.k12.wy.us. The Public Suffix List is a list of all known public suffixes.
-
-
Learning To Use The :before And :after Pseudo-Elements In CSS - Smashing Magazine
http://coding.smashingmagazine.com/2011/07/13/learning-to-use-the-before-and-after-pseudo-elements-in-cssIf you’ve been keeping tabs on various Web design blogs, you’ve probably noticed that the :before and :after pseudo-elements have been getting quite a bit of attention in the front-end development scene — and for good reason. In particular, the experiments of one blogger — namely, London-based developer Nicolas Gallagher — have given pseudo-elements quite a bit of exposure of late.
-
-
Sur Seenthis, c’est utilisé par exemple pour afficher la langue de la destination d’un lien (hreflang).
-
Bizarre, j’ai un bug sur ton lien quand je clique dessus (sur 2 ordis et 2 navigateurs différents), erreur 403 puis c’est ok si je recalcule la page... Oo
-
Je suspecte que Smashing Mag bloque le referer Seenthis (juste nous ?).
-
En effet, il semblerait bien que ce soit un filtre sur le référant. :-(
-
-
Pseudo Spriting | CSS-Tricks
http://css-tricks.com/13224-pseudo-spriting
#after #before #pseudo_elements #CSS #sprites -
Pseudo Spriting | CSS-Tricks
http://css-tricks.com/13224-pseudo-spriting/#comment-98926I’m not advocating against #sprites. I’m just saying don’t go crazy with #diagonal ones ;)
-
ENOUGH ! : Op.Enough-ANONYMISS Launch
http://anonymiss-express.blogspot.com/2011/06/openough-anonymiss-launch.html @atelier.medias.libres -
L’article présente deux nouvelles façons de construire la page : Flexbox et Template Layout Module. Il va falloir enquêter sur ce sujet...
Farewell Floats : The Future of CSS Layout | Design Shack
http://designshack.co.uk/articles/css/farewell-floats-the-future-of-css-layoutFlexbox represents a completely new way to layout websites. You may have heard about this recently but the syntax is changing a bit so make sure you keep an eye on the working spec to stay up to date (I believe “box” will change to “flex” or “flexbox” in most cases). The current working CSS syntax for applying flexbox is as follows:
À noter une petite webapp qui permet de tester la configuration de trois boîtes sous FlexBox :
http://flexiejs.com/playground
et de constater que c’est carrément puissant tout en restant simple. -
Nouvelle version du plugin « CSS imbriqués » :
►http://plugins.spip.net/CSS-imbriquesLe plugin est désormais compatible avec les déclarations @media, permettant de préciser des variantes de classes selon différents critères (support, largeur d’affichage...).
Subtilité : on peut intégrer la déclaration @media à l’intérieur d’une hiérarchie de CSS imbriqués (alors que, normalement, @media n’est présent qu’à la racine). Cela permet de déclarer une variante de media directement dans la structure logique (l’imbrication des CSS), le plugin se chargeant à la fin de regrouper toutes les variantes de classes d’un même @media en fin de feuille de style.
-
Faudrait que je teste un jour, mais j’aime #LESS qui a l’avantage de ne pas être lié à #SPIP...
Mais pourquoi un tag #responsive_web_design ? Quel rapport ?
-
Parce que si tu veux faire du responsive web design, les media queries sont les bienvenues, et c’est en prévision de ça que j’ai introduit cette façon de procéder (les @media queries hiérarchisées à l’envers) dans le plugin.
-
c’est vraiment top mais en effet ce serait encore plus top d’essayer de converger avec #less ►http://lesscss.org ; de ce que j’ai vu rapidement, il y aurait deux ou trois détails de syntaxe + les variables
- #DOM
-
Ça ne me semble pas évident :
– on a déjà une syntaxe dans SPIP,
– mon plugin permet parfaitement d’utiliser la syntaxe de SPIP.La convergence, si elle revient à ajouter une syntaxe tirée de Less à la syntaxe existante de SPIP, ça me semble assez casse-gueule. Les variables de LESS s’ajouteraient aux variables SPIP, et les fonctions de LESS s’ajouteraient aux fonctions de SPIP, avec en plus une syntaxe différente.
-
-
-
A new micro clearfix hack – Nicolas Gallagher
http://nicolasgallagher.com/micro-clearfix-hackThe clearfix hack is a popular way to clear floats without resorting to using presentational markup. This article presents an update to the clearfix method that further reduces the amount of CSS required.
#css
0
|
25