diff --git a/.gitpod.yml b/.gitpod.yml
index 51f4bdcbae96054e054b5a95ba128d2353dc2e2c..866381fccdc485a1293a2e119d1381ca87e23e28 100644
--- a/.gitpod.yml
+++ b/.gitpod.yml
@@ -3,4 +3,4 @@ ports:
     onOpen: open-preview
 tasks:
   - init: pnpm install
-    command: pnpm dev
+    command: pnpm run dev
diff --git a/.husky/lintstagedrc.js b/.husky/lintstagedrc.js
deleted file mode 100644
index 08d8c9e81a81b4e7b07c0e358f202b5e5c1dc798..0000000000000000000000000000000000000000
--- a/.husky/lintstagedrc.js
+++ /dev/null
@@ -1,8 +0,0 @@
-module.exports = {
-  '*.{js,jsx,ts,tsx}': ['eslint --fix', 'prettier --write'],
-  '{!(package)*.json,*.code-snippets,.!(browserslist)*rc}': ['prettier --write--parser json'],
-  'package.json': ['prettier --write'],
-  '*.vue': ['eslint --fix', 'prettier --write', 'stylelint --fix'],
-  '*.{scss,less,styl,html}': ['stylelint --fix', 'prettier --write'],
-  '*.md': ['prettier --write'],
-};
diff --git a/index.html b/index.html
index 5b99faf679245060d6fb43ebe4bc4442cd5341ff..25d1cd722bd2a1cebd7b255c95be18fd6a1830a4 100644
--- a/index.html
+++ b/index.html
@@ -8,7 +8,6 @@
       name="viewport"
       content="width=device-width,initial-scale=1.0,minimum-scale=1.0,maximum-scale=1.0,user-scalable=0"
     />
-
     <title><%= title %></title>
     <link rel="icon" href="/favicon.ico" />
   </head>
@@ -30,7 +29,7 @@
         }
 
         html[data-theme='dark'] .app-loading .app-loading-title {
-          color: rgba(255, 255, 255, 0.85);
+          color: rgb(255 255 255 / 85%);
         }
 
         .app-loading {
@@ -48,7 +47,7 @@
           top: 50%;
           left: 50%;
           display: flex;
-          -webkit-transform: translate3d(-50%, -50%, 0);
+          transform: translate3d(-50%, -50%, 0);
           transform: translate3d(-50%, -50%, 0);
           justify-content: center;
           align-items: center;
@@ -66,7 +65,7 @@
           display: flex;
           margin-top: 30px;
           font-size: 30px;
-          color: rgba(0, 0, 0, 0.85);
+          color: rgb(0 0 0 / 85%);
           justify-content: center;
           align-items: center;
         }
@@ -97,7 +96,7 @@
           height: 20px;
           background-color: #0065cc;
           border-radius: 100%;
-          opacity: 0.3;
+          opacity: 30%;
           transform: scale(0.75);
           animation: antSpinMove 1s infinite linear alternate;
           transform-origin: 50% 50%;
@@ -111,43 +110,43 @@
         .dot i:nth-child(2) {
           top: 0;
           right: 0;
-          -webkit-animation-delay: 0.4s;
+          animation-delay: 0.4s;
           animation-delay: 0.4s;
         }
 
         .dot i:nth-child(3) {
           right: 0;
           bottom: 0;
-          -webkit-animation-delay: 0.8s;
+          animation-delay: 0.8s;
           animation-delay: 0.8s;
         }
 
         .dot i:nth-child(4) {
           bottom: 0;
           left: 0;
-          -webkit-animation-delay: 1.2s;
+          animation-delay: 1.2s;
           animation-delay: 1.2s;
         }
         @keyframes antRotate {
           to {
-            -webkit-transform: rotate(405deg);
+            transform: rotate(405deg);
             transform: rotate(405deg);
           }
         }
-        @-webkit-keyframes antRotate {
+        @keyframes antRotate {
           to {
-            -webkit-transform: rotate(405deg);
+            transform: rotate(405deg);
             transform: rotate(405deg);
           }
         }
         @keyframes antSpinMove {
           to {
-            opacity: 1;
+            opacity: 100%;
           }
         }
-        @-webkit-keyframes antSpinMove {
+        @keyframes antSpinMove {
           to {
-            opacity: 1;
+            opacity: 100%;
           }
         }
       </style>
diff --git a/package.json b/package.json
index bf7eb79400ff6d134a26a8eb63738591d9e75405..6e55a12445ca9f925c68a63372b77f4d8481c37f 100644
--- a/package.json
+++ b/package.json
@@ -23,7 +23,7 @@
     "lint:eslint": "eslint --cache --max-warnings 0  \"{src,mock}/**/*.{vue,ts,tsx}\" --fix",
     "lint:prettier": "prettier --write  \"src/**/*.{js,json,tsx,css,less,scss,vue,html,md}\"",
     "lint:stylelint": "stylelint --cache --fix \"**/*.{vue,less,postcss,css,scss}\" --cache --cache-location node_modules/.cache/stylelint/",
-    "lint:lint-staged": "lint-staged -c ./.husky/lintstagedrc.js",
+    "lint:lint-staged": "lint-staged",
     "test:unit": "jest",
     "test:unit-coverage": "jest --coverage",
     "test:gzip": "npx http-server dist --cors --gzip -c-1",
@@ -159,5 +159,29 @@
   "homepage": "https://github.com/anncwb/vue-vben-admin",
   "engines": {
     "node": "^12 || >=14"
+  },
+  "lint-staged": {
+    "*.{js,jsx,ts,tsx}": [
+      "eslint --fix",
+      "prettier --write"
+    ],
+    "{!(package)*.json,*.code-snippets,.!(browserslist)*rc}": [
+      "prettier --write--parser json"
+    ],
+    "package.json": [
+      "prettier --write"
+    ],
+    "*.vue": [
+      "eslint --fix",
+      "prettier --write",
+      "stylelint --fix"
+    ],
+    "*.{scss,less,styl,html}": [
+      "stylelint --fix",
+      "prettier --write"
+    ],
+    "*.md": [
+      "prettier --write"
+    ]
   }
 }
diff --git a/stylelint.config.js b/stylelint.config.js
index 26bc40c6771c67a843452fca361ca660097a46a5..4216a96102a2a0571e93c1e86d3791caedb76b57 100644
--- a/stylelint.config.js
+++ b/stylelint.config.js
@@ -71,9 +71,10 @@ module.exports = {
   ignoreFiles: ['**/*.js', '**/*.jsx', '**/*.tsx', '**/*.ts'],
   overrides: [
     {
-      files: ['*.vue', '**/*.vue'],
+      files: ['*.vue', '**/*.vue', '*.html', '**/*.html'],
       extends: ['stylelint-config-recommended', 'stylelint-config-html'],
       rules: {
+        'keyframes-name-pattern': null,
         'selector-pseudo-class-no-unknown': [
           true,
           {