Pārlūkot izejas kodu

test: unocss theme color primary

lanjianrong 2 gadi atpakaļ
vecāks
revīzija
9178e062d8
2 mainītis faili ar 1 papildinājumiem un 54 dzēšanām
  1. 0 1
      config/defaultSettings.ts
  2. 1 53
      unocss.config.ts

+ 0 - 1
config/defaultSettings.ts

@@ -5,7 +5,6 @@ const Settings: LayoutSettings & {
   logo?: string
 } = {
   navTheme: 'light',
-  // 拂晓蓝
   primaryColor: '#1890ff',
   layout: 'mix',
   contentWidth: 'Fluid',

+ 1 - 53
unocss.config.ts

@@ -1,12 +1,11 @@
 import { defineConfig, presetWind } from 'unocss'
-import proSettings from './config/defaultSettings'
 export function createConfig({ dev = true } = {}) {
   return defineConfig({
     envMode: dev ? 'dev' : 'build',
     presets: [presetWind()],
     theme: {
       colors: {
-        primary: proSettings.primaryColor
+        primary: '#1890ff'
       },
       screens: {
         sm: '576px',
@@ -20,58 +19,7 @@ export function createConfig({ dev = true } = {}) {
       }
     }
     // transformers: [transformerDirectives()]
-    // rules: [createEnterPlugin()]
-    // variants: [createEnterPlugin()]
   })
 }
 
 export default createConfig()
-/**
- * Used for animation when the element is displayed
- * @param maxOutput The larger the maxOutput output, the larger the generated css volume
- */
-function createEnterPlugin(maxOutput = 10) {
-  const createCss = (index: number, d = 'x') => {
-    const upd = d.toUpperCase()
-    return {
-      [`*> .enter-${d}:nth-child(${index})`]: {
-        transform: `translate${upd}(50px)`
-      },
-      [`*> .-enter-${d}:nth-child(${index})`]: {
-        transform: `translate${upd}(-50px)`
-      },
-      [`* > .enter-${d}:nth-child(${index}),* > .-enter-${d}:nth-child(${index})`]: {
-        'z-index': `${10 - index}`,
-        opacity: '0',
-        animation: `enter-${d}-animation 0.4s ease-in-out 0.3s`,
-        'animation-fill-mode': 'forwards',
-        'animation-delay': `${(index * 1) / 10}s`
-      }
-    }
-  }
-  const handler = () => {
-    const addRawCss = {}
-    for (let index = 1; index < maxOutput; index++) {
-      Object.assign(m, {
-        ...createCss(index, 'x'),
-        ...createCss(index, 'y')
-      })
-    }
-    return {
-      ...addRawCss,
-      [`@keyframes enter-x-animation`]: {
-        to: {
-          opacity: '1',
-          transform: 'translateX(0)'
-        }
-      },
-      [`@keyframes enter-y-animation`]: {
-        to: {
-          opacity: '1',
-          transform: 'translateY(0)'
-        }
-      }
-    }
-  }
-  return [/^enter-(x|y)/, () => handler()]
-}