Spica design system

Overview

Spica Design system is strongly based on the Bootstrap 4 library of components (atoms and molecules).

A small list of components, like tables and charts, are built with DevExpress set of components that mimic Bootstrap styling.

Usage

There are two types of styles:

• bootstrap variables overrides
• SDS components (custom atoms and molecules)
• bootstrap components overrides that cannot be modified via variables

Bootstrap variable overrides must be included before the bootstrap styles.

SDS styles should be placed after the bootstrap styles as it may use some sass variables and classes that are defined within the bootstrap.

Example

@import 'sds_bootstrap_variables';
@import "../node_modules/bootstrap/scss/bootstrap.scss";
@import 'sds_bootstrap';
@import 'sds_components';