diff --git a/docs/Sass.md b/docs/Sass.md index 94e6771..9d338fd 100644 --- a/docs/Sass.md +++ b/docs/Sass.md @@ -29,10 +29,10 @@ Output: ## Import the single-map file -Another way to create all four flavours, in a single file, from a single file, +Another way to create all four flavors, in a single file, from a single file, is to use `_catppuccin.scss`. -**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 `'`. +**NB**: Due to web safe 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: @@ -47,11 +47,11 @@ Input: // sass is also part of the npm package: // @use "~@catppuccin/palette/scss/catppuccin"; -@each $flavour, $colour in catppuccin.$palette { - .my-#{flavour}-class { +@each $flavor, $color in catppuccin.$palette { + .my-#{flavor}-class { // you need surround the catppuccin color names with quotes - background: map-get($colour, 'base'); - color: map-get($colour, 'blue'); + background: map-get($color, 'base'); + color: map-get($color, 'blue'); } } ```