@keenmate/pure-admin-core 2.3.1 → 2.3.2

package/src/scss/core-components/forms/_input-wrapper.scss

@@ -1,89 +1,89 @@
-/* ========================================
-   Input Wrapper
-   Input with clear button, search tokens container
-   ======================================== */
-@use '../../variables' as *;
-
-// Input with clear button wrapper
-.pa-input-wrapper {
-  position: relative;
-  display: flex;
-  flex-wrap: wrap;
-  align-items: center;
-  gap: $spacing-xs;
-  width: 100%;
-
-  .pa-input,
-  .pa-select,
-  .pa-virtual-textbox {
-    flex: 1;
-    min-width: 0; // Allow inputs to shrink below their content size
-    padding-inline-end: 4rem; // RTL: flips to padding-left, make room for clear button
-  }
-
-  &__clear {
-    position: absolute;
-    inset-inline-end: $spacing-xs; // RTL: flips to left
-    top: 50%;
-    transform: translateY(-50%);
-    background: transparent;
-    border: none;
-    color: var(--pa-text-color-2);
-    cursor: pointer;
-    padding: $spacing-xs;
-    font-size: $font-size-base;
-    line-height: 1;
-    opacity: 0.6;
-    transition: opacity $transition-fast $easing-snappy;
-
-    &:hover {
-      opacity: 1;
-      color: $danger-bg;
-    }
-
-    &:focus {
-      outline: none;
-      opacity: 1;
-    }
-
-    // Hide when input is empty
-    &--hidden {
-      display: none;
-    }
-  }
-}
-
-// Search Tokens Container (for query builder badges)
-.pa-search-tokens {
-  display: flex;
-  flex-wrap: wrap;
-  gap: $spacing-xs;
-  align-items: center;
-}
-
-.pa-search-token-group {
-  display: inline-flex;
-  align-items: center;
-  gap: 2px;
-
-  .pa-badge {
-    margin: 0;
-  }
-}
-
-.pa-search-token-remove {
-  margin-inline-start: $spacing-xs; // RTL: flips to margin-right
-  padding: 0 $spacing-xs;
-  border: none;
-  background: transparent;
-  color: currentColor;
-  cursor: pointer;
-  font-size: 1.2em;
-  line-height: 1;
-  opacity: 0.7;
-  transition: opacity $transition-fast $easing-smooth;
-
-  &:hover {
-    opacity: 1;
-  }
-}
+/* ========================================
+   Input Wrapper
+   Input with clear button, search tokens container
+   ======================================== */
+@use '../../variables' as *;
+
+// Input with clear button wrapper
+.pa-input-wrapper {
+  position: relative;
+  display: flex;
+  flex-wrap: wrap;
+  align-items: center;
+  gap: $spacing-xs;
+  width: 100%;
+
+  .pa-input,
+  .pa-select,
+  .pa-virtual-textbox {
+    flex: 1;
+    min-width: 0; // Allow inputs to shrink below their content size
+    padding-inline-end: 4rem; // RTL: flips to padding-left, make room for clear button
+  }
+
+  &__clear {
+    position: absolute;
+    inset-inline-end: $spacing-xs; // RTL: flips to left
+    top: 50%;
+    transform: translateY(-50%);
+    background: transparent;
+    border: none;
+    color: var(--pa-text-color-2);
+    cursor: pointer;
+    padding: $spacing-xs;
+    font-size: $font-size-base;
+    line-height: 1;
+    opacity: 0.6;
+    transition: opacity $transition-fast $easing-snappy;
+
+    &:hover {
+      opacity: 1;
+      color: $danger-bg;
+    }
+
+    &:focus {
+      outline: none;
+      opacity: 1;
+    }
+
+    // Hide when input is empty
+    &--hidden {
+      display: none;
+    }
+  }
+}
+
+// Search Tokens Container (for query builder badges)
+.pa-search-tokens {
+  display: flex;
+  flex-wrap: wrap;
+  gap: $spacing-xs;
+  align-items: center;
+}
+
+.pa-search-token-group {
+  display: inline-flex;
+  align-items: center;
+  gap: 2px;
+
+  .pa-badge {
+    margin: 0;
+  }
+}
+
+.pa-search-token-remove {
+  margin-inline-start: $spacing-xs; // RTL: flips to margin-right
+  padding: 0 $spacing-xs;
+  border: none;
+  background: transparent;
+  color: currentColor;
+  cursor: pointer;
+  font-size: 1.2em;
+  line-height: 1;
+  opacity: 0.7;
+  transition: opacity $transition-fast $easing-smooth;
+
+  &:hover {
+    opacity: 1;
+  }
+}