gitthermal / gitthermal/thermal

Thermal design system

Open
#81 4 comments 1 reaction 0 assignees View on GitHub
⚙ Improvement 🏃🏻‍♀️ Priority medium Design discussion Front end help wanted
Dominant language
Vue
Stars
455
Forks
34
PR merge metrics
No merged PRs in 30d

Description

Use Vue components everywhere to build the application from a small button to a diff preview component.

Split the components into a separate package so it can be used across Thermal ecosystem _(Application, Website, and Marketing)_.

### Questions

- Should we style the components inline or in separate `.sass` file?
- How to name component and props?
- Is it the best way to use mixins for [spacing](https://github.com/gitthermal/thermal/blob/master/src/renderer/mixins/spacingProps.js), [font](https://github.com/gitthermal/thermal/blob/master/src/renderer/mixins/fontProps.js) and [border](https://github.com/gitthermal/thermal/blob/master/src/renderer/mixins/borderProps.js)?
- How can we leverage sass variables in Vue components?

## PRs

- [x] #111 `TModal` Modal component
- [x] #115 `TScrollbar` Scrollbar Layout
- [x] #125 `TButton` Button component
- [x] #128 `TFlexbox` Flexbox Layout
- [x] #137 `TContainer` Container Layout
- [ ] `TSwitch` Switch component
- [ ] `TLink` Link component
- [ ] `TText` Text component
- [ ] `TIcon` Icon component
- [ ] `TInput` Input component
- [ ] `TRadio` Radio component
- [ ] `TImage` Image component
- [ ] `TTag` Tag component
- [ ] `TDropdown` Dropdown component
- [ ] `TNotification` Notification component
- [ ] `TTooltips` Tooltips component
- [ ] Default color provider

## References

* https://github.com/gitthermal/thermal/issues/38

_We are looking for a more modular way to define and use Vue components for the long term, if you have any feedback or suggestion, 🙏🏻 please drop them in the comment section below._

Contributor guide

Open the contributing guide

Assessment

This issue has not been assessed yet.

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.