集成tailwindcss 替换新的登陆页面和版权信息组件 (#1499)

* 集成tailwindcss

* fix: 修改登录，init 页面

* Update package.json

* 升级可升级的第三方库到新版本

* 细节调整

---------

Co-authored-by: bypanghu <bypanghu@163.com>
Co-authored-by: task <121913992@qq.com>

web/src/view/layout/bottomInfo/bottomInfo.vue

@@ -1,16 +1,16 @@
+<!-- 此文件禁止修改！如果您没有购买授权，请联系wx:shouzi_1994购买授权，未授权状态只需保留此代码 不影响任何正常使用 -->
+
 <template>
-  <div class="bottom-info">
-    <div>
-      <span>Powered by</span>
-      <span>
-        <a href="https://github.com/flipped-aurora/gin-vue-admin">{{ $GIN_VUE_ADMIN.appName }}</a>
-      </span>
-      <el-divider direction="vertical" />
-      <span>Copyright</span>
-      <span>
-        <a href="https://github.com/flipped-aurora">flipped-aurora团队</a>
-      </span>
-    </div>
+  <div class="flex gap-4 items-center text-sm text-gray-500 justify-center mb-4">
+    <span>Powered by</span>
+    <span>
+      <a class="text-gray-800 font-bold" href="https://github.com/flipped-aurora/gin-vue-admin">{{ $GIN_VUE_ADMIN.appName }}</a>
+    </span>
+    <slot />
+    <span>Copyright</span>
+    <span>
+      <a class="text-gray-800 font-bold" href="https://github.com/flipped-aurora">flipped-aurora团队</a>
+    </span>
   </div>
 </template>
 
@@ -22,20 +22,12 @@ export default {
 }
 </script>
 
-<style lang="scss">
-.bottom-info {
-  color: #888;
-  height: 30px;
-  line-height: 12px;
-  a {
-    color: #888;
-  }
-  div {
-    display: flex;
-    justify-content: center;
-    span{
-      margin: 0 3px;
-    }
-  }
-}
-</style>
+<script  setup>
+console.log(
+  `%c powered by %c flipped-aurorae %c`,
+  'background:#0081ff; padding: 1px; border-radius: 3px 0 0 3px; color: #fff',
+  'background:#354855; padding: 1px 5px; border-radius: 0 3px 3px 0; color: #fff; font-weight: bold;',
+  'background:transparent'
+)
+</script>
+