Break up styling selectors

powerhome · Dec 20, 2024 · 109d544 · 109d544
1 parent c40287e
commit 109d544
Showing 1 changed file with 11 additions and 3 deletions.
diff --git a/playbook/app/pb_kits/playbook/pb_form_group/_error_state_mixin.scss b/playbook/app/pb_kits/playbook/pb_form_group/_error_state_mixin.scss
@@ -20,12 +20,20 @@
   }
 }
 
-@mixin error-state-left-side-select-kit {
+@mixin error-state-right-side-select-kit {
   &:has(.pb_text_input_kit:not(.error)):has(.pb_text_input_kit_label):has(.pb_select_kit_wrapper.error),
   &:has(.pb_text_input_kit.error):has(.pb_text_input_kit_label):has(.pb_select_kit_wrapper) {
     align-items: flex-start;
 
-    .pb_select_kit_wrapper,
+    .pb_select_kit_wrapper {
+      padding-top: $space_md;
+      margin-top: 2px;
+
+      .pb_select_kit_caret {
+        padding-top: $space_md;
+      }
+    }
+
     .pb_select_kit_wrapper.error {
       padding-top: $space_md;
       margin-top: 2px;
@@ -37,7 +45,7 @@
   }
 }
 
-@mixin error-state-right-side-select-kit {
+@mixin error-state-left-side-select-kit {
   &:has(.pb_select_kit_label):has(.pb_select_kit_wrapper):has(.pb_phone_number_input):has(.pb_text_input_kit.error) {
     align-items: flex-start;