Blocs for Mac V5 Beta Build 3

Here is the third beta of Blocs V5.2.0 with more fixes and improvements.

Most notable improvement is, you can now share screenshots from preview mode for more accurate renders and it will also respect breakpoint, which means you can generate mobile screenshot to share in XS breakpoint.

Anyway, have fun testing and have a great weekend too :beers:

Download Blocs V5.2.0 beta Build 3

3 Likes

Thanks for the update @Norm. It’s great that the user can now unlock the class in the editor, instead of having to go to the library, but if users are able to unlock from the editor shouldn’t they also be able to lock it from there as well?

Currently:

Proposed:

2 Likes

No problem, I hope the recent changes help with your workflow.

I’ve actually given this some thought this week, right now I feel the user flow of only being able to lock in the Class Manager helps to prevent unwanted locks and confusion over what is locked.

My thought was that users may think you are just locking the class name from being edited or the state (hover, active etc).

But I’m totally open to this idea, I’m sure others will contribute their thoughts too so let’s see what other testers think.

1 Like

I think being able to lock from the editor makes sense. Especially since you can easily unlock from there.

In saying that, this is not a feature for me, it’s not something I would use, so my 2cents is worth less :joy:

I’ve just tried exporting a screenshot from XS of a web page and it has added a crazy long empty white space (that isn’t present in preview of Blocs) before showing the footer.

I am guessing this is mainly for template developers.

3 Likes

Yes, I’m just saying it’s not something I would be using, so workflow wise it’s not my thing, but flow matters right.

Advanced users can now lock classes for dynamically added, styled elements that they programmatically create with JS, when a site is run in a web browser. It’s handy if you use the remove all unused classes and the element doesn’t exist until it’s previewed.

And Bric developers who may include classes the user can subclass in a project. Being able to lock these prevents them from being flagged as not used if the elements are dynamic and are not generated until after export when a site is running.

I believe volt CMS offered this workflow with extra classes at one point.

So we can add subclasses in our custom brics?

I know I asked a year or so back about us being able to add classes with our brics.

Or am I misunderstanding what you are saying here?

In order to capture the full height of the webpage Blocs needs to calculate the height which it uses some JS to do, it then adjusts the preview frame height, so no part of the website is hidden in scrollable area.

Something must be throwing off this calculation, do you use any styling that would fix elements to the bottom edge of the screen regardless of height?

Flexy comes to mind.

An example:

Your Bric has a class .my-brics-class that is toggled when a user presses a button within your Brics html content.

You can inform the user this class exists in your Brics docs and they can add it in the Blocs UI and customise it.

Because the class usage only exists in a particular state during use. The user can now lock the class so it’s not flagged as unused when cleaning up a project.

Try removing it, just as a test. See if the snapshot height is correct.

Flexy works dynamically based on viewport. Both with Classic and Reveal behaviours.

So Classic only fixes on short content.

Reveal when the footer section is less than than 80% (or what ever the user sets) of the VH. Otherwise it behaves like a regular section.

So Reveal probably does that :joy::joy:

Because the section above has to have padding = to the height of the footer to reveal it.

1 Like

Cool. We added a feature to Blocs. Looking forward to my commission :joy:

1 Like

No updates needed on my part. It works as intended. :grin:

1 Like

I just tried with one website after removing Flexy on small simple site using Volt and there was no long space, so I went back to the original site not using Volt and the white space was gone there after removing Flexy, however it was no longer respecting the XS breakpoint and just exported as a wide image. Perhaps a cache image.

1 Like

In this case it was set to classic.

1 Like

So the white space should be = to the height of your footer.

So I guess unless you create the screenshots with a different method, we might need an option to exclude certain js files from screenshots. :man_shrugging: