Problem/Motivation

Having number of breakpoints when we add Bootstrap Col 2 and more

Steps to reproduce

Given that the "Bootstrap Layout Builder" was enabled and configured on a site
And a list of "Breakpoints" and "Layout options"
And configured to be used with a selected content type
When we add a new section
And the number of columns was "2 or more"
And each breakpoint has a list of layout options
And we did not select any layout option
Then no default value will set for 2 columns

Proposed resolution

  • Have a default layout option when we add a new sections on listed breakpoints to use the first key value for each breakpoint. Needed for 2 columns and more

Remaining tasks

  • Patch
  • Test

User interface changes

When we add a new section with 2 or more cloumns

API changes

  • None

Data model changes

  • None
CommentFileSizeAuthor
#14 multiple-default-options.png78.55 KBcassioalmeida
#12 Screen Shot 2021-04-16 at 9.39.18 AM.png83.44 KBmahmoud-zayed
#12 Screen Shot 2021-04-16 at 9.22.17 AM.png84.4 KBmahmoud-zayed
#10 3201441.patch9.03 KBcassioalmeida
#10 default_selected.png89.23 KBcassioalmeida
#10 option_list.png68.54 KBcassioalmeida
#10 options_edit.png70.54 KBcassioalmeida
#9 Product_ Varbas-backlog.png178.82 KBrajab natshah
#4 3201441-4.patch798 bytesrajab natshah
After-fix-Edit-layout-for-Test-test-drupal9c1bootstrap_layout_builder.png173.12 KBrajab natshah
Before-fix-Edit-layout-for-Test-test-drupal9c1bootstrap_layout_builder-2.png63.8 KBrajab natshah
Before-fix-Edit-layout-for-Test-test-drupal9c1bootstrap_layout_builder-1.png176.86 KBrajab natshah

Issue fork bootstrap_layout_builder-3201441

Command icon Show commands

Start within a Git clone of the project using the version control instructions.

Or, if you do not have SSH keys set up on git.drupalcode.org:

About issue forks

Comments

RajabNatshah created an issue. See original summary.

rajab natshah’s picture

rajab natshah
he/him
commented
Issue summary: View changes
rajab natshah’s picture

rajab natshah
he/him
commented
Issue summary: View changes
rajab natshah’s picture

rajab natshah
he/him
commented
StatusFileSize
new 3201441-4.patch798 bytes
rajab natshah’s picture

rajab natshah
he/him
commented
Status: Active » Needs review
rajab natshah’s picture

rajab natshah
he/him
commented
Assigned: rajab natshah » Unassigned
jollysolutions’s picture

jollysolutions
one/the
commented
Status: Needs review » Reviewed & tested by the community

Works fine for me.

mahmoud-zayed’s picture

mahmoud-zayed commented
Status: Reviewed & tested by the community » Needs work

Hi Rajab,

Thanks for this feature, I think we can make the default option configurable from the admin panel so we can choose which option suitable for a specific device.

rajab natshah’s picture

rajab natshah
he/him
commented
StatusFileSize
new Product_ Varbas-backlog.png178.82 KB

Thank you, Mahmoud for following up on this issue

Happy to know that you liked the idea

It is in my next 2 weeks sprint to work on number of improvements.

Add Default config values for Bootstrap Styles and Bootstrap Layout Builder

Product Varbase backlog

Investing time on this as a patch for sure. it could be in 2 patches for BLB and Bootstrap Styles

Testing 2 options:

  1. Having a new page for default values ( Suggested to have - not to make the form too much to work with, and it could have it's own default yml config file )
  2. Having a new field next to each Layout Config or Styling Config. ( Razem recommended this option )

Option #2 could be better with a smart tip field to hid/show the default config value.
Researching the best config saving option, and which HTML widget to use

cassioalmeida’s picture

cassioalmeida commented
Status: Needs work » Needs review
StatusFileSize
new options_edit.png70.54 KB
new option_list.png68.54 KB
new default_selected.png89.23 KB
new 3201441.patch9.03 KB

Hi everyone,

I'm submitting a patch in order to add this feature.

This adds a is_default option in the layout's options's list.
As it saves the is_default flag for all selected breakpoints in the option, and remove from any previous option with the same breakpoints.

Options List

Options Edit

Default Selected

cassioalmeida opened merge request !6

mahmoud-zayed’s picture

mahmoud-zayed commented
Status: Needs review » Needs work
StatusFileSize
new Screen Shot 2021-04-16 at 9.22.17 AM.png84.4 KB
new Screen Shot 2021-04-16 at 9.39.18 AM.png83.44 KB

Thanks, Rajab and Cassio!

@Cassio I have the following recommendations:

  • We need to add the ability to select more than one device as the default option.
  • It should be relative to the selected enabled breakpoints for the current layout option, so show&hide the options we can select as default.
  • In List layout options table, we can see at the default column each breakpoint show up maxmum once.

Please check the following screenshots for clarification:
Default
Listing

The description text in the screenshot:
"Select the breakpoints if you want to make this layout option the default option for them.
Note: if the breakpoint already selected as the default option for another layout option, this selection will override it."

Thanks :)

cassioalmeida’s picture

cassioalmeida commented

Thanks for the feedback @Mahmoud.

I'll work on that change today.

cassioalmeida’s picture

cassioalmeida commented
Assigned: Unassigned » cassioalmeida
Status: Needs work » Needs review
StatusFileSize
new multiple-default-options.png78.55 KB

@Mahmoud, I updated the Merge Request with the new code. Could you please review and let me know if this is good?

Multiple Default Options

Thanks!

  • mahmoud-zayed committed 80a855a on 2.x 
    Issue #3201441: Remove unused statement s& run code sniffer.
mahmoud-zayed’s picture

mahmoud-zayed commented
Assigned: cassioalmeida » Unassigned
Status: Needs review » Fixed
rajab natshah’s picture

rajab natshah
he/him
commented

Thank you so much Mahmoud and Cassio for having the default breakpoints
Saved us big time on this

I'm only hopping for more

To follow in new issues

Edited: with more updates

Status: Fixed » Closed (fixed)

Automatically closed - issue fixed for 2 weeks with no activity.