@fxlt/common-ui 0.0.4-rc2 → 0.0.5-rc1

package/animations.css

@@ -113,3 +113,18 @@
 .fade-out-animation {
   animation: fade-out 0.4s ease-out forwards;
 }
+
+@keyframes pulse-glow {
+  0%,
+  100% {
+    opacity: 1;
+    filter: brightness(1);
+  }
+  50% {
+    opacity: 0.7;
+    filter: brightness(1.4);
+  }
+}
+.animate-pulse-glow {
+  animation: pulse-glow 3s ease-in-out infinite;
+}

package/components.css

@@ -93,7 +93,7 @@
   padding-top: 4px !important;
   padding-bottom: 4px !important;
   line-height: 24px !important;
-  font-family: 'BeVietnamProRegular';
+  font-family: 'BeVietnamPro';
 }
 
 .mdc-data-table__row {
@@ -104,11 +104,7 @@
 .mdc-data-table__cell {
   border-left: 1px solid rgb(var(--border-default)) !important;
   background-color: rgb(var(--bg-primary)) !important;
-  /* padding-top: 8px !important;
-  padding-bottom: 8px !important;
-  padding-left: 16px !important;
-  padding-right: 16px !important; */
-  font-family: 'BeVietnamProRegular';
+  font-family: 'BeVietnamPro';
 }
 
 .mat-mdc-cell {
@@ -181,6 +177,9 @@ input[type='password'] {
 .txt-heading-07 {
   @apply font-semibold text-sm tracking-normal leading-5 text-text-primary;
 }
+.txt-heading-table {
+  @apply text-base font-dmsans font-semibold text-text-primary tracking-tight;
+}
 .txt-heading-compact-02 {
   @apply font-semibold text-sm tracking-normal leading-5 text-text-primary;
 }
@@ -381,6 +380,27 @@ input[type='password'] {
 .tag-information {
   @apply tag-common bg-information/10;
 }
+.tag-default-solid {
+  @apply tag-common bg-bg-hover;
+}
+.tag-success-solid {
+  @apply tag-common bg-success;
+}
+.tag-warning-solid {
+  @apply tag-common bg-warning;
+}
+.tag-danger-solid {
+  @apply tag-common bg-danger;
+}
+.tag-critical-solid {
+  @apply tag-common bg-critical;
+}
+.tag-discovery-solid {
+  @apply tag-common bg-discovery;
+}
+.tag-information-solid {
+  @apply tag-common bg-information;
+}
 .tag-square {
   @apply rounded px-semi py-small;
 }
@@ -389,25 +409,12 @@ input[type='password'] {
 }
 /* progress bar */
 .progress-bar-container {
-  @apply bg-bg-hover mt-semi rounded-full h-1.5 overflow-hidden shadow-inner;
+  @apply bg-bg-hover mt-semi rounded-md h-1.5 overflow-hidden shadow-inner;
 }
 .progress-bar-buffer {
-  @apply h-1.5 bg-primary rounded-full transition-all duration-700 ease-in-out animate-pulse-glow;
-}
-@keyframes pulse-glow {
-  0%,
-  100% {
-    opacity: 1;
-    filter: brightness(1);
-  }
-  50% {
-    opacity: 0.7;
-    filter: brightness(1.4);
-  }
-}
-.animate-pulse-glow {
-  animation: pulse-glow 3s ease-in-out infinite;
+  @apply h-1.5 bg-primary rounded-md transition-all duration-700 ease-in-out;
 }
+
 /* radio button */
 .radio-container {
   @apply w-large h-large flex items-center justify-center rounded-full border;
@@ -451,3 +458,16 @@ input[type='password'] {
 .dialog-header {
   @apply px-xl py-semi;
 }
+.border-gradient-primary {
+  border: 1px solid transparent;
+  background:
+    linear-gradient(var(--surface, #fff), var(--surface, #fff)) padding-box,
+    linear-gradient(
+      135deg,
+      rgb(var(--gradient-primary-start)),
+      rgb(var(--gradient-primary-end))
+    ) border-box;
+}
+.skeleton-load {
+  @apply rounded bg-gray-200 animate-pulse motion-reduce:animate-none;
+}