@acorex/styles 7.0.37 → 7.0.38

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@acorex/styles",
-  "version": "7.0.37",
+  "version": "7.0.38",
   "description": "",
   "main": "index.js",
   "author": "",
@@ -13,6 +13,6 @@
     "autoprefixer": "^10.4.13",
     "postcss": "^8.4.21",
     "tailwind-auto-directions": "^1.0.2",
-    "tailwindcss": "^3.2.6"
+    "tailwindcss": "^3.3.1"
   }
 }

package/src/shared/_actionsheet.scss

@@ -1,6 +1,6 @@
 .ax-actionsheet-panel {
-  animation-duration: 300ms;
-  -webkit-animation-duration: 300ms;
+  animation-duration: 100ms;
+  -webkit-animation-duration: 100ms;
   animation-fill-mode: both;
   -webkit-animation-fill-mode: both;
   opacity: 0;
@@ -13,9 +13,9 @@
   -moz-border-radius-topright: var(--ax-rounded-border-default);
   border-top-left-radius: var(--ax-rounded-border-default);
   border-top-right-radius: var(--ax-rounded-border-default);
-  box-shadow: 0 8px 10px -5px rgba(0, 0, 0, 0.2),
-    0 16px 24px 2px rgba(0, 0, 0, 0.141), 0 6px 30px 5px rgba(0, 0, 0, 0.122);
+  box-shadow: 0 8px 10px -5px rgba(0, 0, 0, 0.2), 0 16px 24px 2px rgba(0, 0, 0, 0.141), 0 6px 30px 5px rgba(0, 0, 0, 0.122);
   overflow: hidden;
+
   @keyframes fadeInUp {
     from {
       transform: translate3d(0, 40px, 0);

package/src/shared/_editor-container.scss

@@ -47,7 +47,7 @@
     justify-content: center;
     width: var(--ax-size-default);
     min-width: var(--ax-size-default);
-    height: var(--ax-size-default);
+    height: 100%;
     font-size: 1.25rem;
     line-height: 1.25rem;
     color: rgba(var(--ax-color-surface-fore));

package/src/themes/default.scss

@@ -3,7 +3,7 @@
   --ax-size-default: var(--ax-size-base);
 
   --ax-rounded-border-default: 0.375rem;
-  --ax-color-border-default: 204, 204, 204;
+  --ax-color-border-default: 224, 224, 224;
 
   --ax-color-background-default: 250, 250, 250;
   --ax-color-text-default: 18, 18, 18;
@@ -91,12 +91,12 @@
   --ax-color-background-default: 23, 32, 46;
 
   --ax-color-text-default: 224, 224, 224;
-  --ax-color-border-default: 74, 76, 80;
+  --ax-color-border-default: 66, 83, 110;
 
-  --ax-color-surface: 45, 50, 63;
+  --ax-color-surface: 35, 51, 70;
   --ax-color-surface-fore: 224, 224, 224;
 
-  --ax-color-on-surface: 60, 68, 79;
+  --ax-color-on-surface: 53, 68, 91;
   --ax-color-on-surface-fore: 224, 224, 224;
 
   --ax-color-ghost-fore: 255, 255, 255;
@@ -110,4 +110,16 @@
   --ax-color-ghost-700: 52, 55, 65;
   --ax-color-ghost-800: 44, 47, 56;
   --ax-color-ghost-900: 30, 32, 40;
+
+  //   --ax-color-primary-fore : 25, 41, 63;
+  //   --ax-color-primary-50 : 243, 248, 255;
+  // --ax-color-primary-100 : 226, 236, 254;
+  // --ax-color-primary-200 : 206, 224, 253;
+  // --ax-color-primary-300 : 186, 212, 252;
+  // --ax-color-primary-400 : 172, 202, 252;
+  // --ax-color-primary-500 : 157, 193, 251;
+  // --ax-color-primary-600 : 149, 187, 250;
+  // --ax-color-primary-700 : 139, 179, 250;
+  // --ax-color-primary-800 : 129, 171, 249;
+  // --ax-color-primary-900 : 111, 158, 248
 }

package/tailwind.config.js

@@ -116,6 +116,7 @@ module.exports = withAnimations({
         'success-fore': withOpacityValue('--ax-color-success-fore'),
         'warning-fore': withOpacityValue('--ax-color-warning-fore'),
         'danger-fore': withOpacityValue('--ax-color-danger-fore'),
+        'ghost-fore': withOpacityValue('--ax-color-ghost-fore'),
       },
       backgroundColor: {
         default: withOpacityValue('--ax-color-background-default'),
@@ -178,6 +179,5 @@ module.exports = withAnimations({
       addUtilities(acorexClasses, ['responsive', 'hover', 'focus']);
     }),
     childSelector,
-    require('tailwind-auto-directions'),
   ],
 });