davidbisset.social

css

  • An introduction to #CSS Grid and its potential with a practical example: medium.com/deemaze-softwa…

  • Recreating the GitHub Contribution Graph with #CSS Grid Layout bitsofco.de/github-contrib…

  • #CSS Gridish “automatically builds your grid design’s CSS Grid code, CSS Flexbox fallback code, and more” github.com/IBM/css-gridish

  • Interesting demo: #React component example that demonstrates re-flowing content into different views using #CSS Grids: github.com/jessekorzan/la…

  • Interesting: Proof of Concept for Website tracking, only using #CSS and no #Javascript (although probably no better than using JS) github.com/jbtronics/Croo…

  • Complete set of @instagram filters in pure #CSS: picturepan2.github.io/instagram.css/

  • #CSS Grid + Flexbox: Solving Real-world Problems (via @PeterMouland) medium.com/@petermouland/…

  • Nice @CodePen: Gooey text background with #SVG filters codepen.io/ines/pen/NXbmRO #css

  • From Bootstrap to #CSS Grid (via @natalyathree) open.nytimes.com/bootstrap-to-c…

  • Using SVG to create those “trendy” Duotone effects on Images (via @Real_CSS_Tricks) css-tricks.com/using-svg-to-c… #css

  • If you need a pixel wave animation for seamless page transitions: github.com/vin-ni/PixelWa… #css

  • Front-end developers: building a Calendar with CSS Grid (via @snookca) snook.ca/archives/html_… #css

  • A nice look at the past and modern asynchronous #CSS Loading from @scottjehl: filamentgroup.com/lab/async-css.…

  • ::before and ::after allows you to add content before or after an element. #css Dark magic! @zoonini #WCUS

  • Don’t want something visible on your site? Use the dark magic of display:none. Use visibility:hidden hides the element but preserves the space. #css @zoonini #WCUS

  • Learn #CSS Grid in 5 Minutes (via @perborgen) medium.freecodecamp.org/learn-css-grid…

  • “System Font #CSS” is set of @font-face rules that let you use the native system font of the OS running the browser. github.com/jonathantneal/…

  • Revenge.css is a #CSS bookmarklet that reports bad html using pseudo content. Errors in Comic Sans! heydonworks.com/revenge_css_bo…

  • .@PetrGazarov shows how to do “Text Input with Expanding Bottom Border” medium.freecodecamp.org/text-input-hig… (via @chriscoyier) #css

  • Nice. Random cake in #css (via @mrjasonweaver at @CodePen)

  • Front-end devs: how to structure your #CSS better as components restishistory.net/blog/how-to-st…

  • Unlocking the Benefits of #CSS Variables jonathan-harrell.com/unlocking-bene…

  • Prettier + Stylelint: Writing Very Clean #CSS (Or, Keeping Clean Code is a Two-Tool Game) @chriscoyier css-tricks.com/prettier-style…

  • Ha. Monopoly board game w/ #CSS Grid: codepen.io/johnnycopes/pe…

  • .@mozilla has created a “Css Grid Layout” playground to help #css developers learn more about grids: mozilladevelopers.github.io/playground/

  • How to animate individual letters with the correct kerning (via @CodePen) #css codepen.io/rachsmith/post…

  • Interesting demo of liquid distortion effects in WebGL: tympanus.net/codrops/2017/1… #css #javascript

  • Interesting: comic book layout example on @CodePen codepen.io/rrenula/pen/Lz… #css

  • Nice. Connect 4 in #css (@CodePen) codepen.io/finnhvman/pen/…

  • Introduction to #css layout from @mozilla: mozilladevelopers.github.io/playground/09-…