Add a specific class when having sections with background color, image, or video option

Hi @n.ghunaim,

Would you explain why we need to add that class?

Thanks,
Mahmoud

Hi, thanks for this attempt. This patch did not apply when attempting to apply to the latest version of dev.

I assume the purpose of the class is for adding an overlay tint to the background image, as described in this issue, https://www.drupal.org/project/bootstrap_styles/issues/3163894.

I can go with adding the background image and overlay tint via straight CSS, but it would be cool to get this operational, as most images need a tint so that the text pops.

Thanks.

#3244910: Add a specific class when having background bg-color, bg-image, bg-video options

A patch for the latest 1.0.x-dev committed code

A patch for the committed bootstrap_styles-1.0.3 tag release

Thank you, the patch for bootstrap_styles-1.0.3 applied and a class can be added to a section with a backround image. However this is also possible by applying a "container wrapper classes".

My particular goal is to be able to add a linear gradiant over the background image, but this is not possible because the image is added using background-image and not background.

What would be ideal is being able to get the following result:

background: linear-gradient(rgba(0, 0, 0, 0.45), rgba(0, 0, 0, 0.45)), url(/sites/default/files/file.jpg);

What we currently get with either method:

<div class="class-banner tint white _none" style="background-image: url(/sites/default/files/image.jpg); background-position: center top; background-repeat: no-repeat; background-size: cover;">

So my issue is outside of the scope of this issue and more inline with the issue in https://www.drupal.org/project/bootstrap_styles/issues/3163894, where it looks like they specifically had a background image overlay at some point in time.

Thanks for your help!

Re-roll patch #15

Fix issue when adding background color the class bg-color adding, but when deleting the color the class will not remove.
patch to fix the issue on 1.0.x

Fix issue when adding background color the class bg-color adding, but when deleting the color the class will not remove.
patch to fix the issue on tag 1.0.3

Do not use this patch.
Not sure, when I removed the "$build['#theme_wrappers'][$theme_wrapper]['#attributes']['style'][] = $background_image_style;"
It had got mixed with other issue #3299909: Fix Layout Builder section rendering original Background Image when no background options, no image styles, or lazy loading are applied
which to be fixed in the next stage.

Re-roled the patch to work with 1.1.0

Thx Rajab, #23 works for me on 1.1.0 and helped a lot with styling!

✅ Released bootstrap_styles-1.1.1