zstyl 中文文档教程

Question

zstyl

JS 框架中的 CSS，类似于 zheleznaya 的样式组件。

如何使用

import { h, render } from "zheleznaya";
import { styled } from "zstyl";

const Header = styled<{
  color: string;
}>`
  display: flex;
  justify-content: center;
  background: ${({ color }) => color}

  &:hover {
    background: #000;
  }

  div.inner {
    height: 200px;

    span {
      color: yellow;
    }
  }

  @media (max-width: 720px) {
    display: inline-flex;
  }
`;

render(
  <Header>
    <div class="inner">200px height</div>
  </Header>
);