Blocs 3.2 Beta Build 1


Well, I can’t get it to work. It’s the end of the day here in Japan, so I’ll give it more thought tomorrow. No doubt some of you will have mastered it by then! :slight_smile:


Rest well :+1:


Add the class .modal-content
This class lets you style the modal. You can add a border, box drop shadow, remove the round corners, and also adjust the size.

Some other Modal classes:

Identifies the content as a modal and brings focus to it.

It defines the style for the body of the modal.

Styles the modal (border, background-color, etc). Inside this, add the modal’s header, body and footer, if needed.

Centers the modal vertically and horizontally within the page

The footer of the modal (often contains an action button and a close button)

The header of the modal (often contains a title and a close button)

Large modal (wider than default)

Small modal (less width)



This modal bric is really a sensation.


Blocs uses Bootstrap 4 if you ever wonder why or how, this is a great place to start.

The bootstrap modal.

Boostrap has a class for modals and they also force buttons to be right aligned for some reason. So its like that by design but I’ll see if I can make it a little more flexible.


You are mastering Bootstrap :sunglasses:


The scrolling issue is fixed and ready for 3.2 build 2 (tomorrow)


What about the audio/video problem?


This issue is now fixed up in 3.2 build 2.


I’ve added the first interation of Solo Mode in build 2.


It’s still a bit iffy but before I spend more time on it, I just want to make sure I got the basic concept correct??

When you select a new bloc it closes the old one?


That’s really cool and a valuable new feature. This will really help usability for multi Bloc and complex pages.


Working with modals is always tricky. Besides this great feature we are using Bites popup modals - You have a great list of different modals for different purposes. Not sure how many of you use this kind of modals because its a paid component. If somebody needs this just DM me.


the second best solo after han :grin::hearts::hearts::hearts::hearts::hearts::hearts::hearts::hearts::hearts: thank you norm.


Your version is a little bit different but it is also a good apporach. Yours is more handy to find the “objects” – the Luminar/Lightroom approach is visually more helpfull as it collapses the menus. BUT: we have more elements within one bloc/group/etc. so therefore it is more the decision, if by clicking on one bloc all other will close, the same goes for groups or rows/columns. I def could live with “only blocs/groups” collapse. it is really helpfull. THANK YOU a ton!


Here is how it works in my version of Lightroom.



Yeah so the blocs version currently works on the top level only.


There are many numbers after 3.2.x and also 3.x or later x.0 … :slight_smile: So no hurry. This is already a great step towards productivity.


I quiet like this aproach of @Norm.
Havn´t tested it by now, but hope that if clicking visualy on one bric the belonging bloc will behave the same way one the tree.
Love it :smiling_face_with_three_hearts::+1:


Well, I am not clear on how to get that to work. Here’s what I tried:

  1. New document.
  2. Add Hero.
  3. Add Modal.
  4. Set Hero’s button to Open Modal.
  5. Preview in Blocs to check the size of the modal and click Get Started to display it.
  6. Switch back to page view.
  7. Select “Modal #modal-22843…” in the left sidebar.
  8. Type “model-content” and “modal-lg” inside the Classes field of the right sidebar.
  9. Preview and test, only to find the Modal size has NOT changed.
  10. Return to page view.
  11. Double-click “modal-lg” and type “900” for “Width” and then click Done.
  12. Preview and find it is wider now but no longer centered. Any changes to size seem to kick that size increase to the right, leaving the larger sized modal off-center.


–James W.


You can use just create the class modal-content and adjust the size width at each different break point for a custom size. I use %, it seems easier. You might have to set the left/right margin to auto (which center the modal)