feat(button): 添加倾斜按钮组件并更新主题样式；引入默认主题变量

packages/app/src/components/button-evo.vue

@@ -0,0 +1,54 @@
+<script setup lang="ts">
+import { omit } from 'radash'
+
+// const theme
+interface ComponentProps {
+  block?: boolean
+  color?: string
+  size?: 'lg'
+}
+const props = withDefaults(
+  defineProps<{ customClass?: string; skew?: boolean } & ComponentProps>(),
+  { color: 'primary' },
+)
+const themeVars = { primary: '--evo-theme-primary' }
+const btnThemeClass = { primary: 'before:bg-[--evo-theme-primary] after:bg-[--evo-theme-primary]' }
+
+// const color = computed(() => (theme[props.color] ? theme[props.color] : props.color || 'black'))
+const buttonProps = computed(() => omit(props, ['color']))
+const btnClass = computed(
+  () => `${btnThemeClass[props.color] || `before:bg-[--color] after:bg-[--color]`}`,
+)
+const height = computed(() => ({ lg: '20px' })[props.size] || '2.75rem')
+</script>
+<template>
+  <button
+    class="left-skew relative bg-transparent hover:bg-transparent h-[--evo-btn-height]!"
+    :class="`${btnClass}`"
+    :style="{ '--color': color, '--evo-btn-height': height }"
+    v-bind="props"
+  >
+    <div class="w-full h-full flex items-center justify-center relative z-1 c-white">
+      <slot></slot>
+    </div>
+  </button>
+</template>
+<style lang="scss">
+/* 左侧倾斜的按钮 */
+
+.left-skew {
+  //   @apply bg-blue-500 text-white px-6 rounded text-center relative;
+  //   clip-path: polygon(12% 0%, 100% 0%, 100% 100%, 0% 100%);
+  //   transition: all 0.3s ease;
+  @apply border-black  border-1 h-11 pl-8 pr-4.75 opacity-85 box-border border-red border-solid;
+  &::before {
+    @apply content-empty absolute top-0 right-5 bottom-0 left-1.25 skew-x-154 rounded-tl-1.25 rounded-bl-3.75;
+  }
+  &::after {
+    @apply content-empty absolute top-0 right-0 bottom-0 left-6 w-auto h-auto rounded-2.5 b-none z-0 transform-none;
+  }
+  &:active {
+    // @apply opacity-75;
+  }
+}
+</style>

packages/app/src/core/themes/default.scss

@@ -1,3 +1,4 @@
+@import url('./evo-default.scss');
 :root,
 page {
 }

packages/app/src/core/themes/evo-default.scss

@@ -0,0 +1,3 @@
+:root {
+  --evo-theme-primary: black;
+}