fix: keep select chevrons centered when open

.codex/skills/xinyuan-design-system/assets/portable/react-jsx/styles.css

@@ -1272,15 +1272,20 @@ body [data-theme='dark'] .login-page {
 }
 
 .rc-filter-select__indicator {
+  position: absolute !important;
+  inset: 0 0.625rem 0 auto !important;
   display: inline-grid !important;
   width: 1rem;
   height: 1rem;
   flex: none;
   place-items: center;
+  align-self: auto;
+  margin: auto 0 !important;
   color: var(--rc-text-muted);
   font-size: 0.875rem;
-  line-height: 1;
-  transform-origin: center;
+  line-height: 0;
+  transform: none;
+  transform-origin: 50% 50%;
   transition:
     color var(--rc-motion-fast) var(--rc-ease-standard),
     transform var(--rc-motion-fast) var(--rc-ease-standard);

.codex/skills/xinyuan-design-system/assets/portable/react-jsx/tailwind.css

@@ -1289,15 +1289,20 @@ body [data-theme='dark'] .login-page {
 }
 
 .rc-filter-select__indicator {
+  position: absolute !important;
+  inset: 0 0.625rem 0 auto !important;
   display: inline-grid !important;
   width: 1rem;
   height: 1rem;
   flex: none;
   place-items: center;
+  align-self: auto;
+  margin: auto 0 !important;
   color: var(--rc-text-muted);
   font-size: 0.875rem;
-  line-height: 1;
-  transform-origin: center;
+  line-height: 0;
+  transform: none;
+  transform-origin: 50% 50%;
   transition:
     color var(--rc-motion-fast) var(--rc-ease-standard),
     transform var(--rc-motion-fast) var(--rc-ease-standard);

src/global.less

@@ -214,8 +214,8 @@ button, input, textarea, select { font: inherit; letter-spacing: 0; }
 .rc-form-select .select__value, .rc-form-select__value { display: flex; min-width: 0; min-height: 20px; flex: 1; align-items: center; color: var(--rc-text-primary); font-size: 14px; line-height: 20px; }
 .rc-form-select__text { display: block; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
 .rc-form-select__text.is-placeholder { color: var(--rc-text-muted); }
-.rc-form-select .select__indicator, .rc-form-select__indicator { position: absolute !important; top: 50% !important; right: 12px !important; display: inline-grid !important; width: 16px; height: 16px; place-items: center; margin: 0 !important; color: var(--rc-text-muted); line-height: 0 !important; transform: translateY(-50%); transition: color 150ms ease, transform 150ms ease; }
-.rc-form-select__indicator[data-open='true'], .rc-form-select__trigger[aria-expanded='true'] .rc-form-select__indicator { transform: translateY(-50%) rotate(180deg); }
+.rc-form-select .select__indicator, .rc-form-select__indicator { position: absolute !important; inset: 0 12px 0 auto !important; display: inline-grid !important; width: 16px; height: 16px; place-items: center; align-self: auto; margin: auto 0 !important; color: var(--rc-text-muted); line-height: 0 !important; transform: none; transform-origin: 50% 50%; transition: color 150ms ease, transform 150ms ease; }
+.rc-form-select__indicator[data-open='true'], .rc-form-select__trigger[aria-expanded='true'] .rc-form-select__indicator { transform: rotate(180deg); }
 .rc-form-select__indicator .anticon, .rc-form-select__indicator svg { display: block; width: 16px; height: 16px; margin: 0; }
 .rc-form-select .popover, .rc-form-select [data-slot='popover'], .rc-form-select__popover { z-index: 210; min-width: var(--trigger-width); max-height: min(320px, calc(100dvh - 32px)); overflow-y: auto; padding: 4px !important; border: 1px solid var(--rc-border-default); border-radius: 12px !important; color: var(--rc-text-secondary); background: var(--rc-bg-surface) !important; box-shadow: var(--rc-shadow-overlay) !important; }
 .rc-form-select__listbox { display: grid; gap: 2px; outline: none; }