fix(theme): label placement in select and input (#3869)

* fix(theme): fix the label placement

* chore(changeset): adding the changeset

* chore(select): adding comments

.changeset/calm-trees-serve.md

@@ -0,0 +1,5 @@
+---
+"@nextui-org/theme": patch
+---
+
+fix label placement in input and select

packages/core/theme/src/components/input.ts

@@ -28,7 +28,9 @@ const input = tv({
       "absolute",
       "z-10",
       "pointer-events-none",
-      "origin-top-start",
+      "origin-top-left",
+      // Using RTL here as Tailwind CSS doesn't support `start` and `end` logical properties for transforms yet.
+      "rtl:origin-top-right",
       "subpixel-antialiased",
       "block",
       "text-small",

packages/core/theme/src/components/select.ts

@@ -10,7 +10,9 @@ const select = tv({
       "block",
       "absolute",
       "z-10",
-      "origin-top-start",
+      "origin-top-left",
+      // Using RTL here as Tailwind CSS doesn't support `start` and `end` logical properties for transforms yet.
+      "rtl:origin-top-right",
       "subpixel-antialiased",
       "text-small",
       "text-foreground-500",
@@ -187,7 +189,9 @@ const select = tv({
         base: "transition-background motion-reduce:transition-none !duration-150",
         label: [
           "will-change-auto",
-          "origin-top-start",
+          "origin-top-left",
+          // Using RTL here as Tailwind CSS doesn't support `start` and `end` logical properties for transforms yet.
+          "rtl:origin-top-right",
           "!duration-200",
           "!ease-out",
           "transition-[transform,color,left,opacity]",