I'm getting a background-color
from an API, variable name settings.brand_color
.
I want to use that variable in html element. I cant use style
attribute becuase I'm using :before
selector in my app.
I want to pass that API variable in my css file and use it in my :before
pseudo selector.
JSX
<>
<input
type="radio"
name="language-select"
className="focus:ring-0 mr-5 my-18p default-style radio__input"
/>
<div className="radio__radio"></div>
</>;
CSS
.radio__radio {
width: 24px;
height: 24px;
background-color: #d8d8d8;
border-radius: 50%;
box-sizing: border-box;
padding: 6px;
margin-right: 20px;
z-index: 1;
}
.radio__radio::after {
content: "";
width: 100%;
height: 100%;
display: block;
background: #f28b46;
border-radius: 50%;
transform: scale(0);
z-index: 9;
}