Search code examples
apostrophe-cms

Multi-Column Widget select in Apostrophe UI


I am trying to find the option (if there is one) for enabling the multi-column widget list as seen on the widget demo on the start page of apostrophe https://apostrophecms.org/.

When you watch the demo video on the Tab "Widget" on the apostrophe start page, it shows a 3-column list of widgets to add to the page. In my project, I only have a single-column selection available. I cannot find any option of changing the behaviour of this ui.

Here is a screenshot of the demo video:

enter image description here

Is there an option or even multiple options for configuring the widget select interface?

Thanks and best regards


Solution

  • No option for this but you can apply styles that do this at your project level. In this example I am wrapping a special class (.u-small-dropdowns) around the area's I want to have multi column dropdowns

    .u-small-dropdowns > .apos-area > .apos-area-widgets > .apos-area-widget-wrapper > .apos-ui .apos-dropdown-items {
           column-count: 3;
           max-width: 390px;
        }