rescript-polished

    2.0.0 • Public • Published

    rescript-polished

    GitHub Workflow Status npm Codecov

    Bindings for polished, a lightweight toolset for writing styles in JavaScript, now in ReScript .

    Note: these bindings are still under development, check the Polished module to see the available functions.

    Installation

    Add to your project using the package manager of your preference:

    npm install --save rescript-polished
    # or yarn:
    yarn add rescript-polished

    Add rescript-polished as a bs-dependency in your bsconfig.json:

    "bs-dependencies": [
      "rescript-polished"
    ]

    Usage

    For better convenience in ReScript, these bindings were written in a data-first style, so the API might slightly different from the original polished package. Keep that in mind when consuming the Polished module.

    open Polished
    
    let primaryColor = "#ed5051"
    let primaryColorLight = primaryColor->Color.lighten(~amount=0.25) // #f9c4c4
    let primaryColorDark = primaryColor->Color.darken(~amount=0.25) // #ac1213
    let secondaryColor = primaryColor->Color.complement // #50edec

    If you're using bs-css or bs-css-emotion, you can use PolishedCss:

    module Style = {
      open CssJs
      open PolishedCss
    
      let primary = #hex("e6484f") // or any possible Css_AtomicTypes.Color.t
    
      let button = style(. [
        background(primary),
        hover([background(primary->Color.lighten(0.25))])
        active([background(primary->Color.darken(0.25)]),
        focus([
          boxShadow(
            Shadow.box(
              primary->Color.transparentize(~amount=0.8),
              ~spread=#rem(0.25),
            ),
          ),
        ]),
      ])
    }

    License

    MIT

    Install

    npm i rescript-polished

    DownloadsWeekly Downloads

    12

    Version

    2.0.0

    License

    MIT

    Unpacked Size

    22.4 kB

    Total Files

    15

    Last publish

    Collaborators

    • brnrdog