@acorex/styles 18.4.3 → 18.5.0

package/icons/fontawesome/_variables.scss

@@ -38,3 +38,14 @@ $ax-icon-send: '\f1d8';
 $ax-icon-play: '\f04b';
 $ax-icon-pause: '\f04c';
 $ax-icon-reload: '\f2f9';
+$ax-icon-heart: '\f004';
+$ax-icon-comment: '\f075';
+$ax-icon-bold: '\f032';
+$ax-icon-italic: '\f033';
+$ax-icon-under-line: '\f0cd';
+$ax-icon-order-list: '\f0cb';
+$ax-icon-un-order-list: '\f0ca';
+$ax-icon-align-left: '\f036';
+$ax-icon-align-right: '\f038';
+$ax-icon-align-center: '\f037';
+$ax-icon-align-justify: '\f039';

package/icons/index.scss

@@ -225,3 +225,58 @@
     content: $ax-icon-reload;
   }
 }
+.ax-icon-heart {
+  &:before {
+    content: $ax-icon-heart;
+  }
+}
+.ax-icon-comment {
+  &:before {
+    content: $ax-icon-comment;
+  }
+}
+.ax-icon-bold {
+  &:before {
+    content: $ax-icon-bold;
+  }
+}
+.ax-icon-italic {
+  &:before {
+    content: $ax-icon-italic;
+  }
+}
+.ax-icon-under-line {
+  &:before {
+    content: $ax-icon-under-line;
+  }
+}
+.ax-icon-order-list {
+  &:before {
+    content: $ax-icon-order-list;
+  }
+}
+.ax-icon-un-order-list {
+  &:before {
+    content: $ax-icon-un-order-list;
+  }
+}
+.ax-icon-align-left {
+  &:before {
+    content: $ax-icon-align-left;
+  }
+}
+.ax-icon-align-right {
+  &:before {
+    content: $ax-icon-align-right;
+  }
+}
+.ax-icon-align-center {
+  &:before {
+    content: $ax-icon-align-center;
+  }
+}
+.ax-icon-align-justify {
+  &:before {
+    content: $ax-icon-align-justify;
+  }
+}

package/icons/material/_variables.scss

@@ -38,3 +38,14 @@ $ax-icon-send: '\e163';
 $ax-icon-play: '\e037';
 $ax-icon-pause: '\e034';
 $ax-icon-reload: '\e5d5';
+$ax-icon-heart: '\e87d';
+$ax-icon-comment: '\e0ca';
+$ax-icon-bold: '\e238';
+$ax-icon-italic: '\e23f';
+$ax-icon-under-line: '\e249';
+$ax-icon-order-list: '\e242';
+$ax-icon-un-order-list: '\e241';
+$ax-icon-align-left: '\e236';
+$ax-icon-align-right: '\e237';
+$ax-icon-align-center: '\e234';
+$ax-icon-align-justify: '\e235';

package/index.css

@@ -372,10 +372,8 @@ body {
   border-top-left-radius: var(--ax-rounded-border-default);
   border-top-right-radius: var(--ax-rounded-border-default);
   background-color: rgba(var(--ax-color-surface));
-  --ax-shadow: 0 10px 15px -3px rgb(0 0 0 / 0.1),
-    0 4px 6px -4px rgb(0 0 0 / 0.1);
-  --ax-shadow-colored: 0 10px 15px -3px var(--ax-shadow-color),
-    0 4px 6px -4px var(--ax-shadow-color);
+  --ax-shadow: 0 10px 15px -3px rgb(0 0 0 / 0.1), 0 4px 6px -4px rgb(0 0 0 / 0.1);
+  --ax-shadow-colored: 0 10px 15px -3px var(--ax-shadow-color), 0 4px 6px -4px var(--ax-shadow-color);
   box-shadow: var(--ax-ring-offset-shadow, 0 0 rgba(0, 0, 0, 0)), var(--ax-ring-shadow, 0 0 rgba(0, 0, 0, 0)), var(--ax-shadow);
   animation: 1s both ax-fadeInUp;
   animation-duration: 250ms;

package/package.json

@@ -1,11 +1,11 @@
-{
-  "name": "@acorex/styles",
-  "version": "18.4.3",
-  "main": "index.js",
-  "author": "Ali Safari",
-  "license": "ISC",
-  "peerDependencies": {
-    "animated-tailwindcss": ">=4.0.0",
-    "tailwindcss": ">=3.4.4"
-  }
-}
+{
+  "name": "@acorex/styles",
+  "version": "18.5.0",
+  "main": "index.js",
+  "author": "Ali Safari",
+  "license": "ISC",
+  "peerDependencies": {
+    "animated-tailwindcss": ">=4.0.0",
+    "tailwindcss": ">=3.4.4"
+  }
+}

package/src/base/_preflight.scss

@@ -43,14 +43,8 @@ html,
     'Segoe UI Symbol',
     'Noto Color Emoji'
   ); /* 4 */
-  font-feature-settings: theme(
-    'fontFamily.sans[1].fontFeatureSettings',
-    normal
-  ); /* 5 */
-  font-variation-settings: theme(
-    'fontFamily.sans[1].fontVariationSettings',
-    normal
-  ); /* 6 */
+  font-feature-settings: theme('fontFamily.sans[1].fontFeatureSettings', normal); /* 5 */
+  font-variation-settings: theme('fontFamily.sans[1].fontVariationSettings', normal); /* 6 */
   -webkit-tap-highlight-color: transparent; /* 7 */
 }
 
@@ -138,14 +132,8 @@ pre {
     'Courier New',
     monospace
   ); /* 1 */
-  font-feature-settings: theme(
-    'fontFamily.mono[1].fontFeatureSettings',
-    normal
-  ); /* 2 */
-  font-variation-settings: theme(
-    'fontFamily.mono[1].fontVariationSettings',
-    normal
-  ); /* 3 */
+  font-feature-settings: theme('fontFamily.mono[1].fontFeatureSettings', normal); /* 2 */
+  font-variation-settings: theme('fontFamily.mono[1].fontVariationSettings', normal); /* 3 */
   font-size: 1em; /* 4 */
 }
 

package/src/shared/_actionsheet.scss

@@ -4,12 +4,9 @@
   border-top-left-radius: var(--ax-rounded-border-default);
   border-top-right-radius: var(--ax-rounded-border-default);
   background-color: rgba(var(--ax-color-surface));
-  --ax-shadow: 0 10px 15px -3px rgb(0 0 0 / 0.1),
-    0 4px 6px -4px rgb(0 0 0 / 0.1);
-  --ax-shadow-colored: 0 10px 15px -3px var(--ax-shadow-color),
-    0 4px 6px -4px var(--ax-shadow-color);
-  box-shadow: var(--ax-ring-offset-shadow, 0 0 #0000),
-    var(--ax-ring-shadow, 0 0 #0000), var(--ax-shadow);
+  --ax-shadow: 0 10px 15px -3px rgb(0 0 0 / 0.1), 0 4px 6px -4px rgb(0 0 0 / 0.1);
+  --ax-shadow-colored: 0 10px 15px -3px var(--ax-shadow-color), 0 4px 6px -4px var(--ax-shadow-color);
+  box-shadow: var(--ax-ring-offset-shadow, 0 0 #0000), var(--ax-ring-shadow, 0 0 #0000), var(--ax-shadow);
 
   animation: 1s both ax-fadeInUp;
   animation-duration: 250ms;

package/src/shared/_check-box.scss

@@ -37,7 +37,8 @@
   &:focus-visible,
   &:focus {
     // @apply ax-ring-2 ax-ring-primary-500 ax-ring-offset-2 ax-ring-offset-surface;
-    box-shadow: 0px 0px 0px 2px rgba(var(--ax-color-surface)),
+    box-shadow:
+      0px 0px 0px 2px rgba(var(--ax-color-surface)),
       0px 0px 0px 4px rgba(var(--ax-color-primary-500));
   }
 

package/src/shared/_radio.scss

@@ -34,7 +34,8 @@
   &:focus-visible,
   &:focus {
     // @apply ax-ring-2 ax-ring-primary-500 ax-ring-offset-2 ax-ring-offset-surface;
-    box-shadow: 0px 0px 0px 2px rgba(var(--ax-color-surface)),
+    box-shadow:
+      0px 0px 0px 2px rgba(var(--ax-color-surface)),
       0px 0px 0px 4px rgba(var(--ax-color-primary-500));
   }
 

package/tailwind-base.js

@@ -28,8 +28,7 @@ const _colors = {
   'on-surface-fore': 'rgba(var(--ax-color-on-surface-fore), <alpha-value>)',
 
   'input-surface': 'rgba(var(--ax-color-input-surface), <alpha-value>)',
-  'input-surface-fore':
-    'rgba(var(--ax-color-input-surface-fore), <alpha-value>)',
+  'input-surface-fore': 'rgba(var(--ax-color-input-surface-fore), <alpha-value>)',
 };
 
 const createPalete = function (colorName) {