What's New in Automatic.css (ACSS) v2.5
HTML-код
- Опубликовано: 13 июл 2024
- Let's take a look at some of the key updates in ACSS v2.5! This isn't a full deep-dive, but it'll give you an idea of how to access and use the new features and functionality in 2.5.
Full documentation is coming soon, along with detailed tutorials and sample builds.
Interested in using Automatic.css on your sites and accessing the private ACSS support and strategy community? Get a license here: automaticcss.com
Interested in using Frames on your sites and accessing the private Frames support and strategy community? Get a license here: getframes.io
Want more helpful dev tutorials and agency-related trainings? Check out Kevin's channel: @Gearyco.
0:00 Intro
0:20 UI Adjustments
1:57 Refactored Color System
4:07 New Complimentary Color Partial
7:56 Plaster Integration
15:38 Gutenberg Support
19:10 "Flex Grids"
22:57 New Form Styling Controls
27:08 Unchained Classes Support (Bricks)
I'm really impressed how ACSS is going on - the integration of Plaster was such a great move!
Thanks!
Wow, have to feel sorry for anyone who missed the LTD on this incredible piece of work which continues to amaze. Thanks Kevin and team.
I just got into Website development recently and missed out on the LTD on ACSS 😿
Luckily I was able to get Frames but hope there's a chance for another ACSS LTD coming out sometime since I really can't see myself building a site without it
Kevin, you're a Trailblazer... Value. No fluff. Web Commander, Keep kicking ass and taking names!
💪🏻
Fantastic! Thank you Kevin & Team for the excellent quality of ACSS, Frames and all your invaluable videos. You will make many people happy with the light-dark function with the next release! Cannot praise you enough!
what an update! 👀 excited about flex-grid
The drop downs that show only the relevant values on right-click are going to make getting going with ACSS so much easier. I'm sold :)
This is definitely one of those didn't know I needed it, but now can't live without it updates. Well done!
Daaaamn the Plaster integration is AMAZING. Having an LTD I really feel spoiled, thanks guys.
🙌
Fantastic update, Kevin! The Plaster integration is perfect. They're like training wheels to get into ACSS even faster. The fact that you can instantly preview is huge: it saves so much time. And having the cheatsheet available with just a click with dynamic variables based on the input field: phenomenal.
Thanks to the entire team for this release and looking forward to the future of ACSS!
Exciting times!
Wow congratulation, excellent updates!
Great Kevin! You and your team are absolutely making our lifes easier!
Good job, Team!
Great updates with this new release ! Well done and thank you ACSS team !
This is so freaking cool Kevin (and team).
It’s funny these new frameworks like themer had this type of visual reference then BAM this drops and silences the room. Nice work.
Incredible upgrade. I'm inspired for my next build :)
Plaster and Flex Grids. Just amazing!
🎉well done!
Just want to say “Thank you, Kevin & crew!”. So pleased I discovered ACSS, Frames and your great tutorials on Page Builders. Yes, that is another example of British understatement! 👍😀
💪🏻
I"m halfway through the video, watching the Plaster integration. ACSS is a steal at $69USD. Thank you Kevin and team!
The integration of Plaster is just amazing!!
Unbelievable improvements - so excited about the future. Thanks Kevin and the team 🤗
🎉🎉🎉
ACSS is becoming a BEAST!
Thank you for sharing
Oh my, this is just toooo good 🔥🔥🔥
Awesome update! 🎉i wish RUclips would count my numerous thumbs up - can‘t hit it enough. Great job, Kevin &Team!
Happiness ratio raised! thanks Kevin & team
Bing describes class chaining in Bricks:
Sure, I'll try to explain this controversy as best as I can. In this context, a human might say:
Class chaining is a feature in Bricks Builder that automatically adds the element type and the global class name to any custom class you create for an element. For example, if you create a custom class called `.button-red` for a button element, Bricks Builder will output the CSS selector as `button.bricks-button.button-red`. This makes the selector more specific and less reusable.
Some people may think that this is a good thing because it prevents CSS conflicts and ensures that the styles are applied correctly to the intended elements. However, some people may think that this is a bad thing because it goes against the principles of modern web design, such as modularity, reusability and maintainability. They may prefer to have more control over their CSS selectors and use a naming convention like BEM (Block Element Modifier) to avoid specificity issues.
To address this issue, Bricks Builder has added a new setting in version 1.7 beta that allows you to disable class chaining. You can find this setting under Bricks > Settings > Performance > Disable chaining element & global class⁴. If you enable this setting, Bricks Builder will output the CSS selector as `.button-red` instead of `button.bricks-button.button-red`. This will give you more flexibility and freedom to use your custom classes on different elements.
I hope this helps you understand both sides of the debate. If you have any more questions, feel free to ask me. 😊
Source: Conversation with Bing, 5/9/2023
(1) How to use BEM in Bricks Builder (with Examples) - WagePirate. wagepirate.com/blog/bem-bricks-builder/.
(2) How to use BEM in Bricks Builder (with Examples) - WagePirate. bing.com/search?q=Bricks+Builder+disable+class+chaining.
(3) How To Enable/Disable chaining element & global class Bricks Builder .... ruclips.net/video/WsVtewhop3Y/видео.html.
(4) IMPLEMENTED: Remove Bricks selector from CSS output on custom classes .... forum.bricksbuilder.io/t/implemented-remove-bricks-selector-from-css-output-on-custom-classes-so-the-class-can-be-used-on-different-elements/4961?page=2.
Great work! I see a very bright future ✨👀 (for you and my website development).
Love ACSS!
Excited about the new Color system, this will help me with my darkmode just like the new dark form.
Since you asked the Community for which forms to tackle next im gonna vote for WP Gridbuilder Facets. Not a form per se but it has similar inputs. 😊
great job
AWESOME!
great, i'm so happy for the plaster guy
if this is v2.5, I can't even imagine how great 3.0 will be. we are spoiled Kevin!
Custom variables with freakin' laser beams?
As a new user of ACSS, holy Batman! The right click context cheat sheet means the learning curve has just gone down by like 90%! 😮😃
💪🏻💪🏻💪🏻
Wow really excited for this release especially the Plaster integration! 🎉
When is the planned release for 2.5?
Beta-2 this week and then full release probably next week. Can't say for sure, though.
Just wow.
Flex-grid is very impressive, big help because clients who want this, always think it's an easy thing
freaking awesome. go fluent btw.
SEX ME UP! Now I know why the Plaster developer was so quiet. Well done, gentlemen, well done! I bought Plaster, but even though it is now native, I have no intention of asking for refund. I consider that money as a golden investment that paid off in spades!
💪🏻
Awesome. Awesome. Awesome. Does the Gutenberg version work with Kadence blocks as well as Generate Blocks?
Kadence doesn't have clean code output or support for variables in inputs, so probably not. I haven't tested it specifically yet.
Can't wait to start my next project with this toolset! (Just waiting on content ... what else is new, right?!) Re: variables; can all ACSS vars be accessed in SCSS using $ with 1-to-1 parity? I appreciate you immensely!
Not all of them. But you don’t need all of them to be. CSS variables work in SCSS too.
Some amazing new additions, great work! Quick forms and colours questions... I currently use Ninja forms on most of my sites. Are there variables for the form styling elements I could use to manually apply the form styling from ACSS to Ninja forms classes/ID's.
I heard you quickly mention dark mode - I'm just implementing a dark mode on a major site now (which I can now amend to use properly referenced original ACSS colours instead of overriding them, thanks to your update 😁), but any idea on timescales for the ACSS implementation of dark modes and how customisable it will be?
Very customizable. Not sure on timeframe. Within the next 2-3 releases.
@@AutomaticCSS awesome, and the form variables for use with other forms? Is that possible?
Congrats on the release and acquisition. When you be supporting Zion?
We will take another look soon!
🤯
Regarding new Forms implementations:
Is the poll already out, if yes can you send a link?
I would love if Bricksforge Pro Forms would be considered. It's userbase is probably not as large yet, but it is very well executed and fits with the bricks ecosystem most ACSS users are mainly using.
Love the updates! I see that in Bricks your colors from ACSS are shown within the Bricks dialog for easy selection. I am using Oxygen Builder and my colors I have set in ACSS are not showing within the Oxygen dialog for easy selection. Is that just a Oxygen feature that has been implemented yet or did I not do something correctly? Thanks for all the awesome tips!
Bricks is better than Oxygen, my friend. Oxygen's color management is very limited.
This is tremendous work! I really really hope that the plugin will not get cluttered and bloated over time :) It would be a shame... I trust you guys with the work, dont' get me wrong...Just a concern that raised in me while watching. Is the Plaster integration not affecting the builder performance?
Nope. No affect on performance that we’ve noticed. And everything can be turned on/off so you can manage bloat personally as a user. But we are making sure not to bloat with nonsense features.
@@AutomaticCSS Sounds good! Thanks for developing this gem of a plugin! 🙌🏼
Yet another fantastic update to ACSS Kevin! Just out of interest, when will the release be available (not beta :D)?
Depends on how much stuff people find. But it's pretty well-tested. I would think a week or two at most.
@@AutomaticCSS - Fantastic!
New Code Snippets plugin on the Bricks Blueprint?😮
Sorry if I missed it but I don't think it was mentioned if we need to/should remove plaster if we have it installed?
Yes
Does the form styling work with Bricks native form element?
Yes
Kevin why acss cheat sheet did not show grid variables like var(--grid-7) to var(--grid-12) when you right clicked and opened it?
Because they're for advanced users who don't need the cheatsheet or pre-loaded classes. If you type the variables or use the classes they'll still work. It's an effort to reduce bloat.
are there any flex grid variables or just utility classes right now?
They don’t support variables because the require multiple lines of CSS
Is builder settings works with Nativ Oxygen? I don't get suggesstions when I use Oxygen only. But it works when I activate Recoda Workspace. Is there anything I am missing?
builder settings?
are "Kadence" blocks clean? Will they be supported in gutenberg?
They’re not clean :/
Form Styling also possible for fluent form?
Coming.
dark mode ftw! 🍉🍉
I read that OWL is deprecated in this update. I assume that means all sites using OWL will break??
no you still can use owl classes.
Nope. Read the change on deprecated styles.