@fpxfd/next/es/input/variable.css

A configurable component library for web built on React.

:root {
--input-text-color: #545d75;
--input-border-color: #dee1e4;
--input-label-color: #767d91;
--input-hover-border-color: #c3cbd5;
--input-hover-bg-color: #FFFFFF;
--input-focus-border-color: #284cc0;
--color-calculate-input-focus-shadow: rgba(40, 76, 192, 0.2);
--input-focus-bg-color: #FFFFFF;
--input-focus-shadow-spread: 2px;
--input-border-width: 1px;
--input-bg-color: #FFFFFF;
--input-placeholder-color: #a9aeba;
--input-disabled-color: #c3cbd5;
--input-disabled-border-color: #eef1f6;
--input-disabled-bg-color: #f2f4f8;
--input-multiple-padding-lr: 8px;
--input-multiple-padding-tb: 4px;
--input-multiple-font-size: 12px;
--input-multiple-corner: 3px;
--input-addon-bg-color: #eef1f6;
--input-addon-text-color: #a9aeba;
--input-addon-padding: 8px;
--input-l-padding: 12px;
--input-l-label-padding-left: 12px;
--input-l-icon-padding-right: 8px;
--input-m-padding: 8px;
--input-m-label-padding-left: 8px;
--input-m-icon-padding-right: 8px;
--input-s-padding: 4px;
--input-s-label-padding-left: 8px;
--input-s-icon-padding-right: 4px;
--input-feedback-warning-border-color: #f19442;
--color-calculate-input-feedback-warning-shadow: rgba(241, 148, 66, 0.2);
--input-feedback-warning-bg-color: #FFFFFF;
--input-feedback-warning-color: #f19442;
--input-feedback-warning-icon: "\e60b";
--input-feedback-success-color: #18bd92;
--input-feedback-success-icon: "\e63a";
--input-feedback-loading-color: #005adc;
--input-feedback-loading-icon: "\e646";
--input-feedback-error-color: #545d75;
--input-feedback-error-border-color: #f85359;
--color-calculate-input-feedback-error-shadow: rgba(248, 83, 89, 0.2);
--input-feedback-error-bg-color: #FFFFFF;
--input-maxlen-error-color: #f85359;
--input-maxlen-warning-color: #f19442;
--input-maxlen-color: #a9aeba;
--input-maxlen-font-size: 12px;
--input-hint-color: #a9aeba;
--input-hint-hover-color: #767d91;
--input-feedback-clear-icon: "\e623";
}