1 个不稳定版本

0.0.1 2019年8月27日

#44#scoped

MIT/Apache

30KB
856

scoped_css

生成作用域CSS的工具。

如何使用

fn main() {
  let my_css = scoped_css::css!(
    .my_class {
      color: red;
    }
  );

  // this will generate a struct with a .classes.my_class field which
  // is an obfuscated &'static str.

  let my_app = scoped::smd!(
    <style>{ my_css.to_string() }</style>
    <div class={my_css.classes.my_class}>This will be red</div>
  );
}

// or the following, which generated a static variable named css
scoped_css::static_css!(
  .my_class {
    color: red;
  }
)

支持的CSS功能

支持类、id、标签和属性。不支持像 > 这样的选择器。

此外,还支持嵌套选择器。

scoped_css::static_css!(
  body.my_app #some_id[some-attr="hello"] {
    .nested_stuff_is_supported_too {
      color: blue;
    }
  }
)

待办事项和缺点

这相当原始,仅发布用于演示 :)

  • 不支持定义元素之间关系的选择器,例如 >
  • 不支持伪选择器
  • 不支持不合法的属性名称的类。例如,不支持带有短横线的类。
  • to_css_string 函数应该是一个特质,以便CSS可以传递。
  • 没有测试。
  • 无法更改静态CSS变量的名称或其类型。

依赖项

~1.5MB
~28K SLoC