primevue-mirror/components/inputtext/InputText.css

88 lines
1.5 KiB
CSS
Raw Normal View History

2022-09-06 12:03:37 +00:00
.p-inputtext {
margin: 0;
}
.p-fluid .p-inputtext {
width: 100%;
}
/* InputGroup */
.p-inputgroup {
display: flex;
align-items: stretch;
width: 100%;
}
.p-inputgroup-addon {
display: flex;
align-items: center;
justify-content: center;
}
.p-inputgroup .p-float-label {
display: flex;
align-items: stretch;
width: 100%;
}
.p-inputgroup .p-inputtext,
.p-fluid .p-inputgroup .p-inputtext,
.p-inputgroup .p-inputwrapper,
.p-fluid .p-inputgroup .p-input {
flex: 1 1 auto;
width: 1%;
}
/* Floating Label */
.p-float-label {
display: block;
position: relative;
}
.p-float-label label {
position: absolute;
pointer-events: none;
top: 50%;
margin-top: -.5rem;
transition-property: all;
transition-timing-function: ease;
line-height: 1;
}
.p-float-label textarea ~ label {
top: 1rem;
}
.p-float-label input:focus ~ label,
.p-float-label input.p-filled ~ label,
.p-float-label textarea:focus ~ label,
.p-float-label textarea.p-filled ~ label,
.p-float-label .p-inputwrapper-focus ~ label,
.p-float-label .p-inputwrapper-filled ~ label {
top: -.75rem;
font-size: 12px;
}
.p-float-label .input:-webkit-autofill ~ label {
top: -20px;
font-size: 12px;
}
.p-input-icon-left,
.p-input-icon-right {
position: relative;
display: inline-block;
}
.p-input-icon-left > i,
.p-input-icon-right > i {
position: absolute;
top: 50%;
margin-top: -.5rem;
}
.p-fluid .p-input-icon-left,
.p-fluid .p-input-icon-right {
display: block;
width: 100%;
}