爱意满满的作品展示区。
colliedog

写了个静态提取 css 的 css-in-jss 的库,能不能给点个 star https://github.com/colliejs/colliejs

  •  1
     
  •   colliedog · Jan 2, 2024 · 1434 views
    This topic created in 861 days ago, the information mentioned may be changed or developed.
    3 replies    2024-01-04 12:17:34 +08:00
    colliedog
        1
    colliedog  
    OP
       Jan 2, 2024
    import { absYCenter } from "@collie-ui/css";
    import { makeStyled } from "@colliejs/react";
    import { collieConfig } from "../collie.config";
    export const styled = makeStyled(collieConfig);

    export const StyledButton = styled("button", {
    w: 100,
    h: 40,
    _hover: {
    opacity: 0.8,
    background: "$primary",
    borderRadius: 10,
    color: "white",
    },
    _after: {
    h: "100%",
    w: [10, 4],
    background: "red",
    ...absYCenter({ right: 0 }),
    },

    variants: {
    size: {
    full: {
    w: "100%",
    },
    big: {
    w: 80,
    },
    md: {
    w: 40,
    },
    sm: {
    w: 20,
    },
    dynamic: x => ({
    //any size you want
    w: x,
    }),
    },
    shape: {
    round: {
    borderRadius: 9999,
    },
    rect: {
    borderRadius: 0,
    },
    },
    status: {
    disabled: {
    true: {
    cursor: "not-allowed",
    background: "$gray200",
    },
    },
    },
    },

    compoundVariants: [
    {
    size: "big",
    shape: "round",
    css: {
    background: "$gray200",
    },
    },
    ],
    defaultVariants: {
    shape: "rect",
    },
    });
    privateproxies
        2
    privateproxies  
       Jan 4, 2024
    支持一下
    colliedog
        3
    colliedog  
    OP
       Jan 4, 2024
    @privateproxies 感谢大佬
    About   ·   Help   ·   Advertise   ·   Blog   ·   API   ·   FAQ   ·   Solana   ·   5842 Online   Highest 6679   ·     Select Language
    创意工作者们的社区
    World is powered by solitude
    VERSION: 3.9.8.5 · 44ms · UTC 03:19 · PVG 11:19 · LAX 20:19 · JFK 23:19
    ♥ Do have faith in what you're doing.