From e5768fa1e349bd666d62bb0194fdbe0951d4cde5 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=E5=BC=A0=E4=BC=A0=E9=BE=99?= <zclzone@outlook.com>
Date: Sat, 23 Jul 2022 22:17:23 +0800
Subject: [PATCH] style: modify login page

---
 src/components/common/AppFooter.vue |  2 +-
 src/views/login/index.vue           | 17 +++--------------
 2 files changed, 4 insertions(+), 15 deletions(-)

diff --git a/src/components/common/AppFooter.vue b/src/components/common/AppFooter.vue
index f96029b..be48bc0 100644
--- a/src/components/common/AppFooter.vue
+++ b/src/components/common/AppFooter.vue
@@ -2,7 +2,7 @@
   <footer text-14 f-c-c flex-col color="#6a6a6a">
     <p>
       Copyright©2022
-      <a href="https://github.com/zclzone" target="__blank" hover="decoration-underline color-primary">大脸怪</a>
+      <a href="https://github.com/zclzone" target="__blank" hover="decoration-underline color-primary"> 大脸怪</a>
     </p>
     <p>
       <a href="http://beian.miit.gov.cn/" target="__blank" hover="decoration-underline color-primary">
diff --git a/src/views/login/index.vue b/src/views/login/index.vue
index 8b15b8b..14857db 100644
--- a/src/views/login/index.vue
+++ b/src/views/login/index.vue
@@ -1,6 +1,6 @@
 <template>
-  <div class="login-bg cus-scroll" h-full flex-col overflow-auto>
-    <div class="login-wrapper" m-auto p-15 f-c-c min-w-345 rounded-10>
+  <div class="cus-scroll h-full py-15 flex-col overflow-auto bg-cover" :style="{ backgroundImage: `url(${bgImg})` }">
+    <div m-auto p-15 f-c-c min-w-345 rounded-10 card-shadow bg-white bg-opacity-60>
       <div w-380 hidden md:block px-20 py-35>
         <img src="@/assets/images/login_banner.png" w-full alt="login_banner" />
       </div>
@@ -47,6 +47,7 @@ import { login } from '@/api/auth'
 import { lStorage } from '@/utils/cache'
 import { setToken } from '@/utils/token'
 import { useStorage } from '@vueuse/core'
+import bgImg from '@/assets/images/login_bg.jpg'
 
 const title = import.meta.env.VITE_APP_TITLE
 
@@ -104,15 +105,3 @@ async function handleLogin() {
   loging.value = false
 }
 </script>
-
-<style lang="scss" scoped>
-.login-bg {
-  background-image: url(@/assets/images/login_bg.jpg);
-  background-size: cover;
-}
-
-.login-wrapper {
-  box-shadow: 1.5px 3.99px 27px 0px rgb(0 0 0 / 10%);
-  background-color: rgba(255, 255, 255, 0.6);
-}
-</style>