Thermal design system

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, font and border?
• How can we leverage sass variables in Vue components?

PRs

• #111 TModal Modal component
• #115 TScrollbar Scrollbar Layout
• #125 TButton Button component
• #128 TFlexbox Flexbox Layout
• #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.