vue.js - 如何在 vuejs 中正确调整 CoreUI 侧边栏宽度？

Question

我尝试更改 CoreUI 边栏宽度。但是在coreui文档中并没有具体说明如何修改。

我尝试手动将 css 样式添加到 Vuejs 组件，但没有成功。

//这里是coreui proejct的代码

从'@coreui/vue'导入{Sidebar as AppSidebar}

  <AppSidebar fixed>
    <SidebarHeader/>
    <SidebarForm/>
    <SidebarNav :navItems="nav"></SidebarNav>
    <SidebarFooter/>
    <SidebarMinimizer/>
  </AppSidebar>

我希望任何人都可以为我提供这个问题的答案。非常感谢

Answer 1

如果您使用的是 SCSS，请使用您喜欢的宽度大小覆盖 _variables.scss 中的以下变量。例如，以下代码将侧边栏设置为 250 像素宽。导航栏品牌宽度设置得稍微短一些，以照顾菜单按钮。

// Variable overrides
$navbar-brand-width:                  205px !default;
$sidebar-width:                       250px !default;