@fewangsit/wangsvue-presets 1.0.81-alpha.2 → 1.0.82

package/wangsvue/image/index.js

@@ -1,136 +1,128 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.default = {
-    root: function (_a) {
-        var props = _a.props;
-        return ({
-            class: [
-                'relative inline-block',
-                'shrink-0',
-                { 'rounded-full': props.rounded },
-                { 'rounded-lg': !props.rounded },
-            ],
-        });
-    },
-    image: function (_a) {
-        var props = _a.props;
-        return ({
-            class: [
-                'w-full h-full object-cover',
-                { 'rounded-full': props.rounded },
-                { 'rounded-lg': !props.rounded },
-            ],
-        });
-    },
-    button: {
-        class: [
-            'flex items-center justify-center',
-            'absolute',
-            'w-full h-full',
-            'inset-0 opacity-0 transition-opacity duration-300',
-            'bg-transparent text-white',
-            'hover:cursor-pointer hover:bg-grayscale-900 hover:opacity-50',
-        ],
-        style: 'border-radius: inherit',
-    },
-    icon: {
-        class: 'w-6 h-6',
-    },
-    mask: {
-        class: [
-            'flex items-center justify-center',
-            'fixed top-0 left-0',
-            'w-full h-full',
-            'bg-grayscale-950/90',
-        ],
-    },
-    toolbar: {
-        class: ['flex', 'absolute top-0 right-0', 'p-4'],
-    },
-    rotaterightbutton: {
-        class: [
-            'z-20',
-            'flex justify-center items-center',
-            'w-6 h-6',
-            'mr-2',
-            'rounded-full',
-            'text-white bg-transparent',
-            'hover:text-white hover:bg-white/10',
-            'focus:outline-none focus:outline-offset-0 focus:ring focus:ring-primary-400/50',
-            'transition duration-200 ease-in-out',
-        ],
-    },
-    rotaterighticon: {
-        class: 'w-4 h-4',
-    },
-    rotateleftbutton: {
-        class: [
-            'z-20',
-            'flex justify-center items-center',
-            'w-6 h-6',
-            'mr-2',
-            'rounded-full',
-            'text-white bg-transparent',
-            'hover:text-white hover:bg-white/10',
-            'focus:outline-none focus:outline-offset-0 focus:ring focus:ring-primary-400/50',
-            'transition duration-200 ease-in-out',
-        ],
-    },
-    rotatelefticon: {
-        class: 'w-4 h-4',
-    },
-    zoomoutbutton: {
-        class: [
-            'z-20',
-            'flex justify-center items-center',
-            'w-6 h-6',
-            'mr-2',
-            'rounded-full',
-            'text-white bg-transparent',
-            'hover:text-white hover:bg-white/10',
-            'focus:outline-none focus:outline-offset-0 focus:ring focus:ring-primary-400/50',
-            'transition duration-200 ease-in-out',
-        ],
-    },
-    zoomouticon: {
-        class: 'w-4 h-4',
-    },
-    zoominbutton: {
-        class: [
-            'z-20',
-            'flex justify-center items-center',
-            'w-6 h-6',
-            'mr-2',
-            'rounded-full',
-            'text-white bg-transparent',
-            'hover:text-white hover:bg-white/10',
-            'focus:outline-none focus:outline-offset-0 focus:ring focus:ring-primary-400/50',
-            'transition duration-200 ease-in-out',
-        ],
-    },
-    zoominicon: {
-        class: 'w-4 h-4',
-    },
-    closebutton: {
-        class: [
-            'z-20',
-            'flex justify-center items-center',
-            'w-6 h-6',
-            'mr-2',
-            'rounded-full',
-            'text-white bg-transparent',
-            'hover:text-white hover:bg-white/10',
-            'focus:outline-none focus:outline-offset-0 focus:ring focus:ring-primary-400/50',
-            'transition duration-200 ease-in-out',
-        ],
-    },
-    closeicon: {
-        class: 'w-4 h-4',
-    },
-    transition: {
-        enterFromClass: 'opacity-0 scale-75',
-        enterActiveClass: 'transition-all duration-150 ease-in-out',
-        leaveActiveClass: 'transition-all duration-150 ease-in',
-        leaveToClass: 'opacity-0 scale-75',
-    },
-};
+export default {
+  root: ({ props }) => ({
+    class: [
+      'relative inline-block',
+      'shrink-0',
+      { 'rounded-full': props.rounded },
+      { 'rounded-lg': !props.rounded },
+    ],
+  }),
+  image: ({ props }) => ({
+    class: [
+      'w-full h-full object-cover',
+      { 'rounded-full': props.rounded },
+      { 'rounded-lg': !props.rounded },
+    ],
+  }),
+  button: {
+    class: [
+      'flex items-center justify-center',
+      'absolute',
+      'w-full h-full',
+      'inset-0 opacity-0 transition-opacity duration-300',
+      'bg-transparent text-white',
+      'hover:cursor-pointer hover:bg-grayscale-900 hover:opacity-50',
+    ],
+    style: 'border-radius: inherit',
+  },
+  icon: {
+    class: 'w-6 h-6',
+  },
+  mask: {
+    class: [
+      'flex items-center justify-center',
+      'fixed top-0 left-0',
+      'w-full h-full',
+      'bg-grayscale-950/90',
+    ],
+  },
+  toolbar: {
+    class: ['flex', 'absolute top-0 right-0', 'p-4'],
+  },
+  rotaterightbutton: {
+    class: [
+      'z-20',
+      'flex justify-center items-center',
+      'w-6 h-6',
+      'mr-2',
+      'rounded-full',
+      'text-white bg-transparent',
+      'hover:text-white hover:bg-white/10',
+      'focus:outline-none focus:outline-offset-0 focus:ring focus:ring-primary-400/50',
+      'transition duration-200 ease-in-out',
+    ],
+  },
+  rotaterighticon: {
+    class: 'w-4 h-4',
+  },
+  rotateleftbutton: {
+    class: [
+      'z-20',
+      'flex justify-center items-center',
+      'w-6 h-6',
+      'mr-2',
+      'rounded-full',
+      'text-white bg-transparent',
+      'hover:text-white hover:bg-white/10',
+      'focus:outline-none focus:outline-offset-0 focus:ring focus:ring-primary-400/50',
+      'transition duration-200 ease-in-out',
+    ],
+  },
+  rotatelefticon: {
+    class: 'w-4 h-4',
+  },
+  zoomoutbutton: {
+    class: [
+      'z-20',
+      'flex justify-center items-center',
+      'w-6 h-6',
+      'mr-2',
+      'rounded-full',
+      'text-white bg-transparent',
+      'hover:text-white hover:bg-white/10',
+      'focus:outline-none focus:outline-offset-0 focus:ring focus:ring-primary-400/50',
+      'transition duration-200 ease-in-out',
+    ],
+  },
+  zoomouticon: {
+    class: 'w-4 h-4',
+  },
+  zoominbutton: {
+    class: [
+      'z-20',
+      'flex justify-center items-center',
+      'w-6 h-6',
+      'mr-2',
+      'rounded-full',
+      'text-white bg-transparent',
+      'hover:text-white hover:bg-white/10',
+      'focus:outline-none focus:outline-offset-0 focus:ring focus:ring-primary-400/50',
+      'transition duration-200 ease-in-out',
+    ],
+  },
+  zoominicon: {
+    class: 'w-4 h-4',
+  },
+  closebutton: {
+    class: [
+      'z-20',
+      'flex justify-center items-center',
+      'w-6 h-6',
+      'mr-2',
+      'rounded-full',
+      'text-white bg-transparent',
+      'hover:text-white hover:bg-white/10',
+      'focus:outline-none focus:outline-offset-0 focus:ring focus:ring-primary-400/50',
+      'transition duration-200 ease-in-out',
+    ],
+  },
+  closeicon: {
+    class: 'w-4 h-4',
+  },
+  transition: {
+    enterFromClass: 'opacity-0 scale-75',
+    enterActiveClass: 'transition-all duration-150 ease-in-out',
+    leaveActiveClass: 'transition-all duration-150 ease-in',
+    leaveToClass: 'opacity-0 scale-75',
+  },
+};

package/wangsvue/index.css

@@ -0,0 +1,65 @@
+@import url('https://fonts.googleapis.com/css2?family=Poppins:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,100;1,200;1,300;1,400;1,500;1,600;1,700;1,800;1,900&family=Roboto:ital,wght@0,100;0,300;0,400;0,500;0,700;0,900;1,100;1,300;1,400;1,500;1,700;1,900&display=swap');
+@import url('https://fonts.googleapis.com/css2?family=Source+Code+Pro&display=swap');
+
+@import './icons.css';
+
+@tailwind components;
+@tailwind utilities;
+
+* {
+  font-family: 'Poppins', sans-serif;
+}
+
+.font-poppins {
+  font-family: 'Poppins', sans-serif !important;
+}
+
+.font-source-code-pro {
+  font-family: 'Source Code Pro', monospace;
+  font-optical-sizing: auto;
+  font-weight: 400;
+  font-style: normal;
+}
+
+h1,
+.heading-1 {
+  @apply !text-[22px] !font-semibold leading-7;
+}
+
+h2,
+.heading-2 {
+  @apply !text-lg !font-semibold leading-6;
+}
+
+h3,
+.heading-3 {
+  @apply !text-base !font-medium leading-5;
+}
+
+h4,
+.heading-4 {
+  @apply !text-sm !font-medium leading-4;
+}
+
+p,
+.p {
+  @apply !text-xs !font-normal leading-4;
+}
+
+h5,
+.heading-5 {
+  @apply !text-xs !font-semibold leading-4;
+}
+
+h6,
+.heading-6 {
+  @apply !text-[10px] !font-semibold leading-3;
+}
+
+.scrollbar-w-none {
+  scrollbar-width: none;
+}
+
+.scrollbar-w-thin {
+  scrollbar-width: thin;
+}