@rolster/styles-foundations 3.0.4 → 3.0.5

package/scss/design-system-bordered/atoms/input-search.scss

@@ -1,28 +1,28 @@
-// Rolster Technology InputSearch Component
-// v1.1.3
-// @license MIT
-// Author: Rolster Developers
-// Created: 12/May/2023
-// Updated: 05/May/2026
-
-.rls-input-search {
-  --rlc-input-height: var(--rls-sizing-x14);
-
-  position: relative;
-  display: flex;
-  align-items: center;
-  padding: var(--rls-sizing-x4) var(--rls-sizing-x6);
-  box-sizing: border-box;
-  background: var(--rlc-input-search-background, transparent);
-  border-radius: var(--rls-sizing-x4);
-  border: var(--rlc-input-search-border, var(--rls-app-border-1-200));
-
-  &--disabled {
-    opacity: 0.5;
-  }
-
-  .rls-input__component:disabled,
-  .rls-button-action:disabled {
-    opacity: 1 !important;
-  }
-}
+// Rolster Technology InputSearch Component
+// v1.1.3
+// @license MIT
+// Author: Rolster Developers
+// Created: 12/May/2023
+// Updated: 05/May/2026
+
+.rls-input-search {
+  --rlc-input-height: var(--rls-sizing-x14);
+
+  position: relative;
+  display: flex;
+  align-items: center;
+  padding: var(--rls-sizing-x4) var(--rls-sizing-x6);
+  box-sizing: border-box;
+  background: var(--rlc-input-search-background, transparent);
+  border-radius: var(--rls-sizing-x4);
+  border: var(--rlc-input-search-border, var(--rls-app-border-1-200));
+
+  &--disabled {
+    opacity: 0.5;
+  }
+
+  .rls-input__component:disabled,
+  .rls-button-action:disabled {
+    opacity: 1 !important;
+  }
+}

package/scss/design-system-bordered/atoms/input-text.scss

@@ -1,12 +1,12 @@
-// Rolster Technology InputText Component
-// v1.0.2
-// @license MIT
-// Author: Rolster Developers
-// Created: 06/May/2023
-// Updated: 24/Jun/2024
-
-.rls-input-text {
-  position: relative;
-  width: 100%;
-  box-sizing: border-box;
-}
+// Rolster Technology InputText Component
+// v1.0.2
+// @license MIT
+// Author: Rolster Developers
+// Created: 06/May/2023
+// Updated: 24/Jun/2024
+
+.rls-input-text {
+  position: relative;
+  width: 100%;
+  box-sizing: border-box;
+}

package/scss/design-system-bordered/atoms/label.scss

@@ -1,20 +1,20 @@
-// Rolster Technology Label Component
-// v1.1.1
-// @license MIT
-// Author: Rolster Developers
-// Created: 15/Nov/2023
-// Updated: 02/May/2026
-
-.rls-label {
-  font-size: var(--rlc-label-font-size, var(--rls-smalltext-font-size));
-  letter-spacing: var(
-    --rlc-label-letter-spacing,
-    var(--rls-smalltext-letter-spacing)
-  );
-  line-height: var(--rlc-label-height, var(--rls-smalltext-line-height));
-  font-weight: var(--rlc-label-weight, inherit);
-
-  &[rls-theme] {
-    color: var(--rls-theme-color-500);
-  }
-}
+// Rolster Technology Label Component
+// v1.1.1
+// @license MIT
+// Author: Rolster Developers
+// Created: 15/Nov/2023
+// Updated: 02/May/2026
+
+.rls-label {
+  font-size: var(--rlc-label-font-size, var(--rls-smalltext-font-size));
+  letter-spacing: var(
+    --rlc-label-letter-spacing,
+    var(--rls-smalltext-letter-spacing)
+  );
+  line-height: var(--rlc-label-height, var(--rls-smalltext-line-height));
+  font-weight: var(--rlc-label-weight, inherit);
+
+  &[rls-theme] {
+    color: var(--rls-theme-color-500);
+  }
+}

package/scss/design-system-bordered/atoms/led.scss

@@ -1,31 +1,31 @@
-// Rolster Technology Led Component
-// v1.0.0
-// @license MIT
-// Author: Rolster Developers
-// Created: 07/May/2026
-// Updated: 07/May/2026
-
-.rls-led {
-  --pvt-dimension: var(--rlc-led-dimension, var(--rls-sizing-x8));
-  --pvt-background: var(--rls-app-color-100);
-  --pvt-content-background: var(--rls-app-color-500);
-
-  width: auto;
-  background: var(--pvt-background);
-  padding: var(--rlc-led-padding, var(--rls-sizing-x2));
-  border-radius: 50%;
-
-  &::before {
-    display: block;
-    content: '';
-    background: var(--pvt-content-background);
-    width: var(--pvt-dimension);
-    height: var(--pvt-dimension);
-    border-radius: 50%;
-  }
-
-  &[rls-theme] {
-    --pvt-background: var(--rls-theme-color-100);
-    --pvt-content-background: var(--rls-theme-gradient-500);
-  }
-}
+// Rolster Technology Led Component
+// v1.0.0
+// @license MIT
+// Author: Rolster Developers
+// Created: 07/May/2026
+// Updated: 07/May/2026
+
+.rls-led {
+  --pvt-dimension: var(--rlc-led-dimension, var(--rls-sizing-x8));
+  --pvt-background: var(--rls-app-color-100);
+  --pvt-content-background: var(--rls-app-color-500);
+
+  width: auto;
+  background: var(--pvt-background);
+  padding: var(--rlc-led-padding, var(--rls-sizing-x2));
+  border-radius: 50%;
+
+  &::before {
+    display: block;
+    content: '';
+    background: var(--pvt-content-background);
+    width: var(--pvt-dimension);
+    height: var(--pvt-dimension);
+    border-radius: 50%;
+  }
+
+  &[rls-theme] {
+    --pvt-background: var(--rls-theme-color-100);
+    --pvt-content-background: var(--rls-theme-gradient-500);
+  }
+}

package/scss/design-system-bordered/atoms/message-icon.scss

@@ -1,21 +1,21 @@
-// Rolster Technology MessageIcon Component
-// v1.0.3
-// @license MIT
-// Author: Rolster Developers
-// Created: 17/Nov/2023
-// Updated: 18/Abr/2025
-
-.rls-message-icon {
-  --rlc-icon-color: var(--rls-theme-color-500);
-  --rlc-icon-dimension: var(--rls-sizing-x8);
-
-  display: flex;
-  align-items: center;
-  column-gap: var(--rls-sizing-x2);
-
-  span {
-    font-size: var(--rls-caption-font-size);
-    letter-spacing: var(--rls-caption-letter-spacing);
-    color: var(--rls-app-color-600);
-  }
-}
+// Rolster Technology MessageIcon Component
+// v1.0.3
+// @license MIT
+// Author: Rolster Developers
+// Created: 17/Nov/2023
+// Updated: 18/Abr/2025
+
+.rls-message-icon {
+  --rlc-icon-color: var(--rls-theme-color-500);
+  --rlc-icon-dimension: var(--rls-sizing-x8);
+
+  display: flex;
+  align-items: center;
+  column-gap: var(--rls-sizing-x2);
+
+  span {
+    font-size: var(--rls-caption-font-size);
+    letter-spacing: var(--rls-caption-letter-spacing);
+    color: var(--rls-app-color-600);
+  }
+}

package/scss/design-system-bordered/atoms/poster.scss

@@ -1,42 +1,42 @@
-// Rolster Technology Poster Component
-// v2.1.2
-// @license MIT
-// Author: Rolster Developers
-// Created: 20/Mar/2018
-// Updated: 08/Abr/2026
-
-.rls-poster {
-  --pvt-height: var(--rlc-poster-height, var(--rls-smalltext-line-height));
-
-  position: relative;
-  display: block;
-  width: var(--rlc-poster-width, auto);
-  font-weight: inherit;
-  font-size: var(--rlc-poster-font-size, var(--rls-smalltext-font-size));
-  letter-spacing: var(
-    --rlc-poster-letter-spacing,
-    var(--rls-body-letter-spacing)
-  );
-  height: var(--pvt-height);
-  line-height: var(--pvt-height);
-  padding: var(--rlc-poster-padding, var(--rls-sizing-x2) var(--rls-sizing-x4));
-  text-align: var(--rlc-poster-text-align, center);
-  border-radius: var(--rlc-poster-radius, var(--rls-sizing-x4));
-  color: var(--rls-app-color-050);
-  background: var(--rls-app-color-600);
-
-  &[rls-theme] {
-    color: var(--rls-theme-color-050);
-    background: var(--rls-theme-color-500);
-  }
-
-  &--contrasted {
-    color: var(--rls-app-color-700);
-    background: var(--rls-app-color-200);
-
-    &[rls-theme] {
-      color: var(--rls-theme-color-700);
-      background: var(--rls-theme-color-100);
-    }
-  }
-}
+// Rolster Technology Poster Component
+// v2.1.2
+// @license MIT
+// Author: Rolster Developers
+// Created: 20/Mar/2018
+// Updated: 08/Abr/2026
+
+.rls-poster {
+  --pvt-height: var(--rlc-poster-height, var(--rls-smalltext-line-height));
+
+  position: relative;
+  display: block;
+  width: var(--rlc-poster-width, auto);
+  font-weight: inherit;
+  font-size: var(--rlc-poster-font-size, var(--rls-smalltext-font-size));
+  letter-spacing: var(
+    --rlc-poster-letter-spacing,
+    var(--rls-body-letter-spacing)
+  );
+  height: var(--pvt-height);
+  line-height: var(--pvt-height);
+  padding: var(--rlc-poster-padding, var(--rls-sizing-x2) var(--rls-sizing-x4));
+  text-align: var(--rlc-poster-text-align, center);
+  border-radius: var(--rlc-poster-radius, var(--rls-sizing-x4));
+  color: var(--rls-app-color-050);
+  background: var(--rls-app-color-600);
+
+  &[rls-theme] {
+    color: var(--rls-theme-color-050);
+    background: var(--rls-theme-color-500);
+  }
+
+  &--contrasted {
+    color: var(--rls-app-color-700);
+    background: var(--rls-app-color-200);
+
+    &[rls-theme] {
+      color: var(--rls-theme-color-700);
+      background: var(--rls-theme-color-100);
+    }
+  }
+}

package/scss/design-system-bordered/atoms/progress-bar.scss

@@ -1,83 +1,83 @@
-// Rolster Technology ProgressBar Component
-// v1.0.3
-// @license MIT
-// Author: Rolster Developers
-// Created: 23/Mar/2018
-// Updated: 21/Ene/2026
-
-.rls-progress-bar {
-  --pvt-component-display: block;
-  --pvt-component-height: var(--rlc-progress-bar-height, var(--rls-sizing-x2));
-  --pvt-component-radius: var(--rlc-progress-bar-radius, 0rem);
-
-  position: relative;
-  width: 100%;
-  height: var(--pvt-component-height);
-  overflow: hidden;
-  background: var(--rlc-progress-bar-background, var(--rls-theme-color-100));
-  border-radius: var(--pvt-component-radius);
-
-  &--indeterminate {
-    --pvt-component-display: none;
-
-    &::after,
-    &::before {
-      position: absolute;
-      content: '';
-      top: 0rem;
-      width: 0%;
-      height: var(--pvt-component-height);
-      background: var(--rls-theme-gradient-500);
-      border-radius: var(--pvt-component-radius);
-    }
-
-    &::after {
-      animation: progress-bar-indeterminate-after 2000ms infinite;
-    }
-
-    &::before {
-      animation: progress-bar-indeterminate-before 2000ms infinite;
-    }
-  }
-
-  &__component {
-    position: absolute;
-    display: var(--pvt-component-display);
-    top: 0rem;
-    width: 0%;
-    height: var(--pvt-component-height);
-    background: var(--rls-theme-gradient-500);
-    transition: width 320ms 0ms var(--rls-standard-curve);
-    border-radius: var(--pvt-component-radius);
-  }
-}
-
-@keyframes progress-bar-indeterminate-before {
-  0% {
-    width: 100%;
-    left: -125%;
-  }
-  20% {
-    width: 100%;
-    left: -125%;
-  }
-  100% {
-    width: 12.5%;
-    left: 100%;
-  }
-}
-
-@keyframes progress-bar-indeterminate-after {
-  0% {
-    width: 12.5%;
-    left: -12.5%;
-  }
-  80% {
-    width: 100%;
-    left: 125%;
-  }
-  100% {
-    width: 100%;
-    left: 125%;
-  }
-}
+// Rolster Technology ProgressBar Component
+// v1.0.3
+// @license MIT
+// Author: Rolster Developers
+// Created: 23/Mar/2018
+// Updated: 21/Ene/2026
+
+.rls-progress-bar {
+  --pvt-component-display: block;
+  --pvt-component-height: var(--rlc-progress-bar-height, var(--rls-sizing-x2));
+  --pvt-component-radius: var(--rlc-progress-bar-radius, 0rem);
+
+  position: relative;
+  width: 100%;
+  height: var(--pvt-component-height);
+  overflow: hidden;
+  background: var(--rlc-progress-bar-background, var(--rls-theme-color-100));
+  border-radius: var(--pvt-component-radius);
+
+  &--indeterminate {
+    --pvt-component-display: none;
+
+    &::after,
+    &::before {
+      position: absolute;
+      content: '';
+      top: 0rem;
+      width: 0%;
+      height: var(--pvt-component-height);
+      background: var(--rls-theme-gradient-500);
+      border-radius: var(--pvt-component-radius);
+    }
+
+    &::after {
+      animation: progress-bar-indeterminate-after 2000ms infinite;
+    }
+
+    &::before {
+      animation: progress-bar-indeterminate-before 2000ms infinite;
+    }
+  }
+
+  &__component {
+    position: absolute;
+    display: var(--pvt-component-display);
+    top: 0rem;
+    width: 0%;
+    height: var(--pvt-component-height);
+    background: var(--rls-theme-gradient-500);
+    transition: width 320ms 0ms var(--rls-standard-curve);
+    border-radius: var(--pvt-component-radius);
+  }
+}
+
+@keyframes progress-bar-indeterminate-before {
+  0% {
+    width: 100%;
+    left: -125%;
+  }
+  20% {
+    width: 100%;
+    left: -125%;
+  }
+  100% {
+    width: 12.5%;
+    left: 100%;
+  }
+}
+
+@keyframes progress-bar-indeterminate-after {
+  0% {
+    width: 12.5%;
+    left: -12.5%;
+  }
+  80% {
+    width: 100%;
+    left: 125%;
+  }
+  100% {
+    width: 100%;
+    left: 125%;
+  }
+}

package/scss/design-system-bordered/atoms/progress-circular.scss

@@ -1,59 +1,59 @@
-// Rolster Technology ProgressCircular Component
-// v1.1.0
-// @license MIT
-// Author: Rolster Developers
-// Created: 20/Mar/2018
-// Updated: 14/May/2025
-
-.rls-progress-circular {
-  --pvt-dimension: var(
-    --rlc-progress-circular-dimension,
-    var(--rls-sizing-x28)
-  );
-
-  position: relative;
-  width: var(--pvt-dimension);
-  height: var(--pvt-dimension);
-  padding: var(--rls-sizing-x2);
-  box-sizing: border-box;
-  stroke: var(--rls-theme-color-500);
-
-  &__svg {
-    height: 100%;
-    width: 100%;
-    transform: rotate(990deg);
-    animation: progress-circular-svg 3500ms linear infinite;
-  }
-
-  &__circle {
-    fill: none;
-    stroke-width: 4px;
-    stroke: inherit;
-    stroke-dasharray: 65;
-    stroke-dashoffset: 65;
-    opacity: 1;
-    animation: progress-circular-circle 1750ms var(--rls-standard-curve)
-      infinite;
-  }
-}
-
-@keyframes progress-circular-svg {
-  0% {
-    transform: rotate(0deg);
-  }
-  50% {
-    transform: rotate(180deg);
-  }
-  100% {
-    transform: rotate(360deg);
-  }
-}
-
-@keyframes progress-circular-circle {
-  50% {
-    stroke-dashoffset: 0;
-  }
-  100% {
-    stroke-dashoffset: -65;
-  }
-}
+// Rolster Technology ProgressCircular Component
+// v1.1.0
+// @license MIT
+// Author: Rolster Developers
+// Created: 20/Mar/2018
+// Updated: 14/May/2025
+
+.rls-progress-circular {
+  --pvt-dimension: var(
+    --rlc-progress-circular-dimension,
+    var(--rls-sizing-x28)
+  );
+
+  position: relative;
+  width: var(--pvt-dimension);
+  height: var(--pvt-dimension);
+  padding: var(--rls-sizing-x2);
+  box-sizing: border-box;
+  stroke: var(--rls-theme-color-500);
+
+  &__svg {
+    height: 100%;
+    width: 100%;
+    transform: rotate(990deg);
+    animation: progress-circular-svg 3500ms linear infinite;
+  }
+
+  &__circle {
+    fill: none;
+    stroke-width: 4px;
+    stroke: inherit;
+    stroke-dasharray: 65;
+    stroke-dashoffset: 65;
+    opacity: 1;
+    animation: progress-circular-circle 1750ms var(--rls-standard-curve)
+      infinite;
+  }
+}
+
+@keyframes progress-circular-svg {
+  0% {
+    transform: rotate(0deg);
+  }
+  50% {
+    transform: rotate(180deg);
+  }
+  100% {
+    transform: rotate(360deg);
+  }
+}
+
+@keyframes progress-circular-circle {
+  50% {
+    stroke-dashoffset: 0;
+  }
+  100% {
+    stroke-dashoffset: -65;
+  }
+}