Web components design decisions
This package provides a centralized and version-controlled way to manage and reuse the foundational design choices for our web components. It ensures a consistent look and feel across all components by offering a common set of SCSS variables and rules.
To use these design decisions in your project, you'll need to have Sass installed. You can then install this package via npm (or your preferred package manager):
``bash`
npm install @outbook/design-decisions
This package exposes SCSS variables and mixins that you can use in your own stylesheets.
The _measures.scss file contains variables related to spacing, sizing, and other measurements. To use them, import the main index.scss file into your SCSS file:
`scss
@use "@outbook/design-decisions" as design;
.my-component {
// Now you can use the variables from the package
padding: design.$spacing-medium;
}
`
Or, you can import the measures directly:
`scss
@use "@outbook/design-decisions/measures" as measures;
.my-component {
padding: measures.$spacing-medium;
}
`
The _outline.scss file contains variables related to outlines.
`scss
@use "@outbook/design-decisions/outline" as outline;
.my-component {
outline: outline.$outline-default;
}
``
This package is licensed under the Apache-2.0 License.