theme-crazing-js

最好用的 主题切换 动画

:star: 特性

• 体积小、操作简单
• 支持Vue、React

:pill: 兼容性

单元测试保证支持如下环境：

| IE | CH | FF | SF | OP | IOS | Android | Node | | --- | ---- | ---- | --- | ---- | ----- | ------- | ---- | | 11+ | 100+ | 100+ | 16+ | 100+ | 10.3+ | 4.1+ | 14+ |

注意：编译代码依赖ES5环境，对于ie6-8需要引入es5-shim才可以兼容，可以查看demo/demo-global.html中的例子

:open_file_folder: 目录介绍

.
├── demo 使用demo
├── dist 编译产出代码
├── doc 项目文档
├── src 源代码目录
├── test 单元测试
├── CHANGELOG.md 变更日志
└── TODO.md 计划功能

:rocket: 使用者指南

下载安装

# npm 安装

$ npm install --save @souljs/theme-crazing-js

# yarn 安装

$ yarn add @souljs/theme-crazing-js

使用

:root {
  --background-color: `light-color`;
  background-color: var(--background-color);
}

:root.dark {
  --background-color: `dark-color`;
  background-color: var(--background-color);
}

<script setup lang="ts">
import { useTheme } from '@souljs/theme-crazing-js';
const { setTheme } = useTheme();

function handleClick(e: Event) {
  setTheme(e);
}
</script>

<template>
  <button @click="handleClick">Toggle Theme</button>
</template>

:bookmark_tabs: 文档

API

:gear: 更新日志

CHANGELOG.md

:airplane: 计划列表

TODO.md