spree 3.0 bootstrap 自定义如何

Question

我已经安装了 Spree 3-0-Stable 测试站点，我想添加 bootswatch 主题并更改一些 bootstrap 项的填充。

我很难理解我在哪里做的。

一个例子是我想修改 .panel-footer padding，这样商品价格就会显示在一个较小的框中。

我认为覆盖应该进入 app/assets/stylesheets/spree/frontend。

当我添加以下内容时

    .panel-footer {
      /* padding: 10px 15px; */
      background-color: #f5f5f5;
      border-top: 1px solid #ddd;
      border-bottom-right-radius: 3px;
      border-bottom-left-radius: 3px;
    }
@import "bootstrap";

到

app/assets/stylesheets/spree/frontend/frontend_bootstrap.css.scss

价格框的填充没有改变，但网格中项目的等间距丢失了。

我正在按照正确的方式自定义商店吗？

Answer 1

不，你永远不应该以这种方式定制，因为当狂欢得到更新时，您的所有组件都将被覆盖，您将丢失所有更新。所以最好开始使用狂欢指南中给出的污损覆盖。首先它看起来很难但是一旦看完这个视频，您就可以轻松使用污损覆盖概念。

https://www.youtube.com/watch?v=pirTIAy1NVM

spree 3.0 bootstrap 自定义如何

spree 3.0 bootstrap customization how to

css

twitter-bootstrap

ruby-on-rails-4

sass

spree