@vtmn/css-design-tokens - npm Package Compare versions

Comparing version 1.1.0 to 1.1.1

package.json

		{
		"name": "@vtmn/css-design-tokens",
		"version": "1.1.0",
		"version": "1.1.1",
		"description": "Decathlon Design System - Vitamin specific CSS styles for design tokens",
		@@ -35,3 +35,3 @@ "homepage": "https://github.com/Decathlon/vitamin-web/tree/main/packages/sources/css/src/design-tokens",
		"svelte": "dist/index.css",
		"gitHead": "c71998ff2355e86131948c54a8bfbbe7f9e2cfb0"
		"gitHead": "4d6a964d70f5e6b2ccaf341f9336fe5bb8dbce1f"
		}

README.md

		@@ -31,4 +31,24 @@ # `@vtmn/css-design-tokens`

		Shown below is a sample link markup used to load from a CDN:
		You can install them with [FontSource](https://github.com/fontsource/fontsource):

		```sh
		# with npm
		npm i -S @fontsource/roboto @fontsource/roboto-condensed

		# with yarn
		yarn add @fontsource/roboto @fontsource/roboto-condensed
		```

		Then, within your app entry file or site component, import it in:

		```javascript
		import '@fontsource/roboto'; // Defaults to weight 400
		import '@fontsource/roboto/400.css'; // Specify weight
		import '@fontsource/roboto/400-italic.css'; // Specify weight and style
		```

		In order to enhance performance of your app, please read about [font subsetting](https://web.dev/font-best-practices/#subset-fonts). [FontSource explains it here](https://fontsource.org/docs/getting-started/subsets).

		Otherwise, you can also load them through CDN:

		```html
		@@ -41,3 +61,3 @@ <link

		You can also do it via CSS Import:
		Finally, you can also import them via CSS import:

		@@ -48,19 +68,2 @@ ```css

		Otherwise, you can install them with `typeface`:

		```sh
		# with npm
		npm i -S typeface-roboto typeface-roboto-condensed

		# with yarn
		yarn add typeface-roboto typeface-roboto-condensed
		```

		Then, you can import them in your entry-point:

		```javascript
		import 'typeface-roboto';
		import 'typeface-roboto-condensed';
		```

		## Usage
		@@ -67,0 +70,0 @@

New alerts