These components are simple copy-paste ones. All you need to do is to set up your development environment (with Sass compile and installed Spruce CSS), create a preferred folder structure, paste the necessary files, and import/forward them.
- Some components use custom JS too, which you will see under the code panel.
- Some of them have dependencies that you must include in your build.
For a simple compilation example, check out our starter repository. Here you will find an example for:
- How to compile Sass the most straightforward way.
- How to install Spruce CSS through NPM.
- How to create a basic folder structure.
- How to include Spruce CSS and the UI components into your project.
Preview
You can open any component in a separate browser window to see it individually (mostly, we add some markup because of the presentation). When you do so, you can add two query strings to activate the dark color mode and the RTL direction (or both):
htmlhttps://ui.sprucecss.com/html/component/auth-form-preview.html?theme-mode=darkhttps://ui.sprucecss.com/html/component/auth-form-preview.html?dir=rtlhttps://ui.sprucecss.com/html/component/auth-form-preview.html?theme-mode=dark&dir=rtl
