hubl/src/styles/hubl-framework/badges/_index.scss

51 lines
1.0 KiB
SCSS

.badge {
display: block;
border-radius: 50%;
font-size: 11px;
height: 18px;
width: 18px;
font-weight: bold;
text-align: center;
line-height: 18px;
color: var(--color-heading);
background: var(--color-third);
&.color-primary {
background: white;
border: 1px solid var(--color-primary);
color: var(--color-primary);
}
&.color-secondary {
background: white;
border: 1px solid var(--color-secondary);
color: var(--color-secondary);
}
&.color-third {
background: white;
border: 1px solid var(--color-third);
color: var(--color-third);
}
&.reversed {
&.color-primary {
background: var(--color-primary);
border: 1px solid var(--color-primary);
color: white;
}
&.color-secondary {
background: var(--color-secondary);
border: 1px solid var(--color-secondary);
color: white;
}
&.color-third {
background: var(--color-third);
border: 1px solid var(--color-third);
color: white;
}
}
}