
Synaptic Tuxedo
Synaptic tuxedo is a styled-components based component library build on top of ant-design. If you have no prior exposure to styled components, kindly go through their documentation.
Features
- Inherent support for design-systems. Implement your own with ease.
- Base elements like Box, FlexBox, Text etc straight out of the box.
- Implements most major UI components. For complete list of components, visit Tuxedo-storybook.
- Comes bundled with a default theme and also contains support for a custom theme.
- Flexible & composable.
- Built on top of ant-design and uses styled-components.
Documentation and Examples
Getting Started
Installing synaptic-tuxedo
// NPMnpm install synaptic-tuxedo --save // Yarnyarn add synaptic-tuxedo
Usage
ReactDOM
Using default theme
Step 1
Import default tuxedo theme which contains overrides for antd less
variables
// ES6; // ES5const antdTheme = ;
Follow the steps mentioned at antd/customize-theme and then in your webpack.config or config-overrides, use:
modifyVars:
Step 2
Use Provider
at the start of your project.
ReactDOM
Custom Theme
As mentioned above, synaptic-tuxedo offers support for custom design-system and theming.
Step 1
Pass a custom theme object as a prop to Provider
;<Provider theme=myTheme>...</Provider>
Step 2
For theming antd, pass your theme as an argument to antdTheme
modifyVars:
Built With
Versioning
We use SemVer for versioning. For the versions available, see the tags on this repository.
License
This project is licensed under the MIT License - see the LICENSE.md file for details