Commit f711831 and authored Feb 23, 2022 Verified
1 parent 8c5e1dc commit f711831 Copy full SHA for f711831
File tree 2 files changed +28
-3
lines changed
react/src/components/TextInput/next
styles/scss/components/text-input
2 files changed +28
-3
lines changed Original file line number Diff line number Diff line change @@ -48,6 +48,17 @@ export const TogglePasswordVisibility = () => {
48
48
) ;
49
49
} ;
50
50
51
+ export const ReadOnly = ( ) => {
52
+ return (
53
+ < TextInput
54
+ labelText = "Text input label"
55
+ helperText = "Optional help text"
56
+ value = "This is read only, you can't type more."
57
+ readOnly
58
+ />
59
+ ) ;
60
+ } ;
61
+
51
62
export const WithLayer = ( ) => {
52
63
return (
53
64
< >
Original file line number Diff line number Diff line change 96
96
width : 100% ;
97
97
}
98
98
99
- .#{$prefix } --text-input__invalid-icon {
99
+ .#{$prefix } --text-input__invalid-icon ,
100
+ .#{$prefix } --text-input__readonly-icon {
100
101
position : absolute ;
101
102
// top/transform used to center invalid icon in IE11
102
103
top : 50% ;
103
104
right : $spacing-05 ;
104
- fill : $support-error ;
105
105
transform : translateY (-50% );
106
106
}
107
107
108
+ .#{$prefix } --text-input__invalid-icon {
109
+ fill : $support-error ;
110
+ }
111
+
108
112
.#{$prefix } --text-input__invalid-icon--warning {
109
113
fill : $support-warning ;
110
114
}
175
179
}
176
180
177
181
.#{$prefix } --text-input--invalid ,
178
- .#{$prefix } --text-input--warning {
182
+ .#{$prefix } --text-input--warning ,
183
+ .#{$prefix } --text-input-wrapper--readonly .#{$prefix } --text-input {
179
184
padding-right : $spacing-08 ;
180
185
}
181
186
381
386
flex-direction : column ;
382
387
}
383
388
389
+ // -----------------------------
390
+ // Readonly
391
+ // -----------------------------
392
+
393
+ .#{$prefix } --form--fluid .#{$prefix } --text-input-wrapper--readonly ,
394
+ .#{$prefix } --text-input-wrapper--readonly .#{$prefix } --text-input {
395
+ background : transparent ;
396
+ }
397
+
384
398
// Windows HCM fix
385
399
.#{$prefix } --text-input--password__visibility ,
386
400
// TODO: remove selector above
You can’t perform that action at this time.
0 commit comments