@clearkit/one

ClearKit One

A Tailwind preset and accompanying stylesheet for use across Clearbit user interfaces.

Installation

yarn add @clearkit/one

Usage

Note that you'll need to install Tailwind in your project in order to consume @clearkit/one.

Once installed, pull in the @clearkit/one preset in your configuration and you're halfway there.

// Your project's tailwind.config.js
const preset = require('@clearkit/one');

module.exports = {
  presets: [preset],
  variants: {
    backgroundColor: ['even', 'odd'],
  },
};

Next, be sure to import the following stylesheet, as it contains all of the class definitions for any .ck-* prefixed component (e.g., ck-button, or ck-toast).

/* Your project's main CSS entry point */
@tailwind utilities;
@tailwind base;
@tailwind components;
@import '~@clearkit/one/dist/components.css';

Local Development

yarn
yarn start

Publish New Versions

This repo uses GitHub actions to automate releases and publishing. There is no need to manually create tags, releases, or publish to npm.

Follow the instructions for using actions when creating pull requests. Take careful note of how to use labels to create semantic versions.