Attempting to utilize the bootstrap 4
:Root color property led to an error indicating that the value was invalid.
Searching through the bootstrap documentation yielded no helpful information on this topic.
Seeking assistance on how to properly use the bootstrap 4 :root property
.
Below is a snippet of my failed attempt to achieve this:
Additionally, encountering an error in netbeans
https://i.sstatic.net/p3YGL.png
Thank you in advance.
:root {
--blue: #007bff;
--indigo: #6610f2;
--purple: #6f42c1;
--pink: #e83e8c;
--red: #dc3545;
--orange: #fd7e14;
--yellow: #ffc107;
--green: #28a745;
--teal: #20c997;
--cyan: #17a2b8;
--white: #fff;
--gray: #6c757d;
--gray-dark: #343a40;
--primary: #007bff;
--secondary: #6c757d;
--success: #28a745;
--info: #17a2b8;
--warning: #ffc107;
--danger: #dc3545;
--light: #f8f9fa;
--dark: #343a40;
--breakpoint-xs: 0;
--breakpoint-sm: 576px;
--breakpoint-md: 768px;
--breakpoint-lg: 992px;
--breakpoint-xl: 1200px;
}
.frm-input:focus {
border-color: --yellow;
}
<div class="frm-row">
<input class="frm-input" type="text" name="email" placeholder="Email address">
</div>