Hey everyone!
I have never posted about this before, but I have just released a small update to Cirrus which builds on the changes made in 0.6.0.
What is Cirrus?
Cirrus is a component and utility centric SCSS framework
designed for rapid prototyping. I started this project back in late 2016, but never really wrote about it. The main reason why you should use it is if you need to proto-type a project ASAP with many pre-styled component classes. There's a lot of CSS frameworks already out there, but Cirrus comes with my (and those who contributed in the past) take on what a CSS framework should have and a distinct style.
If you're interested, feel free to check out Cirrus! Documentation
Onto the Updates
π Features
- Added rounded tag groups, added primary color to control themes, updated BEM notation for
tag
. #49 -
tile
now inherits overflow rules. 4a4f276. -
Using multiple column breakpoint classes will now respond accordingly. For example with the code example below, the div will span 8 columns for large screens and above but will span 4 columns for all screen sizes up to large. This is more in line with the behavior seen in most major frameworks. e6a0fd2
<div class="col-xs-4 col-lg-8"></div>
Added BEM compliant class names for
card
. The old class names will still be supported but will be deprecated in a future release. #51
π Fixes
- Removed extra space between label and
input-control
when the input contains an icon. #47 - Fixed
tile
not overflowing correctly in smaller screens. ad43bc2. - Fixed inconsistent
card
UI when certain heights caused by overflowing text content. 8859388
π₯ Breaking Changes
- Shifted column sizes down one step: new
xs
that begins at 0px, oldxs
-> newsm
, oldsm
-> newmd
, oldmd
-> newlg
, oldlg
-> newxl
. This is to have better consistency with the majority of viewports we see today. d2784b7
Thanks for reading!
π Thank you for taking the time to check out this post. For more content like this, head over to my actual blog. Feel free to reach out to me on LinkedIn and follow me on Github.
Top comments (0)