La fin de la semaine est là, voici une sélection des meilleurs liens que j’ai pu trouver. Au programme, un guide ultra complet sur le DPI, un tableau responsive en CSS, des tooltip super simples, un loader en CSS et un jeu pour manier le Flexbox.
Un guide ultra complet sur le DPI (PPI)
Ce guide, écrit par Sebastien Gabriel, Visual Designer chez Google, vous expliquera les différences de pixels et détails qu’il vous faut prendre en compte entre les différentes résolutions d’écrans retina, écrans non retina, mobile, tablette, etc.
Il s’adresse aux designers qui ont déjà un certain niveau.
A lire ici : http://sebastien-gabriel.com/designers-guide-to-dpi/
Un système de tableau responsive en CSS
Qui n’a jamais eu à intégrer un tableau de prix, de chiffres ou autre dans un site web, et s’est heurté au problème du responsive. Voici un CodePen qui pourrait bien vous aider !
Si vous souhaitez le voir en action, réduisez simplement la fenêtre de votre navigateur.
See the Pen CSS only Responsive Tables by David Bushell (@dbushell) on CodePen.
La description est ici : http://dbushell.com/2016/03/04/css-only-responsive-tables/
Baloon.css, pour des bulles tooltip en CSS
Il s’agit d’un CSS qui vous permet d’ajouter des tooltips très facilement à vos éléments et les personnaliser.
A télécharger ici : http://kazzkiq.github.io/balloon.css/
Un loader très réussi tout en CSS
Ce loader a été réalisé et animé tout en CSS. Une belle réussite que je vous invite à étudier sur le CodePen ci-dessous.
See the Pen Css 3 Loading effect by Gerta Xhepi (@xhepigerta) on CodePen.
Visible sur CodePen : http://codepen.io/xhepigerta/pen/JXGvKv
Flexbox Defense, pour vous entraîner à manier les flexbox
Pour le fun, et pourquoi pas vous améliorer ou apprendre le CSS Flexbox, voici un petit jeu bien sympa qui consiste à vous protéger des ennemis en déplaçant les tours de défense.
Et si ça ne vous suffit pas, vous pouvez toujours tenter le jeu Flexbox Froggy dont je vous avais parlé il y a quelques temps.
Pour jouer, c’est par là : http://www.flexboxdefense.com/
Si vous en voulez plus, n’hésitez pas à me suivre sur Facebook et sur Twitter !
