[Gelöst] Bullets again beside Gallery block

[Author]

Artikel

[Stephen Vaughan]

Hello,

just coming back to the bullet point issue again. Originally highlighted here:

https://toolset.com/forums/topic/a-bullet-point-appears-beside-each-image-in-the-new-gallery-block/#post-1613801

They are back!

But, I managed to get rid of them again.

I am working on a project and just updated to the 1.2 version of Toolset blocks. In the project I have a custom post type that is using a template created with the Divi builder. This template is using the Post Content module to bring in the content from each post which is using a template made with blocks. I was using the repeating fields/gallery block to show a gallery of images but with the 1.2 update and conversion to the new gallery block the bullet points are back.

Looking closely at the original css solution it is qualified to target content in a regular non Divi builder page by prepending #left-area
To retarget the rule for my set up using the Divi builder I adjusted the selectors to the following:

ul.tb-gallery {
list-style: none !important;
padding: 0 !important;
}

Might it be possible to configure the css in Toolset blocks to use a rule like this?

[Waqar]

Hi Stephen,

Thank you for contacting us and I'd be happy to assist.

The Toolset Block already includes a CSS style rule to set the "list-style" property to none:
( line# 13 in file: /toolset-blocks/vendor/toolset/blocks/public/css/style.css )

.tb-gallery {
    list-style: none;
    margin: 0 0 1.5em 0;
    padding: 0;
}

But if I understand your recommendation correctly, you're suggesting to include "!important" with these style rules, so that it is less likely that they can be overridden by styles added by the theme or other plugins.
( it would make sense as I can't think of any case where someone would want list-style, padding or margin style property values to be inherited from the website's theme or other plugins, for this UL tag added for the gallery block )

Please confirm, if I've understood this correctly and I'll pass it on to the concerned team.

regards,
Waqar

[Stephen Vaughan]

Hi Waqar,

I adjusted my css to the following:
ul.tb-gallery {
list-style: none ;
padding: 0 ;
}

That still works so it looks like we don't need !important.

It seems that this is specific to Divi where the post which is fronted by a blocks based content template for some of the layout on the front end is getting wrapped in a Divi Theme Builder template. In this situation .tb-gallery on it's own is not good enough and needs to be prefixed with ul to be more specific.

As this is an edge case, and I have my workaround, it not vital for the plugin to reflect this.

[Waqar]

Hi Stephen,

Thanks for writing back.

I agree that this is an edge case, and with the different themes, plugins, and workflow combinations, custom CSS adjustments like these will always be needed.

You're welcome to mark this ticket as resolved and please keep sharing your valuable suggestions and feedback.

regards,
Waqar

[Stephen Vaughan]

My issue is resolved now. Thank you!