fix: rename SCSS layer from 'utils' to 'utilities' for consistency

Co-authored-by: github-actions[bot] <41898282+github-actions[bot]@users.noreply.github.com>

README.md

@@ -23,24 +23,8 @@ A premium and open source dashboard template with a responsive and high-quality
 	</a>
 </p>
 
-<p align="center">
-	<a href="https://github.com/sponsors/codecalm" target="_blank">
-			<img src="https://raw.githubusercontent.com/tabler/tabler/dev/shared/static/sponsor-banner-homepage.svg" alt="Sponsor Banner">
-	</a>
-</p>
-
 ## Testing
 
-<p align="center">Visual testing with:</p>
-
-<p align="center">
-	<a href="https://argos-ci.com/" target="_blank">
-		<picture>
-			<img src="https://github.com/user-attachments/assets/7d231a26-eff5-4fc5-8392-b2a679a7c572" alt="Argos-CI" height="164" />
-		</picture>
-	</a>
-</p>
-
 <p align="center">Browser testing via:</p>
 
 <p align="center">

core/CHANGELOG.md

@@ -1,5 +1,11 @@
 # @tabler/core
 
+## 1.3.2
+
+### Patch Changes
+
+- 446c34e: Fix README file in core package
+
 ## 1.3.1
 
 ### Patch Changes

core/README.md

@@ -1 +0,0 @@
-../README.md

core/README.md

@@ -0,0 +1,42 @@
+# Tabler Core
+
+Tabler Core is a set of components and utilities for building web applications. It provides a collection of pre-designed components, such as buttons, forms, modals, and more, that can be easily customized and integrated into your projects.
+
+## 🔎 Preview
+
+Tabler is fully responsive and compatible with all modern browsers. Thanks to its modern and user-friendly design you can create a fully functional interface that users will love! Choose the layouts and components you need and customize them to make your design consistent and eye-catching. Every component has been created with attention to detail to make your interface beautiful!
+
+<p align="center">
+	<a href="https://preview.tabler.io" target="_blank">
+			<img src="https://raw.githubusercontent.com/tabler/tabler/dev/shared/static/tabler-preview.png" alt="Tabler Preview">
+	</a>
+</p>
+
+## Installation
+
+To install Tabler Core, you can use npm or yarn. Run one of the following commands in your terminal:
+
+```bash
+npm install @tabler/core
+```
+
+or
+
+```bash
+pnpm add @tabler/core
+```
+
+## Sponsors
+
+**If you want to support our project and help us grow it, you can [become a sponsor on GitHub](https://github.com/sponsors/codecalm) or just [donate on PayPal](https://paypal.me/codecalm) :)**
+
+<p align="center">
+	<a href="https://github.com/sponsors/codecalm">
+		<img src="https://cdn.jsdelivr.net/gh/tabler/sponsors@latest/sponsors.svg" alt="Tabler sponsors">
+	</a>
+</p>
+
+
+## License
+
+See the [LICENSE](https://github.com/tabler/tabler/blob/master/LICENSE) file.

core/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@tabler/core",
-  "version": "1.3.1",
+  "version": "1.3.2",
   "description": "Premium and Open Source dashboard template with responsive and high quality UI.",
   "homepage": "https://tabler.io",
   "scripts": {

core/scss/_bootstrap-components.scss

@@ -1,7 +1,14 @@
 // Layout & components
+@layer props {
   @import "bootstrap/scss/root";
+}
+
+@layer reset {
   @import "bootstrap/scss/reboot";
   @import "bootstrap/scss/type";
+}
+
+@layer components {
   @import "bootstrap/scss/images";
   @import "bootstrap/scss/containers";
   @import "bootstrap/scss/grid";
@@ -26,6 +33,9 @@
   @import "bootstrap/scss/spinners";
   @import "bootstrap/scss/offcanvas";
   @import "bootstrap/scss/placeholders";
+}
 
 // Utilities
+@layer utilities {
   @import "bootstrap/scss/utilities/api";
+}

core/scss/_core.scss

@@ -1,10 +1,15 @@
+@layer props, reset, layout, components, themes, vendors, utils;
+
 @import "config";
+
+@layer props {
+  @import "props";
+}
+
 @import "bootstrap-components";
 
-@import "props";
-
+@layer layout {
   @import "fonts/webfonts";
-
   @import "layout/root";
   @import "layout/animations";
   @import "layout/core";
@@ -12,7 +17,9 @@
   @import "layout/page";
   @import "layout/footer";
   @import "layout/dark";
+}
 
+@layer components {
   @import "ui/accordion";
   @import "ui/alerts";
   @import "ui/avatars";
@@ -66,9 +73,10 @@
   @import "ui/offcanvas";
   @import "ui/chat";
   @import "ui/signature";
-
   @import "helpers/index";
+}
 
+@layer utilities {
   @import "utils/background";
   @import "utils/colors";
   @import "utils/scroll";
@@ -76,8 +84,4 @@
   @import "utils/opacity";
   @import "utils/shadow";
   @import "utils/text";
-
-@import "debug";
-
-
-@import "debug";
+}

core/scss/_debug.scss

@@ -1,49 +0,0 @@
-$debug: false;
-
-@if $debug {
-  $colors: (
-    "blue": $blue,
-    "azure": $azure,
-    "indigo": $indigo,
-    "purple": $purple,
-    "pink": $pink,
-    "red": $red,
-    "orange": $orange,
-    "yellow": $yellow,
-    "lime": $lime,
-    "green": $green,
-    "teal": $teal,
-    "cyan": $cyan,
-  );
-
-  @each $name, $color in $colors {
-    @debug ("#{$name}: '#{$color}'");
-    @debug ("#{$name}-100: '#{tint-color($color, 8)}'");
-    @debug ("#{$name}-200: '#{tint-color($color, 6)}'");
-    @debug ("#{$name}-300: '#{tint-color($color, 4)}'");
-    @debug ("#{$name}-400: '#{tint-color($color, 2)}'");
-    @debug ("#{$name}-500: '#{$color}'");
-    @debug ("#{$name}-600: '#{shade-color($color, 2)}'");
-    @debug ("#{$name}-700: '#{shade-color($color, 4)}'");
-    @debug ("#{$name}-800: '#{shade-color($color, 6)}'");
-    @debug ("#{$name}-900: '#{shade-color($color, 8)}'");
-  }
-
-  @debug ("gray: '#{$gray-500}'");
-  @debug ("gray-100: '#{$gray-100}'");
-  @debug ("gray-200: '#{$gray-200}'");
-  @debug ("gray-300: '#{$gray-300}'");
-  @debug ("gray-400: '#{$gray-400}'");
-  @debug ("gray-500: '#{$gray-500}'");
-  @debug ("gray-600: '#{$gray-600}'");
-  @debug ("gray-700: '#{$gray-700}'");
-  @debug ("gray-800: '#{$gray-800}'");
-  @debug ("gray-900: '#{$gray-900}'");
-
-  @debug ("border-color: '#{$border-color}'");
-  @debug ("text-secondary: '#{$text-secondary}'");
-
-  @each $name, $color in $social-colors {
-    @debug ("#{$name}: '#{$color}'");
-  }
-}

core/scss/tabler-flags.scss

@@ -1,2 +1,5 @@
 @import "config";
+
+@layer components {
   @import "ui/flags";
+}

core/scss/tabler-marketing.scss

@@ -1,7 +1,7 @@
 @import "config";
-@import "variables";
 @import "utilities-marketing";
 
+@layer components {
   @import "marketing/core";
   @import "marketing/hero";
   @import "marketing/browser";
@@ -9,5 +9,8 @@
   @import "marketing/filters";
   @import "marketing/pricing";
   @import "marketing/shape";
+}
 
+@layer utilities {
   @import "bootstrap/scss/utilities/api";
+}

core/scss/tabler-payments.scss

@@ -1,2 +1,5 @@
 @import "config";
+
+@layer components {
   @import "ui/payments";
+}

core/scss/tabler-socials.scss

@@ -1,2 +1,5 @@
 @import "config";
+
+@layer components {
   @import "ui/social";
+}

core/scss/tabler-themes.scss

@@ -1,5 +1,6 @@
 @import "config";
 
+@layer themes {
   [data-bs-theme-base="slate"] {
     --#{$prefix}gray-50: #f8fafc;
     --#{$prefix}gray-100: #f1f5f9;
@@ -119,3 +120,4 @@
       }
     }
   }
+}

core/scss/tabler-vendors.scss

@@ -1,5 +1,6 @@
 @import "config";
 
+@layer vendors {
   @import "vendor/nouislider";
   @import "vendor/litepicker";
   @import "vendor/tom-select";
@@ -14,3 +15,4 @@
   @import "vendor/typed";
   @import "vendor/turbo";
   @import "vendor/fullcalendar";
+}

docs/CHANGELOG.md

@@ -1,5 +1,12 @@
 # @tabler/docs
 
+## 1.3.2
+
+### Patch Changes
+
+- Updated dependencies [446c34e]
+  - @tabler/core@1.3.2
+
 ## 1.3.1
 
 ### Patch Changes

docs/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@tabler/docs",
-  "version": "1.3.1",
+  "version": "1.3.2",
   "description": "",
   "private": true,
   "scripts": {

preview/CHANGELOG.md

@@ -1,5 +1,12 @@
 # @tabler/preview
 
+## 1.3.2
+
+### Patch Changes
+
+- Updated dependencies [446c34e]
+  - @tabler/core@1.3.2
+
 ## 1.3.1
 
 ### Patch Changes

preview/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@tabler/preview",
-  "version": "1.3.1",
+  "version": "1.3.2",
   "private": true,
   "scripts": {
     "build": "pnpm run clean && pnpm run css && pnpm run js && pnpm run html",

shared/includes/layout/footer.html

@@ -23,7 +23,7 @@
 						All rights reserved.
 					</li>
 					<li class="list-inline-item">
-						{% if environment == 'production' %}
+						{% if environment == 'production' or environment == 'preview' %}
 						<a href="{{ page | relative }}/changelog.html" class="link-secondary" rel="noopener">
 							v{{ package.version }}
 						</a>