FloatLabel RTL

pull/6634/head
tugcekucukoglu 2024-10-21 10:46:38 +03:00
parent 1df2d306a6
commit 152270fc50
1 changed files with 6 additions and 22 deletions

View File

@ -15,7 +15,7 @@ const theme = ({ dt }) => `
transition-timing-function: ease; transition-timing-function: ease;
line-height: 1; line-height: 1;
font-weight: ${dt('floatlabel.font.weight')}; font-weight: ${dt('floatlabel.font.weight')};
left: ${dt('floatlabel.position.x')}; inset-inline-start: ${dt('floatlabel.position.x')};
color: ${dt('floatlabel.color')}; color: ${dt('floatlabel.color')};
transition-duration: ${dt('floatlabel.transition.duration')}; transition-duration: ${dt('floatlabel.transition.duration')};
} }
@ -26,7 +26,7 @@ const theme = ({ dt }) => `
} }
.p-floatlabel:has(.p-inputicon:first-child) label { .p-floatlabel:has(.p-inputicon:first-child) label {
left: calc((${dt('form.field.padding.x')} * 2) + ${dt('icon.size')}); inset-inline-start: calc((${dt('form.field.padding.x')} * 2) + ${dt('icon.size')});
} }
.p-floatlabel:has(.p-invalid) label { .p-floatlabel:has(.p-invalid) label {
@ -59,22 +59,6 @@ const theme = ({ dt }) => `
color: ${dt('floatlabel.focus.color')}; color: ${dt('floatlabel.focus.color')};
} }
/*.p-floatlabel .p-placeholder,
.p-floatlabel input::placeholder,
.p-floatlabel .p-inputtext::placeholder {
opacity: 0;
transition-property: all;
transition-timing-function: ease;
}
.p-floatlabel .p-focus .p-placeholder,
.p-floatlabel input:focus::placeholder,
.p-floatlabel .p-inputtext:focus::placeholder {
opacity: 1;
transition-property: all;
transition-timing-function: ease;
}*/
.p-floatlabel-in .p-inputtext, .p-floatlabel-in .p-inputtext,
.p-floatlabel-in .p-textarea, .p-floatlabel-in .p-textarea,
.p-floatlabel-in .p-select-label, .p-floatlabel-in .p-select-label,
@ -82,8 +66,8 @@ const theme = ({ dt }) => `
.p-floatlabel-in .p-autocomplete-input-multiple, .p-floatlabel-in .p-autocomplete-input-multiple,
.p-floatlabel-in .p-cascadeselect-label, .p-floatlabel-in .p-cascadeselect-label,
.p-floatlabel-in .p-treeselect-label { .p-floatlabel-in .p-treeselect-label {
padding-top: ${dt('floatlabel.in.input.padding.top')}; padding-block-start: ${dt('floatlabel.in.input.padding.top')};
padding-bottom: ${dt('floatlabel.in.input.padding.bottom')}; padding-block-end: ${dt('floatlabel.in.input.padding.bottom')};
} }
.p-floatlabel-in:has(input:focus) label, .p-floatlabel-in:has(input:focus) label,