1 files changed, 75 insertions, 15 deletions

diff --git a/src/assets/styles/bmc/custom/_forms.scss b/src/assets/styles/bmc/custom/_forms.scss
index 693b5e0b..9e30359c 100644
--- a/src/assets/styles/bmc/custom/_forms.scss
+++ b/src/assets/styles/bmc/custom/_forms.scss
@@ -23,14 +23,14 @@
 
 .custom-select,
 .form-control {
-  &:active {
+  // &:active {
     // border: 1px solid $primary!important;
-  }
-  &:focus {
+  // }
+  // &:focus {
     // color: theme-color("dark");
     // background-color: gray("100");
     // box-shadow: inset 0 0 0 3px gray("100"), inset 0 0 0 5px $primary !important;
-  }
+  // }
   &:disabled {
     background-color: gray("400");
     color: gray("600");
@@ -41,13 +41,13 @@
   }
 }
 
-.custom-select,
-.custom-control-label,
-.form-control {
-  color: theme-color("dark") !important;
-  font-size: 1rem;
-  border-radius: 8px;
-}
+// .custom-select,
+// .custom-control-label,
+// .form-control {
+  // color: theme-color("dark") !important;
+  // font-size: 1rem;
+  // border-radius: 8px;
+// }
 
 // Inverted form colors
 .form-background {
@@ -82,9 +82,13 @@
 .custom-checkbox .custom-control-input:checked ~ .custom-control-label::after,
 .custom-checkbox .custom-control-input:indeterminate ~ .custom-control-label::before,
 .custom-control-input:checked ~ .custom-control-label::before  {
-  background-color: $black;
-  border-color: $black;
+  border-radius: 3px;
+  background-color: $red-brand-primary;
+  border-color: $red-brand-primary;
   cursor: pointer;
+  &:focus {
+    box-shadow: none !important;
+  }
 }
 
 .custom-control {
@@ -97,8 +101,43 @@
   }
 }
 
-.custom-control-input:focus ~ .custom-control-label::before{
-  // box-shadow: 0 0 0 2px  theme-color("primary");
+.custom-switch {
+  width: 28px;
+  height: 16px;
+  margin: 0 0 0 auto;
+}
+
+.custom-switch
+.custom-control-input:focus ~ .custom-control-label::before {
+    box-shadow: none;
+}
+
+.custom-switch
+.custom-control-input ~ .custom-control-label::after {
+  border: 1px solid $faint-secondary-primary-20;
+  background: $white;
+}
+
+.custom-control-input:focus:not(:checked) ~ .custom-control-label::before {
+  border-color: $faint-secondary-primary-20;
+}
+
+.custom-control-input:not(:disabled):active ~ .custom-control-label::before {
+  background-color: rgba(4, 10, 15, 0.3);
+  border-color: $faint-secondary-primary-20;
+}
+
+.custom-switch
+.custom-control-input ~ .custom-control-label::before {
+  border: 1px solid $faint-secondary-primary-20;
+  background: rgba(4, 10, 15, 0.3);
+}
+
+.custom-switch
+.custom-control-input:checked ~ .custom-control-label::before {
+  background: $red-brand-primary;
+  border: 1px solid $faint-secondary-primary-20;
+  border-radius: 8px;
 }
 
 .custom-control-label::after {
@@ -133,3 +172,24 @@
     background-position: right 3rem bottom 50%;
   }
 }
+
+// Global style progress bar
+.progress {
+  width: 120px;
+  height: 8px;
+  border-radius: 4px;
+  background-color: $faint-secondary-primary-10;
+}
+
+.progress-bar {
+  background-color: $red-brand-primary;
+  border-radius: 4px;
+}
+
+.progress_bar_percent {
+  color: $red-brand-primary;
+}
+
+.system-control__radio label {
+  padding-top: 4px;
+}
\ No newline at end of file