Re-using CSS class names when importing templates - why?

1

Hi, wondering if someone can explain the logic of how Bricks handles classes on template imports.

Let’s say I import a template which is a generic card. The card has a class name of “rk-card”. Since that is a generic class name for this generic card, and I’m using the card on my page as a contact card, I rename the class to “contact-card”. I can now style all my cards on this page at the same time because they all share the same class. All good so far.

The problem comes on the next page, when I want to use this same card but in a different way (i.e. styled slightly differently). This time the card will be an author card. So I want to call this card’s class “author-card”. When I import the card, however, it doesn’t have the original “rk-card” class name, instead it’s “contact-card” - the name of the first card that I added on another page that has nothing to do with the page I’m working on. If I rename “contact-card” class on the new page, it also renames it on the first page. This is not what I expect nor what I want!

Shouldn’t Bricks ask you, when importing a template, whether to re-use CSS class names that might be existing in a previous template import, or whether to use the CSS class names that were saved as part of the template? Without this functionality it seems I have to use a convoluted method of copying styles from one card and applying them to the other, so my 2 cards on 2 different pages of the site are independent and can be styled differently.

4 Likes
2

I am wondering about the same thing. Why not having the option of adding or not an __imported suffix to all classes of an imported template. There was a time when it was possible but they “fixed” it instead of making it better by adding the option of enabling & disabling this option.

2 Likes
3

See the explanation in this thread … NO BUG: Importing Templates and Changing Classes Affects Future Imports

4

I’ve already seen it but this makes sense to me “is it not possible to generate new IDs when a template is imported? This would make the most sense to me.”.

I believe this is possible and should be a feature with an enable/disable toggle for each to choose. If I for example need 10 variants (similar CSS styles) of the same template, I need to keep the styling of my classes and only alter them but as for now I can not do that. This means a lot of work in order to end up with my :slight_smile: 10 variants of a single template.

If maybe I missed something and you know an easy solution to achieve the above, please let me know.

1 Like