added blue/info widgets

ibexa · Sep 25, 2023 · 9890abf · 9890abf
1 parent 3f454aa
commit 9890abf
Show file tree

Hide file tree

Showing 2 changed files with 27 additions and 24 deletions.
diff --git a/src/bundle/Resources/public/scss/_inputs.scss b/src/bundle/Resources/public/scss/_inputs.scss
@@ -23,21 +23,7 @@
     transition: all $ibexa-admin-transition-duration $ibexa-admin-transition;
     border: calculateRem(1px) solid $ibexa-color-dark-300;
 
-    &:hover {
-        border-color: $ibexa-color-primary;
-    }
-
-    &:focus,
-    &.ibexa-input--text.form-control:focus,
-    &.ibexa-input--date.form-control:focus {
-        border-color: $ibexa-color-primary;
-        box-shadow: 0 0 calculateRem(3px) 0 rgba($ibexa-color-primary, 0.75);
-    }
-
-    &:disabled {
-        cursor: not-allowed;
-        border-color: $ibexa-color-dark-200;
-    }
+    @include ibexa-input-hover-and-focus($ibexa-color-primary);
 
     &--text,
     &--textarea,
@@ -49,15 +35,6 @@
         border-radius: $ibexa-border-radius;
         position: relative;
 
-        &:focus,
-        &.form-control:focus {
-            color: $ibexa-color-dark;
-        }
-
-        &:hover:not(:disabled) {
-            border-color: $ibexa-color-primary;
-        }
-
         &:active:not(:disabled) {
             border-color: $ibexa-color-dark;
         }

diff --git a/src/bundle/Resources/public/scss/mixins/_inputs.scss b/src/bundle/Resources/public/scss/mixins/_inputs.scss
@@ -41,3 +41,29 @@
     flex-basis: 100%;
     margin: 0 0 calculateRem(10px) calculateRem(2px);
 }
+
+@mixin ibexa-input-hover-and-focus($color) {
+    &:hover {
+        border-color: $color;
+    }
+
+    &:focus,
+    &.ibexa-input--text.form-control:focus,
+    &.ibexa-input--date.form-control:focus {
+        border-color: $color;
+        box-shadow: 0 0 calculateRem(3px) 0 rgba($color, 0.75);
+    }
+
+    &--text,
+    &--textarea,
+    &--date {
+        &:focus,
+        &.form-control:focus {
+            color: $ibexa-color-dark;
+        }
+
+        &:hover:not(:disabled) {
+            border-color: $color;
+        }
+    }
+}