Today is a big day. It feels like I am launching a huge new product (and I guess that is true). I have been working towards this launch for over 5 months now. I have 3 new things to announce today, all related to Foundation 6.
Foundation 6.8
There are a ton of small features in this update that really refine Foundation and take it to an even more polished level. It’s amazing how far Foundation 6 has come in the past 18 months. Comparing to Foundation v1, it took us almost 5 years to get to a similar level of maturity. And if you have used F6, you know that it’s seriously 100x better.
You can see the full release notes below. There is also a recording of the live stream that I did this week that reviewed all of the updates in F6.8.
New Website
https://www.foundationstacks.com/
One of the biggest short comings for Foundation 6 has been its lack of a good website to help you realize everything that it can do. The new homepage has a lovely modern design and its fast! Yes, it scored a 100 on Google PageSpeed and its build 100% with Foundation 6 stacks.
The new demo section on the website gives full live examples of every Foundation component. The demos are broken down into logical groups just as they are in the Stacks library. At the bottom of each demo page, there is a playlist of videos just for the components on that page. This will make it so much easier to locate tutorials for how to use Foundation stacks.
The project file is available for download. I am providing this as a courtesy to you. However, I ask that you not publish this project file online. I worked very hard on this website. We don’t want to water down my SEO. So download it and use it as a great learning tool. I appreciate your understanding. I hope that you enjoy the project.
Download: https://weavers.link/foundation6-demo-project
New Swatch Pack
https://www.foundationstacks.com/demo/swatch-pack/
This swatch pack is the first paid addon made just for Foundation 6. It includes 25 new swatches that will allow you to take your designs to entirely new levels. These swatches will help you design more efficiently by centralizing even more styles. These swatches can unlock some real eye popping animation capabilities as well.
The swatches that come with this pack are just the start. I currently have plans for many more that I will release in future updates.
My live stream next week will be dedicated to reviewing all of the new swatches that come in this pack. I hope that you can join me.
Full Release Notes
New
- Official Support for the new Foundation 6 Swatch Pack
- New fancy website at <foundationstacks.com>
- New Mailto Button stack
- New Link Container stack to turn anything into a link
Edit Mode
- New and improved Edit Mode interface options!
- New Streamlined edit mode option in site styles creates a new minimal edit mode interface that is blazing fast!
- Vastly improved scrolling performance in Edit Mode
Site Styles
- Ability to hide Color Palletes in Site Styles in order to reduce space
- Improved Shelf interface
- Reorganized swatch order
- Default Button Sizing can now be set in Site Styles
- The jQuery 3 Feature will now import jQuery 3.6 onto the page. Foundation 6 is fully functional with jQuery 3.6. However, it may not be compatible with other stacks that could be on the page. You may need to remove this from the page, if it causes any stack to break. I recommend that you let the developer of said stack know that they need to update the stack to support jQuery 3.
- Most utility classes now use !important so that we can ensure that their styles override default styles
Swatches
- Hover on Parent option in all swatches
- Custom CSS Selector in all swatches now has 8 lines
- You can now use Parent and Pseudo options along with Custom CSS Selector
- Max height units in Height swatch
- Improved Background Sizing options added for new instances of the Background swatch. Existing instances will continue to function but have been deprecated.
- Background Positions can now be set with percentages in the Background swatch
- Added media queries to Height, Width, Padding, Margin swatches
- Overlay BG swatch now has a z-index setting
- New
Is Stuck
option in the Menu swatch
Forms
- Checkbox, Radio and Switch controls can now have values set via URL
- Time formatting in Date field has been fixed
- New Form action to open/close any F6 Component on successful form submission
- Forms can now be auto-submitted from any form field
Misc
- Improved fill color options in the SVG stack
- Controls in the video stack are now on by default
- Hollow Button Group styles are fixed
- New History action in the Button stack to allow for back/forward buttons
- Support for the new YouTube and Vimeo v3.0 stacks that will autoplay when added into a lightbox