vertumnus
/
primevue-mirror
mirror of https://github.com/primefaces/primevue.git
1
0
Fork 0
Code Packages Releases Activity

Fixed #379 - Support for left and right icons for Input

pull/388/head
cagataycivici 2020-07-10 15:10:53 +03:00
parent 6c3b707bdc
commit fbc7d15f5b
34 changed files with 108 additions and 102 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

6
public/themes/arya-blue/theme.css
View File

@ -769,13 +769,13 @@
padding: 0.625rem 0.625rem; padding: 0.625rem 0.625rem;
} }
.p-float-label label { .p-float-label > label {
left: 0.5rem; left: 0.5rem;
color: rgba(255, 255, 255, 0.6); color: rgba(255, 255, 255, 0.6);
transition-duration: 0.2s; transition-duration: 0.2s;
} }
.p-input-icon-left > i { .p-input-icon-left > i:first-of-type {
left: 0.5rem; left: 0.5rem;
color: rgba(255, 255, 255, 0.6); color: rgba(255, 255, 255, 0.6);
} }
@ -784,7 +784,7 @@
padding-left: 2rem; padding-left: 2rem;
} }
.p-input-icon-right > i { .p-input-icon-right > i:last-of-type {
right: 0.5rem; right: 0.5rem;
color: rgba(255, 255, 255, 0.6); color: rgba(255, 255, 255, 0.6);
} }

6
public/themes/arya-green/theme.css
View File

@ -769,13 +769,13 @@
padding: 0.625rem 0.625rem; padding: 0.625rem 0.625rem;
} }
.p-float-label label { .p-float-label > label {
left: 0.5rem; left: 0.5rem;
color: rgba(255, 255, 255, 0.6); color: rgba(255, 255, 255, 0.6);
transition-duration: 0.2s; transition-duration: 0.2s;
} }
.p-input-icon-left > i { .p-input-icon-left > i:first-of-type {
left: 0.5rem; left: 0.5rem;
color: rgba(255, 255, 255, 0.6); color: rgba(255, 255, 255, 0.6);
} }
@ -784,7 +784,7 @@
padding-left: 2rem; padding-left: 2rem;
} }
.p-input-icon-right > i { .p-input-icon-right > i:last-of-type {
right: 0.5rem; right: 0.5rem;
color: rgba(255, 255, 255, 0.6); color: rgba(255, 255, 255, 0.6);
} }

6
public/themes/arya-orange/theme.css
View File

@ -769,13 +769,13 @@
padding: 0.625rem 0.625rem; padding: 0.625rem 0.625rem;
} }
.p-float-label label { .p-float-label > label {
left: 0.5rem; left: 0.5rem;
color: rgba(255, 255, 255, 0.6); color: rgba(255, 255, 255, 0.6);
transition-duration: 0.2s; transition-duration: 0.2s;
} }
.p-input-icon-left > i { .p-input-icon-left > i:first-of-type {
left: 0.5rem; left: 0.5rem;
color: rgba(255, 255, 255, 0.6); color: rgba(255, 255, 255, 0.6);
} }
@ -784,7 +784,7 @@
padding-left: 2rem; padding-left: 2rem;
} }
.p-input-icon-right > i { .p-input-icon-right > i:last-of-type {
right: 0.5rem; right: 0.5rem;
color: rgba(255, 255, 255, 0.6); color: rgba(255, 255, 255, 0.6);
} }

6
public/themes/arya-purple/theme.css
View File

@ -769,13 +769,13 @@
padding: 0.625rem 0.625rem; padding: 0.625rem 0.625rem;
} }
.p-float-label label { .p-float-label > label {
left: 0.5rem; left: 0.5rem;
color: rgba(255, 255, 255, 0.6); color: rgba(255, 255, 255, 0.6);
transition-duration: 0.2s; transition-duration: 0.2s;
} }
.p-input-icon-left > i { .p-input-icon-left > i:first-of-type {
left: 0.5rem; left: 0.5rem;
color: rgba(255, 255, 255, 0.6); color: rgba(255, 255, 255, 0.6);
} }
@ -784,7 +784,7 @@
padding-left: 2rem; padding-left: 2rem;
} }
.p-input-icon-right > i { .p-input-icon-right > i:last-of-type {
right: 0.5rem; right: 0.5rem;
color: rgba(255, 255, 255, 0.6); color: rgba(255, 255, 255, 0.6);
} }

6
public/themes/bootstrap4-dark-blue/theme.css
View File

@ -769,13 +769,13 @@
padding: 0.625rem 0.9375rem; padding: 0.625rem 0.9375rem;
} }
.p-float-label label { .p-float-label > label {
left: 0.75rem; left: 0.75rem;
color: rgba(255, 255, 255, 0.6); color: rgba(255, 255, 255, 0.6);
transition-duration: 0.15s; transition-duration: 0.15s;
} }
.p-input-icon-left > i { .p-input-icon-left > i:first-of-type {
left: 0.75rem; left: 0.75rem;
color: rgba(255, 255, 255, 0.6); color: rgba(255, 255, 255, 0.6);
} }
@ -784,7 +784,7 @@
padding-left: 2.5rem; padding-left: 2.5rem;
} }
.p-input-icon-right > i { .p-input-icon-right > i:last-of-type {
right: 0.75rem; right: 0.75rem;
color: rgba(255, 255, 255, 0.6); color: rgba(255, 255, 255, 0.6);
} }

6
public/themes/bootstrap4-dark-purple/theme.css
View File

@ -769,13 +769,13 @@
padding: 0.625rem 0.9375rem; padding: 0.625rem 0.9375rem;
} }
.p-float-label label { .p-float-label > label {
left: 0.75rem; left: 0.75rem;
color: rgba(255, 255, 255, 0.6); color: rgba(255, 255, 255, 0.6);
transition-duration: 0.15s; transition-duration: 0.15s;
} }
.p-input-icon-left > i { .p-input-icon-left > i:first-of-type {
left: 0.75rem; left: 0.75rem;
color: rgba(255, 255, 255, 0.6); color: rgba(255, 255, 255, 0.6);
} }
@ -784,7 +784,7 @@
padding-left: 2.5rem; padding-left: 2.5rem;
} }
.p-input-icon-right > i { .p-input-icon-right > i:last-of-type {
right: 0.75rem; right: 0.75rem;
color: rgba(255, 255, 255, 0.6); color: rgba(255, 255, 255, 0.6);
} }

6
public/themes/bootstrap4-light-blue/theme.css
View File

@ -769,13 +769,13 @@
padding: 0.625rem 0.9375rem; padding: 0.625rem 0.9375rem;
} }
.p-float-label label { .p-float-label > label {
left: 0.75rem; left: 0.75rem;
color: #6c757d; color: #6c757d;
transition-duration: 0.15s; transition-duration: 0.15s;
} }
.p-input-icon-left > i { .p-input-icon-left > i:first-of-type {
left: 0.75rem; left: 0.75rem;
color: #495057; color: #495057;
} }
@ -784,7 +784,7 @@
padding-left: 2.5rem; padding-left: 2.5rem;
} }
.p-input-icon-right > i { .p-input-icon-right > i:last-of-type {
right: 0.75rem; right: 0.75rem;
color: #495057; color: #495057;
} }

6
public/themes/bootstrap4-light-purple/theme.css
View File

@ -769,13 +769,13 @@
padding: 0.625rem 0.9375rem; padding: 0.625rem 0.9375rem;
} }
.p-float-label label { .p-float-label > label {
left: 0.75rem; left: 0.75rem;
color: #6c757d; color: #6c757d;
transition-duration: 0.15s; transition-duration: 0.15s;
} }
.p-input-icon-left > i { .p-input-icon-left > i:first-of-type {
left: 0.75rem; left: 0.75rem;
color: #495057; color: #495057;
} }
@ -784,7 +784,7 @@
padding-left: 2.5rem; padding-left: 2.5rem;
} }
.p-input-icon-right > i { .p-input-icon-right > i:last-of-type {
right: 0.75rem; right: 0.75rem;
color: #495057; color: #495057;
} }

6
public/themes/luna-amber/theme.css
View File

@ -769,13 +769,13 @@
padding: 0.53625rem 0.53625rem; padding: 0.53625rem 0.53625rem;
} }
.p-float-label label { .p-float-label > label {
left: 0.429rem; left: 0.429rem;
color: #9b9b9b; color: #9b9b9b;
transition-duration: 0.2s; transition-duration: 0.2s;
} }
.p-input-icon-left > i { .p-input-icon-left > i:first-of-type {
left: 0.429rem; left: 0.429rem;
color: #888888; color: #888888;
} }
@ -784,7 +784,7 @@
padding-left: 1.858rem; padding-left: 1.858rem;
} }
.p-input-icon-right > i { .p-input-icon-right > i:last-of-type {
right: 0.429rem; right: 0.429rem;
color: #888888; color: #888888;
} }

6
public/themes/luna-blue/theme.css
View File

@ -769,13 +769,13 @@
padding: 0.53625rem 0.53625rem; padding: 0.53625rem 0.53625rem;
} }
.p-float-label label { .p-float-label > label {
left: 0.429rem; left: 0.429rem;
color: #9b9b9b; color: #9b9b9b;
transition-duration: 0.2s; transition-duration: 0.2s;
} }
.p-input-icon-left > i { .p-input-icon-left > i:first-of-type {
left: 0.429rem; left: 0.429rem;
color: #888888; color: #888888;
} }
@ -784,7 +784,7 @@
padding-left: 1.858rem; padding-left: 1.858rem;
} }
.p-input-icon-right > i { .p-input-icon-right > i:last-of-type {
right: 0.429rem; right: 0.429rem;
color: #888888; color: #888888;
} }

6
public/themes/luna-green/theme.css
View File

@ -769,13 +769,13 @@
padding: 0.53625rem 0.53625rem; padding: 0.53625rem 0.53625rem;
} }
.p-float-label label { .p-float-label > label {
left: 0.429rem; left: 0.429rem;
color: #9b9b9b; color: #9b9b9b;
transition-duration: 0.2s; transition-duration: 0.2s;
} }
.p-input-icon-left > i { .p-input-icon-left > i:first-of-type {
left: 0.429rem; left: 0.429rem;
color: #888888; color: #888888;
} }
@ -784,7 +784,7 @@
padding-left: 1.858rem; padding-left: 1.858rem;
} }
.p-input-icon-right > i { .p-input-icon-right > i:last-of-type {
right: 0.429rem; right: 0.429rem;
color: #888888; color: #888888;
} }

6
public/themes/luna-pink/theme.css
View File

@ -769,13 +769,13 @@
padding: 0.53625rem 0.53625rem; padding: 0.53625rem 0.53625rem;
} }
.p-float-label label { .p-float-label > label {
left: 0.429rem; left: 0.429rem;
color: #9b9b9b; color: #9b9b9b;
transition-duration: 0.2s; transition-duration: 0.2s;
} }
.p-input-icon-left > i { .p-input-icon-left > i:first-of-type {
left: 0.429rem; left: 0.429rem;
color: #888888; color: #888888;
} }
@ -784,7 +784,7 @@
padding-left: 1.858rem; padding-left: 1.858rem;
} }
.p-input-icon-right > i { .p-input-icon-right > i:last-of-type {
right: 0.429rem; right: 0.429rem;
color: #888888; color: #888888;
} }

6
public/themes/md-dark-deeppurple/theme.css
View File

@ -789,13 +789,13 @@
padding: 1.25rem 1.25rem; padding: 1.25rem 1.25rem;
} }
.p-float-label label { .p-float-label > label {
left: 1rem; left: 1rem;
color: rgba(255, 255, 255, 0.6); color: rgba(255, 255, 255, 0.6);
transition-duration: 0.2s; transition-duration: 0.2s;
} }
.p-input-icon-left > i { .p-input-icon-left > i:first-of-type {
left: 1rem; left: 1rem;
color: rgba(255, 255, 255, 0.6); color: rgba(255, 255, 255, 0.6);
} }
@ -804,7 +804,7 @@
padding-left: 3rem; padding-left: 3rem;
} }
.p-input-icon-right > i { .p-input-icon-right > i:last-of-type {
right: 1rem; right: 1rem;
color: rgba(255, 255, 255, 0.6); color: rgba(255, 255, 255, 0.6);
} }

6
public/themes/md-dark-indigo/theme.css
View File

@ -789,13 +789,13 @@
padding: 1.25rem 1.25rem; padding: 1.25rem 1.25rem;
} }
.p-float-label label { .p-float-label > label {
left: 1rem; left: 1rem;
color: rgba(255, 255, 255, 0.6); color: rgba(255, 255, 255, 0.6);
transition-duration: 0.2s; transition-duration: 0.2s;
} }
.p-input-icon-left > i { .p-input-icon-left > i:first-of-type {
left: 1rem; left: 1rem;
color: rgba(255, 255, 255, 0.6); color: rgba(255, 255, 255, 0.6);
} }
@ -804,7 +804,7 @@
padding-left: 3rem; padding-left: 3rem;
} }
.p-input-icon-right > i { .p-input-icon-right > i:last-of-type {
right: 1rem; right: 1rem;
color: rgba(255, 255, 255, 0.6); color: rgba(255, 255, 255, 0.6);
} }

6
public/themes/md-light-deeppurple/theme.css
View File

@ -789,13 +789,13 @@
padding: 1.25rem 1.25rem; padding: 1.25rem 1.25rem;
} }
.p-float-label label { .p-float-label > label {
left: 1rem; left: 1rem;
color: rgba(0, 0, 0, 0.6); color: rgba(0, 0, 0, 0.6);
transition-duration: 0.2s; transition-duration: 0.2s;
} }
.p-input-icon-left > i { .p-input-icon-left > i:first-of-type {
left: 1rem; left: 1rem;
color: rgba(0, 0, 0, 0.6); color: rgba(0, 0, 0, 0.6);
} }
@ -804,7 +804,7 @@
padding-left: 3rem; padding-left: 3rem;
} }
.p-input-icon-right > i { .p-input-icon-right > i:last-of-type {
right: 1rem; right: 1rem;
color: rgba(0, 0, 0, 0.6); color: rgba(0, 0, 0, 0.6);
} }

6
public/themes/md-light-indigo/theme.css
View File

@ -789,13 +789,13 @@
padding: 1.25rem 1.25rem; padding: 1.25rem 1.25rem;
} }
.p-float-label label { .p-float-label > label {
left: 1rem; left: 1rem;
color: rgba(0, 0, 0, 0.6); color: rgba(0, 0, 0, 0.6);
transition-duration: 0.2s; transition-duration: 0.2s;
} }
.p-input-icon-left > i { .p-input-icon-left > i:first-of-type {
left: 1rem; left: 1rem;
color: rgba(0, 0, 0, 0.6); color: rgba(0, 0, 0, 0.6);
} }
@ -804,7 +804,7 @@
padding-left: 3rem; padding-left: 3rem;
} }
.p-input-icon-right > i { .p-input-icon-right > i:last-of-type {
right: 1rem; right: 1rem;
color: rgba(0, 0, 0, 0.6); color: rgba(0, 0, 0, 0.6);
} }

6
public/themes/mdc-dark-deeppurple/theme.css
View File

@ -789,13 +789,13 @@
padding: 0.9375rem 0.9375rem; padding: 0.9375rem 0.9375rem;
} }
.p-float-label label { .p-float-label > label {
left: 0.75rem; left: 0.75rem;
color: rgba(255, 255, 255, 0.6); color: rgba(255, 255, 255, 0.6);
transition-duration: 0.2s; transition-duration: 0.2s;
} }
.p-input-icon-left > i { .p-input-icon-left > i:first-of-type {
left: 0.75rem; left: 0.75rem;
color: rgba(255, 255, 255, 0.6); color: rgba(255, 255, 255, 0.6);
} }
@ -804,7 +804,7 @@
padding-left: 2.5rem; padding-left: 2.5rem;
} }
.p-input-icon-right > i { .p-input-icon-right > i:last-of-type {
right: 0.75rem; right: 0.75rem;
color: rgba(255, 255, 255, 0.6); color: rgba(255, 255, 255, 0.6);
} }

6
public/themes/mdc-dark-indigo/theme.css
View File

@ -789,13 +789,13 @@
padding: 0.9375rem 0.9375rem; padding: 0.9375rem 0.9375rem;
} }
.p-float-label label { .p-float-label > label {
left: 0.75rem; left: 0.75rem;
color: rgba(255, 255, 255, 0.6); color: rgba(255, 255, 255, 0.6);
transition-duration: 0.2s; transition-duration: 0.2s;
} }
.p-input-icon-left > i { .p-input-icon-left > i:first-of-type {
left: 0.75rem; left: 0.75rem;
color: rgba(255, 255, 255, 0.6); color: rgba(255, 255, 255, 0.6);
} }
@ -804,7 +804,7 @@
padding-left: 2.5rem; padding-left: 2.5rem;
} }
.p-input-icon-right > i { .p-input-icon-right > i:last-of-type {
right: 0.75rem; right: 0.75rem;
color: rgba(255, 255, 255, 0.6); color: rgba(255, 255, 255, 0.6);
} }

6
public/themes/mdc-light-deeppurple/theme.css
View File

@ -789,13 +789,13 @@
padding: 0.9375rem 0.9375rem; padding: 0.9375rem 0.9375rem;
} }
.p-float-label label { .p-float-label > label {
left: 0.75rem; left: 0.75rem;
color: rgba(0, 0, 0, 0.6); color: rgba(0, 0, 0, 0.6);
transition-duration: 0.2s; transition-duration: 0.2s;
} }
.p-input-icon-left > i { .p-input-icon-left > i:first-of-type {
left: 0.75rem; left: 0.75rem;
color: rgba(0, 0, 0, 0.6); color: rgba(0, 0, 0, 0.6);
} }
@ -804,7 +804,7 @@
padding-left: 2.5rem; padding-left: 2.5rem;
} }
.p-input-icon-right > i { .p-input-icon-right > i:last-of-type {
right: 0.75rem; right: 0.75rem;
color: rgba(0, 0, 0, 0.6); color: rgba(0, 0, 0, 0.6);
} }

6
public/themes/mdc-light-indigo/theme.css
View File

@ -789,13 +789,13 @@
padding: 0.9375rem 0.9375rem; padding: 0.9375rem 0.9375rem;
} }
.p-float-label label { .p-float-label > label {
left: 0.75rem; left: 0.75rem;
color: rgba(0, 0, 0, 0.6); color: rgba(0, 0, 0, 0.6);
transition-duration: 0.2s; transition-duration: 0.2s;
} }
.p-input-icon-left > i { .p-input-icon-left > i:first-of-type {
left: 0.75rem; left: 0.75rem;
color: rgba(0, 0, 0, 0.6); color: rgba(0, 0, 0, 0.6);
} }
@ -804,7 +804,7 @@
padding-left: 2.5rem; padding-left: 2.5rem;
} }
.p-input-icon-right > i { .p-input-icon-right > i:last-of-type {
right: 0.75rem; right: 0.75rem;
color: rgba(0, 0, 0, 0.6); color: rgba(0, 0, 0, 0.6);
} }

6
public/themes/nova-accent/theme.css
View File

@ -765,13 +765,13 @@
padding: 0.53625rem 0.53625rem; padding: 0.53625rem 0.53625rem;
} }
.p-float-label label { .p-float-label > label {
left: 0.429rem; left: 0.429rem;
color: #666666; color: #666666;
transition-duration: 0.2s; transition-duration: 0.2s;
} }
.p-input-icon-left > i { .p-input-icon-left > i:first-of-type {
left: 0.429rem; left: 0.429rem;
color: #848484; color: #848484;
} }
@ -780,7 +780,7 @@
padding-left: 1.858rem; padding-left: 1.858rem;
} }
.p-input-icon-right > i { .p-input-icon-right > i:last-of-type {
right: 0.429rem; right: 0.429rem;
color: #848484; color: #848484;
} }

6
public/themes/nova-alt/theme.css
View File

@ -769,13 +769,13 @@
padding: 0.53625rem 0.53625rem; padding: 0.53625rem 0.53625rem;
} }
.p-float-label label { .p-float-label > label {
left: 0.429rem; left: 0.429rem;
color: #666666; color: #666666;
transition-duration: 0.2s; transition-duration: 0.2s;
} }
.p-input-icon-left > i { .p-input-icon-left > i:first-of-type {
left: 0.429rem; left: 0.429rem;
color: #848484; color: #848484;
} }
@ -784,7 +784,7 @@
padding-left: 1.858rem; padding-left: 1.858rem;
} }
.p-input-icon-right > i { .p-input-icon-right > i:last-of-type {
right: 0.429rem; right: 0.429rem;
color: #848484; color: #848484;
} }

6
public/themes/nova-vue/theme.css
View File

@ -769,13 +769,13 @@
padding: 0.53625rem 0.53625rem; padding: 0.53625rem 0.53625rem;
} }
.p-float-label label { .p-float-label > label {
left: 0.429rem; left: 0.429rem;
color: #666666; color: #666666;
transition-duration: 0.2s; transition-duration: 0.2s;
} }
.p-input-icon-left > i { .p-input-icon-left > i:first-of-type {
left: 0.429rem; left: 0.429rem;
color: #848484; color: #848484;
} }
@ -784,7 +784,7 @@
padding-left: 1.858rem; padding-left: 1.858rem;
} }
.p-input-icon-right > i { .p-input-icon-right > i:last-of-type {
right: 0.429rem; right: 0.429rem;
color: #848484; color: #848484;
} }

6
public/themes/nova/theme.css
View File

@ -769,13 +769,13 @@
padding: 0.53625rem 0.53625rem; padding: 0.53625rem 0.53625rem;
} }
.p-float-label label { .p-float-label > label {
left: 0.429rem; left: 0.429rem;
color: #666666; color: #666666;
transition-duration: 0.2s; transition-duration: 0.2s;
} }
.p-input-icon-left > i { .p-input-icon-left > i:first-of-type {
left: 0.429rem; left: 0.429rem;
color: #848484; color: #848484;
} }
@ -784,7 +784,7 @@
padding-left: 1.858rem; padding-left: 1.858rem;
} }
.p-input-icon-right > i { .p-input-icon-right > i:last-of-type {
right: 0.429rem; right: 0.429rem;
color: #848484; color: #848484;
} }

6
public/themes/rhea/theme.css
View File

@ -765,13 +765,13 @@
padding: 0.53625rem 0.53625rem; padding: 0.53625rem 0.53625rem;
} }
.p-float-label label { .p-float-label > label {
left: 0.429rem; left: 0.429rem;
color: #a6a6a6; color: #a6a6a6;
transition-duration: 0.2s; transition-duration: 0.2s;
} }
.p-input-icon-left > i { .p-input-icon-left > i:first-of-type {
left: 0.429rem; left: 0.429rem;
color: #a6a6a6; color: #a6a6a6;
} }
@ -780,7 +780,7 @@
padding-left: 1.858rem; padding-left: 1.858rem;
} }
.p-input-icon-right > i { .p-input-icon-right > i:last-of-type {
right: 0.429rem; right: 0.429rem;
color: #a6a6a6; color: #a6a6a6;
} }

6
public/themes/saga-blue/theme.css
View File

@ -769,13 +769,13 @@
padding: 0.625rem 0.625rem; padding: 0.625rem 0.625rem;
} }
.p-float-label label { .p-float-label > label {
left: 0.5rem; left: 0.5rem;
color: #6c757d; color: #6c757d;
transition-duration: 0.2s; transition-duration: 0.2s;
} }
.p-input-icon-left > i { .p-input-icon-left > i:first-of-type {
left: 0.5rem; left: 0.5rem;
color: #6c757d; color: #6c757d;
} }
@ -784,7 +784,7 @@
padding-left: 2rem; padding-left: 2rem;
} }
.p-input-icon-right > i { .p-input-icon-right > i:last-of-type {
right: 0.5rem; right: 0.5rem;
color: #6c757d; color: #6c757d;
} }

6
public/themes/saga-green/theme.css
View File

@ -769,13 +769,13 @@
padding: 0.625rem 0.625rem; padding: 0.625rem 0.625rem;
} }
.p-float-label label { .p-float-label > label {
left: 0.5rem; left: 0.5rem;
color: #6c757d; color: #6c757d;
transition-duration: 0.2s; transition-duration: 0.2s;
} }
.p-input-icon-left > i { .p-input-icon-left > i:first-of-type {
left: 0.5rem; left: 0.5rem;
color: #6c757d; color: #6c757d;
} }
@ -784,7 +784,7 @@
padding-left: 2rem; padding-left: 2rem;
} }
.p-input-icon-right > i { .p-input-icon-right > i:last-of-type {
right: 0.5rem; right: 0.5rem;
color: #6c757d; color: #6c757d;
} }

6
public/themes/saga-orange/theme.css
View File

@ -769,13 +769,13 @@
padding: 0.625rem 0.625rem; padding: 0.625rem 0.625rem;
} }
.p-float-label label { .p-float-label > label {
left: 0.5rem; left: 0.5rem;
color: #6c757d; color: #6c757d;
transition-duration: 0.2s; transition-duration: 0.2s;
} }
.p-input-icon-left > i { .p-input-icon-left > i:first-of-type {
left: 0.5rem; left: 0.5rem;
color: #6c757d; color: #6c757d;
} }
@ -784,7 +784,7 @@
padding-left: 2rem; padding-left: 2rem;
} }
.p-input-icon-right > i { .p-input-icon-right > i:last-of-type {
right: 0.5rem; right: 0.5rem;
color: #6c757d; color: #6c757d;
} }

6
public/themes/saga-purple/theme.css
View File

@ -769,13 +769,13 @@
padding: 0.625rem 0.625rem; padding: 0.625rem 0.625rem;
} }
.p-float-label label { .p-float-label > label {
left: 0.5rem; left: 0.5rem;
color: #6c757d; color: #6c757d;
transition-duration: 0.2s; transition-duration: 0.2s;
} }
.p-input-icon-left > i { .p-input-icon-left > i:first-of-type {
left: 0.5rem; left: 0.5rem;
color: #6c757d; color: #6c757d;
} }
@ -784,7 +784,7 @@
padding-left: 2rem; padding-left: 2rem;
} }
.p-input-icon-right > i { .p-input-icon-right > i:last-of-type {
right: 0.5rem; right: 0.5rem;
color: #6c757d; color: #6c757d;
} }

6
public/themes/vela-blue/theme.css
View File

@ -769,13 +769,13 @@
padding: 0.625rem 0.625rem; padding: 0.625rem 0.625rem;
} }
.p-float-label label { .p-float-label > label {
left: 0.5rem; left: 0.5rem;
color: rgba(255, 255, 255, 0.6); color: rgba(255, 255, 255, 0.6);
transition-duration: 0.2s; transition-duration: 0.2s;
} }
.p-input-icon-left > i { .p-input-icon-left > i:first-of-type {
left: 0.5rem; left: 0.5rem;
color: rgba(255, 255, 255, 0.6); color: rgba(255, 255, 255, 0.6);
} }
@ -784,7 +784,7 @@
padding-left: 2rem; padding-left: 2rem;
} }
.p-input-icon-right > i { .p-input-icon-right > i:last-of-type {
right: 0.5rem; right: 0.5rem;
color: rgba(255, 255, 255, 0.6); color: rgba(255, 255, 255, 0.6);
} }

6
public/themes/vela-green/theme.css
View File

@ -769,13 +769,13 @@
padding: 0.625rem 0.625rem; padding: 0.625rem 0.625rem;
} }
.p-float-label label { .p-float-label > label {
left: 0.5rem; left: 0.5rem;
color: rgba(255, 255, 255, 0.6); color: rgba(255, 255, 255, 0.6);
transition-duration: 0.2s; transition-duration: 0.2s;
} }
.p-input-icon-left > i { .p-input-icon-left > i:first-of-type {
left: 0.5rem; left: 0.5rem;
color: rgba(255, 255, 255, 0.6); color: rgba(255, 255, 255, 0.6);
} }
@ -784,7 +784,7 @@
padding-left: 2rem; padding-left: 2rem;
} }
.p-input-icon-right > i { .p-input-icon-right > i:last-of-type {
right: 0.5rem; right: 0.5rem;
color: rgba(255, 255, 255, 0.6); color: rgba(255, 255, 255, 0.6);
} }

6
public/themes/vela-orange/theme.css
View File

@ -769,13 +769,13 @@
padding: 0.625rem 0.625rem; padding: 0.625rem 0.625rem;
} }
.p-float-label label { .p-float-label > label {
left: 0.5rem; left: 0.5rem;
color: rgba(255, 255, 255, 0.6); color: rgba(255, 255, 255, 0.6);
transition-duration: 0.2s; transition-duration: 0.2s;
} }
.p-input-icon-left > i { .p-input-icon-left > i:first-of-type {
left: 0.5rem; left: 0.5rem;
color: rgba(255, 255, 255, 0.6); color: rgba(255, 255, 255, 0.6);
} }
@ -784,7 +784,7 @@
padding-left: 2rem; padding-left: 2rem;
} }
.p-input-icon-right > i { .p-input-icon-right > i:last-of-type {
right: 0.5rem; right: 0.5rem;
color: rgba(255, 255, 255, 0.6); color: rgba(255, 255, 255, 0.6);
} }

6
public/themes/vela-purple/theme.css
View File

@ -769,13 +769,13 @@
padding: 0.625rem 0.625rem; padding: 0.625rem 0.625rem;
} }
.p-float-label label { .p-float-label > label {
left: 0.5rem; left: 0.5rem;
color: rgba(255, 255, 255, 0.6); color: rgba(255, 255, 255, 0.6);
transition-duration: 0.2s; transition-duration: 0.2s;
} }
.p-input-icon-left > i { .p-input-icon-left > i:first-of-type {
left: 0.5rem; left: 0.5rem;
color: rgba(255, 255, 255, 0.6); color: rgba(255, 255, 255, 0.6);
} }
@ -784,7 +784,7 @@
padding-left: 2rem; padding-left: 2rem;
} }
.p-input-icon-right > i { .p-input-icon-right > i:last-of-type {
right: 0.5rem; right: 0.5rem;
color: rgba(255, 255, 255, 0.6); color: rgba(255, 255, 255, 0.6);
} }

12
src/views/inputtext/InputTextDoc.vue
View File

@ -23,8 +23,8 @@ import InputText from 'primevue/inputtext';
</CodeHighlight> </CodeHighlight>
<h5>Icons</h5> <h5>Icons</h5>
<p>An icon can be integrated within an input field by wrapping the input and the icon with an element having either <i>p-input-icon-right</i> <p>An icon can be integrated within an input field by wrapping the input and the icon with an element having <i>p-input-icon-right</i>
or <i>p-input-icon-left</i> class depending on the icon location.</p> and <i>p-input-icon-left</i> classes depending on the icon location.</p>
<CodeHighlight> <CodeHighlight>
&lt;span class="p-input-icon-left"&gt; &lt;span class="p-input-icon-left"&gt;
&lt;i class="pi pi-search" /&gt; &lt;i class="pi pi-search" /&gt;
@ -32,8 +32,14 @@ import InputText from 'primevue/inputtext';
&lt;/span&gt; &lt;/span&gt;
&lt;span class="p-input-icon-right"&gt; &lt;span class="p-input-icon-right"&gt;
&lt;i class="pi pi-spin pi-spinner" /&gt;
&lt;InputText type="text" v-model="value2" /&gt; &lt;InputText type="text" v-model="value2" /&gt;
&lt;i class="pi pi-spin pi-spinner" /&gt;
&lt;/span&gt;
&lt;span class="p-input-icon-left p-input-icon-right"&gt;
&lt;i class="pi pi-search" /&gt;
&lt;InputText type="text" v-model="value3" /&gt;
&lt;i class="pi pi-spin pi-spinner" /&gt;
&lt;/span&gt; &lt;/span&gt;
</CodeHighlight> </CodeHighlight>