/* import Google font icon */ @import url('https://fonts.googleapis.com/css2?family=Material+Symbols+Outlined:opsz,wght,FILL,GRAD@20..48,100..700,0..1,-50..200'); /* icon default set */ .material-symbols-outlined { font-variation-settings: 'FILL' 0, 'wght' 400, 'GRAD' 0, 'opsz' 40 } .material-fill { font-variation-settings: 'FILL' 1, 'wght' 400, 'GRAD' 0, 'opsz' 40 } /* vue-toast-notification */ .v-toast { @apply z-[99999] } .v-toast__item { @apply min-h-[48px] rounded-full } .v-toast__item .v-toast__text { @apply py-3 } /* Primevue */ /* sidebar */ .p-sidebar-left { @apply ml-14 } .p-sidebar-mask { height: calc(100vh - 104px) !important; top: 104px !important; z-index: 20; } .p-sidebar { @apply !shadow-[1px_0px_4px_rgba(0,0,0,0.25)] } .p-sidebar-header { @apply bg-neutral-200 border-b border-neutral-300 !py-2 !justify-between } .p-sidebar-right .p-sidebar-header { @apply flex-row-reverse !justify-end text-neutral-500 } .p-sidebar-right .p-sidebar { @apply !shadow-[-1px_0px_4px_rgba(0,0,0,0.25)] } /* inputswitch */ .p-inputswitch { @apply !w-11 !h-6 } .p-inputswitch.p-inputswitch-checked .p-inputswitch-slider { @apply !bg-primary } .p-inputswitch .p-inputswitch-slider:before { @apply !w-5 !h-5 !left-0.5 } /* slider 滑塊 */ .p-slider .p-slider-handle { @apply !h-3.5 !w-3.5 !border !border-primary } .p-slider.p-slider-horizontal .p-slider-handle { @apply !-my-2 } .p-slider.p-slider-horizontal { @apply !h-1 } /* radio */ /* p-radiobutton p-radiobutton-box p-radiobutton-icon */ .p-radiobutton { @apply !align-text-top } .p-radiobutton-box { @apply !bg-neutral-10 } .p-radiobutton-box .p-highlight:not(.p-disabled):hover { @apply !bg-neutral-10 } .p-radiobutton-icon { @apply !bg-primary } /* Dialog */ .p-dialog-header { @apply !p-0 !px-4 !bg-neutral-100 } .p-dialog-content { @apply !p-0 } /* DataTable */ .p-datatable-resizable > .p-datatable-wrapper { @apply !overflow-x-visible } /* 蓋住 inline style 的 overflow-auto,才能使 thead 定位 */ .p-datatable-wrapper { overflow: unset !important; }