@start-base/react-form-elements/TextArea/styles.css

Simplify form elements and form management. Selection of user friendly inputs and wide customization abilities to match your design and functionality.

.SUI-TextArea-module-inputContainer-j6GDh{box-sizing:border-box;margin-bottom:var(--rfe-spacing);position:relative}.SUI-TextArea-module-label-CoCQG{color:var(--rfe-color);cursor:text;font-size:var(--rfe-font-size);left:16px;line-height:1;margin-bottom:0;position:absolute;top:-2px;transform:translateY(calc((var(--rfe-input-height) - 14px)/2));transition:transform .25s,font-size .25s;width:calc(100% - 16px)}.SUI-TextArea-module-label-CoCQG:before{background-color:var(--rfe-background);content:"";height:24px;left:0;position:absolute;top:-6px;transition:all .25s;width:calc(100% - 14px);z-index:-1}.SUI-TextArea-module-inputContainer-j6GDh.SUI-TextArea-module-focusedContainer-1KbhK .SUI-TextArea-module-label-CoCQG{font-size:var(--rfe-focused-font-size);transform:translateY(9px)}.SUI-TextArea-module-inputContainer-j6GDh .SUI-TextArea-module-innerContainer-SmzlR{display:flex;flex-direction:column;position:relative}.SUI-TextArea-module-inputContainer-j6GDh .SUI-TextArea-module-innerWrapper-t0xFX{border-radius:var(--rfe-border-radius);display:flex;flex-direction:column}.SUI-TextArea-module-input-OEgHJ{background-color:var(--rfe-background);border:1px solid var(--rfe-border);border-radius:var(--rfe-border-radius);color:var(--rfe-color);font-family:var(--rfe-font-family);line-height:24px;min-height:calc(var(--rfe-input-height)*2);padding:7px 16px;resize:none;transition:all .25s;width:100%}.SUI-TextArea-module-inputContainer-j6GDh .SUI-TextArea-module-innerWrapper-t0xFX .SUI-TextArea-module-input-OEgHJ.SUI-TextArea-module-withLabel-8jLka{padding-bottom:0;padding-top:25px}.SUI-TextArea-module-inputContainer-j6GDh .SUI-TextArea-module-innerWrapper-t0xFX .SUI-TextArea-module-input-OEgHJ:focus{box-shadow:var(--rfe-focus)}.SUI-TextArea-module-errorLabel-EqHep{color:var(--rfe-color-error);font-size:var(--rfe-error-font-size);margin-top:var(--rfe-label-spacing);pointer-events:none}.SUI-TextArea-module-disabled-N09tP{background-color:var(--rfe-background-disabled)!important;color:var(--rfe-color)!important;cursor:not-allowed!important;opacity:1!important}.SUI-TextArea-module-inputError-khDK0{border-color:var(--rfe-color-error)!important}.SUI-TextArea-module-disabledLabel-oY2zO{cursor:not-allowed;pointer-events:none}.SUI-TextArea-module-disabledLabel-oY2zO:before{background-color:var(--rfe-background-disabled)!important}.SUI-TextArea-module-disableShrink-Jb7WA{color:var(--rfe-color);display:block;font-size:var(--rfe-font-size)!important;margin-bottom:var(--rfe-label-spacing);position:static!important;transform:none}.SUI-TextArea-module-disableShrink-Jb7WA:before{background-color:var(--rfe-transparent)!important}.SUI-TextArea-module-disableShrinkInput-pVE3n{padding-bottom:0!important;padding-top:10px!important}.SUI-TextArea-module-input-OEgHJ::placeholder{color:var(--rfe-color-placeholder);font-size:var(--rfe-placeholder-font-size)}.SUI-TextArea-module-labelPlaceholder-xOQdB{font-size:var(--rfe-focused-font-size);transform:translateY(9px)}