feat: 登录页面

2025-06-20 06:10:15 -04:00
parent 1641320847
commit 54f620d92f
12 changed files with 328 additions and 287 deletions
--- a/src/views/components/login/style.scss
+++ b/src/views/components/login/style.scss
@ -0,0 +1,115 @@
+.login-wrap {
+  .login-bg {
+    position: fixed;
+    left: 0;
+    right: 0;
+    top: 0;
+    height: 100%;
+    text-align: center;
+    background-image: url('@/assets/img/BG.svg');
+    background-repeat: no-repeat;
+    background-position: center;
+    background-size: cover;
+  }
+  .form-link {
+    color: #211f24;
+    font-size: 12px;
+    margin: 0px;
+  }
+
+  .login-footer {
+    position: absolute;
+    bottom: 32px;
+    left: 50%;
+    transform: translateX(-50%);
+
+    .text {
+      font-family: Alibaba PuHuiTi;
+      font-weight: 400;
+      font-size: 14px;
+      line-height: 22px;
+      letter-spacing: 0%;
+      color: #939499;
+    }
+  }
+
+  :deep(.arco-space-item) {
+    margin: 0px !important;
+  }
+}
+
+
+
+.account-bind-container {
+  width: 100%;
+  max-width: 400px;
+  margin: 0 auto;
+  display: flex;
+
+  .bind-card {
+    background-color: var(--color-bg-2);
+    width: 100%;
+    flex-direction: column;
+    align-items: start;
+  }
+
+  .bind-header {
+    margin-bottom: 8px;
+    text-align: left;
+  }
+
+  .phone-number {
+    font-size: 14px;
+    color: var(--color-text-4);
+    text-align: left;
+  }
+
+  .account-list {
+    margin-top: 16px;
+
+    .account-item {
+      padding: 12px 16px;
+      margin-bottom: 8px;
+      background-color: var(--color-bg-2);
+      border-radius: 4px;
+      cursor: pointer;
+      transition: all 0.2s ease;
+      display: flex;
+      align-items: center;
+    }
+
+    .account-item {
+      padding: 12px 16px;
+      margin-bottom: 8px;
+      background-color: var(--color-bg-2);
+      border-radius: 4px;
+      cursor: pointer;
+      transition: all 0.2s ease;
+      border: 1px solid var(--color-border-2);
+      box-shadow: 0 2px 4px 0 #b1b2b5;
+
+      &.selected {
+        border-color: #6d4cfe;
+        background-color: rgba(109, 76, 254, 0.1);
+        box-shadow: 0 2px 4px 0 rgba(109, 76, 254, 0.5);
+      }
+    }
+
+    .account-item:deep(.arco-list-item-main) {
+      padding: 0;
+    }
+
+    :deep(.arco-list-item-actions) {
+      margin-left: 12px;
+    }
+
+    :deep(.arco-checkbox) {
+      margin-right: 0;
+    }
+
+    :deep(.arco-checkbox-checked .arco-checkbox-mask) {
+      background-color: #6d4cfe;
+      border-color: #6d4cfe;
+    }
+  }
+}