Tag Pills Help

Things I have tried

What I’m trying to do

Hi guys,

Sorry if this has already been asked… I am slowly getting back into coding. So I have this code I modified for tag pills; however, the colours when I hover over aren’t right. I am using the Minimal theme and want the pills to match the colours.

Can you please help me. Here is the code I have so far. Also, if I want to add more can I just do that under these ones I already have?

Thanks in advance

.tag {
background-color: var(–text-accent);
border: none;
color: white;
font-size: 11px;
padding: 1px 8px;
text-align: center;
text-decoration: none;
display: inline-block;
margin: 0px 0px;
cursor: pointer;
border-radius: 14px;
}
.tag:hover {
color: white;
background-color: var(–background-primary);
}
.tag[href^="#Home"] {
background-color: #dc143c;
}
.tag[href^="#MOC"] {
background-color: #fff44f;
}
.tag[href^="#Subject"] {
background-color: #32cd32;
}
.tag[href^="#journal"] {
background-color: #ba55d3;
}
.tag[href^="#dcc"] {
background-color: #da1d81;
}

This topic was automatically closed 30 days after the last reply. New replies are no longer allowed.