How to change style in Blockk theme

ctokepa

Hello how to change the style of the link of the category of the article. For example to be red.

saguaros

You can override this css rule:

.jacl-item__cat.style-outline a, .jacl-item__cat.style-outline-rounded a {
    background-color: var(--light-reverse);
    border: 2px solid var(--link-cat-normal);
    color: var(--link-cat-normal);
    padding: var(--global-spacing) calc(var(--global-spacing) * 2);
}

/*Hover color*/
.jacl-item__cat.style-outline a:hover, .jacl-item__cat.style-outline a:focus, .jacl-item__cat.style-outline a:active, .jacl-item__cat.style-outline-rounded a:hover, .jacl-item__cat.style-outline-rounded a:focus, .jacl-item__cat.style-outline-rounded a:active {
    background-color: var(--link-cat-normal);
    color: var(--light-reverse);
}

For example, if you want to change to red, try with:

.jacl-item__cat.style-outline a, .jacl-item__cat.style-outline-rounded a {
    background-color: var(--color-red) !important;
    border: 2px solid var(--color-red) !important;
    color: var(--light-reverse) !important;
    padding: var(--global-spacing) calc(var(--global-spacing) * 2);
}

ctokepa

Thank you

ctokepa

Upon changing the name of the category it becomes inactive and blue and stays like this. Is it a bug?

saguaros

ctokepa You can share me the link of that page on your site, I will take a look.

And tell me how you want it should be.

ctokepa

dominic saguaros an update Outline, Background Color and Background rounded show this bug in item settings. The others don't have that problem

ctokepa

the problem is that if i change the name of the category it will not stay the same style. i want to change the names and the style to stay the same.

dominic

Hi ctokepa,
I think your issue is that The width/height of the category box will change with the name that you used.
You can use the following CSS code to keep the style (width/height):

.jacl-item__cat.style-outline a, .jacl-item__cat.style-outline-rounded a {
    width: 100px;
    padding: 8px 2px;
}

Note: You can change the width to fit with the name category.
Hope this help!

ctokepa

Thank you but that means I cannot change the name of the categories and after changing it I have to edit everytime the style? By the way it doesn't matter what is the lenght or whatsoever of the name of the category to have the discoloration.

dominic

Hi ctokepa,
Could you check the admin account? I will access it and help you check this issue.

ctokepa

This message is visible to Moderators only

hidden content

dominic

Hi ctokepa,
I can not access your site. However, I have checked on our site about your mentioned, you can use the following CSS code to resolve the issue:

.jacl-item__cat.style-outline a, .jacl-item__cat.style-outline-rounded a,
.jacl-item .style-outline.color-blue a {
    border: 2px solid var(--color-red) !important;
    color: var(--color-red) !important;
    padding: var(--global-spacing) calc(var(--global-spacing) * 2);
}

.jacl-item .style-rounded.color-blue a, 
.jacl-item .style-bgcolor.color-blue a {
    background-color: var(--color-white) !important;
    border: 2px solid var(--color-red) !important;
    color: var(--color-red) !important;
    padding: var(--global-spacing) calc(var(--global-spacing) * 2);
}

Hope this helps!

ctokepa

Thank you in the beginning I have shared all info about the site and send the credentials through hidden message. But in general is this a bug or not?

dominic

Hi ctokepa,
It's just different styles of the template, not a bug.