import ceph quincy 17.2.6

[ceph.git] / ceph / src / pybind / mgr / dashboard / frontend / src / styles / ceph-custom / _buttons.scss

diff --git a/ceph/src/pybind/mgr/dashboard/frontend/src/styles/ceph-custom/_buttons.scss b/ceph/src/pybind/mgr/dashboard/frontend/src/styles/ceph-custom/_buttons.scss
index a56bf350664fdc172ea3ffd4b5f8cede980a7127..5b9789b3162d3bc76aa154e4e7f6379396a5c96b 100644 (file)
--- a/ceph/src/pybind/mgr/dashboard/frontend/src/styles/ceph-custom/_buttons.scss
+++ b/ceph/src/pybind/mgr/dashboard/frontend/src/styles/ceph-custom/_buttons.scss
@@ -1,27 +1,39 @@
 @use './src/styles/vendor/variables' as vv;
 
 /* Reset checkbox success color */
-.was-validated .custom-control-input:valid,
-.custom-control-input.is-valid {
-  ~ .custom-control-label {
+.was-validated .form-check-input:valid,
+.form-check-input.is-valid {
+  border-color: rgba(vv.$primary, 0.8);
+
+  &:checked {
+    background-color: vv.$primary;
+    border-color: rgba(vv.$primary, 0.8);
+    box-shadow: 0 0 3px 2px rgba(vv.$primary, 0.5);
+  }
+
+  &:focus {
+    border-color: rgba(vv.$primary, 0.8);
+    box-shadow: 0 0 3px 2px rgba(vv.$primary, 0.5);
+  }
+
+  ~ .form-check-label {
     color: initial;
   }
 
-  &:checked ~ .custom-control-label::before {
+  &:checked ~ .form-check-label::before {
     background-color: $component-active-bg;
-    border-color: $custom-control-indicator-checked-border-color;
   }
 
-  ~ .custom-control-label::before {
-    border-color: $custom-control-indicator-border-color;
+  ~ .form-check-label::before {
+    border-color: rgba(vv.$primary, 0.8);
   }
 
   &:focus ~ .custom-control-label::before {
-    box-shadow: $custom-control-indicator-focus-box-shadow;
+    box-shadow: 0 0 3px 2px rgba(vv.$primary, 0.5);
   }
 
   &:focus:not(:checked) ~ .custom-control-label::before {
-    border-color: $custom-control-indicator-focus-border-color;
+    border-color: rgba(vv.$primary, 0.8);
   }
 }
 
@@ -41,6 +53,10 @@
   }
 }
 
+.btn-primary {
+  @extend .btn-accent;
+}
+
 // We have some inputs that don't have a corresponding formControlName,
 // to be able to get the same styling and no JS errors we need use a different
 // class name