koosi v1.0.7

Koosi, the open source React components

this package need @emotion/react and @emotion/styled

download:

npm i koosi @emotion/react @emotion/styled

and you are ready to use it !

Avaible components:

<Div></Div>
<A></A>
<Image></Image>
<Span></Span>
<Input></Input>

the avaible props :

    "m": "margin",
    "margin": "margin",
    "mt": "margin-top",
    "mb": "margin-bottom",
    "mr": "margin-right",
    "ml": "margin-left",
    "p": "padding",
    "padding": "padding",
    "pt": "padding-top",
    "pb": "padding-bottom",
    "pr": "padding-right",
    "pl": "padding-left",
    "h": "height",
    "height": "height",
    "w": "width",
    "width": "width",
    "fs": "font-size",
    "fontSize": "font-size",
    "fw": "font-weight",
    "fontWeight": "font-weight",
    "fontFamily": "font-family",
    "ls": "letter-spacing",
    "letterSpacing": "letter-spacing",
    "c": "color",
    "color": "color",
    "d": "display",
    "display": "display",
    "jc": "justify-content",
    "bg": "background",
    "bgImg": "background-image",
    "bgSize": "background-size",
    "bgPos": "background-position",
    "br": "border-radius",
    "b": "border",
    "t": "transition",
    "ff": "flex-flow",
    "ai": "align-items",
    "ta": "text-align",
    "textAlign": "text-align",
    "pos": "position",
    "position": "position",
    "ow": "overflow-wrap",
    "ps": "place-self",
    "fd": "flex-direction",
    "bl": "border-left",
    "borderLeft": "border-left",
    "borderRight": "border-right",
    "borderBottom": "border-bottom",
    "bb": "border-bottom",
    "borderTop": "border-top",
    "bt": "border-top",
    "zi": "z-index",
    "zindex": "z-index",
    "outline": "outline",
    "textTransform": "text-transform",
    "tt": "text-transform"

more props added with the advancement of the project !

a small exemple :

<Div fs="20px" c="red">
    this is a text
</Div>

render a div with font-size of 20px and color red