Target Typography for entire column

Community Share Code and Components
1

So, my desired effect is to be able to Target all the Typography within a container. I then want to be able to change the BG Color, and Typography color WHEN HOVERED. Anyone have a simple solution?
Thanks In Advance.
Aj

2

Hi!

You have to add a CSS class to your container.

Then you can paste this CSS code, replace the class name and adjust the values:

.your-css-class {
    color: $color-background;
    background-color: $color-secondary;
    padding: 2rem;
    transition: $transition-base;
    
    &:hover {
        color: $color-default;
        background-color: $color-primary;
    }
}

I have also added padding and a transition.

I hope this helps you.

3 Likes
3

I appreciate the snippet, and the feedback. I guess my hope was there was a built in way to add all this natively within the CMS without the need to write code. Essentially, the less code I write, the faster I can build for my clients, and charge less. I know SiteJet is still young, but I would like to see the ability to control Container Typography and Hover effects built into the CMS without the need for code.

Thank you again.

4

In the first few weeks that I worked in Sitejet, I was also bothered by the fact that a lot of things require code to be written. Today I have to say that I have learned a lot through this and sometimes even prefer writing code to the internal tools of the builder.

Since I started with Sitejet two years ago, a lot has happened and much more can be created without code.

3 Likes
5

I am excited to see where the platform can go. We are a Digital Agency that uses Duda, and Wordpress Primarily, so when we ran across the deal we wanted to jump on it while it was still young. Thank you for all your help with this issue, but I was unable to get the desired effect I was looking for.

6

If you tell me what didn’t work, I’ll be happy to create new code for you again.
Just let me know.

1 Like