@surveyplanet/styles

SurveyPlanet SCSS base styles

Usage

<style lang="scss">
	@use '@surveyplanet/styles' as *;
	body {
		color: $color--blue;
		font: $font--default;
	}
</style>

Note: using as * will disregard the namespace set by the filename so you don't need to specify the module followed by the variable name e.g.: fonts.$font--default.

Alternate usage

You may only need a single module, you can import it like this:

<style lang="scss">
	@use '@surveyplanet/styles/src/colors.scss';
	.blue-txt {
		color: colors.$color--blue;
	}
</style>

Documentation

To see documentation for all the styles run the following command.

npm install
npm run docs

Create Snippets for VS Code

There is a script in the ./bin which will create VS Code Snippets for all the styles. To create VS Code Snippets:

npm install
./bin/snippets.cjs --save

You can get all available options with the --help flag.