在 FileZilla 中使用带有变量自定义的 Bulma

Question

我在 FileZilla 上有一个站点运行。我想在其中使用 Bulma，我可以通过 unpkg 来实现。我的问题是我的网站与 Bulma 的绿松石配色方案不同。有什么方法可以更改配色方案：

没有SASS，纯CSS
使用 SASS 运行我的 FileZilla

根据我对 SASS 的理解，它不就是一个以纯 CSS 结束的预编译器吗？如果是这样，那么我可以更改纯 CSS 中的颜色变量吗？

谢谢

Answer 1

Bulma 在框架的核心使用 Sass 个变量 (see their documentation)。是的，Sass 代码被编译成纯 CSS，但是当发生这种情况时，每个变量都被注入到许多 CSS 语句中。

据我所知，不，没有不使用 Sass 自定义 Bulma 的好方法。但是，仅仅因为您使用的是 FileZilla，并不意味着您不能在自己的计算机上使用 Sass 来将 $primary 变量设置为新颜色，将其编译为 CSS，并将结果上传到FileZilla。

这里描述得很好： https://bulma.io/documentation/customize/with-sass-cli/

如果您真的不想走 Sass 路线，您始终可以在导入 Bulma 后手动重新设置每个元素的样式。但这可能很快就会变得笨拙。

快速，可能不完整，示例 .button:

<!doctype html>
<html class="no-js" lang="en">
<head>
  <link href="https://unpkg.com/bulma@0.5.3/css/bulma.css" rel="stylesheet">
  <style>
  .button.is-primary {
    background-color: red;
  }
  .button.is-primary:active,
  .button.is-primary.is-active {
    background-color: red;
  }
  .button.is-primary:hover {
    background-color: purple;
  }
  </style>
</head>
<body style="margin: 2rem auto">
<div style="text-align:center">
<button class="button is-primary">
Save
</button>
</div>
</body>
</html>

Answer 2

本质上，你不能。 SASS 被编译为 CSS，因此它是 'injects' 的值。

在 FileZilla 中使用带有变量自定义的 Bulma

Use Bulma w/ variable customization in FileZilla

css

sass

filezilla

bulma