kids-first / kf-uikit

🎨 Design System for Kids First
https://kf-uikit.netlify.com
Apache License 2.0
1 stars 1 forks source link

✨ Add badge component #107

Open XuTheBunny opened 5 years ago

XuTheBunny commented 5 years ago

Motivation

Adds badge component for labels and stats. image

Use Cases

  1. Kids First Data Tracker image

  2. Kids First Coordinator image image image

  3. Kids First Portal image

API changes

No API changes are made on this component.

Implementation Notes

Referencing Colors in the storybook and color options.

Rendering and Storybook location

src/
└── components
    ├── Badge
    │   ├── __tests__/
    │   ├── Badge.jsx
    │   ├── Badge.story.jsx
    │   └── Badge.css
    └── index.js

Functional Tests

Test badge component under all the color options and on loading or not.

dankolbman commented 5 years ago

UIKit Storybook for Review

Built with commit 6a549bb6741ed019ee1a1e5763e0038df11d6026

https://deploy-preview-107--kf-uikit.netlify.com

dankolbman commented 5 years ago

Story book is returning an error :( Also, due to kids-first/kf-ui-data-tracker#155, maybe we want to rethink how these should be styled? @bdolly @XuTheBunny

bdolly commented 5 years ago

maybe we want to rethink how these should be styled? @bdolly @XuTheBunny

Agreed, I think @allisonheath wanted to be part of that discussion as well as it involves brand standards

allisonheath commented 5 years ago

I don't think I necessarily need to be there for the initial discussions/ideas, but if you all can come up with an option or two I can review/inform.