fix: 🐛 fix scroll bar style (#617)
This commit is contained in:
parent
25692f8371
commit
c797ff5cb3
|
@ -1,7 +1,7 @@
|
|||
import { createApp } from 'vue'
|
||||
import App from './App.vue'
|
||||
import { setupI18n } from './locales'
|
||||
import { setupAssets } from './plugins'
|
||||
import { setupAssets, setupScrollbarStyle } from './plugins'
|
||||
import { setupStore } from './store'
|
||||
import { setupRouter } from './router'
|
||||
|
||||
|
@ -9,6 +9,8 @@ async function bootstrap() {
|
|||
const app = createApp(App)
|
||||
setupAssets()
|
||||
|
||||
setupScrollbarStyle()
|
||||
|
||||
setupStore(app)
|
||||
|
||||
setupI18n(app)
|
||||
|
|
|
@ -1,3 +1,4 @@
|
|||
import setupAssets from './assets'
|
||||
import setupScrollbarStyle from './scrollbarStyle'
|
||||
|
||||
export { setupAssets }
|
||||
export { setupAssets, setupScrollbarStyle }
|
||||
|
|
|
@ -0,0 +1,28 @@
|
|||
import { darkTheme, lightTheme } from 'naive-ui'
|
||||
|
||||
const setupScrollbarStyle = () => {
|
||||
const style = document.createElement('style')
|
||||
const styleContent = `
|
||||
::-webkit-scrollbar {
|
||||
background-color: transparent;
|
||||
width: ${lightTheme.Scrollbar.common?.scrollbarWidth};
|
||||
}
|
||||
::-webkit-scrollbar-thumb {
|
||||
background-color: ${lightTheme.Scrollbar.common?.scrollbarColor};
|
||||
border-radius: ${lightTheme.Scrollbar.common?.scrollbarBorderRadius};
|
||||
}
|
||||
html.dark ::-webkit-scrollbar {
|
||||
background-color: transparent;
|
||||
width: ${darkTheme.Scrollbar.common?.scrollbarWidth};
|
||||
}
|
||||
html.dark ::-webkit-scrollbar-thumb {
|
||||
background-color: ${darkTheme.Scrollbar.common?.scrollbarColor};
|
||||
border-radius: ${darkTheme.Scrollbar.common?.scrollbarBorderRadius};
|
||||
}
|
||||
`
|
||||
|
||||
style.innerHTML = styleContent
|
||||
document.head.appendChild(style)
|
||||
}
|
||||
|
||||
export default setupScrollbarStyle
|
Loading…
Reference in New Issue