Fixed #2856 - Header checkbox is not styled as expected in Material themes.
parent
ac714283c5
commit
fa5ff89a39
|
@ -35,7 +35,7 @@
|
|||
<span ref="firstHiddenFocusableElementOnOverlay" role="presentation" aria-hidden="true" class="p-hidden-accessible p-hidden-focusable" :tabindex="0" @focus="onFirstHiddenFocus"></span>
|
||||
<slot name="header" :value="modelValue" :options="visibleOptions"></slot>
|
||||
<div v-if="(showToggleAll && selectionLimit == null) || filter" class="p-multiselect-header">
|
||||
<div v-if="showToggleAll && selectionLimit == null" class="p-checkbox p-component" @click="onToggleAll">
|
||||
<div v-if="showToggleAll && selectionLimit == null" :class="headerCheckboxClass" @click="onToggleAll">
|
||||
<div class="p-hidden-accessible">
|
||||
<input type="checkbox" readonly :checked="allSelected" :aria-label="toggleAllAriaLabel" @focus="onHeaderCheckboxFocus" @blur="onHeaderCheckboxBlur">
|
||||
</div>
|
||||
|
@ -947,6 +947,12 @@ export default {
|
|||
'p-ripple-disabled': this.$primevue.config.ripple === false
|
||||
}];
|
||||
},
|
||||
headerCheckboxClass() {
|
||||
return ['p-checkbox p-component', {
|
||||
'p-checkbox-checked': this.allSelected,
|
||||
'p-checkbox-focused': this.headerCheckboxFocused
|
||||
}];
|
||||
},
|
||||
visibleOptions() {
|
||||
const options = this.optionGroupLabel ? this.flatOptions(this.options) : (this.options || []);
|
||||
|
||||
|
|
Loading…
Reference in New Issue