Fixed #972 - Listbox Enhancements
Cagatay Civici
parent
3bec317cd6
commit
5205954063
|
|
@ -130,7 +130,8 @@
|
|||
"children": [
|
||||
{
|
||||
"name": "AutoComplete",
|
||||
"to": "/autocomplete"
|
||||
"to": "/autocomplete",
|
||||
"badge": "New"
|
||||
},
|
||||
{
|
||||
"name": "Calendar",
|
||||
|
|
@ -154,7 +155,8 @@
|
|||
},
|
||||
{
|
||||
"name": "Dropdown",
|
||||
"to": "/dropdown"
|
||||
"to": "/dropdown",
|
||||
"badge": "New"
|
||||
},
|
||||
{
|
||||
"name": "Editor",
|
||||
|
|
@ -194,11 +196,13 @@
|
|||
},
|
||||
{
|
||||
"name": "Listbox",
|
||||
"to": "/listbox"
|
||||
"to": "/listbox",
|
||||
"badge": "New"
|
||||
},
|
||||
{
|
||||
"name": "MultiSelect",
|
||||
"to": "/multiselect"
|
||||
"to": "/multiselect",
|
||||
"badge": "New"
|
||||
},
|
||||
{
|
||||
"name": "Password",
|
||||
|
|
|
|||
|
|
@ -124,6 +124,13 @@
|
|||
color: rgba(255, 255, 255, 0.87);
|
||||
background: rgba(100, 181, 246, 0.16);
|
||||
}
|
||||
.p-autocomplete-panel .p-autocomplete-items .p-autocomplete-item-group {
|
||||
margin: 0;
|
||||
padding: 0.75rem 1rem;
|
||||
color: rgba(255, 255, 255, 0.87);
|
||||
background: #1e1e1e;
|
||||
font-weight: 600;
|
||||
}
|
||||
|
||||
.p-calendar.p-invalid.p-component > .p-inputtext {
|
||||
border-color: #ef9a9a;
|
||||
|
|
@ -604,6 +611,13 @@
|
|||
color: rgba(255, 255, 255, 0.87);
|
||||
background: rgba(255, 255, 255, 0.03);
|
||||
}
|
||||
.p-dropdown-panel .p-dropdown-items .p-dropdown-item-group {
|
||||
margin: 0;
|
||||
padding: 0.75rem 1rem;
|
||||
color: rgba(255, 255, 255, 0.87);
|
||||
background: #1e1e1e;
|
||||
font-weight: 600;
|
||||
}
|
||||
.p-dropdown-panel .p-dropdown-items .p-dropdown-empty-message {
|
||||
padding: 0.5rem 1rem;
|
||||
color: rgba(255, 255, 255, 0.87);
|
||||
|
|
@ -973,6 +987,13 @@
|
|||
outline-offset: 0;
|
||||
box-shadow: inset 0 0 0 1px #93cbf9;
|
||||
}
|
||||
.p-listbox .p-listbox-list .p-listbox-item-group {
|
||||
margin: 0;
|
||||
padding: 0.75rem 1rem;
|
||||
color: rgba(255, 255, 255, 0.87);
|
||||
background: #1e1e1e;
|
||||
font-weight: 600;
|
||||
}
|
||||
.p-listbox .p-listbox-list .p-listbox-empty-message {
|
||||
padding: 0.5rem 1rem;
|
||||
color: rgba(255, 255, 255, 0.87);
|
||||
|
|
@ -1107,6 +1128,13 @@
|
|||
.p-multiselect-panel .p-multiselect-items .p-multiselect-item .p-checkbox {
|
||||
margin-right: 0.5rem;
|
||||
}
|
||||
.p-multiselect-panel .p-multiselect-items .p-multiselect-item-group {
|
||||
margin: 0;
|
||||
padding: 0.75rem 1rem;
|
||||
color: rgba(255, 255, 255, 0.87);
|
||||
background: #1e1e1e;
|
||||
font-weight: 600;
|
||||
}
|
||||
.p-multiselect-panel .p-multiselect-items .p-multiselect-empty-message {
|
||||
padding: 0.5rem 1rem;
|
||||
color: rgba(255, 255, 255, 0.87);
|
||||
|
|
|
|||
|
|
@ -124,6 +124,13 @@
|
|||
color: rgba(255, 255, 255, 0.87);
|
||||
background: rgba(129, 199, 132, 0.16);
|
||||
}
|
||||
.p-autocomplete-panel .p-autocomplete-items .p-autocomplete-item-group {
|
||||
margin: 0;
|
||||
padding: 0.75rem 1rem;
|
||||
color: rgba(255, 255, 255, 0.87);
|
||||
background: #1e1e1e;
|
||||
font-weight: 600;
|
||||
}
|
||||
|
||||
.p-calendar.p-invalid.p-component > .p-inputtext {
|
||||
border-color: #ef9a9a;
|
||||
|
|
@ -604,6 +611,13 @@
|
|||
color: rgba(255, 255, 255, 0.87);
|
||||
background: rgba(255, 255, 255, 0.03);
|
||||
}
|
||||
.p-dropdown-panel .p-dropdown-items .p-dropdown-item-group {
|
||||
margin: 0;
|
||||
padding: 0.75rem 1rem;
|
||||
color: rgba(255, 255, 255, 0.87);
|
||||
background: #1e1e1e;
|
||||
font-weight: 600;
|
||||
}
|
||||
.p-dropdown-panel .p-dropdown-items .p-dropdown-empty-message {
|
||||
padding: 0.5rem 1rem;
|
||||
color: rgba(255, 255, 255, 0.87);
|
||||
|
|
@ -973,6 +987,13 @@
|
|||
outline-offset: 0;
|
||||
box-shadow: inset 0 0 0 1px #a7d8a9;
|
||||
}
|
||||
.p-listbox .p-listbox-list .p-listbox-item-group {
|
||||
margin: 0;
|
||||
padding: 0.75rem 1rem;
|
||||
color: rgba(255, 255, 255, 0.87);
|
||||
background: #1e1e1e;
|
||||
font-weight: 600;
|
||||
}
|
||||
.p-listbox .p-listbox-list .p-listbox-empty-message {
|
||||
padding: 0.5rem 1rem;
|
||||
color: rgba(255, 255, 255, 0.87);
|
||||
|
|
@ -1107,6 +1128,13 @@
|
|||
.p-multiselect-panel .p-multiselect-items .p-multiselect-item .p-checkbox {
|
||||
margin-right: 0.5rem;
|
||||
}
|
||||
.p-multiselect-panel .p-multiselect-items .p-multiselect-item-group {
|
||||
margin: 0;
|
||||
padding: 0.75rem 1rem;
|
||||
color: rgba(255, 255, 255, 0.87);
|
||||
background: #1e1e1e;
|
||||
font-weight: 600;
|
||||
}
|
||||
.p-multiselect-panel .p-multiselect-items .p-multiselect-empty-message {
|
||||
padding: 0.5rem 1rem;
|
||||
color: rgba(255, 255, 255, 0.87);
|
||||
|
|
|
|||
|
|
@ -124,6 +124,13 @@
|
|||
color: rgba(255, 255, 255, 0.87);
|
||||
background: rgba(255, 213, 79, 0.16);
|
||||
}
|
||||
.p-autocomplete-panel .p-autocomplete-items .p-autocomplete-item-group {
|
||||
margin: 0;
|
||||
padding: 0.75rem 1rem;
|
||||
color: rgba(255, 255, 255, 0.87);
|
||||
background: #1e1e1e;
|
||||
font-weight: 600;
|
||||
}
|
||||
|
||||
.p-calendar.p-invalid.p-component > .p-inputtext {
|
||||
border-color: #ef9a9a;
|
||||
|
|
@ -604,6 +611,13 @@
|
|||
color: rgba(255, 255, 255, 0.87);
|
||||
background: rgba(255, 255, 255, 0.03);
|
||||
}
|
||||
.p-dropdown-panel .p-dropdown-items .p-dropdown-item-group {
|
||||
margin: 0;
|
||||
padding: 0.75rem 1rem;
|
||||
color: rgba(255, 255, 255, 0.87);
|
||||
background: #1e1e1e;
|
||||
font-weight: 600;
|
||||
}
|
||||
.p-dropdown-panel .p-dropdown-items .p-dropdown-empty-message {
|
||||
padding: 0.5rem 1rem;
|
||||
color: rgba(255, 255, 255, 0.87);
|
||||
|
|
@ -973,6 +987,13 @@
|
|||
outline-offset: 0;
|
||||
box-shadow: inset 0 0 0 1px #ffe284;
|
||||
}
|
||||
.p-listbox .p-listbox-list .p-listbox-item-group {
|
||||
margin: 0;
|
||||
padding: 0.75rem 1rem;
|
||||
color: rgba(255, 255, 255, 0.87);
|
||||
background: #1e1e1e;
|
||||
font-weight: 600;
|
||||
}
|
||||
.p-listbox .p-listbox-list .p-listbox-empty-message {
|
||||
padding: 0.5rem 1rem;
|
||||
color: rgba(255, 255, 255, 0.87);
|
||||
|
|
@ -1107,6 +1128,13 @@
|
|||
.p-multiselect-panel .p-multiselect-items .p-multiselect-item .p-checkbox {
|
||||
margin-right: 0.5rem;
|
||||
}
|
||||
.p-multiselect-panel .p-multiselect-items .p-multiselect-item-group {
|
||||
margin: 0;
|
||||
padding: 0.75rem 1rem;
|
||||
color: rgba(255, 255, 255, 0.87);
|
||||
background: #1e1e1e;
|
||||
font-weight: 600;
|
||||
}
|
||||
.p-multiselect-panel .p-multiselect-items .p-multiselect-empty-message {
|
||||
padding: 0.5rem 1rem;
|
||||
color: rgba(255, 255, 255, 0.87);
|
||||
|
|
|
|||
|
|
@ -124,6 +124,13 @@
|
|||
color: rgba(255, 255, 255, 0.87);
|
||||
background: rgba(186, 104, 200, 0.16);
|
||||
}
|
||||
.p-autocomplete-panel .p-autocomplete-items .p-autocomplete-item-group {
|
||||
margin: 0;
|
||||
padding: 0.75rem 1rem;
|
||||
color: rgba(255, 255, 255, 0.87);
|
||||
background: #1e1e1e;
|
||||
font-weight: 600;
|
||||
}
|
||||
|
||||
.p-calendar.p-invalid.p-component > .p-inputtext {
|
||||
border-color: #ef9a9a;
|
||||
|
|
@ -604,6 +611,13 @@
|
|||
color: rgba(255, 255, 255, 0.87);
|
||||
background: rgba(255, 255, 255, 0.03);
|
||||
}
|
||||
.p-dropdown-panel .p-dropdown-items .p-dropdown-item-group {
|
||||
margin: 0;
|
||||
padding: 0.75rem 1rem;
|
||||
color: rgba(255, 255, 255, 0.87);
|
||||
background: #1e1e1e;
|
||||
font-weight: 600;
|
||||
}
|
||||
.p-dropdown-panel .p-dropdown-items .p-dropdown-empty-message {
|
||||
padding: 0.5rem 1rem;
|
||||
color: rgba(255, 255, 255, 0.87);
|
||||
|
|
@ -973,6 +987,13 @@
|
|||
outline-offset: 0;
|
||||
box-shadow: inset 0 0 0 1px #cf95d9;
|
||||
}
|
||||
.p-listbox .p-listbox-list .p-listbox-item-group {
|
||||
margin: 0;
|
||||
padding: 0.75rem 1rem;
|
||||
color: rgba(255, 255, 255, 0.87);
|
||||
background: #1e1e1e;
|
||||
font-weight: 600;
|
||||
}
|
||||
.p-listbox .p-listbox-list .p-listbox-empty-message {
|
||||
padding: 0.5rem 1rem;
|
||||
color: rgba(255, 255, 255, 0.87);
|
||||
|
|
@ -1107,6 +1128,13 @@
|
|||
.p-multiselect-panel .p-multiselect-items .p-multiselect-item .p-checkbox {
|
||||
margin-right: 0.5rem;
|
||||
}
|
||||
.p-multiselect-panel .p-multiselect-items .p-multiselect-item-group {
|
||||
margin: 0;
|
||||
padding: 0.75rem 1rem;
|
||||
color: rgba(255, 255, 255, 0.87);
|
||||
background: #1e1e1e;
|
||||
font-weight: 600;
|
||||
}
|
||||
.p-multiselect-panel .p-multiselect-items .p-multiselect-empty-message {
|
||||
padding: 0.5rem 1rem;
|
||||
color: rgba(255, 255, 255, 0.87);
|
||||
|
|
|
|||
|
|
@ -124,6 +124,13 @@
|
|||
color: #151515;
|
||||
background: #8dd0ff;
|
||||
}
|
||||
.p-autocomplete-panel .p-autocomplete-items .p-autocomplete-item-group {
|
||||
margin: 0;
|
||||
padding: 0.75rem 1rem;
|
||||
color: rgba(255, 255, 255, 0.87);
|
||||
background: #2a323d;
|
||||
font-weight: 600;
|
||||
}
|
||||
|
||||
.p-calendar.p-invalid.p-component > .p-inputtext {
|
||||
border-color: #f19ea6;
|
||||
|
|
@ -608,6 +615,13 @@
|
|||
color: rgba(255, 255, 255, 0.87);
|
||||
background: rgba(255, 255, 255, 0.04);
|
||||
}
|
||||
.p-dropdown-panel .p-dropdown-items .p-dropdown-item-group {
|
||||
margin: 0;
|
||||
padding: 0.75rem 1rem;
|
||||
color: rgba(255, 255, 255, 0.87);
|
||||
background: #2a323d;
|
||||
font-weight: 600;
|
||||
}
|
||||
.p-dropdown-panel .p-dropdown-items .p-dropdown-empty-message {
|
||||
padding: 0.5rem 1.5rem;
|
||||
color: rgba(255, 255, 255, 0.87);
|
||||
|
|
@ -977,6 +991,13 @@
|
|||
outline-offset: 0;
|
||||
box-shadow: inset 0 0 0 0.15rem #e3f3fe;
|
||||
}
|
||||
.p-listbox .p-listbox-list .p-listbox-item-group {
|
||||
margin: 0;
|
||||
padding: 0.75rem 1rem;
|
||||
color: rgba(255, 255, 255, 0.87);
|
||||
background: #2a323d;
|
||||
font-weight: 600;
|
||||
}
|
||||
.p-listbox .p-listbox-list .p-listbox-empty-message {
|
||||
padding: 0.5rem 1.5rem;
|
||||
color: rgba(255, 255, 255, 0.87);
|
||||
|
|
@ -1111,6 +1132,13 @@
|
|||
.p-multiselect-panel .p-multiselect-items .p-multiselect-item .p-checkbox {
|
||||
margin-right: 0.5rem;
|
||||
}
|
||||
.p-multiselect-panel .p-multiselect-items .p-multiselect-item-group {
|
||||
margin: 0;
|
||||
padding: 0.75rem 1rem;
|
||||
color: rgba(255, 255, 255, 0.87);
|
||||
background: #2a323d;
|
||||
font-weight: 600;
|
||||
}
|
||||
.p-multiselect-panel .p-multiselect-items .p-multiselect-empty-message {
|
||||
padding: 0.5rem 1.5rem;
|
||||
color: rgba(255, 255, 255, 0.87);
|
||||
|
|
|
|||
|
|
@ -124,6 +124,13 @@
|
|||
color: #151515;
|
||||
background: #c298d8;
|
||||
}
|
||||
.p-autocomplete-panel .p-autocomplete-items .p-autocomplete-item-group {
|
||||
margin: 0;
|
||||
padding: 0.75rem 1rem;
|
||||
color: rgba(255, 255, 255, 0.87);
|
||||
background: #2a323d;
|
||||
font-weight: 600;
|
||||
}
|
||||
|
||||
.p-calendar.p-invalid.p-component > .p-inputtext {
|
||||
border-color: #f19ea6;
|
||||
|
|
@ -608,6 +615,13 @@
|
|||
color: rgba(255, 255, 255, 0.87);
|
||||
background: rgba(255, 255, 255, 0.04);
|
||||
}
|
||||
.p-dropdown-panel .p-dropdown-items .p-dropdown-item-group {
|
||||
margin: 0;
|
||||
padding: 0.75rem 1rem;
|
||||
color: rgba(255, 255, 255, 0.87);
|
||||
background: #2a323d;
|
||||
font-weight: 600;
|
||||
}
|
||||
.p-dropdown-panel .p-dropdown-items .p-dropdown-empty-message {
|
||||
padding: 0.5rem 1.5rem;
|
||||
color: rgba(255, 255, 255, 0.87);
|
||||
|
|
@ -977,6 +991,13 @@
|
|||
outline-offset: 0;
|
||||
box-shadow: inset 0 0 0 0.15rem #f0e6f5;
|
||||
}
|
||||
.p-listbox .p-listbox-list .p-listbox-item-group {
|
||||
margin: 0;
|
||||
padding: 0.75rem 1rem;
|
||||
color: rgba(255, 255, 255, 0.87);
|
||||
background: #2a323d;
|
||||
font-weight: 600;
|
||||
}
|
||||
.p-listbox .p-listbox-list .p-listbox-empty-message {
|
||||
padding: 0.5rem 1.5rem;
|
||||
color: rgba(255, 255, 255, 0.87);
|
||||
|
|
@ -1111,6 +1132,13 @@
|
|||
.p-multiselect-panel .p-multiselect-items .p-multiselect-item .p-checkbox {
|
||||
margin-right: 0.5rem;
|
||||
}
|
||||
.p-multiselect-panel .p-multiselect-items .p-multiselect-item-group {
|
||||
margin: 0;
|
||||
padding: 0.75rem 1rem;
|
||||
color: rgba(255, 255, 255, 0.87);
|
||||
background: #2a323d;
|
||||
font-weight: 600;
|
||||
}
|
||||
.p-multiselect-panel .p-multiselect-items .p-multiselect-empty-message {
|
||||
padding: 0.5rem 1.5rem;
|
||||
color: rgba(255, 255, 255, 0.87);
|
||||
|
|
|
|||
|
|
@ -124,6 +124,13 @@
|
|||
color: #ffffff;
|
||||
background: #007bff;
|
||||
}
|
||||
.p-autocomplete-panel .p-autocomplete-items .p-autocomplete-item-group {
|
||||
margin: 0;
|
||||
padding: 0.75rem 1rem;
|
||||
color: #212529;
|
||||
background: #ffffff;
|
||||
font-weight: 600;
|
||||
}
|
||||
|
||||
.p-calendar.p-invalid.p-component > .p-inputtext {
|
||||
border-color: #dc3545;
|
||||
|
|
@ -608,6 +615,13 @@
|
|||
color: #212529;
|
||||
background: #e9ecef;
|
||||
}
|
||||
.p-dropdown-panel .p-dropdown-items .p-dropdown-item-group {
|
||||
margin: 0;
|
||||
padding: 0.75rem 1rem;
|
||||
color: #212529;
|
||||
background: #ffffff;
|
||||
font-weight: 600;
|
||||
}
|
||||
.p-dropdown-panel .p-dropdown-items .p-dropdown-empty-message {
|
||||
padding: 0.5rem 1.5rem;
|
||||
color: #212529;
|
||||
|
|
@ -977,6 +991,13 @@
|
|||
outline-offset: 0;
|
||||
box-shadow: inset 0 0 0 0.15rem rgba(38, 143, 255, 0.5);
|
||||
}
|
||||
.p-listbox .p-listbox-list .p-listbox-item-group {
|
||||
margin: 0;
|
||||
padding: 0.75rem 1rem;
|
||||
color: #212529;
|
||||
background: #ffffff;
|
||||
font-weight: 600;
|
||||
}
|
||||
.p-listbox .p-listbox-list .p-listbox-empty-message {
|
||||
padding: 0.5rem 1.5rem;
|
||||
color: #212529;
|
||||
|
|
@ -1111,6 +1132,13 @@
|
|||
.p-multiselect-panel .p-multiselect-items .p-multiselect-item .p-checkbox {
|
||||
margin-right: 0.5rem;
|
||||
}
|
||||
.p-multiselect-panel .p-multiselect-items .p-multiselect-item-group {
|
||||
margin: 0;
|
||||
padding: 0.75rem 1rem;
|
||||
color: #212529;
|
||||
background: #ffffff;
|
||||
font-weight: 600;
|
||||
}
|
||||
.p-multiselect-panel .p-multiselect-items .p-multiselect-empty-message {
|
||||
padding: 0.5rem 1.5rem;
|
||||
color: #212529;
|
||||
|
|
|
|||
|
|
@ -124,6 +124,13 @@
|
|||
color: #ffffff;
|
||||
background: #883cae;
|
||||
}
|
||||
.p-autocomplete-panel .p-autocomplete-items .p-autocomplete-item-group {
|
||||
margin: 0;
|
||||
padding: 0.75rem 1rem;
|
||||
color: #212529;
|
||||
background: #ffffff;
|
||||
font-weight: 600;
|
||||
}
|
||||
|
||||
.p-calendar.p-invalid.p-component > .p-inputtext {
|
||||
border-color: #dc3545;
|
||||
|
|
@ -608,6 +615,13 @@
|
|||
color: #212529;
|
||||
background: #e9ecef;
|
||||
}
|
||||
.p-dropdown-panel .p-dropdown-items .p-dropdown-item-group {
|
||||
margin: 0;
|
||||
padding: 0.75rem 1rem;
|
||||
color: #212529;
|
||||
background: #ffffff;
|
||||
font-weight: 600;
|
||||
}
|
||||
.p-dropdown-panel .p-dropdown-items .p-dropdown-empty-message {
|
||||
padding: 0.5rem 1.5rem;
|
||||
color: #212529;
|
||||
|
|
@ -977,6 +991,13 @@
|
|||
outline-offset: 0;
|
||||
box-shadow: inset 0 0 0 0.15rem rgba(136, 60, 174, 0.5);
|
||||
}
|
||||
.p-listbox .p-listbox-list .p-listbox-item-group {
|
||||
margin: 0;
|
||||
padding: 0.75rem 1rem;
|
||||
color: #212529;
|
||||
background: #ffffff;
|
||||
font-weight: 600;
|
||||
}
|
||||
.p-listbox .p-listbox-list .p-listbox-empty-message {
|
||||
padding: 0.5rem 1.5rem;
|
||||
color: #212529;
|
||||
|
|
@ -1111,6 +1132,13 @@
|
|||
.p-multiselect-panel .p-multiselect-items .p-multiselect-item .p-checkbox {
|
||||
margin-right: 0.5rem;
|
||||
}
|
||||
.p-multiselect-panel .p-multiselect-items .p-multiselect-item-group {
|
||||
margin: 0;
|
||||
padding: 0.75rem 1rem;
|
||||
color: #212529;
|
||||
background: #ffffff;
|
||||
font-weight: 600;
|
||||
}
|
||||
.p-multiselect-panel .p-multiselect-items .p-multiselect-empty-message {
|
||||
padding: 0.5rem 1.5rem;
|
||||
color: #212529;
|
||||
|
|
|
|||
|
|
@ -124,6 +124,13 @@
|
|||
color: #323130;
|
||||
background: #edebe9;
|
||||
}
|
||||
.p-autocomplete-panel .p-autocomplete-items .p-autocomplete-item-group {
|
||||
margin: 0;
|
||||
padding: 0.75rem 0.5rem;
|
||||
color: #0078d4;
|
||||
background: #ffffff;
|
||||
font-weight: 600;
|
||||
}
|
||||
|
||||
.p-calendar.p-invalid.p-component > .p-inputtext {
|
||||
border-color: #a4252c;
|
||||
|
|
@ -604,6 +611,13 @@
|
|||
color: #323130;
|
||||
background: #f3f2f1;
|
||||
}
|
||||
.p-dropdown-panel .p-dropdown-items .p-dropdown-item-group {
|
||||
margin: 0;
|
||||
padding: 0.75rem 0.5rem;
|
||||
color: #0078d4;
|
||||
background: #ffffff;
|
||||
font-weight: 600;
|
||||
}
|
||||
.p-dropdown-panel .p-dropdown-items .p-dropdown-empty-message {
|
||||
padding: 0.75rem 0.5rem;
|
||||
color: #323130;
|
||||
|
|
@ -973,6 +987,13 @@
|
|||
outline-offset: 0;
|
||||
box-shadow: inset 0 0 0 1px #605e5c;
|
||||
}
|
||||
.p-listbox .p-listbox-list .p-listbox-item-group {
|
||||
margin: 0;
|
||||
padding: 0.75rem 0.5rem;
|
||||
color: #0078d4;
|
||||
background: #ffffff;
|
||||
font-weight: 600;
|
||||
}
|
||||
.p-listbox .p-listbox-list .p-listbox-empty-message {
|
||||
padding: 0.75rem 0.5rem;
|
||||
color: #323130;
|
||||
|
|
@ -1107,6 +1128,13 @@
|
|||
.p-multiselect-panel .p-multiselect-items .p-multiselect-item .p-checkbox {
|
||||
margin-right: 0.5rem;
|
||||
}
|
||||
.p-multiselect-panel .p-multiselect-items .p-multiselect-item-group {
|
||||
margin: 0;
|
||||
padding: 0.75rem 0.5rem;
|
||||
color: #0078d4;
|
||||
background: #ffffff;
|
||||
font-weight: 600;
|
||||
}
|
||||
.p-multiselect-panel .p-multiselect-items .p-multiselect-empty-message {
|
||||
padding: 0.75rem 0.5rem;
|
||||
color: #323130;
|
||||
|
|
|
|||
|
|
@ -124,6 +124,13 @@
|
|||
color: #212529;
|
||||
background: #FFE082;
|
||||
}
|
||||
.p-autocomplete-panel .p-autocomplete-items .p-autocomplete-item-group {
|
||||
margin: 0;
|
||||
padding: 0.857rem;
|
||||
color: #dedede;
|
||||
background: #191919;
|
||||
font-weight: 700;
|
||||
}
|
||||
|
||||
.p-calendar.p-invalid.p-component > .p-inputtext {
|
||||
border-color: #e57373;
|
||||
|
|
@ -608,6 +615,13 @@
|
|||
color: #dedede;
|
||||
background: #4c4c4c;
|
||||
}
|
||||
.p-dropdown-panel .p-dropdown-items .p-dropdown-item-group {
|
||||
margin: 0;
|
||||
padding: 0.857rem;
|
||||
color: #dedede;
|
||||
background: #191919;
|
||||
font-weight: 700;
|
||||
}
|
||||
.p-dropdown-panel .p-dropdown-items .p-dropdown-empty-message {
|
||||
padding: 0.429rem 0.857rem;
|
||||
color: #dedede;
|
||||
|
|
@ -977,6 +991,13 @@
|
|||
outline-offset: 0;
|
||||
box-shadow: inset 0 0 0 0.2rem white;
|
||||
}
|
||||
.p-listbox .p-listbox-list .p-listbox-item-group {
|
||||
margin: 0;
|
||||
padding: 0.857rem;
|
||||
color: #dedede;
|
||||
background: #191919;
|
||||
font-weight: 700;
|
||||
}
|
||||
.p-listbox .p-listbox-list .p-listbox-empty-message {
|
||||
padding: 0.429rem 0.857rem;
|
||||
color: #dedede;
|
||||
|
|
@ -1111,6 +1132,13 @@
|
|||
.p-multiselect-panel .p-multiselect-items .p-multiselect-item .p-checkbox {
|
||||
margin-right: 0.5rem;
|
||||
}
|
||||
.p-multiselect-panel .p-multiselect-items .p-multiselect-item-group {
|
||||
margin: 0;
|
||||
padding: 0.857rem;
|
||||
color: #dedede;
|
||||
background: #191919;
|
||||
font-weight: 700;
|
||||
}
|
||||
.p-multiselect-panel .p-multiselect-items .p-multiselect-empty-message {
|
||||
padding: 0.429rem 0.857rem;
|
||||
color: #dedede;
|
||||
|
|
|
|||
|
|
@ -124,6 +124,13 @@
|
|||
color: #212529;
|
||||
background: #81D4FA;
|
||||
}
|
||||
.p-autocomplete-panel .p-autocomplete-items .p-autocomplete-item-group {
|
||||
margin: 0;
|
||||
padding: 0.857rem;
|
||||
color: #dedede;
|
||||
background: #191919;
|
||||
font-weight: 700;
|
||||
}
|
||||
|
||||
.p-calendar.p-invalid.p-component > .p-inputtext {
|
||||
border-color: #e57373;
|
||||
|
|
@ -608,6 +615,13 @@
|
|||
color: #dedede;
|
||||
background: #4c4c4c;
|
||||
}
|
||||
.p-dropdown-panel .p-dropdown-items .p-dropdown-item-group {
|
||||
margin: 0;
|
||||
padding: 0.857rem;
|
||||
color: #dedede;
|
||||
background: #191919;
|
||||
font-weight: 700;
|
||||
}
|
||||
.p-dropdown-panel .p-dropdown-items .p-dropdown-empty-message {
|
||||
padding: 0.429rem 0.857rem;
|
||||
color: #dedede;
|
||||
|
|
@ -977,6 +991,13 @@
|
|||
outline-offset: 0;
|
||||
box-shadow: inset 0 0 0 0.2rem white;
|
||||
}
|
||||
.p-listbox .p-listbox-list .p-listbox-item-group {
|
||||
margin: 0;
|
||||
padding: 0.857rem;
|
||||
color: #dedede;
|
||||
background: #191919;
|
||||
font-weight: 700;
|
||||
}
|
||||
.p-listbox .p-listbox-list .p-listbox-empty-message {
|
||||
padding: 0.429rem 0.857rem;
|
||||
color: #dedede;
|
||||
|
|
@ -1111,6 +1132,13 @@
|
|||
.p-multiselect-panel .p-multiselect-items .p-multiselect-item .p-checkbox {
|
||||
margin-right: 0.5rem;
|
||||
}
|
||||
.p-multiselect-panel .p-multiselect-items .p-multiselect-item-group {
|
||||
margin: 0;
|
||||
padding: 0.857rem;
|
||||
color: #dedede;
|
||||
background: #191919;
|
||||
font-weight: 700;
|
||||
}
|
||||
.p-multiselect-panel .p-multiselect-items .p-multiselect-empty-message {
|
||||
padding: 0.429rem 0.857rem;
|
||||
color: #dedede;
|
||||
|
|
|
|||
|
|
@ -124,6 +124,13 @@
|
|||
color: #212529;
|
||||
background: #C5E1A5;
|
||||
}
|
||||
.p-autocomplete-panel .p-autocomplete-items .p-autocomplete-item-group {
|
||||
margin: 0;
|
||||
padding: 0.857rem;
|
||||
color: #dedede;
|
||||
background: #191919;
|
||||
font-weight: 700;
|
||||
}
|
||||
|
||||
.p-calendar.p-invalid.p-component > .p-inputtext {
|
||||
border-color: #e57373;
|
||||
|
|
@ -608,6 +615,13 @@
|
|||
color: #dedede;
|
||||
background: #4c4c4c;
|
||||
}
|
||||
.p-dropdown-panel .p-dropdown-items .p-dropdown-item-group {
|
||||
margin: 0;
|
||||
padding: 0.857rem;
|
||||
color: #dedede;
|
||||
background: #191919;
|
||||
font-weight: 700;
|
||||
}
|
||||
.p-dropdown-panel .p-dropdown-items .p-dropdown-empty-message {
|
||||
padding: 0.429rem 0.857rem;
|
||||
color: #dedede;
|
||||
|
|
@ -977,6 +991,13 @@
|
|||
outline-offset: 0;
|
||||
box-shadow: inset 0 0 0 0.2rem white;
|
||||
}
|
||||
.p-listbox .p-listbox-list .p-listbox-item-group {
|
||||
margin: 0;
|
||||
padding: 0.857rem;
|
||||
color: #dedede;
|
||||
background: #191919;
|
||||
font-weight: 700;
|
||||
}
|
||||
.p-listbox .p-listbox-list .p-listbox-empty-message {
|
||||
padding: 0.429rem 0.857rem;
|
||||
color: #dedede;
|
||||
|
|
@ -1111,6 +1132,13 @@
|
|||
.p-multiselect-panel .p-multiselect-items .p-multiselect-item .p-checkbox {
|
||||
margin-right: 0.5rem;
|
||||
}
|
||||
.p-multiselect-panel .p-multiselect-items .p-multiselect-item-group {
|
||||
margin: 0;
|
||||
padding: 0.857rem;
|
||||
color: #dedede;
|
||||
background: #191919;
|
||||
font-weight: 700;
|
||||
}
|
||||
.p-multiselect-panel .p-multiselect-items .p-multiselect-empty-message {
|
||||
padding: 0.429rem 0.857rem;
|
||||
color: #dedede;
|
||||
|
|
|
|||
|
|
@ -124,6 +124,13 @@
|
|||
color: #212529;
|
||||
background: #F48FB1;
|
||||
}
|
||||
.p-autocomplete-panel .p-autocomplete-items .p-autocomplete-item-group {
|
||||
margin: 0;
|
||||
padding: 0.857rem;
|
||||
color: #dedede;
|
||||
background: #191919;
|
||||
font-weight: 700;
|
||||
}
|
||||
|
||||
.p-calendar.p-invalid.p-component > .p-inputtext {
|
||||
border-color: #e57373;
|
||||
|
|
@ -608,6 +615,13 @@
|
|||
color: #dedede;
|
||||
background: #4c4c4c;
|
||||
}
|
||||
.p-dropdown-panel .p-dropdown-items .p-dropdown-item-group {
|
||||
margin: 0;
|
||||
padding: 0.857rem;
|
||||
color: #dedede;
|
||||
background: #191919;
|
||||
font-weight: 700;
|
||||
}
|
||||
.p-dropdown-panel .p-dropdown-items .p-dropdown-empty-message {
|
||||
padding: 0.429rem 0.857rem;
|
||||
color: #dedede;
|
||||
|
|
@ -977,6 +991,13 @@
|
|||
outline-offset: 0;
|
||||
box-shadow: inset 0 0 0 0.2rem white;
|
||||
}
|
||||
.p-listbox .p-listbox-list .p-listbox-item-group {
|
||||
margin: 0;
|
||||
padding: 0.857rem;
|
||||
color: #dedede;
|
||||
background: #191919;
|
||||
font-weight: 700;
|
||||
}
|
||||
.p-listbox .p-listbox-list .p-listbox-empty-message {
|
||||
padding: 0.429rem 0.857rem;
|
||||
color: #dedede;
|
||||
|
|
@ -1111,6 +1132,13 @@
|
|||
.p-multiselect-panel .p-multiselect-items .p-multiselect-item .p-checkbox {
|
||||
margin-right: 0.5rem;
|
||||
}
|
||||
.p-multiselect-panel .p-multiselect-items .p-multiselect-item-group {
|
||||
margin: 0;
|
||||
padding: 0.857rem;
|
||||
color: #dedede;
|
||||
background: #191919;
|
||||
font-weight: 700;
|
||||
}
|
||||
.p-multiselect-panel .p-multiselect-items .p-multiselect-empty-message {
|
||||
padding: 0.429rem 0.857rem;
|
||||
color: #dedede;
|
||||
|
|
|
|||
|
|
@ -148,6 +148,13 @@
|
|||
color: #CE93D8;
|
||||
background: rgba(206, 147, 216, 0.16);
|
||||
}
|
||||
.p-autocomplete-panel .p-autocomplete-items .p-autocomplete-item-group {
|
||||
margin: 0;
|
||||
padding: 1rem;
|
||||
color: rgba(255, 255, 255, 0.6);
|
||||
background: transparent;
|
||||
font-weight: 400;
|
||||
}
|
||||
|
||||
.p-calendar.p-invalid.p-component > .p-inputtext {
|
||||
border-color: #f44435;
|
||||
|
|
@ -628,6 +635,13 @@
|
|||
color: rgba(255, 255, 255, 0.87);
|
||||
background: rgba(255, 255, 255, 0.04);
|
||||
}
|
||||
.p-dropdown-panel .p-dropdown-items .p-dropdown-item-group {
|
||||
margin: 0;
|
||||
padding: 1rem;
|
||||
color: rgba(255, 255, 255, 0.6);
|
||||
background: transparent;
|
||||
font-weight: 400;
|
||||
}
|
||||
.p-dropdown-panel .p-dropdown-items .p-dropdown-empty-message {
|
||||
padding: 1rem 1rem;
|
||||
color: rgba(255, 255, 255, 0.87);
|
||||
|
|
@ -997,6 +1011,13 @@
|
|||
outline-offset: 0;
|
||||
box-shadow: none;
|
||||
}
|
||||
.p-listbox .p-listbox-list .p-listbox-item-group {
|
||||
margin: 0;
|
||||
padding: 1rem;
|
||||
color: rgba(255, 255, 255, 0.6);
|
||||
background: transparent;
|
||||
font-weight: 400;
|
||||
}
|
||||
.p-listbox .p-listbox-list .p-listbox-empty-message {
|
||||
padding: 1rem 1rem;
|
||||
color: rgba(255, 255, 255, 0.87);
|
||||
|
|
@ -1131,6 +1152,13 @@
|
|||
.p-multiselect-panel .p-multiselect-items .p-multiselect-item .p-checkbox {
|
||||
margin-right: 0.5rem;
|
||||
}
|
||||
.p-multiselect-panel .p-multiselect-items .p-multiselect-item-group {
|
||||
margin: 0;
|
||||
padding: 1rem;
|
||||
color: rgba(255, 255, 255, 0.6);
|
||||
background: transparent;
|
||||
font-weight: 400;
|
||||
}
|
||||
.p-multiselect-panel .p-multiselect-items .p-multiselect-empty-message {
|
||||
padding: 1rem 1rem;
|
||||
color: rgba(255, 255, 255, 0.87);
|
||||
|
|
|
|||
|
|
@ -148,6 +148,13 @@
|
|||
color: #9FA8DA;
|
||||
background: rgba(159, 168, 218, 0.16);
|
||||
}
|
||||
.p-autocomplete-panel .p-autocomplete-items .p-autocomplete-item-group {
|
||||
margin: 0;
|
||||
padding: 1rem;
|
||||
color: rgba(255, 255, 255, 0.6);
|
||||
background: transparent;
|
||||
font-weight: 400;
|
||||
}
|
||||
|
||||
.p-calendar.p-invalid.p-component > .p-inputtext {
|
||||
border-color: #f44435;
|
||||
|
|
@ -628,6 +635,13 @@
|
|||
color: rgba(255, 255, 255, 0.87);
|
||||
background: rgba(255, 255, 255, 0.04);
|
||||
}
|
||||
.p-dropdown-panel .p-dropdown-items .p-dropdown-item-group {
|
||||
margin: 0;
|
||||
padding: 1rem;
|
||||
color: rgba(255, 255, 255, 0.6);
|
||||
background: transparent;
|
||||
font-weight: 400;
|
||||
}
|
||||
.p-dropdown-panel .p-dropdown-items .p-dropdown-empty-message {
|
||||
padding: 1rem 1rem;
|
||||
color: rgba(255, 255, 255, 0.87);
|
||||
|
|
@ -997,6 +1011,13 @@
|
|||
outline-offset: 0;
|
||||
box-shadow: none;
|
||||
}
|
||||
.p-listbox .p-listbox-list .p-listbox-item-group {
|
||||
margin: 0;
|
||||
padding: 1rem;
|
||||
color: rgba(255, 255, 255, 0.6);
|
||||
background: transparent;
|
||||
font-weight: 400;
|
||||
}
|
||||
.p-listbox .p-listbox-list .p-listbox-empty-message {
|
||||
padding: 1rem 1rem;
|
||||
color: rgba(255, 255, 255, 0.87);
|
||||
|
|
@ -1131,6 +1152,13 @@
|
|||
.p-multiselect-panel .p-multiselect-items .p-multiselect-item .p-checkbox {
|
||||
margin-right: 0.5rem;
|
||||
}
|
||||
.p-multiselect-panel .p-multiselect-items .p-multiselect-item-group {
|
||||
margin: 0;
|
||||
padding: 1rem;
|
||||
color: rgba(255, 255, 255, 0.6);
|
||||
background: transparent;
|
||||
font-weight: 400;
|
||||
}
|
||||
.p-multiselect-panel .p-multiselect-items .p-multiselect-empty-message {
|
||||
padding: 1rem 1rem;
|
||||
color: rgba(255, 255, 255, 0.87);
|
||||
|
|
|
|||
|
|
@ -148,6 +148,13 @@
|
|||
color: #673AB7;
|
||||
background: rgba(103, 58, 183, 0.12);
|
||||
}
|
||||
.p-autocomplete-panel .p-autocomplete-items .p-autocomplete-item-group {
|
||||
margin: 0;
|
||||
padding: 1rem;
|
||||
color: rgba(0, 0, 0, 0.6);
|
||||
background: #ffffff;
|
||||
font-weight: 400;
|
||||
}
|
||||
|
||||
.p-calendar.p-invalid.p-component > .p-inputtext {
|
||||
border-color: #B00020;
|
||||
|
|
@ -628,6 +635,13 @@
|
|||
color: rgba(0, 0, 0, 0.87);
|
||||
background: rgba(0, 0, 0, 0.04);
|
||||
}
|
||||
.p-dropdown-panel .p-dropdown-items .p-dropdown-item-group {
|
||||
margin: 0;
|
||||
padding: 1rem;
|
||||
color: rgba(0, 0, 0, 0.6);
|
||||
background: #ffffff;
|
||||
font-weight: 400;
|
||||
}
|
||||
.p-dropdown-panel .p-dropdown-items .p-dropdown-empty-message {
|
||||
padding: 1rem 1rem;
|
||||
color: rgba(0, 0, 0, 0.87);
|
||||
|
|
@ -997,6 +1011,13 @@
|
|||
outline-offset: 0;
|
||||
box-shadow: none;
|
||||
}
|
||||
.p-listbox .p-listbox-list .p-listbox-item-group {
|
||||
margin: 0;
|
||||
padding: 1rem;
|
||||
color: rgba(0, 0, 0, 0.6);
|
||||
background: #ffffff;
|
||||
font-weight: 400;
|
||||
}
|
||||
.p-listbox .p-listbox-list .p-listbox-empty-message {
|
||||
padding: 1rem 1rem;
|
||||
color: rgba(0, 0, 0, 0.87);
|
||||
|
|
@ -1131,6 +1152,13 @@
|
|||
.p-multiselect-panel .p-multiselect-items .p-multiselect-item .p-checkbox {
|
||||
margin-right: 0.5rem;
|
||||
}
|
||||
.p-multiselect-panel .p-multiselect-items .p-multiselect-item-group {
|
||||
margin: 0;
|
||||
padding: 1rem;
|
||||
color: rgba(0, 0, 0, 0.6);
|
||||
background: #ffffff;
|
||||
font-weight: 400;
|
||||
}
|
||||
.p-multiselect-panel .p-multiselect-items .p-multiselect-empty-message {
|
||||
padding: 1rem 1rem;
|
||||
color: rgba(0, 0, 0, 0.87);
|
||||
|
|
|
|||
|
|
@ -148,6 +148,13 @@
|
|||
color: #3F51B5;
|
||||
background: rgba(63, 81, 181, 0.12);
|
||||
}
|
||||
.p-autocomplete-panel .p-autocomplete-items .p-autocomplete-item-group {
|
||||
margin: 0;
|
||||
padding: 1rem;
|
||||
color: rgba(0, 0, 0, 0.6);
|
||||
background: #ffffff;
|
||||
font-weight: 400;
|
||||
}
|
||||
|
||||
.p-calendar.p-invalid.p-component > .p-inputtext {
|
||||
border-color: #B00020;
|
||||
|
|
@ -628,6 +635,13 @@
|
|||
color: rgba(0, 0, 0, 0.87);
|
||||
background: rgba(0, 0, 0, 0.04);
|
||||
}
|
||||
.p-dropdown-panel .p-dropdown-items .p-dropdown-item-group {
|
||||
margin: 0;
|
||||
padding: 1rem;
|
||||
color: rgba(0, 0, 0, 0.6);
|
||||
background: #ffffff;
|
||||
font-weight: 400;
|
||||
}
|
||||
.p-dropdown-panel .p-dropdown-items .p-dropdown-empty-message {
|
||||
padding: 1rem 1rem;
|
||||
color: rgba(0, 0, 0, 0.87);
|
||||
|
|
@ -997,6 +1011,13 @@
|
|||
outline-offset: 0;
|
||||
box-shadow: none;
|
||||
}
|
||||
.p-listbox .p-listbox-list .p-listbox-item-group {
|
||||
margin: 0;
|
||||
padding: 1rem;
|
||||
color: rgba(0, 0, 0, 0.6);
|
||||
background: #ffffff;
|
||||
font-weight: 400;
|
||||
}
|
||||
.p-listbox .p-listbox-list .p-listbox-empty-message {
|
||||
padding: 1rem 1rem;
|
||||
color: rgba(0, 0, 0, 0.87);
|
||||
|
|
@ -1131,6 +1152,13 @@
|
|||
.p-multiselect-panel .p-multiselect-items .p-multiselect-item .p-checkbox {
|
||||
margin-right: 0.5rem;
|
||||
}
|
||||
.p-multiselect-panel .p-multiselect-items .p-multiselect-item-group {
|
||||
margin: 0;
|
||||
padding: 1rem;
|
||||
color: rgba(0, 0, 0, 0.6);
|
||||
background: #ffffff;
|
||||
font-weight: 400;
|
||||
}
|
||||
.p-multiselect-panel .p-multiselect-items .p-multiselect-empty-message {
|
||||
padding: 1rem 1rem;
|
||||
color: rgba(0, 0, 0, 0.87);
|
||||
|
|
|
|||
|
|
@ -148,6 +148,13 @@
|
|||
color: #673AB7;
|
||||
background: rgba(103, 58, 183, 0.16);
|
||||
}
|
||||
.p-autocomplete-panel .p-autocomplete-items .p-autocomplete-item-group {
|
||||
margin: 0;
|
||||
padding: 0.75rem;
|
||||
color: rgba(255, 255, 255, 0.6);
|
||||
background: transparent;
|
||||
font-weight: 400;
|
||||
}
|
||||
|
||||
.p-calendar.p-invalid.p-component > .p-inputtext {
|
||||
border-color: #f44435;
|
||||
|
|
@ -628,6 +635,13 @@
|
|||
color: rgba(255, 255, 255, 0.87);
|
||||
background: rgba(255, 255, 255, 0.04);
|
||||
}
|
||||
.p-dropdown-panel .p-dropdown-items .p-dropdown-item-group {
|
||||
margin: 0;
|
||||
padding: 0.75rem;
|
||||
color: rgba(255, 255, 255, 0.6);
|
||||
background: transparent;
|
||||
font-weight: 400;
|
||||
}
|
||||
.p-dropdown-panel .p-dropdown-items .p-dropdown-empty-message {
|
||||
padding: 0.75rem 0.75rem;
|
||||
color: rgba(255, 255, 255, 0.87);
|
||||
|
|
@ -997,6 +1011,13 @@
|
|||
outline-offset: 0;
|
||||
box-shadow: none;
|
||||
}
|
||||
.p-listbox .p-listbox-list .p-listbox-item-group {
|
||||
margin: 0;
|
||||
padding: 0.75rem;
|
||||
color: rgba(255, 255, 255, 0.6);
|
||||
background: transparent;
|
||||
font-weight: 400;
|
||||
}
|
||||
.p-listbox .p-listbox-list .p-listbox-empty-message {
|
||||
padding: 0.75rem 0.75rem;
|
||||
color: rgba(255, 255, 255, 0.87);
|
||||
|
|
@ -1131,6 +1152,13 @@
|
|||
.p-multiselect-panel .p-multiselect-items .p-multiselect-item .p-checkbox {
|
||||
margin-right: 0.5rem;
|
||||
}
|
||||
.p-multiselect-panel .p-multiselect-items .p-multiselect-item-group {
|
||||
margin: 0;
|
||||
padding: 0.75rem;
|
||||
color: rgba(255, 255, 255, 0.6);
|
||||
background: transparent;
|
||||
font-weight: 400;
|
||||
}
|
||||
.p-multiselect-panel .p-multiselect-items .p-multiselect-empty-message {
|
||||
padding: 0.75rem 0.75rem;
|
||||
color: rgba(255, 255, 255, 0.87);
|
||||
|
|
|
|||
|
|
@ -148,6 +148,13 @@
|
|||
color: #3F51B5;
|
||||
background: rgba(63, 81, 181, 0.16);
|
||||
}
|
||||
.p-autocomplete-panel .p-autocomplete-items .p-autocomplete-item-group {
|
||||
margin: 0;
|
||||
padding: 0.75rem;
|
||||
color: rgba(255, 255, 255, 0.6);
|
||||
background: transparent;
|
||||
font-weight: 400;
|
||||
}
|
||||
|
||||
.p-calendar.p-invalid.p-component > .p-inputtext {
|
||||
border-color: #f44435;
|
||||
|
|
@ -628,6 +635,13 @@
|
|||
color: rgba(255, 255, 255, 0.87);
|
||||
background: rgba(255, 255, 255, 0.04);
|
||||
}
|
||||
.p-dropdown-panel .p-dropdown-items .p-dropdown-item-group {
|
||||
margin: 0;
|
||||
padding: 0.75rem;
|
||||
color: rgba(255, 255, 255, 0.6);
|
||||
background: transparent;
|
||||
font-weight: 400;
|
||||
}
|
||||
.p-dropdown-panel .p-dropdown-items .p-dropdown-empty-message {
|
||||
padding: 0.75rem 0.75rem;
|
||||
color: rgba(255, 255, 255, 0.87);
|
||||
|
|
@ -997,6 +1011,13 @@
|
|||
outline-offset: 0;
|
||||
box-shadow: none;
|
||||
}
|
||||
.p-listbox .p-listbox-list .p-listbox-item-group {
|
||||
margin: 0;
|
||||
padding: 0.75rem;
|
||||
color: rgba(255, 255, 255, 0.6);
|
||||
background: transparent;
|
||||
font-weight: 400;
|
||||
}
|
||||
.p-listbox .p-listbox-list .p-listbox-empty-message {
|
||||
padding: 0.75rem 0.75rem;
|
||||
color: rgba(255, 255, 255, 0.87);
|
||||
|
|
@ -1131,6 +1152,13 @@
|
|||
.p-multiselect-panel .p-multiselect-items .p-multiselect-item .p-checkbox {
|
||||
margin-right: 0.5rem;
|
||||
}
|
||||
.p-multiselect-panel .p-multiselect-items .p-multiselect-item-group {
|
||||
margin: 0;
|
||||
padding: 0.75rem;
|
||||
color: rgba(255, 255, 255, 0.6);
|
||||
background: transparent;
|
||||
font-weight: 400;
|
||||
}
|
||||
.p-multiselect-panel .p-multiselect-items .p-multiselect-empty-message {
|
||||
padding: 0.75rem 0.75rem;
|
||||
color: rgba(255, 255, 255, 0.87);
|
||||
|
|
|
|||
|
|
@ -148,6 +148,13 @@
|
|||
color: #673AB7;
|
||||
background: rgba(103, 58, 183, 0.12);
|
||||
}
|
||||
.p-autocomplete-panel .p-autocomplete-items .p-autocomplete-item-group {
|
||||
margin: 0;
|
||||
padding: 0.75rem;
|
||||
color: rgba(0, 0, 0, 0.6);
|
||||
background: #ffffff;
|
||||
font-weight: 400;
|
||||
}
|
||||
|
||||
.p-calendar.p-invalid.p-component > .p-inputtext {
|
||||
border-color: #B00020;
|
||||
|
|
@ -628,6 +635,13 @@
|
|||
color: rgba(0, 0, 0, 0.87);
|
||||
background: rgba(0, 0, 0, 0.04);
|
||||
}
|
||||
.p-dropdown-panel .p-dropdown-items .p-dropdown-item-group {
|
||||
margin: 0;
|
||||
padding: 0.75rem;
|
||||
color: rgba(0, 0, 0, 0.6);
|
||||
background: #ffffff;
|
||||
font-weight: 400;
|
||||
}
|
||||
.p-dropdown-panel .p-dropdown-items .p-dropdown-empty-message {
|
||||
padding: 0.75rem 0.75rem;
|
||||
color: rgba(0, 0, 0, 0.87);
|
||||
|
|
@ -997,6 +1011,13 @@
|
|||
outline-offset: 0;
|
||||
box-shadow: none;
|
||||
}
|
||||
.p-listbox .p-listbox-list .p-listbox-item-group {
|
||||
margin: 0;
|
||||
padding: 0.75rem;
|
||||
color: rgba(0, 0, 0, 0.6);
|
||||
background: #ffffff;
|
||||
font-weight: 400;
|
||||
}
|
||||
.p-listbox .p-listbox-list .p-listbox-empty-message {
|
||||
padding: 0.75rem 0.75rem;
|
||||
color: rgba(0, 0, 0, 0.87);
|
||||
|
|
@ -1131,6 +1152,13 @@
|
|||
.p-multiselect-panel .p-multiselect-items .p-multiselect-item .p-checkbox {
|
||||
margin-right: 0.5rem;
|
||||
}
|
||||
.p-multiselect-panel .p-multiselect-items .p-multiselect-item-group {
|
||||
margin: 0;
|
||||
padding: 0.75rem;
|
||||
color: rgba(0, 0, 0, 0.6);
|
||||
background: #ffffff;
|
||||
font-weight: 400;
|
||||
}
|
||||
.p-multiselect-panel .p-multiselect-items .p-multiselect-empty-message {
|
||||
padding: 0.75rem 0.75rem;
|
||||
color: rgba(0, 0, 0, 0.87);
|
||||
|
|
|
|||
|
|
@ -148,6 +148,13 @@
|
|||
color: #3F51B5;
|
||||
background: rgba(63, 81, 181, 0.12);
|
||||
}
|
||||
.p-autocomplete-panel .p-autocomplete-items .p-autocomplete-item-group {
|
||||
margin: 0;
|
||||
padding: 0.75rem;
|
||||
color: rgba(0, 0, 0, 0.6);
|
||||
background: #ffffff;
|
||||
font-weight: 400;
|
||||
}
|
||||
|
||||
.p-calendar.p-invalid.p-component > .p-inputtext {
|
||||
border-color: #B00020;
|
||||
|
|
@ -628,6 +635,13 @@
|
|||
color: rgba(0, 0, 0, 0.87);
|
||||
background: rgba(0, 0, 0, 0.04);
|
||||
}
|
||||
.p-dropdown-panel .p-dropdown-items .p-dropdown-item-group {
|
||||
margin: 0;
|
||||
padding: 0.75rem;
|
||||
color: rgba(0, 0, 0, 0.6);
|
||||
background: #ffffff;
|
||||
font-weight: 400;
|
||||
}
|
||||
.p-dropdown-panel .p-dropdown-items .p-dropdown-empty-message {
|
||||
padding: 0.75rem 0.75rem;
|
||||
color: rgba(0, 0, 0, 0.87);
|
||||
|
|
@ -997,6 +1011,13 @@
|
|||
outline-offset: 0;
|
||||
box-shadow: none;
|
||||
}
|
||||
.p-listbox .p-listbox-list .p-listbox-item-group {
|
||||
margin: 0;
|
||||
padding: 0.75rem;
|
||||
color: rgba(0, 0, 0, 0.6);
|
||||
background: #ffffff;
|
||||
font-weight: 400;
|
||||
}
|
||||
.p-listbox .p-listbox-list .p-listbox-empty-message {
|
||||
padding: 0.75rem 0.75rem;
|
||||
color: rgba(0, 0, 0, 0.87);
|
||||
|
|
@ -1131,6 +1152,13 @@
|
|||
.p-multiselect-panel .p-multiselect-items .p-multiselect-item .p-checkbox {
|
||||
margin-right: 0.5rem;
|
||||
}
|
||||
.p-multiselect-panel .p-multiselect-items .p-multiselect-item-group {
|
||||
margin: 0;
|
||||
padding: 0.75rem;
|
||||
color: rgba(0, 0, 0, 0.6);
|
||||
background: #ffffff;
|
||||
font-weight: 400;
|
||||
}
|
||||
.p-multiselect-panel .p-multiselect-items .p-multiselect-empty-message {
|
||||
padding: 0.75rem 0.75rem;
|
||||
color: rgba(0, 0, 0, 0.87);
|
||||
|
|
|
|||
|
|
@ -124,6 +124,13 @@
|
|||
color: #ffffff;
|
||||
background: #e02365;
|
||||
}
|
||||
.p-autocomplete-panel .p-autocomplete-items .p-autocomplete-item-group {
|
||||
margin: 0;
|
||||
padding: 0.857rem;
|
||||
color: #333333;
|
||||
background: #f4f4f4;
|
||||
font-weight: 700;
|
||||
}
|
||||
|
||||
.p-calendar.p-invalid.p-component > .p-inputtext {
|
||||
border-color: #a80000;
|
||||
|
|
@ -604,6 +611,13 @@
|
|||
color: #333333;
|
||||
background: #eaeaea;
|
||||
}
|
||||
.p-dropdown-panel .p-dropdown-items .p-dropdown-item-group {
|
||||
margin: 0;
|
||||
padding: 0.857rem;
|
||||
color: #333333;
|
||||
background: #f4f4f4;
|
||||
font-weight: 700;
|
||||
}
|
||||
.p-dropdown-panel .p-dropdown-items .p-dropdown-empty-message {
|
||||
padding: 0.429rem 0.857rem;
|
||||
color: #333333;
|
||||
|
|
@ -973,6 +987,13 @@
|
|||
outline-offset: 0;
|
||||
box-shadow: inset 0 0 0 0.2rem #8dcdff;
|
||||
}
|
||||
.p-listbox .p-listbox-list .p-listbox-item-group {
|
||||
margin: 0;
|
||||
padding: 0.857rem;
|
||||
color: #333333;
|
||||
background: #f4f4f4;
|
||||
font-weight: 700;
|
||||
}
|
||||
.p-listbox .p-listbox-list .p-listbox-empty-message {
|
||||
padding: 0.429rem 0.857rem;
|
||||
color: #333333;
|
||||
|
|
@ -1107,6 +1128,13 @@
|
|||
.p-multiselect-panel .p-multiselect-items .p-multiselect-item .p-checkbox {
|
||||
margin-right: 0.5rem;
|
||||
}
|
||||
.p-multiselect-panel .p-multiselect-items .p-multiselect-item-group {
|
||||
margin: 0;
|
||||
padding: 0.857rem;
|
||||
color: #333333;
|
||||
background: #f4f4f4;
|
||||
font-weight: 700;
|
||||
}
|
||||
.p-multiselect-panel .p-multiselect-items .p-multiselect-empty-message {
|
||||
padding: 0.429rem 0.857rem;
|
||||
color: #333333;
|
||||
|
|
|
|||
|
|
@ -124,6 +124,13 @@
|
|||
color: #ffffff;
|
||||
background: #007ad9;
|
||||
}
|
||||
.p-autocomplete-panel .p-autocomplete-items .p-autocomplete-item-group {
|
||||
margin: 0;
|
||||
padding: 0.857rem;
|
||||
color: #333333;
|
||||
background: #f4f4f4;
|
||||
font-weight: 700;
|
||||
}
|
||||
|
||||
.p-calendar.p-invalid.p-component > .p-inputtext {
|
||||
border-color: #a80000;
|
||||
|
|
@ -608,6 +615,13 @@
|
|||
color: #333333;
|
||||
background: #eaeaea;
|
||||
}
|
||||
.p-dropdown-panel .p-dropdown-items .p-dropdown-item-group {
|
||||
margin: 0;
|
||||
padding: 0.857rem;
|
||||
color: #333333;
|
||||
background: #f4f4f4;
|
||||
font-weight: 700;
|
||||
}
|
||||
.p-dropdown-panel .p-dropdown-items .p-dropdown-empty-message {
|
||||
padding: 0.429rem 0.857rem;
|
||||
color: #333333;
|
||||
|
|
@ -977,6 +991,13 @@
|
|||
outline-offset: 0;
|
||||
box-shadow: inset 0 0 0 0.2rem #8dcdff;
|
||||
}
|
||||
.p-listbox .p-listbox-list .p-listbox-item-group {
|
||||
margin: 0;
|
||||
padding: 0.857rem;
|
||||
color: #333333;
|
||||
background: #f4f4f4;
|
||||
font-weight: 700;
|
||||
}
|
||||
.p-listbox .p-listbox-list .p-listbox-empty-message {
|
||||
padding: 0.429rem 0.857rem;
|
||||
color: #333333;
|
||||
|
|
@ -1111,6 +1132,13 @@
|
|||
.p-multiselect-panel .p-multiselect-items .p-multiselect-item .p-checkbox {
|
||||
margin-right: 0.5rem;
|
||||
}
|
||||
.p-multiselect-panel .p-multiselect-items .p-multiselect-item-group {
|
||||
margin: 0;
|
||||
padding: 0.857rem;
|
||||
color: #333333;
|
||||
background: #f4f4f4;
|
||||
font-weight: 700;
|
||||
}
|
||||
.p-multiselect-panel .p-multiselect-items .p-multiselect-empty-message {
|
||||
padding: 0.429rem 0.857rem;
|
||||
color: #333333;
|
||||
|
|
|
|||
|
|
@ -124,6 +124,13 @@
|
|||
color: #ffffff;
|
||||
background: #41b883;
|
||||
}
|
||||
.p-autocomplete-panel .p-autocomplete-items .p-autocomplete-item-group {
|
||||
margin: 0;
|
||||
padding: 0.857rem;
|
||||
color: #333333;
|
||||
background: #f4f4f4;
|
||||
font-weight: 700;
|
||||
}
|
||||
|
||||
.p-calendar.p-invalid.p-component > .p-inputtext {
|
||||
border-color: #a80000;
|
||||
|
|
@ -608,6 +615,13 @@
|
|||
color: #333333;
|
||||
background: #eaeaea;
|
||||
}
|
||||
.p-dropdown-panel .p-dropdown-items .p-dropdown-item-group {
|
||||
margin: 0;
|
||||
padding: 0.857rem;
|
||||
color: #333333;
|
||||
background: #f4f4f4;
|
||||
font-weight: 700;
|
||||
}
|
||||
.p-dropdown-panel .p-dropdown-items .p-dropdown-empty-message {
|
||||
padding: 0.429rem 0.857rem;
|
||||
color: #333333;
|
||||
|
|
@ -977,6 +991,13 @@
|
|||
outline-offset: 0;
|
||||
box-shadow: inset 0 0 0 0.2rem #c2e9d8;
|
||||
}
|
||||
.p-listbox .p-listbox-list .p-listbox-item-group {
|
||||
margin: 0;
|
||||
padding: 0.857rem;
|
||||
color: #333333;
|
||||
background: #f4f4f4;
|
||||
font-weight: 700;
|
||||
}
|
||||
.p-listbox .p-listbox-list .p-listbox-empty-message {
|
||||
padding: 0.429rem 0.857rem;
|
||||
color: #333333;
|
||||
|
|
@ -1111,6 +1132,13 @@
|
|||
.p-multiselect-panel .p-multiselect-items .p-multiselect-item .p-checkbox {
|
||||
margin-right: 0.5rem;
|
||||
}
|
||||
.p-multiselect-panel .p-multiselect-items .p-multiselect-item-group {
|
||||
margin: 0;
|
||||
padding: 0.857rem;
|
||||
color: #333333;
|
||||
background: #f4f4f4;
|
||||
font-weight: 700;
|
||||
}
|
||||
.p-multiselect-panel .p-multiselect-items .p-multiselect-empty-message {
|
||||
padding: 0.429rem 0.857rem;
|
||||
color: #333333;
|
||||
|
|
|
|||
|
|
@ -124,6 +124,13 @@
|
|||
color: #ffffff;
|
||||
background: #007ad9;
|
||||
}
|
||||
.p-autocomplete-panel .p-autocomplete-items .p-autocomplete-item-group {
|
||||
margin: 0;
|
||||
padding: 0.857rem;
|
||||
color: #333333;
|
||||
background: #f4f4f4;
|
||||
font-weight: 700;
|
||||
}
|
||||
|
||||
.p-calendar.p-invalid.p-component > .p-inputtext {
|
||||
border-color: #a80000;
|
||||
|
|
@ -608,6 +615,13 @@
|
|||
color: #333333;
|
||||
background: #eaeaea;
|
||||
}
|
||||
.p-dropdown-panel .p-dropdown-items .p-dropdown-item-group {
|
||||
margin: 0;
|
||||
padding: 0.857rem;
|
||||
color: #333333;
|
||||
background: #f4f4f4;
|
||||
font-weight: 700;
|
||||
}
|
||||
.p-dropdown-panel .p-dropdown-items .p-dropdown-empty-message {
|
||||
padding: 0.429rem 0.857rem;
|
||||
color: #333333;
|
||||
|
|
@ -977,6 +991,13 @@
|
|||
outline-offset: 0;
|
||||
box-shadow: inset 0 0 0 0.2rem #8dcdff;
|
||||
}
|
||||
.p-listbox .p-listbox-list .p-listbox-item-group {
|
||||
margin: 0;
|
||||
padding: 0.857rem;
|
||||
color: #333333;
|
||||
background: #f4f4f4;
|
||||
font-weight: 700;
|
||||
}
|
||||
.p-listbox .p-listbox-list .p-listbox-empty-message {
|
||||
padding: 0.429rem 0.857rem;
|
||||
color: #333333;
|
||||
|
|
@ -1111,6 +1132,13 @@
|
|||
.p-multiselect-panel .p-multiselect-items .p-multiselect-item .p-checkbox {
|
||||
margin-right: 0.5rem;
|
||||
}
|
||||
.p-multiselect-panel .p-multiselect-items .p-multiselect-item-group {
|
||||
margin: 0;
|
||||
padding: 0.857rem;
|
||||
color: #333333;
|
||||
background: #f4f4f4;
|
||||
font-weight: 700;
|
||||
}
|
||||
.p-multiselect-panel .p-multiselect-items .p-multiselect-empty-message {
|
||||
padding: 0.429rem 0.857rem;
|
||||
color: #333333;
|
||||
|
|
|
|||
|
|
@ -124,6 +124,13 @@
|
|||
color: #385048;
|
||||
background: #AFD3C8;
|
||||
}
|
||||
.p-autocomplete-panel .p-autocomplete-items .p-autocomplete-item-group {
|
||||
margin: 0;
|
||||
padding: 0.857rem;
|
||||
color: #666666;
|
||||
background: #f4f4f4;
|
||||
font-weight: 700;
|
||||
}
|
||||
|
||||
.p-calendar.p-invalid.p-component > .p-inputtext {
|
||||
border-color: #e7a3a3;
|
||||
|
|
@ -604,6 +611,13 @@
|
|||
color: #666666;
|
||||
background: #f4f4f4;
|
||||
}
|
||||
.p-dropdown-panel .p-dropdown-items .p-dropdown-item-group {
|
||||
margin: 0;
|
||||
padding: 0.857rem;
|
||||
color: #666666;
|
||||
background: #f4f4f4;
|
||||
font-weight: 700;
|
||||
}
|
||||
.p-dropdown-panel .p-dropdown-items .p-dropdown-empty-message {
|
||||
padding: 0.429rem 0.857rem;
|
||||
color: #666666;
|
||||
|
|
@ -973,6 +987,13 @@
|
|||
outline-offset: 0;
|
||||
box-shadow: inset 0 0 0 0.2rem #e4e9ec;
|
||||
}
|
||||
.p-listbox .p-listbox-list .p-listbox-item-group {
|
||||
margin: 0;
|
||||
padding: 0.857rem;
|
||||
color: #666666;
|
||||
background: #f4f4f4;
|
||||
font-weight: 700;
|
||||
}
|
||||
.p-listbox .p-listbox-list .p-listbox-empty-message {
|
||||
padding: 0.429rem 0.857rem;
|
||||
color: #666666;
|
||||
|
|
@ -1107,6 +1128,13 @@
|
|||
.p-multiselect-panel .p-multiselect-items .p-multiselect-item .p-checkbox {
|
||||
margin-right: 0.5rem;
|
||||
}
|
||||
.p-multiselect-panel .p-multiselect-items .p-multiselect-item-group {
|
||||
margin: 0;
|
||||
padding: 0.857rem;
|
||||
color: #666666;
|
||||
background: #f4f4f4;
|
||||
font-weight: 700;
|
||||
}
|
||||
.p-multiselect-panel .p-multiselect-items .p-multiselect-empty-message {
|
||||
padding: 0.429rem 0.857rem;
|
||||
color: #666666;
|
||||
|
|
|
|||
|
|
@ -124,6 +124,13 @@
|
|||
color: #495057;
|
||||
background: #E3F2FD;
|
||||
}
|
||||
.p-autocomplete-panel .p-autocomplete-items .p-autocomplete-item-group {
|
||||
margin: 0;
|
||||
padding: 0.75rem 1rem;
|
||||
color: #495057;
|
||||
background: #ffffff;
|
||||
font-weight: 600;
|
||||
}
|
||||
|
||||
.p-calendar.p-invalid.p-component > .p-inputtext {
|
||||
border-color: #f44336;
|
||||
|
|
@ -604,6 +611,13 @@
|
|||
color: #495057;
|
||||
background: #e9ecef;
|
||||
}
|
||||
.p-dropdown-panel .p-dropdown-items .p-dropdown-item-group {
|
||||
margin: 0;
|
||||
padding: 0.75rem 1rem;
|
||||
color: #495057;
|
||||
background: #ffffff;
|
||||
font-weight: 600;
|
||||
}
|
||||
.p-dropdown-panel .p-dropdown-items .p-dropdown-empty-message {
|
||||
padding: 0.5rem 1rem;
|
||||
color: #495057;
|
||||
|
|
@ -973,6 +987,13 @@
|
|||
outline-offset: 0;
|
||||
box-shadow: inset 0 0 0 0.15rem #a6d5fa;
|
||||
}
|
||||
.p-listbox .p-listbox-list .p-listbox-item-group {
|
||||
margin: 0;
|
||||
padding: 0.75rem 1rem;
|
||||
color: #495057;
|
||||
background: #ffffff;
|
||||
font-weight: 600;
|
||||
}
|
||||
.p-listbox .p-listbox-list .p-listbox-empty-message {
|
||||
padding: 0.5rem 1rem;
|
||||
color: #495057;
|
||||
|
|
@ -1107,6 +1128,13 @@
|
|||
.p-multiselect-panel .p-multiselect-items .p-multiselect-item .p-checkbox {
|
||||
margin-right: 0.5rem;
|
||||
}
|
||||
.p-multiselect-panel .p-multiselect-items .p-multiselect-item-group {
|
||||
margin: 0;
|
||||
padding: 0.75rem 1rem;
|
||||
color: #495057;
|
||||
background: #ffffff;
|
||||
font-weight: 600;
|
||||
}
|
||||
.p-multiselect-panel .p-multiselect-items .p-multiselect-empty-message {
|
||||
padding: 0.5rem 1rem;
|
||||
color: #495057;
|
||||
|
|
|
|||
|
|
@ -124,6 +124,13 @@
|
|||
color: #495057;
|
||||
background: #E8F5E9;
|
||||
}
|
||||
.p-autocomplete-panel .p-autocomplete-items .p-autocomplete-item-group {
|
||||
margin: 0;
|
||||
padding: 0.75rem 1rem;
|
||||
color: #495057;
|
||||
background: #ffffff;
|
||||
font-weight: 600;
|
||||
}
|
||||
|
||||
.p-calendar.p-invalid.p-component > .p-inputtext {
|
||||
border-color: #f44336;
|
||||
|
|
@ -604,6 +611,13 @@
|
|||
color: #495057;
|
||||
background: #e9ecef;
|
||||
}
|
||||
.p-dropdown-panel .p-dropdown-items .p-dropdown-item-group {
|
||||
margin: 0;
|
||||
padding: 0.75rem 1rem;
|
||||
color: #495057;
|
||||
background: #ffffff;
|
||||
font-weight: 600;
|
||||
}
|
||||
.p-dropdown-panel .p-dropdown-items .p-dropdown-empty-message {
|
||||
padding: 0.5rem 1rem;
|
||||
color: #495057;
|
||||
|
|
@ -973,6 +987,13 @@
|
|||
outline-offset: 0;
|
||||
box-shadow: inset 0 0 0 0.15rem #b7e0b8;
|
||||
}
|
||||
.p-listbox .p-listbox-list .p-listbox-item-group {
|
||||
margin: 0;
|
||||
padding: 0.75rem 1rem;
|
||||
color: #495057;
|
||||
background: #ffffff;
|
||||
font-weight: 600;
|
||||
}
|
||||
.p-listbox .p-listbox-list .p-listbox-empty-message {
|
||||
padding: 0.5rem 1rem;
|
||||
color: #495057;
|
||||
|
|
@ -1107,6 +1128,13 @@
|
|||
.p-multiselect-panel .p-multiselect-items .p-multiselect-item .p-checkbox {
|
||||
margin-right: 0.5rem;
|
||||
}
|
||||
.p-multiselect-panel .p-multiselect-items .p-multiselect-item-group {
|
||||
margin: 0;
|
||||
padding: 0.75rem 1rem;
|
||||
color: #495057;
|
||||
background: #ffffff;
|
||||
font-weight: 600;
|
||||
}
|
||||
.p-multiselect-panel .p-multiselect-items .p-multiselect-empty-message {
|
||||
padding: 0.5rem 1rem;
|
||||
color: #495057;
|
||||
|
|
|
|||
|
|
@ -124,6 +124,13 @@
|
|||
color: #495057;
|
||||
background: #FFF3E0;
|
||||
}
|
||||
.p-autocomplete-panel .p-autocomplete-items .p-autocomplete-item-group {
|
||||
margin: 0;
|
||||
padding: 0.75rem 1rem;
|
||||
color: #495057;
|
||||
background: #ffffff;
|
||||
font-weight: 600;
|
||||
}
|
||||
|
||||
.p-calendar.p-invalid.p-component > .p-inputtext {
|
||||
border-color: #f44336;
|
||||
|
|
@ -604,6 +611,13 @@
|
|||
color: #495057;
|
||||
background: #e9ecef;
|
||||
}
|
||||
.p-dropdown-panel .p-dropdown-items .p-dropdown-item-group {
|
||||
margin: 0;
|
||||
padding: 0.75rem 1rem;
|
||||
color: #495057;
|
||||
background: #ffffff;
|
||||
font-weight: 600;
|
||||
}
|
||||
.p-dropdown-panel .p-dropdown-items .p-dropdown-empty-message {
|
||||
padding: 0.5rem 1rem;
|
||||
color: #495057;
|
||||
|
|
@ -973,6 +987,13 @@
|
|||
outline-offset: 0;
|
||||
box-shadow: inset 0 0 0 0.15rem #ffe69c;
|
||||
}
|
||||
.p-listbox .p-listbox-list .p-listbox-item-group {
|
||||
margin: 0;
|
||||
padding: 0.75rem 1rem;
|
||||
color: #495057;
|
||||
background: #ffffff;
|
||||
font-weight: 600;
|
||||
}
|
||||
.p-listbox .p-listbox-list .p-listbox-empty-message {
|
||||
padding: 0.5rem 1rem;
|
||||
color: #495057;
|
||||
|
|
@ -1107,6 +1128,13 @@
|
|||
.p-multiselect-panel .p-multiselect-items .p-multiselect-item .p-checkbox {
|
||||
margin-right: 0.5rem;
|
||||
}
|
||||
.p-multiselect-panel .p-multiselect-items .p-multiselect-item-group {
|
||||
margin: 0;
|
||||
padding: 0.75rem 1rem;
|
||||
color: #495057;
|
||||
background: #ffffff;
|
||||
font-weight: 600;
|
||||
}
|
||||
.p-multiselect-panel .p-multiselect-items .p-multiselect-empty-message {
|
||||
padding: 0.5rem 1rem;
|
||||
color: #495057;
|
||||
|
|
|
|||
|
|
@ -124,6 +124,13 @@
|
|||
color: #495057;
|
||||
background: #F3E5F5;
|
||||
}
|
||||
.p-autocomplete-panel .p-autocomplete-items .p-autocomplete-item-group {
|
||||
margin: 0;
|
||||
padding: 0.75rem 1rem;
|
||||
color: #495057;
|
||||
background: #ffffff;
|
||||
font-weight: 600;
|
||||
}
|
||||
|
||||
.p-calendar.p-invalid.p-component > .p-inputtext {
|
||||
border-color: #f44336;
|
||||
|
|
@ -604,6 +611,13 @@
|
|||
color: #495057;
|
||||
background: #e9ecef;
|
||||
}
|
||||
.p-dropdown-panel .p-dropdown-items .p-dropdown-item-group {
|
||||
margin: 0;
|
||||
padding: 0.75rem 1rem;
|
||||
color: #495057;
|
||||
background: #ffffff;
|
||||
font-weight: 600;
|
||||
}
|
||||
.p-dropdown-panel .p-dropdown-items .p-dropdown-empty-message {
|
||||
padding: 0.5rem 1rem;
|
||||
color: #495057;
|
||||
|
|
@ -973,6 +987,13 @@
|
|||
outline-offset: 0;
|
||||
box-shadow: inset 0 0 0 0.15rem #df9eea;
|
||||
}
|
||||
.p-listbox .p-listbox-list .p-listbox-item-group {
|
||||
margin: 0;
|
||||
padding: 0.75rem 1rem;
|
||||
color: #495057;
|
||||
background: #ffffff;
|
||||
font-weight: 600;
|
||||
}
|
||||
.p-listbox .p-listbox-list .p-listbox-empty-message {
|
||||
padding: 0.5rem 1rem;
|
||||
color: #495057;
|
||||
|
|
@ -1107,6 +1128,13 @@
|
|||
.p-multiselect-panel .p-multiselect-items .p-multiselect-item .p-checkbox {
|
||||
margin-right: 0.5rem;
|
||||
}
|
||||
.p-multiselect-panel .p-multiselect-items .p-multiselect-item-group {
|
||||
margin: 0;
|
||||
padding: 0.75rem 1rem;
|
||||
color: #495057;
|
||||
background: #ffffff;
|
||||
font-weight: 600;
|
||||
}
|
||||
.p-multiselect-panel .p-multiselect-items .p-multiselect-empty-message {
|
||||
padding: 0.5rem 1rem;
|
||||
color: #495057;
|
||||
|
|
|
|||
|
|
@ -124,6 +124,13 @@
|
|||
color: rgba(255, 255, 255, 0.87);
|
||||
background: rgba(100, 181, 246, 0.16);
|
||||
}
|
||||
.p-autocomplete-panel .p-autocomplete-items .p-autocomplete-item-group {
|
||||
margin: 0;
|
||||
padding: 0.75rem 1rem;
|
||||
color: rgba(255, 255, 255, 0.87);
|
||||
background: #1f2d40;
|
||||
font-weight: 600;
|
||||
}
|
||||
|
||||
.p-calendar.p-invalid.p-component > .p-inputtext {
|
||||
border-color: #ef9a9a;
|
||||
|
|
@ -604,6 +611,13 @@
|
|||
color: rgba(255, 255, 255, 0.87);
|
||||
background: rgba(255, 255, 255, 0.03);
|
||||
}
|
||||
.p-dropdown-panel .p-dropdown-items .p-dropdown-item-group {
|
||||
margin: 0;
|
||||
padding: 0.75rem 1rem;
|
||||
color: rgba(255, 255, 255, 0.87);
|
||||
background: #1f2d40;
|
||||
font-weight: 600;
|
||||
}
|
||||
.p-dropdown-panel .p-dropdown-items .p-dropdown-empty-message {
|
||||
padding: 0.5rem 1rem;
|
||||
color: rgba(255, 255, 255, 0.87);
|
||||
|
|
@ -973,6 +987,13 @@
|
|||
outline-offset: 0;
|
||||
box-shadow: inset 0 0 0 1px #93cbf9;
|
||||
}
|
||||
.p-listbox .p-listbox-list .p-listbox-item-group {
|
||||
margin: 0;
|
||||
padding: 0.75rem 1rem;
|
||||
color: rgba(255, 255, 255, 0.87);
|
||||
background: #1f2d40;
|
||||
font-weight: 600;
|
||||
}
|
||||
.p-listbox .p-listbox-list .p-listbox-empty-message {
|
||||
padding: 0.5rem 1rem;
|
||||
color: rgba(255, 255, 255, 0.87);
|
||||
|
|
@ -1107,6 +1128,13 @@
|
|||
.p-multiselect-panel .p-multiselect-items .p-multiselect-item .p-checkbox {
|
||||
margin-right: 0.5rem;
|
||||
}
|
||||
.p-multiselect-panel .p-multiselect-items .p-multiselect-item-group {
|
||||
margin: 0;
|
||||
padding: 0.75rem 1rem;
|
||||
color: rgba(255, 255, 255, 0.87);
|
||||
background: #1f2d40;
|
||||
font-weight: 600;
|
||||
}
|
||||
.p-multiselect-panel .p-multiselect-items .p-multiselect-empty-message {
|
||||
padding: 0.5rem 1rem;
|
||||
color: rgba(255, 255, 255, 0.87);
|
||||
|
|
|
|||
|
|
@ -124,6 +124,13 @@
|
|||
color: rgba(255, 255, 255, 0.87);
|
||||
background: rgba(129, 199, 132, 0.16);
|
||||
}
|
||||
.p-autocomplete-panel .p-autocomplete-items .p-autocomplete-item-group {
|
||||
margin: 0;
|
||||
padding: 0.75rem 1rem;
|
||||
color: rgba(255, 255, 255, 0.87);
|
||||
background: #1f2d40;
|
||||
font-weight: 600;
|
||||
}
|
||||
|
||||
.p-calendar.p-invalid.p-component > .p-inputtext {
|
||||
border-color: #ef9a9a;
|
||||
|
|
@ -604,6 +611,13 @@
|
|||
color: rgba(255, 255, 255, 0.87);
|
||||
background: rgba(255, 255, 255, 0.03);
|
||||
}
|
||||
.p-dropdown-panel .p-dropdown-items .p-dropdown-item-group {
|
||||
margin: 0;
|
||||
padding: 0.75rem 1rem;
|
||||
color: rgba(255, 255, 255, 0.87);
|
||||
background: #1f2d40;
|
||||
font-weight: 600;
|
||||
}
|
||||
.p-dropdown-panel .p-dropdown-items .p-dropdown-empty-message {
|
||||
padding: 0.5rem 1rem;
|
||||
color: rgba(255, 255, 255, 0.87);
|
||||
|
|
@ -973,6 +987,13 @@
|
|||
outline-offset: 0;
|
||||
box-shadow: inset 0 0 0 1px #a7d8a9;
|
||||
}
|
||||
.p-listbox .p-listbox-list .p-listbox-item-group {
|
||||
margin: 0;
|
||||
padding: 0.75rem 1rem;
|
||||
color: rgba(255, 255, 255, 0.87);
|
||||
background: #1f2d40;
|
||||
font-weight: 600;
|
||||
}
|
||||
.p-listbox .p-listbox-list .p-listbox-empty-message {
|
||||
padding: 0.5rem 1rem;
|
||||
color: rgba(255, 255, 255, 0.87);
|
||||
|
|
@ -1107,6 +1128,13 @@
|
|||
.p-multiselect-panel .p-multiselect-items .p-multiselect-item .p-checkbox {
|
||||
margin-right: 0.5rem;
|
||||
}
|
||||
.p-multiselect-panel .p-multiselect-items .p-multiselect-item-group {
|
||||
margin: 0;
|
||||
padding: 0.75rem 1rem;
|
||||
color: rgba(255, 255, 255, 0.87);
|
||||
background: #1f2d40;
|
||||
font-weight: 600;
|
||||
}
|
||||
.p-multiselect-panel .p-multiselect-items .p-multiselect-empty-message {
|
||||
padding: 0.5rem 1rem;
|
||||
color: rgba(255, 255, 255, 0.87);
|
||||
|
|
|
|||
|
|
@ -124,6 +124,13 @@
|
|||
color: rgba(255, 255, 255, 0.87);
|
||||
background: rgba(255, 213, 79, 0.16);
|
||||
}
|
||||
.p-autocomplete-panel .p-autocomplete-items .p-autocomplete-item-group {
|
||||
margin: 0;
|
||||
padding: 0.75rem 1rem;
|
||||
color: rgba(255, 255, 255, 0.87);
|
||||
background: #1f2d40;
|
||||
font-weight: 600;
|
||||
}
|
||||
|
||||
.p-calendar.p-invalid.p-component > .p-inputtext {
|
||||
border-color: #ef9a9a;
|
||||
|
|
@ -604,6 +611,13 @@
|
|||
color: rgba(255, 255, 255, 0.87);
|
||||
background: rgba(255, 255, 255, 0.03);
|
||||
}
|
||||
.p-dropdown-panel .p-dropdown-items .p-dropdown-item-group {
|
||||
margin: 0;
|
||||
padding: 0.75rem 1rem;
|
||||
color: rgba(255, 255, 255, 0.87);
|
||||
background: #1f2d40;
|
||||
font-weight: 600;
|
||||
}
|
||||
.p-dropdown-panel .p-dropdown-items .p-dropdown-empty-message {
|
||||
padding: 0.5rem 1rem;
|
||||
color: rgba(255, 255, 255, 0.87);
|
||||
|
|
@ -973,6 +987,13 @@
|
|||
outline-offset: 0;
|
||||
box-shadow: inset 0 0 0 1px #ffe284;
|
||||
}
|
||||
.p-listbox .p-listbox-list .p-listbox-item-group {
|
||||
margin: 0;
|
||||
padding: 0.75rem 1rem;
|
||||
color: rgba(255, 255, 255, 0.87);
|
||||
background: #1f2d40;
|
||||
font-weight: 600;
|
||||
}
|
||||
.p-listbox .p-listbox-list .p-listbox-empty-message {
|
||||
padding: 0.5rem 1rem;
|
||||
color: rgba(255, 255, 255, 0.87);
|
||||
|
|
@ -1107,6 +1128,13 @@
|
|||
.p-multiselect-panel .p-multiselect-items .p-multiselect-item .p-checkbox {
|
||||
margin-right: 0.5rem;
|
||||
}
|
||||
.p-multiselect-panel .p-multiselect-items .p-multiselect-item-group {
|
||||
margin: 0;
|
||||
padding: 0.75rem 1rem;
|
||||
color: rgba(255, 255, 255, 0.87);
|
||||
background: #1f2d40;
|
||||
font-weight: 600;
|
||||
}
|
||||
.p-multiselect-panel .p-multiselect-items .p-multiselect-empty-message {
|
||||
padding: 0.5rem 1rem;
|
||||
color: rgba(255, 255, 255, 0.87);
|
||||
|
|
|
|||
|
|
@ -124,6 +124,13 @@
|
|||
color: rgba(255, 255, 255, 0.87);
|
||||
background: rgba(186, 104, 200, 0.16);
|
||||
}
|
||||
.p-autocomplete-panel .p-autocomplete-items .p-autocomplete-item-group {
|
||||
margin: 0;
|
||||
padding: 0.75rem 1rem;
|
||||
color: rgba(255, 255, 255, 0.87);
|
||||
background: #1f2d40;
|
||||
font-weight: 600;
|
||||
}
|
||||
|
||||
.p-calendar.p-invalid.p-component > .p-inputtext {
|
||||
border-color: #ef9a9a;
|
||||
|
|
@ -604,6 +611,13 @@
|
|||
color: rgba(255, 255, 255, 0.87);
|
||||
background: rgba(255, 255, 255, 0.03);
|
||||
}
|
||||
.p-dropdown-panel .p-dropdown-items .p-dropdown-item-group {
|
||||
margin: 0;
|
||||
padding: 0.75rem 1rem;
|
||||
color: rgba(255, 255, 255, 0.87);
|
||||
background: #1f2d40;
|
||||
font-weight: 600;
|
||||
}
|
||||
.p-dropdown-panel .p-dropdown-items .p-dropdown-empty-message {
|
||||
padding: 0.5rem 1rem;
|
||||
color: rgba(255, 255, 255, 0.87);
|
||||
|
|
@ -973,6 +987,13 @@
|
|||
outline-offset: 0;
|
||||
box-shadow: inset 0 0 0 1px #cf95d9;
|
||||
}
|
||||
.p-listbox .p-listbox-list .p-listbox-item-group {
|
||||
margin: 0;
|
||||
padding: 0.75rem 1rem;
|
||||
color: rgba(255, 255, 255, 0.87);
|
||||
background: #1f2d40;
|
||||
font-weight: 600;
|
||||
}
|
||||
.p-listbox .p-listbox-list .p-listbox-empty-message {
|
||||
padding: 0.5rem 1rem;
|
||||
color: rgba(255, 255, 255, 0.87);
|
||||
|
|
@ -1107,6 +1128,13 @@
|
|||
.p-multiselect-panel .p-multiselect-items .p-multiselect-item .p-checkbox {
|
||||
margin-right: 0.5rem;
|
||||
}
|
||||
.p-multiselect-panel .p-multiselect-items .p-multiselect-item-group {
|
||||
margin: 0;
|
||||
padding: 0.75rem 1rem;
|
||||
color: rgba(255, 255, 255, 0.87);
|
||||
background: #1f2d40;
|
||||
font-weight: 600;
|
||||
}
|
||||
.p-multiselect-panel .p-multiselect-items .p-multiselect-empty-message {
|
||||
padding: 0.5rem 1rem;
|
||||
color: rgba(255, 255, 255, 0.87);
|
||||
|
|
|
|||
|
|
@ -1,6 +1,24 @@
|
|||
import {ObjectUtils} from 'primevue/utils';
|
||||
|
||||
const FilterService = {
|
||||
filter(value, fields, filterValue, filterMatchMode, filterLocale) {
|
||||
let filteredItems = [];
|
||||
|
||||
if (value) {
|
||||
for (let item of value) {
|
||||
for (let field of fields) {
|
||||
let fieldValue = ObjectUtils.resolveFieldData(item, field);
|
||||
|
||||
if (this.filters[filterMatchMode](fieldValue, filterValue, filterLocale)) {
|
||||
filteredItems.push(item);
|
||||
break;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
return filteredItems;
|
||||
},
|
||||
filters: {
|
||||
startsWith(value, filter, filterLocale) {
|
||||
if (filter === undefined || filter === null || filter.trim() === '') {
|
||||
|
|
|
|||
|
|
@ -42,7 +42,9 @@ const defaultOptions = {
|
|||
weak: 'Weak',
|
||||
medium: 'Medium',
|
||||
strong: 'Strong',
|
||||
passwordPrompt: 'Enter a password'
|
||||
passwordPrompt: 'Enter a password',
|
||||
emptyFilterMessage: 'No results found',
|
||||
emptyMessage: 'No available options'
|
||||
},
|
||||
filterMatchModeOptions: {
|
||||
text: [
|
||||
|
|
|
|||
|
|
@ -6,6 +6,8 @@ interface ListboxProps {
|
|||
optionLabel?: string;
|
||||
optionValue?: any;
|
||||
optionDisabled?: boolean;
|
||||
optionGroupLabel?: string;
|
||||
optionGroupChildren?: string;
|
||||
listStyle?: string;
|
||||
disabled?: boolean;
|
||||
dataKey?: string;
|
||||
|
|
@ -14,8 +16,11 @@ interface ListboxProps {
|
|||
filter?: boolean;
|
||||
filterPlaceholder?: string;
|
||||
filterLocale?: string;
|
||||
filterMatchMode?: string;
|
||||
filterFields?: string[];
|
||||
ariaLabelledBy?: string;
|
||||
emptyFilterMessage?: string;
|
||||
emptyMessage?: string;
|
||||
}
|
||||
|
||||
declare class Listbox {
|
||||
|
|
|
|||
|
|
@ -1,5 +1,6 @@
|
|||
<template>
|
||||
<div class="p-listbox p-component">
|
||||
<slot name="header" :value="modelValue" :options="visibleOptions"></slot>
|
||||
<div class="p-listbox-header" v-if="filter">
|
||||
<div class="p-listbox-filter-container">
|
||||
<input type="text" class="p-listbox-filter p-inputtext p-component" v-model="filterValue" :placeholder="filterPlaceholder" @input="onFilterChange">
|
||||
|
|
@ -8,21 +9,39 @@
|
|||
</div>
|
||||
<div class="p-listbox-list-wrapper" :style="listStyle">
|
||||
<ul class="p-listbox-list" role="listbox" aria-multiselectable="multiple">
|
||||
<li v-for="(option, i) of visibleOptions" :tabindex="isOptionDisabled(option) ? null : '0'" :class="['p-listbox-item', {'p-highlight': isSelected(option), 'p-disabled': isOptionDisabled(option)}]" v-ripple
|
||||
:aria-label="getOptionLabel(option)" :key="getOptionRenderKey(option)" @click="onOptionSelect($event, option)" @touchend="onOptionTouchEnd()" @keydown="onOptionKeyDown($event, option)" role="option" :aria-selected="isSelected(option)">
|
||||
<slot name="option" :option="option" :index="i">
|
||||
{{getOptionLabel(option)}}
|
||||
</slot>
|
||||
<template v-if="!optionGroupLabel">
|
||||
<li v-for="(option, i) of visibleOptions" :tabindex="isOptionDisabled(option) ? null : '0'" :class="['p-listbox-item', {'p-highlight': isSelected(option), 'p-disabled': isOptionDisabled(option)}]" v-ripple
|
||||
:key="getOptionRenderKey(option)" @click="onOptionSelect($event, option)" @touchend="onOptionTouchEnd()" @keydown="onOptionKeyDown($event, option)" role="option" :aria-label="getOptionLabel(option)" :aria-selected="isSelected(option)" >
|
||||
<slot name="option" :option="option" :index="i">{{getOptionLabel(option)}} </slot>
|
||||
</li>
|
||||
</template>
|
||||
<template v-else>
|
||||
<template v-for="(optionGroup, i) of visibleOptions" :key="getOptionGroupRenderKey(optionGroup)">
|
||||
<li class="p-listbox-item-group" >
|
||||
<slot name="optiongroup" :option="optionGroup" :index="i">{{getOptionGroupLabel(optionGroup)}}</slot>
|
||||
</li>
|
||||
<li v-for="(option, i) of getOptionGroupChildren(optionGroup)" :tabindex="isOptionDisabled(option) ? null : '0'" :class="['p-listbox-item', {'p-highlight': isSelected(option), 'p-disabled': isOptionDisabled(option)}]" v-ripple
|
||||
:key="getOptionRenderKey(option)" @click="onOptionSelect($event, option)" @touchend="onOptionTouchEnd()" @keydown="onOptionKeyDown($event, option)" role="option" :aria-label="getOptionLabel(option)" :aria-selected="isSelected(option)" >
|
||||
<slot name="option" :option="option" :index="i">{{getOptionLabel(option)}}</slot>
|
||||
</li>
|
||||
</template>
|
||||
</template>
|
||||
<li v-if="filterValue && (!visibleOptions || (visibleOptions && visibleOptions.length === 0))" class="p-listbox-empty-message">
|
||||
<slot name="emptyfilter">{{emptyFilterMessageText}}</slot>
|
||||
</li>
|
||||
<li v-else-if="(!options || (options && options.length === 0))" class="p-listbox-empty-message">
|
||||
<slot name="empty">{{emptyMessageText}}</slot>
|
||||
</li>
|
||||
<li v-if="filterValue && (!visibleOptions || (visibleOptions && visibleOptions.length === 0))" class="p-listbox-empty-message">{{emptyFilterMessage}}</li>
|
||||
</ul>
|
||||
</div>
|
||||
<slot name="footer" :value="modelValue" :options="visibleOptions"></slot>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import {ObjectUtils} from 'primevue/utils';
|
||||
import {DomHandler} from 'primevue/utils';
|
||||
import {FilterService} from 'primevue/api';
|
||||
import Ripple from 'primevue/ripple';
|
||||
|
||||
export default {
|
||||
|
|
@ -33,6 +52,8 @@ export default {
|
|||
optionLabel: null,
|
||||
optionValue: null,
|
||||
optionDisabled: null,
|
||||
optionGroupLabel: null,
|
||||
optionGroupChildren: null,
|
||||
listStyle: null,
|
||||
disabled: Boolean,
|
||||
dataKey: null,
|
||||
|
|
@ -41,9 +62,21 @@ export default {
|
|||
filter: Boolean,
|
||||
filterPlaceholder: String,
|
||||
filterLocale: String,
|
||||
filterMatchMode: {
|
||||
type: String,
|
||||
default: 'contains'
|
||||
},
|
||||
filterFields: {
|
||||
type: Array,
|
||||
default: null
|
||||
},
|
||||
emptyFilterMessage: {
|
||||
type: String,
|
||||
default: 'No results found'
|
||||
default: null
|
||||
},
|
||||
emptyMessage: {
|
||||
type: String,
|
||||
default: null
|
||||
}
|
||||
},
|
||||
optionTouched: false,
|
||||
|
|
@ -65,6 +98,15 @@ export default {
|
|||
isOptionDisabled(option) {
|
||||
return this.optionDisabled ? ObjectUtils.resolveFieldData(option, this.optionDisabled) : false;
|
||||
},
|
||||
getOptionGroupRenderKey(optionGroup) {
|
||||
return ObjectUtils.resolveFieldData(optionGroup, this.optionGroupLabel);
|
||||
},
|
||||
getOptionGroupLabel(optionGroup) {
|
||||
return ObjectUtils.resolveFieldData(optionGroup, this.optionGroupLabel);
|
||||
},
|
||||
getOptionGroupChildren(optionGroup) {
|
||||
return ObjectUtils.resolveFieldData(optionGroup, this.optionGroupChildren);
|
||||
},
|
||||
onOptionSelect(event, option) {
|
||||
if (this.disabled || this.isOptionDisabled(option)) {
|
||||
return;
|
||||
|
|
@ -229,13 +271,36 @@ export default {
|
|||
},
|
||||
computed: {
|
||||
visibleOptions() {
|
||||
if (this.filterValue)
|
||||
return this.options.filter(option => this.getOptionLabel(option).toLocaleLowerCase(this.filterLocale).indexOf(this.filterValue.toLocaleLowerCase(this.filterLocale)) > -1);
|
||||
else
|
||||
if (this.filterValue) {
|
||||
if (this.optionGroupLabel) {
|
||||
let filteredGroups = [];
|
||||
for (let optgroup of this.options) {
|
||||
let filteredSubOptions = FilterService.filter(this.getOptionGroupChildren(optgroup), this.searchFields, this.filterValue, this.filterMatchMode, this.filterLocale);
|
||||
if (filteredSubOptions && filteredSubOptions.length) {
|
||||
filteredGroups.push({...optgroup, ...{items: filteredSubOptions}});
|
||||
}
|
||||
}
|
||||
return filteredGroups
|
||||
}
|
||||
else {
|
||||
return FilterService.filter(this.options, this.searchFields, this.filterValue, 'contains', this.filterLocale);
|
||||
}
|
||||
}
|
||||
else {
|
||||
return this.options;
|
||||
}
|
||||
},
|
||||
equalityKey() {
|
||||
return this.optionValue ? null : this.dataKey;
|
||||
},
|
||||
searchFields() {
|
||||
return this.filterFields || [this.optionLabel];
|
||||
},
|
||||
emptyFilterMessageText() {
|
||||
return this.emptyFilterMessage || this.$primevue.config.locale.emptyFilterMessage;
|
||||
},
|
||||
emptyMessageText() {
|
||||
return this.emptyMessage || this.$primevue.config.locale.emptyMessage;
|
||||
}
|
||||
},
|
||||
directives: {
|
||||
|
|
|
|||
|
|
@ -13,8 +13,18 @@
|
|||
<h5>Single</h5>
|
||||
<Listbox v-model="selectedCity" :options="cities" optionLabel="name" style="width:15rem" />
|
||||
|
||||
<h5>Grouped</h5>
|
||||
<Listbox v-model="selectedGroupedCity" :options="groupedCities" optionLabel="label" style="width:15rem" optionGroupLabel="label" optionGroupChildren="items" listStyle="max-height:250px">
|
||||
<template #optiongroup="slotProps">
|
||||
<div class="p-d-flex p-ai-center country-item">
|
||||
<img src="../../assets/images/flag_placeholder.png" :class="'flag flag-' + slotProps.option.code.toLowerCase()" width="18" />
|
||||
<div>{{slotProps.option.label}}</div>
|
||||
</div>
|
||||
</template>
|
||||
</Listbox>
|
||||
|
||||
<h5>Advanced with Templating, Filtering and Multiple Selection</h5>
|
||||
<Listbox v-model="selectedCountries" :options="countries" :multiple="true" :filter="true" optionLabel="name" listStyle="max-height:250px" style="width:15rem">
|
||||
<Listbox v-model="selectedCountries" :options="countries" :multiple="true" :filter="true" optionLabel="name" listStyle="max-height:250px" style="width:15rem" filterPlaceholder="Search">
|
||||
<template #option="slotProps">
|
||||
<div class="country-item">
|
||||
<img src="../../assets/images/flag_placeholder.png" :class="'flag flag-' + slotProps.option.code.toLowerCase()" />
|
||||
|
|
@ -37,6 +47,7 @@ export default {
|
|||
return {
|
||||
selectedCity: null,
|
||||
selectedCountries: null,
|
||||
selectedGroupedCity: null,
|
||||
cities: [
|
||||
{name: 'New York', code: 'NY'},
|
||||
{name: 'Rome', code: 'RM'},
|
||||
|
|
@ -55,7 +66,34 @@ export default {
|
|||
{name: 'Japan', code: 'JP'},
|
||||
{name: 'Spain', code: 'ES'},
|
||||
{name: 'United States', code: 'US'}
|
||||
]
|
||||
],
|
||||
groupedCities: [{
|
||||
label: 'Germany', code: 'DE',
|
||||
items: [
|
||||
{label: 'Berlin', value: 'Berlin'},
|
||||
{label: 'Frankfurt', value: 'Frankfurt'},
|
||||
{label: 'Hamburg', value: 'Hamburg'},
|
||||
{label: 'Munich', value: 'Munich'}
|
||||
]
|
||||
},
|
||||
{
|
||||
label: 'USA', code: 'US',
|
||||
items: [
|
||||
{label: 'Chicago', value: 'Chicago'},
|
||||
{label: 'Los Angeles', value: 'Los Angeles'},
|
||||
{label: 'New York', value: 'New York'},
|
||||
{label: 'San Francisco', value: 'San Francisco'}
|
||||
]
|
||||
},
|
||||
{
|
||||
label: 'Japan', code: 'JP',
|
||||
items: [
|
||||
{label: 'Kyoto', value: 'Kyoto'},
|
||||
{label: 'Osaka', value: 'Osaka'},
|
||||
{label: 'Tokyo', value: 'Tokyo'},
|
||||
{label: 'Yokohama', value: 'Yokohama'}
|
||||
]
|
||||
}]
|
||||
}
|
||||
},
|
||||
components: {
|
||||
|
|
|
|||
|
|
@ -40,22 +40,73 @@ data() {
|
|||
|
||||
</code></pre>
|
||||
|
||||
<h5>Custom Content</h5>
|
||||
<p>Label of an option is used as the display text of an item by default, for custom content support define an <i>option</i> template that gets the option instance as a parameter.</p>
|
||||
<h5>Templating</h5>
|
||||
<p>Label of an option is used as the display text of an item by default, for custom content support define an <i>option</i> template that gets the option instance as a parameter. When grouping is enabled, use <i>optiongroup</i> to customize the group content.
|
||||
In addition <i>optiongroup</i>, <i>header</i>, <i>footer</i>, <i>emptyfilter</i> and <i>empty</i> slots are provided for further customization.</p>
|
||||
<pre v-code><code><template v-pre>
|
||||
<Listbox v-model="selectedCars" :options="cars" :multiple="true" :filter="true" optionLabel="brand" listStyle="max-height:250px" style="width:15em">
|
||||
<template #option="slotProps">
|
||||
<template #header></template>
|
||||
<template #option="slotProps">
|
||||
<div>
|
||||
<img :alt="slotProps.option.brand" :src="'demo/images/car/' + slotProps.option.brand + '.png'" />
|
||||
<span>{{slotProps.option.brand}}</span>
|
||||
</div>
|
||||
</template>
|
||||
<template #footer></footer>
|
||||
</Listbox>
|
||||
</template>
|
||||
</code></pre>
|
||||
|
||||
<h5>Grouping</h5>
|
||||
<p>Options groups are specified with the <i>optionGroupLabel</i> and <i>optionGroupChildren</i> properties.</p>
|
||||
<pre v-code.script><code>
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
selectedGroupedCity: null,
|
||||
groupedCities: [{
|
||||
label: 'Germany', code: 'DE',
|
||||
items: [
|
||||
{label: 'Berlin', value: 'Berlin'},
|
||||
{label: 'Frankfurt', value: 'Frankfurt'},
|
||||
{label: 'Hamburg', value: 'Hamburg'},
|
||||
{label: 'Munich', value: 'Munich'}
|
||||
]
|
||||
},
|
||||
{
|
||||
label: 'USA', code: 'US',
|
||||
items: [
|
||||
{label: 'Chicago', value: 'Chicago'},
|
||||
{label: 'Los Angeles', value: 'Los Angeles'},
|
||||
{label: 'New York', value: 'New York'},
|
||||
{label: 'San Francisco', value: 'San Francisco'}
|
||||
]
|
||||
},
|
||||
{
|
||||
label: 'Japan', code: 'JP',
|
||||
items: [
|
||||
{label: 'Kyoto', value: 'Kyoto'},
|
||||
{label: 'Osaka', value: 'Osaka'},
|
||||
{label: 'Tokyo', value: 'Tokyo'},
|
||||
{label: 'Yokohama', value: 'Yokohama'}
|
||||
]
|
||||
}]
|
||||
}
|
||||
}
|
||||
}
|
||||
</code></pre>
|
||||
|
||||
<pre v-code><code><template v-pre>
|
||||
<Listbox v-model="selectedGroupedCity" :options="groupedCities"
|
||||
optionLabel="label" optionGroupLabel="label" optionGroupChildren="items">
|
||||
</Listbox>
|
||||
</template>
|
||||
</code></pre>
|
||||
|
||||
<h5>Filter</h5>
|
||||
<p>Filtering allows searching items in the list using an input field at the header. In order to use filtering, enable <i>filter</i> property.</p>
|
||||
<p>Filtering allows searching items in the list using an input field at the header. In order to use filtering, enable <i>filter</i> property. By default,
|
||||
optionLabel is used when searching and <i>filterFields</i> can be used to customize the fields being utilized. Furthermore, <i>filterMatchMode</i> is available
|
||||
to define the search algorithm. Valid values are "contains" (default), "startsWith" and "endsWith".</p>
|
||||
<pre v-code><code>
|
||||
<Listbox v-model="selectedCity" :options="cities" optionLabel="name" :filter="true"/>
|
||||
|
||||
|
|
@ -104,6 +155,18 @@ data() {
|
|||
<td>null</td>
|
||||
<td>Property name or getter function to use as the disabled flag of an option, defaults to false when not defined.</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>optionGroupLabel</td>
|
||||
<td>string</td>
|
||||
<td>null</td>
|
||||
<td>Property name or getter function to use as the label of an option group.</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>optionGroupChildren</td>
|
||||
<td>string</td>
|
||||
<td>null</td>
|
||||
<td>Property name or getter function that refers to the children options of option group.</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>listStyle</td>
|
||||
<td>string</td>
|
||||
|
|
@ -153,11 +216,29 @@ data() {
|
|||
<td>undefined</td>
|
||||
<td>Locale to use in filtering. The default locale is the host environment's current locale.</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>filterMatchMode</td>
|
||||
<td>string</td>
|
||||
<td>contains</td>
|
||||
<td>Defines the filtering algorithm to use when searching the options. Valid values are "contains" (default), "startsWith" and "endsWith"</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>filterFields</td>
|
||||
<td>array</td>
|
||||
<td>null</td>
|
||||
<td>Fields used when filtering the options, defaults to optionLabel.</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>emptyFilterMessage</td>
|
||||
<td>string</td>
|
||||
<td>No results found</td>
|
||||
<td>Text to display when filtering does not return any results.</td>
|
||||
<td>Text to display when filtering does not return any results. Defaults to value from PrimeVue locale configuration.</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>emptyMessage</td>
|
||||
<td>string</td>
|
||||
<td>No results found</td>
|
||||
<td>Text to display when there are no options available. Defaults to value from PrimeVue locale configuration.</td>
|
||||
</tr>
|
||||
</tbody>
|
||||
</table>
|
||||
|
|
@ -190,6 +271,48 @@ data() {
|
|||
</table>
|
||||
</div>
|
||||
|
||||
<h5>Slots</h5>
|
||||
<div class="doc-tablewrapper">
|
||||
<table class="doc-table">
|
||||
<thead>
|
||||
<tr>
|
||||
<th>Name</th>
|
||||
<th>Parameters</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
<tr>
|
||||
<td>option</td>
|
||||
<td>option: Option instance <br />
|
||||
index: Index of the option</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>optiongroup</td>
|
||||
<td>option: OptionGroup instance <br />
|
||||
index: Index of the option group</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>header</td>
|
||||
<td>value: Value of the component <br />
|
||||
options: Displayed options</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>footer</td>
|
||||
<td>value: Value of the component <br />
|
||||
options: Displayed options</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>emptyfilter</td>
|
||||
<td>-</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>empty</td>
|
||||
<td>-</td>
|
||||
</tr>
|
||||
</tbody>
|
||||
</table>
|
||||
</div>
|
||||
|
||||
<h5>Styling</h5>
|
||||
<p>Following is the list of structural style classes, for theming classes visit <router-link to="/theming">theming</router-link> page.</p>
|
||||
<div class="doc-tablewrapper">
|
||||
|
|
@ -240,8 +363,18 @@ data() {
|
|||
<h5>Single</h5>
|
||||
<Listbox v-model="selectedCity" :options="cities" optionLabel="name" style="width:15rem" />
|
||||
|
||||
<h5>Grouped</h5>
|
||||
<Listbox v-model="selectedGroupedCity" :options="groupedCities" optionLabel="label" style="width:15rem" optionGroupLabel="label" optionGroupChildren="items" listStyle="max-height:250px">
|
||||
<template #optiongroup="slotProps">
|
||||
<div class="p-d-flex p-ai-center country-item">
|
||||
<img src="../../assets/images/flag_placeholder.png" :class="'flag flag-' + slotProps.option.code.toLowerCase()" width="18" />
|
||||
<div>{{slotProps.option.label}}</div>
|
||||
</div>
|
||||
</template>
|
||||
</Listbox>
|
||||
|
||||
<h5>Advanced with Templating, Filtering and Multiple Selection</h5>
|
||||
<Listbox v-model="selectedCountries" :options="countries" :multiple="true" :filter="true" optionLabel="name" listStyle="max-height:250px" style="width:15rem">
|
||||
<Listbox v-model="selectedCountries" :options="countries" :multiple="true" :filter="true" optionLabel="name" listStyle="max-height:250px" style="width:15rem" filterPlaceholder="Search">
|
||||
<template #option="slotProps">
|
||||
<div class="country-item">
|
||||
<img src="../../assets/images/flag_placeholder.png" :class="'flag flag-' + slotProps.option.code.toLowerCase()" />
|
||||
|
|
@ -258,6 +391,7 @@ export default {
|
|||
return {
|
||||
selectedCity: null,
|
||||
selectedCountries: null,
|
||||
selectedGroupedCity: null,
|
||||
cities: [
|
||||
{name: 'New York', code: 'NY'},
|
||||
{name: 'Rome', code: 'RM'},
|
||||
|
|
@ -276,7 +410,34 @@ export default {
|
|||
{name: 'Japan', code: 'JP'},
|
||||
{name: 'Spain', code: 'ES'},
|
||||
{name: 'United States', code: 'US'}
|
||||
]
|
||||
],
|
||||
groupedCities: [{
|
||||
label: 'Germany', code: 'DE',
|
||||
items: [
|
||||
{label: 'Berlin', value: 'Berlin'},
|
||||
{label: 'Frankfurt', value: 'Frankfurt'},
|
||||
{label: 'Hamburg', value: 'Hamburg'},
|
||||
{label: 'Munich', value: 'Munich'}
|
||||
]
|
||||
},
|
||||
{
|
||||
label: 'USA', code: 'US',
|
||||
items: [
|
||||
{label: 'Chicago', value: 'Chicago'},
|
||||
{label: 'Los Angeles', value: 'Los Angeles'},
|
||||
{label: 'New York', value: 'New York'},
|
||||
{label: 'San Francisco', value: 'San Francisco'}
|
||||
]
|
||||
},
|
||||
{
|
||||
label: 'Japan', code: 'JP',
|
||||
items: [
|
||||
{label: 'Kyoto', value: 'Kyoto'},
|
||||
{label: 'Osaka', value: 'Osaka'},
|
||||
{label: 'Tokyo', value: 'Tokyo'},
|
||||
{label: 'Yokohama', value: 'Yokohama'}
|
||||
]
|
||||
}]
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
@ -301,11 +462,21 @@ export default {
|
|||
<h5>Single</h5>
|
||||
<Listbox v-model="selectedCity" :options="cities" optionLabel="name" style="width:15rem" />
|
||||
|
||||
<h5>Grouped</h5>
|
||||
<Listbox v-model="selectedGroupedCity" :options="groupedCities" optionLabel="label" style="width:15rem" optionGroupLabel="label" optionGroupChildren="items" listStyle="max-height:250px">
|
||||
<template #optiongroup="slotProps">
|
||||
<div class="p-d-flex p-ai-center country-item">
|
||||
<img src="../../assets/images/flag_placeholder.png" :class="'flag flag-' + slotProps.option.code.toLowerCase()" width="18" />
|
||||
<div>{{slotProps.option.label}}</div>
|
||||
</div>
|
||||
</template>
|
||||
</Listbox>
|
||||
|
||||
<h5>Advanced with Templating, Filtering and Multiple Selection</h5>
|
||||
<Listbox v-model="selectedCountries" :options="countries" :multiple="true" :filter="true" optionLabel="name" listStyle="max-height:250px" style="width:15rem">
|
||||
<Listbox v-model="selectedCountries" :options="countries" :multiple="true" :filter="true" optionLabel="name" listStyle="max-height:250px" style="width:15rem" filterPlaceholder="Search">
|
||||
<template #option="slotProps">
|
||||
<div class="country-item">
|
||||
<img src="https://www.primefaces.org/wp-content/uploads/2020/05/placeholder.png" style="width: 18px; margin-right: .5rem;"/>
|
||||
<img src="../../assets/images/flag_placeholder.png" :class="'flag flag-' + slotProps.option.code.toLowerCase()" />
|
||||
<div>{{slotProps.option.name}}</div>
|
||||
</div>
|
||||
</template>
|
||||
|
|
@ -321,6 +492,7 @@ export default {
|
|||
return {
|
||||
selectedCity: null,
|
||||
selectedCountries: null,
|
||||
selectedGroupedCity: null,
|
||||
cities: [
|
||||
{name: 'New York', code: 'NY'},
|
||||
{name: 'Rome', code: 'RM'},
|
||||
|
|
@ -339,7 +511,34 @@ export default {
|
|||
{name: 'Japan', code: 'JP'},
|
||||
{name: 'Spain', code: 'ES'},
|
||||
{name: 'United States', code: 'US'}
|
||||
]
|
||||
],
|
||||
groupedCities: [{
|
||||
label: 'Germany', code: 'DE',
|
||||
items: [
|
||||
{label: 'Berlin', value: 'Berlin'},
|
||||
{label: 'Frankfurt', value: 'Frankfurt'},
|
||||
{label: 'Hamburg', value: 'Hamburg'},
|
||||
{label: 'Munich', value: 'Munich'}
|
||||
]
|
||||
},
|
||||
{
|
||||
label: 'USA', code: 'US',
|
||||
items: [
|
||||
{label: 'Chicago', value: 'Chicago'},
|
||||
{label: 'Los Angeles', value: 'Los Angeles'},
|
||||
{label: 'New York', value: 'New York'},
|
||||
{label: 'San Francisco', value: 'San Francisco'}
|
||||
]
|
||||
},
|
||||
{
|
||||
label: 'Japan', code: 'JP',
|
||||
items: [
|
||||
{label: 'Kyoto', value: 'Kyoto'},
|
||||
{label: 'Osaka', value: 'Osaka'},
|
||||
{label: 'Tokyo', value: 'Tokyo'},
|
||||
{label: 'Yokohama', value: 'Yokohama'}
|
||||
]
|
||||
}]
|
||||
}
|
||||
}
|
||||
}`
|
||||
|
|
|
|||
Loading…
Reference in New Issue