fix: dropdown color

zio/stable
Anthony Fu 2022-11-24 21:34:35 +08:00
parent 071e11b8f4
commit c01acb7aa3
4 changed files with 21 additions and 2 deletions

View File

@ -9,7 +9,7 @@ provide(dropdownContextKey, {
</script> </script>
<template> <template>
<VDropdown v-bind="$attrs" ref="dropdown"> <VDropdown v-bind="$attrs" ref="dropdown" :class="{ dark: isDark }">
<slot /> <slot />
<template #popper="scope"> <template #popper="scope">
<slot name="popper" v-bind="scope" /> <slot name="popper" v-bind="scope" />

View File

@ -12,8 +12,10 @@ export default defineNuxtConfig({
}, },
css: [ css: [
'@unocss/reset/tailwind.css', '@unocss/reset/tailwind.css',
'floating-vue/dist/style.css',
'~/styles/vars.css', '~/styles/vars.css',
'~/styles/global.css', '~/styles/global.css',
'~/styles/dropdown.css',
], ],
alias: { alias: {
querystring: 'rollup-plugin-node-polyfills/polyfills/qs', querystring: 'rollup-plugin-node-polyfills/polyfills/qs',

View File

@ -1,6 +1,5 @@
import FloatingVue from 'floating-vue' import FloatingVue from 'floating-vue'
import { defineNuxtPlugin } from '#app' import { defineNuxtPlugin } from '#app'
import 'floating-vue/dist/style.css'
export default defineNuxtPlugin((nuxtApp) => { export default defineNuxtPlugin((nuxtApp) => {
nuxtApp.vueApp.use(FloatingVue) nuxtApp.vueApp.use(FloatingVue)

View File

@ -0,0 +1,18 @@
.v-popper--theme-dropdown .v-popper__inner {
--at-apply: bg-base text-base rounded border border-base shadow;
box-shadow: 0 6px 30px #0000001a;
}
.v-popper--theme-dropdown .v-popper__arrow-inner {
visibility: visible;
--at-apply: border-base;
}
.v-popper--theme-dropdown .v-popper__arrow-outer {
--at-apply: border-base;
}
.v-popper--theme-tooltip .v-popper__inner {
--at-apply: bg-base text-base rounded border border-base shadow;
padding: 7px 12px 6px;
}
.v-popper--theme-tooltip .v-popper__arrow-outer {
--at-apply: border-base;
}