Skip to content

Frow 3.3

Choose a tag to compare

View all tags
@codysherman codysherman released this 11 Nov 19:59
· 15 commits to master since this release
3.3
f96b76d
This commit was created on GitHub.com and signed with GitHub’s verified signature. The key has expired.
GPG key ID: 4AEE18F83AFDEB23
Expired
Verified
Learn about vigilant mode.

Frow 4.0 is on the horizon, but before making any breaking changes, I'm trying to put as many non-breaking changes onto version 3.0 as possible.

Frow version 3.3!

Upgrade Notes

Frow has officially hit 3.3 with a new feature release! View the full documentation at FrowCSS.com. It was given a version of 3.3 as while a lot of stuff is new, there should not be any breaking changes, thus no bump to 4.0. Everyone should be able to jump up to version 3.3 if you are already on 3.X. If you are still on Frow version 2, be sure to just read about the breaking changes in the jump to 3 here.

What's New?

Space-Evenly Support

  • New modifier class .justify-evenly which is equivalent to flexbox's justify-content: space-evenly. See an example here.
  • New modifier class .content-evenly which is equivalent to flexbox's align-content: space-evenly. See an example here.
  • The addition of .justify-evenly also dictated a new combo class as well: .row-evenly. This class is identical to .justify-evenly, except for the fact that like all other .row- classes, it also aligns the items vertically. See an example here.

Text Decoration/Font Style Utility Classes

  • Three new reusable classes for quickly changing how your text looks without having to write your own CSS:
    • .text-underline
    • .text-line-through
    • .text-italic
  • Full documentation available here

"Text Overflow as Ellipsis" Utility Class

Don't you hate it when your end user ruins your perfectly good design by entering in an input that is longer than the div you display it in later in? Get a shorter name end user! Well, here is a quick drop-in utility class, .text-ellipsis, that makes text get cut off with ellipsis rather than break your design: See an example here.

Opacity Utility Classes

Minor Documentation Improvements and Corrections

  • On the Frow Shortcuts page, combo classes like .frow .row-center now better explain the differences vs using the two very similar classes: .frow and .frow .justify-center.
  • $text-color was accidentally referred to as $default-text-color in the Customizing Sass docs.
  • Other minor improvements to the docs.

A Roadmap via GitHub Issues!

In the past I've kept an internal list of issues I planned to fix, as well as what features would go into the next versions of Frow. I'm going to be changing my workflow so that I'll be putting upcoming changes into the Frow GitHub Issues page. Now you'll be able to see what I'm planning, and what issues I've found internally. Feel free to voice your opinion on what's next!

New to Frow? Try it fast with a CDN!

If you're new to Frow, come check out all of the features and learn how to get started on FrowCSS.com! Grab Frow in Sass & CSS format via npm or give it a super quick try out using the CDN:
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/frow@3/dist/frow.min.css">

A final thanks

As always, all of your support and feedback is much appreciated! Thanks so much for trying out Frow CSS, and always feel free to reach out!

Assets 2
Loading