diff --git a/package.json b/package.json index fce1854..f25b023 100644 --- a/package.json +++ b/package.json @@ -1,51 +1,61 @@ { - "name": "@catppuccin/palette", - "version": "0.1.5", - "description": "Soothing pastel themes for the high-spirited!", - "main": "dist/index.js", - "module": "dist/index.mjs", - "exports": { - ".": { - "require": "./dist/index.cjs", - "import": "./dist/index.mjs" - }, - "./style": "./css/catppuccin.css" - }, - "scripts": { - "test": "ava", - "build": "node esbuild.js", - "prepublishOnly": "npm run build" - }, - "files": [ - "css/", - "dist/index.cjs", - "dist/index.mjs", - "index.d.ts" - ], - "types": "index.d.ts", - "repository": { - "type": "git", - "url": "git+https://github.com/catppuccin/palette.git" - }, - "keywords": [ - "pastel-colors", - "catppuccin", - "colors", - "theme", - "palette", - "soothing" - ], - "publishConfig": { - "access": "public" - }, - "author": "Catppuccin Org", - "license": "MIT", - "bugs": { - "url": "https://github.com/catppuccin/palette/issues" - }, - "homepage": "https://github.com/catppuccin/palette#readme", - "devDependencies": { - "ava": "^4.2.0", - "esbuild": "^0.14.42" - } + "name": "@catppuccin/palette", + "version": "0.1.6", + "description": "Soothing pastel themes for the high-spirited!", + "main": "dist/index.js", + "module": "dist/index.mjs", + "exports": { + ".": { + "require": "./dist/index.cjs", + "import": "./dist/index.mjs" + }, + "./style": "./css/catppuccin.css" + }, + "scripts": { + "test": "ava", + "build": "node esbuild.js", + "prepublishOnly": "npm run build" + }, + "files": [ + "css/*", + "dist/*", + "scss/*.scss", + "index.d.ts" + ], + "types": "index.d.ts", + "repository": { + "type": "git", + "url": "git+https://github.com/catppuccin/palette.git" + }, + "keywords": [ + "pastel-colors", + "catppuccin", + "colors", + "theme", + "palette", + "soothing" + ], + "publishConfig": { + "access": "public" + }, + "author": "Catppuccin Org", + "license": "MIT", + "bugs": { + "url": "https://github.com/catppuccin/palette/issues" + }, + "homepage": "https://github.com/catppuccin/palette#readme", + "funding": [ + { + "type": "opencollective", + "url": "https://opencollective.com/catppuccin" + }, + { + "type": "github", + "url": "https://github.com/sponsors/catppuccin" + } + ], + "devDependencies": { + "ava": "^4.2.0", + "esbuild": "^0.14.42" + } } diff --git a/scss/README.md b/scss/README.md index c9babbb..94e6771 100644 --- a/scss/README.md +++ b/scss/README.md @@ -4,12 +4,14 @@ There are two ways of using these Sass files: ## Import one-by-one -The easiest way to import a single flavour, is to use one of these 4 files:\ +The easiest way to import a single flavor, is to use one of these 4 files:\ `_latte.scss`, `_frappe.scss`, `_macchiato.scss`, `_mocha.scss` Input: ```scss @import "mocha"; +// sass is also part of the npm package: +// @use "~@catppuccin/palette/scss/catppuccin/mocha"; .my-mocha-class { background: $base; @@ -30,7 +32,7 @@ Output: Another way to create all four flavours, in a single file, from a single file, is to use `_catppuccin.scss`. -**NB**: Due to websafe colours being predefined in CSS, colours like `red`, `green`, `blue` will **not** be generated with this method, **when they are not** explicitly cast as a string. To ensure proper generation, wrap your values with `'`. +**NB**: Due to websafe colors being predefined in CSS, colors like `red`, `green`, `blue` will **not** be generated with this method, **when they are not** explicitly cast as a string. To ensure proper generation, wrap your values with `'`. In short:\ ❌ Don't do this: @@ -42,10 +44,12 @@ Input: ```scss @use "catppuccin"; +// sass is also part of the npm package: +// @use "~@catppuccin/palette/scss/catppuccin"; @each $flavour, $colour in catppuccin.$palette { .my-#{flavour}-class { - // you need surround the catppuccin colour names with quotes + // you need surround the catppuccin color names with quotes background: map-get($colour, 'base'); color: map-get($colour, 'blue'); }