代码之家  ›  专栏  ›  技术社区  ›  Tarvo Mäesepp

有些东西会覆盖Vuetify分割颜色

  •  1
  • Tarvo Mäesepp  · 技术社区  · 6 年前

    我有一个奇怪的问题,在将Vuetify从1.1.9更新到1.2.3之后,我所有的分隔符都比以前暗得多,并且在文档中的每个示例中都是这样。

    必须是这样的:

    enter image description here

    这是我的(我想你可以看到明显的不同):

    enter image description here

    在检查时,我能看到班级的颜色是正确的:

    .theme--light.v-divider {
        border-color: rgba(0,0,0,0.12);
    }
    

    还有一件事,正是由于某种原因,它将背景色覆盖为相同的颜色:

    .application .theme--light.v-navigation-drawer .v-divider, .application .theme--light.v-navigation-drawer:not(.v-navigation-drawer--floating) .v-navigation-drawer__border, .theme--light .v-navigation-drawer .v-divider, .theme--light .v-navigation-drawer:not(.v-navigation-drawer--floating) .v-navigation-drawer__border{background-color: rgba(0,0,0,.12));}
    

    在Chrome的工具中禁用这两个选项可以使分隔符颜色正确。

    所以问题是,为什么会这样,我能做些什么来解决这个问题?非常感谢您的帮助。

    编辑: 我认为它与更新无关,因为我回滚到早期版本以检查它是否是问题所在,而不是问题所在。

    1 回复  |  直到 4 年前
        1
  •  1
  •   Marat Badykov    6 年前

    最简单的解决方案是添加 !重要的 你的类,它不会被覆盖。

    .theme--light.v-divider {
        border-color: rgba(0,0,0,0.12) !important; 
    }