Skip to content

How fast do you like it?

Compare
Choose a tag to compare
@mrmrs mrmrs released this 15 Sep 19:07

Well 4.4.0 had a small bug in it so that got quickly patched and we are now ready to drop 4.4.1.

tl;dr

  • Tweaked some colors & added some colors
  • Added a width class for calc(100%/3) called w-third
  • Added two base min-height classes for 100% and 100vh
  • Added new module for setting background-position
  • Made the shadow-hover animation more performant. 60fps ftw.
  • Added button reset in form module
  • Better focus styles on links
  • Hover utilities all cover focus now as well

Colors

Before

screen shot 2016-09-15 at 4 20 28 pm

After

screen shot 2016-09-15 at 4 22 43 pm

Let’s paint some bikesheds! After some tweaks to color values and adding a couple colors we’ve expanded the amount of available color combinations that meet accessibility standards for contrast ratio. We now have reds and greens that you can use white or black text on (amongst others)

The breakdown:

  • 14 More AA Large combos
  • 26 More AA combos
  • 26 More AAA combos

Widths & Heights

  • Added a width utility for setting elements to a third of it’s parent element.
  • Added min-height classes set to 100% and 100vh. They can be found in the heights module

Background-position

New module! We now have some background-position utilities for setting images to be aligned to the top, right, left, or bottom of the image (while centered on the opposite axis). Check out the source code in src/_background-position.css

A11y

Some of the hover classes didn’t also have focus attached. That is now fixed. In addition, we have added some outlines on links when they are focused along with a button reset class for form elements. All of these should aid in making a better experience when using the keyboard for navigation. Shout out to @JASONLI for helping with that.

60fps

After reading an excellent blog post about how to make your box-shadow animations more performant, I had to refactor the shadow-hover class a bit. It should now be a bit smoother and run at 60fps.

The Future

We’re working on (a bunch of things) but a huge priority is building a custom generator for everyone to use. It will allow you to set your own colors, type scale, media queries, and more to generate your own version of tachyons. It seems that changing the values of tachyons is proving to be a painpoint and we definitely don’t want it to be. Hopefully we’ll have something soon!

Cheers.

The Tachyons Team