Changing Category Block Color
RespondidaHello everyone, currently when you come to the home page the category color is white with blue font and when you hover it then it turns blue with white font. Basically what I want to do is flip these two color. I want the blocks to be constantly blue with white font and then when you hover it turns white with blue font. I tried changing it with the simple color pickers on the adjustment page but that didnt seem to do it. It seems you cant just change the border color with these options! Any suggestions? Im using the Copenhagen theme.
Thanks!
-
Hi @Zach,
You need to do it by adding CSS in your CSS editor.
Go to line no. 812 in your CSS editor and replace the code from line no. 812 to line no. 861 with the below code -
.blocks-item {
background-color: #4369a7;
border: 1px solid#4369a7;
border-radius: 4px;
box-sizing: border-box;
color: #fff;
display: flex;
flex: 1 0 340px;
flex-direction: column;
justify-content: center;
margin: 0 0 30px;
max-width: 100%;
text-align: center;
}
@media (min-width: 768px) {
.blocks-item {
margin: 0 15px 30px;
}
}
.blocks-item:hover, .blocks-item:focus, .blocks-item:active {
background-color: #fff;
}
.blocks-item:hover *, .blocks-item:focus *, .blocks-item:active * {
color: #4369a7;
text-decoration: none;
}
.blocks-item-internal {
background-color: transparent;
border: 1px solid #ddd;
}
.blocks-item-internal .icon-lock::before {
content: "\1F512";
font-size: 15px;
bottom: 5px;
position: relative;
}
.blocks-item-internal a {
color: #fff;
}
.blocks-item-link {
color: #fff;
padding: 20px 30px;
}Let me know if you face any issue.ThanksTeam Diziana -
Worked flawlessly as usual! I tried messing around with the CSS but I guess i couldn't quite get it. You guys are great as usual though! Thanks.
-
hi! This worked really well but I am having a couple of issues that I am hoping you could help me with.
When I added this code it changed the pre-clicked link text to be purple instead of white and it make my icons bigger.Is there a way to reduce the icon size so it doesn't touch the edge of the border on hover & is there a way to change my pre-clicked link text to white?
-
Hi Customer Success ViralGains
It's possible to share the URL of your Help Center where you have got this issue so that I will go through it and provide you a solution for your problem.
Thanks
Pulkit
Publicação fechada para comentários.
5 Comentários