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;
}