@rolster/styles-foundations 2.6.3 → 2.6.4

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@rolster/styles-foundations",
-  "version": "2.6.3",
+  "version": "2.6.4",
   "description": "Front-end style pack to develop responsive and mobile projects on the web with Rolster.",
   "sass": "scss/styles.scss",
   "style": "dist/styles.css",
@@ -31,6 +31,6 @@
   },
   "repository": {
     "type": "git",
-    "url": "https://github.com/rolster-developments/styles-foundations"
+    "url": "git+https://github.com/rolster-developments/styles-foundations"
   }
 }

package/scss/components/data-table.scss

@@ -1,9 +1,9 @@
 // Rolster Technology Datatable Component
-// v2.6.1
+// v2.6.2
 // @license MIT
 // Author: Rolster Developers
 // Created: 20/Mar/2018
-// Updated: 08/Nov/2025
+// Updated: 13/Nov/2025
 
 @mixin datatable_cell() {
   --rlc-field-box-body-background: transparent;
@@ -45,6 +45,7 @@
 
   --rlc-switch-max-width: var(--rls-sizing-x16);
   --rlc-switch-component-height: var(--rls-sizing-x8);
+  --rlc-switch-element-width: var(--rls-sizing-x6);
   --rlc-switch-element-height: var(--rls-sizing-x4);
   --rlc-switch-element-radius: var(--rls-sizing-x4);
 

package/scss/foundations/colors.scss

@@ -1,30 +1,30 @@
 // Rolster Technology Colors Foundations
-// v2.6.5
+// v2.6.6
 // @license MIT
 // Author: Rolster Developers
 // Created: 03/Mar/2022
-// Updated: 26/Oct/2025
+// Updated: 13/Nov/2025
 
 @use 'helpers' as helpers;
 
 body {
-  --rls-app-color-900: var(--rls-project-color-900, #28323d);
+  --rls-app-color-900: var(--rls-project-color-900, #26303b);
 
-  --rls-app-color-800: var(--rls-project-color-800, #343957);
+  --rls-app-color-800: var(--rls-project-color-800, #323755);
 
-  --rls-app-color-700: var(--rls-project-color-700, #484d6b);
+  --rls-app-color-700: var(--rls-project-color-700, #464b60);
 
-  --rls-app-color-600: var(--rls-project-color-600, #626f9b);
+  --rls-app-color-600: var(--rls-project-color-600, #616e99);
 
-  --rls-app-color-500: var(--rls-project-color-500, #808dbe);
+  --rls-app-color-500: var(--rls-project-color-500, #828fbf);
 
   --rls-app-color-400: var(--rls-project-color-400, #bdc0dc);
 
   --rls-app-color-300: var(--rls-project-color-300, #d6d9f0);
 
-  --rls-app-color-200: var(--rls-project-color-200, #e5e8f5);
+  --rls-app-color-200: var(--rls-project-color-200, #e7eaf7);
 
-  --rls-app-color-100: var(--rls-project-color-100, #f4f7ff);
+  --rls-app-color-100: var(--rls-project-color-100, #f7f9ff);
 
   --rls-app-color-050: var(--rls-project-color-050, #ffffff);
 

package/scss/foundations/flex-boxs.scss

@@ -1,9 +1,9 @@
 // Rolster Technology FlexBoxs Foundations
-// v1.0.0
+// v1.0.1
 // @license MIT
 // Author: Rolster Developers
 // Created: 08/Nov/2025
-// Updated: 08/Nov/2025
+// Updated: 13/Nov/2025
 
 @mixin flex_row($gap) {
   display: flex;
@@ -64,3 +64,27 @@
 .rls-flex-column-16 {
   @include flex_column(16rem);
 }
+
+.rls-flex-justify-content-start {
+  justify-content: flex-start;
+}
+
+.rls-flex-justify-content-center {
+  justify-content: center;
+}
+
+.rls-flex-justify-content-end {
+  justify-content: flex-end;
+}
+
+.rls-flex-aligns-items-start {
+  align-items: flex-start;
+}
+
+.rls-flex-aligns-items-center {
+  align-items: center;
+}
+
+.rls-flex-aligns-items-end {
+  align-items: flex-end;
+}

package/scss/utilities/layout.scss

@@ -1,9 +1,9 @@
 // Rolster Technology Layout Utilities
-// v2.0.1
+// v2.1.2
 // @license MIT
 // Author: Rolster Developers
 // Created: 11/Abr/2023
-// Updated: 27/Ene/2024
+// Updated: 13/Nov/2025
 
 @mixin grid-responsive($size) {
   .#{$size}-grid-8 {
@@ -136,6 +136,8 @@
 
   .#{$size}-flex-grid-col-4 {
     & > * {
+      display: flex;
+      align-items: flex-start;
       width: calc(25% - var(--flex-grid-4-gap));
 
       &.#{$size}-flex-col-1 {
@@ -161,6 +163,8 @@
 
   .#{$size}-flex-grid-col-6 {
     & > * {
+      display: flex;
+      align-items: flex-start;
       width: calc(16.66% - var(--flex-grid-6-gap));
 
       &.#{$size}-flex-col-1 {
@@ -189,6 +193,8 @@
 
   .#{$size}-flex-grid-col-8 {
     & > * {
+      display: flex;
+      align-items: flex-start;
       width: calc(12.5% - var(--flex-grid-8-gap));
 
       &.#{$size}-flex-col-1 {
@@ -220,6 +226,8 @@
 
   .#{$size}-flex-grid-col-12 {
     & > * {
+      display: flex;
+      align-items: flex-start;
       width: calc(8.33% - var(--flex-grid-12-gap));
 
       &.#{$size}-flex-col-1 {