样式调整

zhangwencui

48 分钟以前 6ce67a8e4a226e4c97dfeb53b843489f8c9c21bc

样式调整

 src/assets/styles/element-ui.scss

@@ -52,7 +52,7 @@
  left: 0;
  position: relative;
  margin: 0 auto;
  border-radius: 16px;
  border-radius: var(--radius-lg);
  padding: 0 !important;
  border: 1px solid var(--surface-border);
  box-shadow: var(--shadow-md);
@@ -62,7 +62,7 @@
  background: linear-gradient(180deg, rgba(248, 251, 255, 1), rgba(242, 247, 255, 0.98));
  padding: 18px 24px 14px;
  border-bottom: 1px solid var(--surface-border);
  border-radius: 14px 14px 0 0;
  border-radius: var(--radius-lg) var(--radius-lg) 0 0;
}
.el-dialog__title {
  font-weight: 600;
@@ -80,7 +80,7 @@
}
.el-message-box {
  padding: 0 !important;
  border-radius: 16px;
  border-radius: var(--radius-lg);
  border: 1px solid var(--surface-border);
  box-shadow: var(--shadow-md);
  background: rgba(255, 255, 255, 0.96);
@@ -89,7 +89,7 @@
  background: linear-gradient(180deg, rgba(248, 251, 255, 1), rgba(242, 247, 255, 0.98));
  padding: 18px 24px 14px;
  border-bottom: 1px solid var(--surface-border);
  border-radius: 14px 14px 0 0;
  border-radius: var(--radius-lg) var(--radius-lg) 0 0;
}
.el-message-box__title {
  font-weight: 600;
@@ -162,7 +162,7 @@
}

.el-button {
  border-radius: 8px;
  border-radius: var(--radius-sm);
  font-weight: 600;
  box-shadow: none !important;
}
@@ -181,7 +181,7 @@
.el-select__wrapper,
.el-date-editor.el-input__wrapper,
.el-date-editor .el-input__wrapper {
  border-radius: 10px;
  border-radius: var(--radius-sm);
  box-shadow: 0 0 0 1px rgba(148, 163, 184, 0.28) inset !important;
  background: rgba(255, 255, 255, 0.92);
  color: var(--text-primary);
@@ -197,6 +197,7 @@
  border: 1px solid var(--surface-border);
  box-shadow: var(--shadow-sm);
  background: var(--panel-mask);
  border-radius: var(--radius-md);
}

.el-table {
@@ -204,7 +205,7 @@
  --el-table-header-bg-color: #f2f7ff;
  --el-table-row-hover-bg-color: #f8fbff;
  --el-table-current-row-bg-color: #edf4ff;
  border-radius: 12px;
  border-radius: var(--radius-md);
  background: rgba(255, 255, 255, 0.94) !important;
}


 src/assets/styles/index.scss

@@ -114,7 +114,7 @@
  background: rgba(255, 255, 255, 0.84);
  padding: 8px 24px;
  margin-bottom: 20px;
  border-radius: 12px;
  border-radius: var(--radius-md);
  border: 1px solid var(--surface-border);
  display: block;

  line-height: 32px;


 src/assets/styles/variables.module.scss

@@ -70,7 +70,7 @@
  --topbar-height: 64px;
  --tagsbar-height: 40px;
  --content-gap: 16px;
  --content-radius: 16px;
  --content-radius: 10px;
  --layout-header-z: 20;

  --el-color-primary: #374d77;
@@ -101,10 +101,15 @@
  --shadow-sm: 0 1px 2px 0 rgba(0, 0, 0, 0.05);
  --shadow-md: 0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -1px rgba(0, 0, 0, 0.06);
  --shadow-menu: 0 10px 15px -3px rgba(0, 0, 0, 0.1), 0 4px 6px -2px rgba(0, 0, 0, 0.05);
  --radius-lg: 12px;
  --radius-md: 8px;
  --radius-sm: 6px;
  --radius-xs: 4px;
  --radius-lg: 8px;
  --radius-md: 6px;
  --radius-sm: 4px;
  --radius-xs: 2px;

  --el-border-radius-base: var(--radius-sm);
  --el-border-radius-small: var(--radius-xs);
  --el-border-radius-round: 999px;
  --el-border-radius-circle: 50%;

  --navbar-bg: rgba(30, 41, 59, 0.85);
  --navbar-text: #f8fafc;

 src/views/login.vue

@@ -98,7 +98,7 @@
                    y="112"
                    width="138"
                    height="128"
                    rx="18"
                    rx="10"
                    fill="url(#g2)"
                    stroke="rgba(255,255,255,.42)" />
              <path d="M145 185h88M145 210h58"
@@ -116,7 +116,7 @@
                    y="76"
                    width="190"
                    height="164"
                    rx="22"
                    rx="12"
                    fill="url(#g2)"
                    stroke="rgba(255,255,255,.42)" />
              <path d="M350 126h120M350 158h90M350 190h112"
@@ -169,7 +169,7 @@
                    y="82"
                    width="148"
                    height="158"
                    rx="20"
                    rx="12"
                    fill="url(#g2)"
                    stroke="rgba(255,255,255,.42)" />
              <path d="M724 206V134M764 206V112M804 206V154"
@@ -573,7 +573,7 @@
    grid-template-columns: 3fr 2fr;
    gap: 0;
    align-items: stretch;
    border-radius: 34px;
    border-radius: var(--content-radius);
    background: rgba(255, 255, 255, 0.72);
    border: 1px solid rgba(255, 255, 255, 0.72);
    box-shadow: var(--shadow);
@@ -646,7 +646,7 @@
  .logo {
    width: 52px;
    height: 52px;
    border-radius: 14px;
    border-radius: var(--radius-md);
    display: grid;
    place-items: center;
    background: rgba(var(--accent-rgb), 0.12);
@@ -691,7 +691,7 @@
    display: inline-flex;
    align-items: center;
    padding: 7px 12px;
    border-radius: 999px;
    border-radius: var(--radius-md);
    border: 1px solid rgba(255, 255, 255, 0.16);
    background: rgba(255, 255, 255, 0.08);
    color: rgba(255, 255, 255, 0.78);
@@ -744,7 +744,7 @@

  .time span {
    padding: 6px 10px;
    border-radius: 999px;
    border-radius: var(--radius-md);
    border: 1px solid rgba(15, 23, 42, 0.12);
    background: rgba(255, 255, 255, 0.7);
    color: rgba(15, 23, 42, 0.6);
@@ -754,7 +754,7 @@
  .login-card {
    width: min(420px, 100%);
    padding: 38px 34px 34px;
    border-radius: 22px;
    border-radius: var(--radius-lg);
    border: 1px solid rgba(15, 23, 42, 0.12);
    background: rgba(255, 255, 255, 0.86);
    backdrop-filter: blur(14px);
@@ -770,7 +770,7 @@
    top: -120px;
    width: 240px;
    height: 240px;
    border-radius: 999px;
    border-radius: var(--radius-lg);
    background: radial-gradient(
      circle at 30% 30%,
      rgba(var(--accent-rgb), 0.36),
@@ -792,7 +792,7 @@
  .card-brand .logo {
    width: 46px;
    height: 46px;
    border-radius: 14px;
    border-radius: var(--radius-md);
    background: rgba(var(--accent-rgb), 0.12);
    border: 1px solid rgba(var(--accent-rgb), 0.22);
  }
@@ -867,7 +867,7 @@
    height: 50px;
    padding: 0 14px 0 44px;
    border: 1px solid var(--border);
    border-radius: 14px;
    border-radius: var(--radius-md);
    outline: none;
    background: rgba(255, 255, 255, 0.92);
    color: var(--text);
@@ -921,7 +921,7 @@
    width: 100%;
    height: 52px;
    border: none;
    border-radius: 14px;
    border-radius: var(--radius-md);
    cursor: pointer;
    color: #ffffff;
    font-size: 15px;