Styles - AbstractsThis package gathers all Sass tools and helpers used across the project. Every global variable, function, mixin and placeholder should be put in here. The rule of thumb for this folder is that it should not output a single line of CSS when compiled on its own. These are nothing but Sass helpers. Reference: Sass Guidelines > Architecture > Abstracts folder
Styles packages structureThe
Styles - Abstractspackage is created as part of restructuring Studyportals styling. This structure is based on a combination of SMACCS and the 7-1 pattern. More information about how we use the patterns, can be found in the Knowledge Vault.
Installing the packageInstall the package ``` npm install --save-dev @studyportals/styles-abstracts ```
Publishing the package on the GitHub Package Registry
- Ensure you are authenticated to the GitHub Package Registry. This section explains how.
Usage of functionalityHow can I use:
UsageThere are two ways to use this package:
- Import all files into your project.
- Select specific files to use in your project.
Using the entire packageTo use the entire package, you can import the
abstracts.scssfile from the package into your project. ``` // Import the entire abstracts package @import '~@studyportals/styles-abstracts/abstracts.scss'; // Importing using the full url @import './nodemodules/@studyportals/styles-abstracts/abstracts.scss'; ``` The
~is an alias for
node_modules. You might need to set this up in your project. Otherwise you can use the full url.