ui: add read-only styling to Input element

2026-05-04 18:00:48 +03:00 · 2023-01-13 11:59:11 -07:00
parent e88197c4b1
commit f6cf4a1236
1 changed files with 8 additions and 1 deletions
--- a/resources/scripts/components/elements/Input.tsx
+++ b/resources/scripts/components/elements/Input.tsx
@@ -62,7 +62,14 @@ const inputStyle = css<Props>`
        ${tw`opacity-75`};
    }

-    ${props => props.isLight && light};
+    ${props =>
+        props.isLight
+            ? light
+            : css`
+                  &:not(.ignoreReadOnly):read-only {
+                      ${tw`border-neutral-800 bg-neutral-900`};
+                  }
+              `};
    ${props => props.hasError && tw`text-red-100 border-red-400 hover:border-red-300`};
 `;