Sorting CSS <time> values
In the previous blog post I announced that Project Wallace now supports analysis of animation-duration
and transition-duration
. One of the neat things about Project Wallace is that it always shows all your values sorted in a sensible way. For example, font-sizes are sorted from small to large, colors are sorted by hue, etc. So it only makes sense to sort CSS <time> values from short to long. Enter css-time-sort.
The functional requirements
- Sort durations from short to long
- If a
ms
value is the same as as
value, sort thems
value first - Be able to sort an array of
['1s', '200ms']
with the native.sort()
method
With this relatively simple piece of code it's possible to sort an array of CSS durations like so:
const { sortFn } = require('css-time-sort')
const sorted = ['1s', '200ms'].sort(sortFn)
// RESULT:
// => ['200ms', '1s']
Check out the source code on GitHub.