@nextelco/common-ui 1.7.102 → 1.7.105

package/src/styles/utils/reset.scss

@@ -0,0 +1,64 @@
+*,
+*::before,
+*::after {
+  box-sizing: border-box;
+}
+
+* {
+  margin: 0;
+  padding: 0;
+}
+
+ul[role='list'],
+ol[role='list'] {
+  list-style: none;
+}
+
+html:focus-within {
+  scroll-behavior: smooth;
+}
+
+a:not([class]) {
+  text-decoration-skip-ink: auto;
+}
+
+img,
+picture,
+svg,
+video,
+canvas {
+  max-width: 100%;
+  height: auto;
+  vertical-align: middle;
+  font-style: italic;
+  background-repeat: no-repeat;
+  background-size: cover;
+}
+
+input,
+button,
+textarea,
+select {
+  font: inherit;
+}
+
+@media (prefers-reduced-motion: reduce) {
+  html:focus-within {
+    scroll-behavior: auto;
+  }
+  *,
+  *::before,
+  *::after {
+    animation-duration: 0.01ms !important;
+    animation-iteration-count: 1 !important;
+    transition-duration: 0.01ms !important;
+    scroll-behavior: auto !important;
+    transition: none;
+  }
+}
+
+body,
+html {
+  height: 100%;
+  scroll-behavior: smooth;
+}

package/src/styles/utils/scrollbar.scss

@@ -0,0 +1,34 @@
+::-webkit-scrollbar {
+  width: 10px;
+  height: 10px;
+}
+
+::-webkit-scrollbar-track {
+  background: #f1f1f1;
+  border-radius: 15px;
+}
+
+::-webkit-scrollbar-thumb {
+  background: #888;
+  border-radius: 15px;
+}
+
+::-webkit-scrollbar-thumb:hover {
+  background: var(--dark-blue);
+  border-radius: 15px;
+}
+
+.scroll-bar::-webkit-scrollbar {
+  width: 10px;
+  height: 5px;
+}
+
+.scroll-bar::-webkit-scrollbar-track {
+  background: var(--light-gray-01);
+  border-radius: 15px;
+}
+
+.scroll-bar::-webkit-scrollbar-thumb {
+  border-radius: 15px;
+  background: var(--dark-blue);
+}

package/src/styles/utils/variables.scss

@@ -0,0 +1,39 @@
+:root {
+  /* Primary */
+  --bright-blue: #006fff;
+  --bright-green: #17daa4;
+  --dark-blue: #010060;
+  --light-gray-01: #dddddd;
+  --light-blue: #e2eaff;
+  --almost-white: #f8f8f8;
+  --almost-black: #1f1f1f;
+
+  /* Secundary */
+  --medium-blue: #87a9ff;
+  --medium-green: #b0ebdb;
+  --medium-dark-blue: #7d7dab;
+  --medium-gray-01: #c2c2c2;
+  --light-gray-02: #ededed;
+  --light-blue: #cedcff;
+  --dark-gray: #6c6c6c;
+
+  /* Tertiary */
+  --warm-yellow: #ebc25a;
+  --warm-orange: #eb745a;
+  --light-yellow: #ffedbf;
+  --dark-yellow: #cfa948;
+  --bright-purple: #801de2;
+
+  /* Alert */
+  --rejected: #de4321;
+  --approved: #1dc88a;
+  --stand-by: #ffcc4a;
+
+  /* Notifications */
+  --bg-light-yellow: #ffedbf;
+  --dark-yellow: #856404;
+  --bg-light-red: #ffbdae;
+  --dark-red: #842029;
+  --bg-success: #8ef8d2;
+  --dark-green: #0f5132;
+}