// core .p-fluid .p-inputtext { width: 100%; } // theme .p-inputtext { font-family: var(--font-family); font-feature-settings: var(--font-feature-settings, normal); font-size: $inputTextFontSize; color: $inputTextColor; background: $inputBg; padding: $inputPadding; border: $inputBorder; transition: $formElementTransition; appearance: none; border-radius: $borderRadius; outline-color: transparent; &:enabled:hover { border-color: $inputHoverBorderColor; } &:enabled:focus { @include focused-input(); } &.p-invalid.p-component { @include invalid-input(); } &.p-variant-filled { background-color: $inputFilledBg; &:enabled:hover { background-color: $inputFilledHoverBg; } &:enabled:focus { background-color: $inputFilledFocusBg; } } &.p-inputtext-sm { @include scaledFontSize($inputTextFontSize, $scaleSM); @include scaledPadding($inputPadding, $scaleSM); } &.p-inputtext-lg { @include scaledFontSize($inputTextFontSize, $scaleLG); @include scaledPadding($inputPadding, $scaleLG); } } .p-float-label > label { left: nth($inputPadding, 2); color: $inputPlaceholderTextColor; transition-duration: $transitionDuration; } .p-float-label > .p-invalid + label { color: $inputErrorBorderColor; } .p-icon-field-left > .p-inputtext { padding-left: nth($inputPadding, 2) * 2 + $primeIconFontSize; } .p-icon-field-left.p-float-label > label { left: nth($inputPadding, 2) * 2 + $primeIconFontSize; } .p-icon-field-right > .p-inputtext { padding-right: nth($inputPadding, 2) * 2 + $primeIconFontSize; } @include placeholder { color: $inputPlaceholderTextColor; } .p-input-filled { .p-inputtext { background-color: $inputFilledBg; &:enabled:hover { background-color: $inputFilledHoverBg; } &:enabled:focus { background-color: $inputFilledFocusBg; } } } .p-inputtext-sm { .p-inputtext { @include scaledFontSize($inputTextFontSize, $scaleSM); @include scaledPadding($inputPadding, $scaleSM); } } .p-inputtext-lg { .p-inputtext { @include scaledFontSize($inputTextFontSize, $scaleLG); @include scaledPadding($inputPadding, $scaleLG); } }