更改mixins.scss不会更改导入它的CSS文件

时间:2014-11-03 11:26:18

标签: sass liferay liferay-6 mixins liferay-theme

以下是我们正在做的事情:

  • 我们正在创建一个钩子来修改\html\css\common\_mixins.scss文件。

更新部署时的文件。到目前为止一切都很好。

问题是导入此mixin的CSS文件未显示任何更改,例如此文件 - \webapps\ROOT\html\css\taglib\navbar.css

经过一些调试后,我发现.sass-cache中有一个\webapps\ROOT\html\css\taglib\.sass-cache文件夹,其中还包含门户网站使用的最终生成文件navbar.css

现在,当我部署钩子时,导入此mixin的所有CSS文件都不会在.sass-cache文件夹中重新编译/重新生成,这使得钩子无用。

有人可以告诉我是否有任何方法可以使用这个mixin或者是否有其他方法可以做到这一点,或者我可以使用这个mixins手动重新编译所有CSS文件,如果我知道如何。

此外,我发现删除.sass-cache不是一个选项,因为如果有热修复,liferay也会使用此文件夹修补CSS文件。

环境

与Tomcat捆绑的Liferay EE 6.2 SP9


来自comments

原因

我们需要更改此文件的原因是要有一种方法来禁用导航栏的响应元素。或者更好的是仍然禁用整个门户的响应能力。由于响应性是由媒体查询引起的。

由于

2 个答案:

答案 0 :(得分:1)

不可能通过钩子改变_mixins.scss,而且不仅仅是因为邪恶的sass-cache。

_mixins.scss编写的是SASS,它需要在sass-cache中编译和存储。每个主题都包含每个sass文件的编译版本。

唯一的方法是构建自己的主题并更改_mixins.scss或_diff文件夹中的任何其他文件。

为什么需要更改该特定文件?

答案 1 :(得分:0)

因此没有反映出这些变化,我认为CSS不适合挂钩。

所以在尝试了很多东西之后,我们仍然无法禁用响应,因此我们在主题中的custom.css中应用了以下CSS。这适用于导航栏,对于其他人我们可以再次单独包含这些样式。

@media (max-width: 979px) {
    .navbar .container {
        position: initial;
    }
    .navbar .container .btn-navbar {
        color: initial;
        display: none;
        margin-bottom: initial;
        width: initial;
    }
    .navbar .container .btn-navbar > .icon-bar:first-child {
        margin-top: initial;
    }
    .navbar .container .btn-navbar > .icon-bar:last-child {
        margin-bottom: initial;
    }
    .navbar .container .nav-collapse {
        display: initial;
    }
    .navbar .container .nav-collapse.open {
        display: initial;
        height: initial;
        overflow: initial;
    }
    .navbar .container .nav-collapse .btn {
        padding: initial;
    }
    .navbar .container .navbar-search {
        margin: initial;
        padding: initial;
    }
    .navbar .container .navbar-search .btn,
    .navbar .container .navbar-search .btn-link {
        clip: none;
        position: initial;
    }
    .navbar .container .navbar-search .form-search {
        margin: initial;
    }
    .navbar .container .navbar-search .form-search .input-append {
        display: initial;
        padding-right: initial;
    }
    .navbar .container .navbar-search .form-search .input-append .search-query {
        width: initial;
    }
}

此CSS代码取自this Liferay forum post