Blocs 4.2 Beta Build 4

Hey everyone, here is the fourth beta of Blocs 4.2. This release comes just in time for the weekend and patches some outstanding issues with translations and Bootstrap 5.

Bootstrap 5 :rocket:
It’s here, but please remember the framework is actually still in beta. We have a feeling the official release may happen during the beta testing for Blocs 4.2, however, until then we do not recommend using Bootstrap 5 for live production sites.

Migration :dizzy:
You can migrate up to Bootstrap 5 but not backwards, so as this is a super early beta only migrate with backup projects and again don’t migrate and push to production, it’s way to soon for that. :no_entry:

To migrate, open a Bootstrap 4 project and head to project settings, you will see a new framework dropdown, change this and you are good to go!

Javascript Rewrite :writing_hand:
Almost all of the javascript Blocs generates for light boxes, special navigations, scrollFX etc has all been completely rewritten in vanilla JS so regardless of whether your project uses bootstrap 4 or 5, please test every feature of the site before you move it into production. It’s a big rewrite and there may be some issues in these early stages, that will break functionality once exported.

JS Updates :face_with_monocle:
Jquery and the lazyload javascript have both been updated to the latest versions.

Localisation :fr: :de: :es:
Bonjour, Hallo, Hola! Our none native English speaking users will be happy to hear Blocs now speaks French, German and Spanish. You may notice a bad translation, some text cropping or another little interface oddity. Please let me know if you spot something and it’ll be fixed up in no time!

CSS Selectors :nerd_face:
For those interested in the new CSS selector support, you can now add these manually to classes, below is a list of newly support selectors.

  • :first-letter
  • :first-line
  • :selection
  • :first-child
  • :last-child
  • :first-of-type
  • :last-of-type
  • :placeholder

Solis :sunny:
We have also spent some time working on the Blocs companion app Solis, basically patching up some longstanding issues bringing in support for Bootstrap 5. You can download Solis 1.0.7 beta build 1 here.

Summary :grinning:
Please don’t be put off using this version of Blocs, just remember there are a lot of big changes in this release, so only use it for none critical, none production work, at least for the first few betas anyway.

Enjoy testing and have a great weekend! :beers:


Download Blocs 4.2 Beta Build 4

Don’t forget to hard reload your browser if the beta doesn’t show!

3 Likes

I just tried publishing a project migrated to BS5 using this beta with @Malachiman easy burger bric. It is showing up correctly on the published page, but invisible inside Blocs preview. I combined CSS but not JS in this instance, recalling that this caused a few problems before.

Screenshot 2021-04-01 at 21.57.34

One strangeness is that I am seeing a thick white bar on the right hand side of the sidebar menu when opened with Firefox but not other browsers and only on desktop. It looks correct on mobile.

Screenshot 2021-04-01 at 21.53.10

I tried that other project with the double dropdown menu and that appears all correct now when migrated to BS5. This is definitely making progress with every beta. My initial impression is that lazy load seems much improved.

UPDATE: I have just gone back to the BS4 version and that has the same issue with the white bar in Firefox. This is seen across various websites.

Screenshot 2021-04-01 at 22.40.24

2 Likes

You should find combine JS won’t break the easy burger plug-in now.

I’ll keep chipping away and get build 5 out next week.

5 Likes

I don’t know what has changed but easy burger isn’t working this morning either in BS4 or BS5 with this beta.

Stretched-links are behaving very oddly in BS5. They flicker between the chosen one and the next column in the same bloc, then generally going to the wrong page, however it’s working perfectly in BS4. I’ll prepare you a quick video and send over a project file.

This glitch with the stretched links made me realise it would be a nice feature in Blocs if hovering over links in preview could actually show the intended link without needing to click on it. I know we can add custom attributes, but it’s extra work and you might not want to do that on the site itself. I am thinking more of a small status bar at the bottom of the preview window just like we have in Safari.

1 Like

Easy Burger is working for me in Build 4.

Ive tried it in old projects, a new project all working fine.

I’ve just done a local preview in Firefox and Brave where it worked, but not a little earlier when published. I’ll try again.

EDIT: It’s not showing up online when published, either with BS4 or BS5 it seems. I also ran tests with JS combined or not with the same result.

Yeah, I Just transferred a project to BS5 and noticed the same. Stretched-link is not working anywhere near the button but in the top-right corner off the canvas. To @Norm’s attention as well.
Kapture 2021-04-03 at 14.25.12

So far it’s working fine for me.

In my case I have two columns in a bloc and each one has a separate stretched link. They are flickering on hover, then generally going to the wrong destination if at all.

Are you using a php or html page? Testing here but it could be that php is the issue in 4.2 with easy burger. It works fine with 4.1.1.

PHP and clean URL’s

So, I’ve moved my site from Bootstrap 4 to Bootstrap 5. When styling the homepage some magic happened. In preview (Blocs and Browser) I’m not able to scroll down anymore. Navbar is there, links are working but the fullscreen picture has “frozen” the screen. When scrolling down in the file I can see Blocs has put 2 Blocs on top of each other in the file. @Norm I’ll send you the file.

When upgrading a project to Bootstrap 5 It seems the colour settings panel in the inspector became obsolete. It’s not applying any colours anymore.

In the Solis update remotely hosted images in hero blocs are not appearing on mobile. It’s just a blank white space and looks like it didn’t take the image, which does appear in tablet or desktop views.

On another note I can’t help thinking the default device options need to be updated, since an iPhone 12 or SE is surely more relevant than an iPhone 4.

It’s been a while since I last used Solis but just checked now on a BS5 project and it’s showing brics on the page. These were in the footer.

And the last one for today. The underline on hover in the accordion is slightly out of sync on Bootstrap 5.

I had dropdown menu problems with a converted project on both 4.2b4 bs4 and 4.2b4 bs5. I also had a timed modal popup problem on 4.2b4 bs5. I just submitted a bug report to Norm.

4.2b4 is the first 4.2 beta I’ve tested. Immediately upon opening a large document created in Blocs 4.1 and subsequently changing the framework to Bootstrap 5, I found that all of my links suddenly became UNDERLINED. That wasn’t true before. Checking the Class for each link shows this:

image

As you can see, it’s NOT underlined, yet all my links were underlined anyway. This seems to indicate a bug exists whereby Blocs is ignoring Underline states in Classes on links.

When I clicked the underlined T in the Decoration section and then clicked the X, all underlined links associated with that one class suddenly became correct again without underlines. It is unreasonable for me to hand-edit every single Link-class to fix this problem.

Before I file a formal bug report, I would like to know if any of you have seen this?

(I’m on High Sierra, if that matters.)

Thanks,

James

Here’s another question for my fellow beta testers.
Is there a super fast way to delete all pages in a Blocs document except the current page?

I want to often create cut -own versions of my documents for a variety of reasons but especially for sending such to Norm as a bug report. It’s painful for me to delete each page one-by-one, especially because it takes more than 2 second after clicking the red trashcan icon for the “Are you sure…?” dialog to appear. CMD-Delete doesn’t work because doing that just deletes a Bloc instead.

Thanks,

James

Just add custom class called: .a and set decoration to none. You might need to click first on any of the decorations and click none afterwards to do the magic.

Why would you not turn this around? Save the page you want to keep in the Blocs Library and reopen this page in a new document. Now (in B4) you can save all your custom classes this should work without issues. Just my 2 cents of the day.

1 Like