如何在spree_fancy上覆盖css.scss文件中的CSS类？

Question

我想覆盖spree_fancy的一些CSS文件：

https://github.com/spree/spree_fancy

当我找到要覆盖的文件时，我发现它是一个SCSS文件（SASS）。这是我正在采取的文件：

https://github.com/spree/spree_fancy/blob/2-1-stable/app/assets/stylesheets/store/components/_product_item.scss

我想，经过一些阅读后，我需要在我的本地应用程序上编写这个文件并在那里添加我要覆盖的类，如下所示：

https://github.com/spree/spree_fancy/blob/2-1-stable/app/assets/stylesheets/store/variables_override.css.scss

#product-thumbnails {
....
}

当我再次向服务器重新加载发送请求时，不会应用更改。我也尝试重新启动Web服务器，但仍然没有结果。

有人可以告诉我，如果我在这里遗漏了某些东西以使其正常工作吗？

*添加了我的variables_override.css.scss文件的内容：

#product-thumbnails {
  margin-right: -20px;

  li {
    border: none;
    margin-right: 12px;

    a {
      border: 1px solid lighten($body_text_color, 30);
      text-align: center;
      display: block;
      width: 70px;
      height: 70px;
      @include opacity(0.7);

      &:hover {
        @include opacity(1);
        border-color: $c_green;
      }

      &, img {
        @include border-radius(300px);
      }

      img {
        padding: 0px;
      }
    }

    &.selected a {
      @include opacity(1);
      border-color: $c_green;
    }
  }

}