Question

我是编程新手，这是我的第一个Spree应用。我无法使用Spree和Spree Fancy更改我的应用程序的配色方案。我已经尝试了下面列出的一些教程和文档，但是我很难实现Deface和覆盖。我能够使用Deface app / overrides / update_footer.rb文件更新页面，其中包含以下内容：

Deface::Override.new(:virtual_path => 'spree/shared/_footer',
  :name => 'change address to boston',
  :replace  => "div.address",
  :text => "
      <div class='address'>
        New Location USA
      </div>
")

我的Gem文件是

gem 'rails', '4.0.3'
gem 'spree', github: 'spree/spree', branch: '2-2-stable'
gem 'spree_auth_devise', github: 'spree/spree_auth_devise', branch: '2-2-stable'
gem 'spree_fancy', github: 'spree/spree_fancy'

我试过的链接

http://railscasts.com/episodes/298-getting-started-with-spree?view=asciicast http://guides.spreecommerce.com/developer/deface_overrides_tutorial.html以及资产和观点指南。

自定义颜色的正确方法是什么？我希望一旦理解了这个过程，就能够做出其他改变。

Answer 1

您的deface覆盖无效，因为您正在尝试替换您覆盖的模板中不存在的内容。

在这里查看模板的来源： https://github.com/spree/spree/blob/v2.2.0/frontend/app/views/spree/shared/_footer.html.erb

我会把它贴在下面，因为它很小。

<footer id="footer" class="sixteen columns" data-hook>
  <div id="footer-left" class="columns alpha eight" data-hook>
    <p><%= Spree.t :powered_by  %> <%= link_to 'Spree', 'http://spreecommerce.com/' %></p>
  </div>
  <div id="footer-right" class="columns omega eight" data-hook></div>
</footer>

在你的deface覆盖中，你应该看到它适用于你改变它以覆盖该模板中的东西。例如，

:replace  => "#footer-left"

如果你只想改变一些颜色，你应该覆盖这个文件：

https://github.com/spree/spree_fancy/blob/master/app/assets/stylesheets/spree/fancy/variables_override.css.scss

然后，您可以重新定义此处列出的一些变量：

https://github.com/spree/spree_fancy/blob/a78d4b9017985405b497af9d8d4bc26949d19283/app/assets/stylesheets/spree/fancy/variables.css.scss#L4-L17

您还可以通过向其应用新CSS来设置元素样式，或者使用优先级较高的CSS选择器覆盖现有样式。

使用Spree和Spree Fancy如何自定义配色方案？

我的Gem文件是

我试过的链接

1 个答案: