🚀 Cirrus 0.7.2 Released

Hey everyone!

Just released 0.7.2 for Cirrus. Check it out! This release adds fixes to a lot of user requested issues.

💎 Cirrus
📝 Documentation

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.

Onto the Updates

🎉 Features

• Link pseudo elements will now use currentColor instead of fixed link color bd9ab44
• Buttons now completely support color modifier classes (background, text, and border). 5962ca4
• Add px (1px) to default sizing system. 14970c4
• Add 48 and 64 to default sizing system to close the gap with xs viewport. 31f80f0
• Border color util classes will now set button shadow color, taking precedence over bg color classes. 46fcc01
• Add new normal-case utility class. 81d36aa
• Add vertical-align util classes. ee67b56
• Update utility mixin to handle prefers dark/light and reduced motion variants. 4907381
• Add common class name field to utility api, add new function to convert old class map to new class mapping for utility mixin. 3b6d753
• Reorder style generation to minimize minified size with gulp-clean-css. b5dd955
• Add new gap classes for row or column only 5c317e0
• Add new font style classes #192 83463e1
• Move language label for code component to styling for 'pre' #206 2248631
• Add new helper class to toggle tree-nav visibility 623a19d
• Integrate native hover color generation for buttons using bg- modifier classes 7b55b6d
• Add new utility classes for grid auto flow row and column. f0349a1

🐛 Fixes

• Remove margins from label HTML element. 010146f
• Remove margins for btn-close. 4bfb7c0
• Last border of accordion item should be invisible. a95694b
• Add missing button variables to v1 color classes. 8e01988
• Reset cursor of nav-item children. c706fce
• Inline condition for generating classes to avoid conflicting variable names. 50dc1b5
• Fix incorrect viewport being used to apply fill-height styles #163. 7ef825b
• Add left text alignment for list in dropdown menu. 6997266
• Fix horizontal centering for default spinner. 50af674
• All semantic color references to _theme.scss will now use _config.scss for customization #174 d3e0f9a
• Remove duplicate generation of blur util classes c60a237
• Fix grid row support, grid rows will now have a max of 6 74cdab9
• Remove extra padding on anchor tags 9bd4aec
• Move pointer cursor to tag__close-btn specifically instead of colored tags #193 0a6c23f
• Hide overflow for frame component #195 7fd9209
• Restrict transition animation to only box shadow #194 4731e12
• Fix specifier for tree-nav class for small viewports 875a5ce
• Fix issue where range slider does not slide from start to end #217 77582e7
• Fix accordion rendering on Safari #216 ab69a6c
• Set pointer as default cursor for pagination-item a tag #211 d9ea857
• Vertical center spinner fix (#242) 856461d
• Fix bug where list dropdown menu flashes briefly during page load #207 2cbc17a
• Use default browser focus styling for elements that don't have custom styling b164485
• Remove unused focus styling 68eb3a2
• Fix incorrect property used for column gap 81336a8
• Fix bug where webkit default focus styles were applied instead of input, textarea, and select focus styles, refactor forms code cff0e97
• Fix incorrect selector used in commit a95694b 7090712
• Form border styling should respect --border-opacity var if present 95bb80b
• Fix horizontal alignment of loading spinner f093e8f

💥 Breaking Changes

• Rename tree-nav--shown to tree-nav--visible to follow new class conventions 37290af
• Deprecate .menu-item.right, revert to applying list stylings to child link to support nested lists, expand list stylings to child divs and spans first children only #198 889f0fe
• Deprecating .usquare and .usquare.delay classes due to incompatible color styling 161bf52

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.