vertumnus/primevue-mirror
1
0
Fork 0
mirror of https://github.com/primefaces/primevue.git synced 2025-05-09 17:02:38 +00:00
Code Issues Projects Releases Packages Wiki Activity

Update material theming and add invalid field demo

Browse source
This commit is contained in:
Cagatay Civici 2021-01-13 12:16:49 +03:00
parent 754131d09e
commit bf9ecec03b
38 changed files with 3333 additions and 1598 deletions
Download patch file Download diff file Expand all files Collapse all files

40
public/themes/nova-vue/theme.css
View file

@ -61,39 +61,39 @@
.p-autocomplete.p-autocomplete-dd .p-autocomplete-loader {
right: 2.786rem;
}
.p-autocomplete.p-autocomplete-multiple .p-autocomplete-multiple-container {
.p-autocomplete .p-autocomplete-multiple-container {
padding: 0.2145rem 0.429rem;
}
.p-autocomplete.p-autocomplete-multiple .p-autocomplete-multiple-container:not(.p-disabled):hover {
.p-autocomplete .p-autocomplete-multiple-container:not(.p-disabled):hover {
border-color: #212121;
}
.p-autocomplete.p-autocomplete-multiple .p-autocomplete-multiple-container:not(.p-disabled).p-focus {
.p-autocomplete .p-autocomplete-multiple-container:not(.p-disabled).p-focus {
outline: 0 none;
outline-offset: 0;
box-shadow: 0 0 0 0.2rem #c2e9d8;
border-color: #41b883;
}
.p-autocomplete.p-autocomplete-multiple .p-autocomplete-multiple-container .p-autocomplete-input-token {
.p-autocomplete .p-autocomplete-multiple-container .p-autocomplete-input-token {
padding: 0.2145rem 0;
}
.p-autocomplete.p-autocomplete-multiple .p-autocomplete-multiple-container .p-autocomplete-input-token input {
.p-autocomplete .p-autocomplete-multiple-container .p-autocomplete-input-token input {
font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";
font-size: 1rem;
color: #333333;
padding: 0;
margin: 0;
}
.p-autocomplete.p-autocomplete-multiple .p-autocomplete-multiple-container .p-autocomplete-token {
.p-autocomplete .p-autocomplete-multiple-container .p-autocomplete-token {
padding: 0.2145rem 0.429rem;
margin-right: 0.5rem;
background: #c8c8c8;
color: #333333;
border-radius: 16px;
}
.p-autocomplete.p-autocomplete-multiple .p-autocomplete-multiple-container .p-autocomplete-token .p-autocomplete-token-icon {
.p-autocomplete .p-autocomplete-multiple-container .p-autocomplete-token .p-autocomplete-token-icon {
margin-left: 0.5rem;
}
.p-autocomplete.p-error > .p-inputtext, .p-autocomplete.p-invalid > .p-inputtext {
.p-autocomplete.p-invalid.p-component > .p-inputtext {
border-color: #a80000;
}
@ -125,7 +125,7 @@
background: #41b883;
}
.p-calendar.p-error > .p-inputtext, .p-calendar.p-invalid > .p-inputtext {
.p-calendar.p-invalid.p-component > .p-inputtext {
border-color: #a80000;
}
@ -499,7 +499,7 @@
padding: 0;
margin: 0;
}
.p-chips.p-error > .p-inputtext, .p-chips.p-invalid > .p-inputtext {
.p-chips.p-invalid.p-component > .p-inputtext {
border-color: #a80000;
}
@ -561,7 +561,7 @@
color: #848484;
right: 2.357rem;
}
.p-dropdown.p-error, .p-dropdown.p-invalid {
.p-dropdown.p-invalid.p-component {
border-color: #a80000;
}
@ -665,16 +665,18 @@
border: 1px solid #c8c8c8;
box-shadow: 0 3px 6px 0 rgba(0, 0, 0, 0.16);
border-radius: 3px;
padding: 0;
}
.p-editor-container .p-editor-toolbar.ql-snow .ql-picker.ql-expanded .ql-picker-options .ql-picker-item {
color: #333333;
padding: 0.429rem 0.857rem;
border-radius: 3px;
}
.p-editor-container .p-editor-toolbar.ql-snow .ql-picker.ql-expanded .ql-picker-options .ql-picker-item:hover {
color: #333333;
background: #eaeaea;
}
.p-editor-container .p-editor-toolbar.ql-snow .ql-picker.ql-expanded:not(.ql-icon-picker) .ql-picker-item {
padding: 0.429rem 0.857rem;
}
.p-editor-container .p-editor-content {
border-bottom-right-radius: 3px;
border-bottom-left-radius: 3px;
@ -791,7 +793,7 @@
width: 2.357rem;
}
.p-inputnumber.p-error > .p-inputtext, .p-inputnumber.p-invalid > .p-inputtext {
.p-inputnumber.p-invalid.p-component > .p-inputtext {
border-color: #a80000;
}
@ -857,7 +859,7 @@
box-shadow: 0 0 0 0.2rem #c2e9d8;
border-color: #41b883;
}
.p-inputtext.p-error, .p-inputtext.p-invalid {
.p-inputtext.p-invalid.p-component {
border-color: #a80000;
}
.p-inputtext.p-inputtext-sm {
@ -884,6 +886,10 @@
padding-left: 1.858rem;
}
.p-input-icon-left.p-float-label > label {
left: 1.858rem;
}
.p-input-icon-right > i:last-of-type {
right: 0.429rem;
color: #848484;
@ -1023,7 +1029,7 @@
border-top-right-radius: 3px;
border-bottom-right-radius: 3px;
}
.p-multiselect.p-error, .p-multiselect.p-invalid {
.p-multiselect.p-invalid.p-component {
border-color: #a80000;
}
@ -4540,7 +4546,7 @@
border-radius: 3px;
}
.p-skeleton:after {
background: linear-gradient(90deg, transparent, rgba(255, 255, 255, 0.4), transparent);
background: linear-gradient(90deg, rgba(255, 255, 255, 0), rgba(255, 255, 255, 0.4), rgba(255, 255, 255, 0));
}
.p-tag {