feat 个人中心样式整改
This commit is contained in:
@@ -176,9 +176,9 @@ const coreBusiness = [
|
|||||||
}
|
}
|
||||||
|
|
||||||
&__contact {
|
&__contact {
|
||||||
font-size: 16px;
|
font-size: @font-size-sm;
|
||||||
font-weight: 500;
|
font-weight: 400;
|
||||||
line-height: 23px;
|
line-height: 1.8;
|
||||||
}
|
}
|
||||||
|
|
||||||
&__bottom {
|
&__bottom {
|
||||||
@@ -193,14 +193,14 @@ const coreBusiness = [
|
|||||||
|
|
||||||
&__legal {
|
&__legal {
|
||||||
margin: 0;
|
margin: 0;
|
||||||
font-size: 14px;
|
font-size: @font-size-sm;
|
||||||
font-weight: 500;
|
font-weight: 400;
|
||||||
line-height: 23px;
|
line-height: 1.6;
|
||||||
white-space: nowrap;
|
white-space: nowrap;
|
||||||
color: @white;
|
color: @white;
|
||||||
|
|
||||||
&--icp {
|
&--icp {
|
||||||
margin-top: 16px;
|
margin-top: @spacing-base;
|
||||||
margin-left: 315px;
|
margin-left: 315px;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|||||||
@@ -6,30 +6,79 @@ function goHome(): void {
|
|||||||
|
|
||||||
<template>
|
<template>
|
||||||
<section class="not-found">
|
<section class="not-found">
|
||||||
<h1>404</h1>
|
<div class="not-found__card">
|
||||||
<p class="text-secondary">
|
<p class="not-found__code">
|
||||||
页面不存在或已下线
|
404
|
||||||
</p>
|
</p>
|
||||||
<button class="not-found__back link" @click="goHome">
|
<h1 class="not-found__title">
|
||||||
返回首页
|
页面不存在
|
||||||
</button>
|
</h1>
|
||||||
|
<p class="not-found__desc text-secondary">
|
||||||
|
页面不存在或已下线,请返回首页继续浏览
|
||||||
|
</p>
|
||||||
|
<button
|
||||||
|
class="not-found__back"
|
||||||
|
type="button"
|
||||||
|
@click="goHome"
|
||||||
|
>
|
||||||
|
返回首页
|
||||||
|
</button>
|
||||||
|
</div>
|
||||||
</section>
|
</section>
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
<style lang="less" scoped>
|
<style lang="less" scoped>
|
||||||
.not-found {
|
.not-found {
|
||||||
.flex(column, center);
|
.flex(column, center, center);
|
||||||
gap: @spacing-base;
|
|
||||||
min-height: 100vh;
|
min-height: 100vh;
|
||||||
|
padding: @spacing-lg;
|
||||||
|
background: @bg-color;
|
||||||
|
|
||||||
h1 {
|
&__card {
|
||||||
font-size: 64px;
|
.flex(column, center, center);
|
||||||
|
gap: @spacing-sm;
|
||||||
|
width: 100%;
|
||||||
|
max-width: 420px;
|
||||||
|
padding: @spacing-xxl @spacing-xl;
|
||||||
|
border-radius: @radius-base;
|
||||||
|
background: @white;
|
||||||
|
text-align: center;
|
||||||
|
}
|
||||||
|
|
||||||
|
&__code {
|
||||||
|
margin: 0;
|
||||||
|
font-size: @font-size-hero;
|
||||||
|
font-weight: 600;
|
||||||
|
line-height: 1;
|
||||||
|
color: @primary-color;
|
||||||
|
}
|
||||||
|
|
||||||
|
&__title {
|
||||||
|
margin: 0;
|
||||||
|
font-size: @font-size-xl;
|
||||||
|
font-weight: 600;
|
||||||
color: @heading-color;
|
color: @heading-color;
|
||||||
}
|
}
|
||||||
|
|
||||||
&__back {
|
&__desc {
|
||||||
color: @primary-color;
|
margin: 0 0 @spacing-base;
|
||||||
font-size: @font-size-base;
|
font-size: @font-size-base;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
&__back {
|
||||||
|
height: 40px;
|
||||||
|
padding: 0 @spacing-xl;
|
||||||
|
border: none;
|
||||||
|
border-radius: @radius-round;
|
||||||
|
background: @primary-color;
|
||||||
|
color: @white;
|
||||||
|
font-size: @font-size-base;
|
||||||
|
cursor: pointer;
|
||||||
|
transition: background 0.2s;
|
||||||
|
|
||||||
|
&:hover {
|
||||||
|
background: @primary-hover;
|
||||||
|
}
|
||||||
|
}
|
||||||
}
|
}
|
||||||
</style>
|
</style>
|
||||||
|
|||||||
@@ -71,13 +71,13 @@ const contacts = [
|
|||||||
|
|
||||||
&__section {
|
&__section {
|
||||||
& + & {
|
& + & {
|
||||||
margin-top: 34px;
|
margin-top: @spacing-lg;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
&__section-title {
|
&__section-title {
|
||||||
font-size: 14px;
|
font-size: @font-size-base;
|
||||||
font-weight: 700;
|
font-weight: 600;
|
||||||
color: @heading-color;
|
color: @heading-color;
|
||||||
line-height: 20px;
|
line-height: 20px;
|
||||||
text-align: center;
|
text-align: center;
|
||||||
|
|||||||
@@ -45,33 +45,37 @@ defineProps<Props>()
|
|||||||
|
|
||||||
&__group {
|
&__group {
|
||||||
& + & {
|
& + & {
|
||||||
margin-top: 42px;
|
margin-top: @spacing-xl;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
&__group-title {
|
&__group-title {
|
||||||
font-size: 14px;
|
font-size: @font-size-base;
|
||||||
font-weight: 700;
|
font-weight: 600;
|
||||||
color: @heading-color;
|
color: @heading-color;
|
||||||
line-height: 20px;
|
line-height: 1.4;
|
||||||
text-align: center;
|
text-align: left;
|
||||||
}
|
}
|
||||||
|
|
||||||
&__item {
|
&__item {
|
||||||
margin-top: 24px;
|
margin-top: @spacing-base;
|
||||||
|
padding: @spacing-base;
|
||||||
|
border-radius: @radius-base;
|
||||||
|
background: @bg-color-light;
|
||||||
}
|
}
|
||||||
|
|
||||||
&__q {
|
&__q {
|
||||||
font-size: 14px;
|
font-size: @font-size-base;
|
||||||
font-weight: 700;
|
font-weight: 600;
|
||||||
color: @heading-color;
|
color: @heading-color;
|
||||||
line-height: 20px;
|
line-height: 1.4;
|
||||||
}
|
}
|
||||||
|
|
||||||
&__a {
|
&__a {
|
||||||
margin: 8px 0 0 184px;
|
margin: @spacing-sm 0 0;
|
||||||
font-size: 13px;
|
font-size: @font-size-sm;
|
||||||
line-height: 1.8;
|
line-height: 1.6;
|
||||||
|
color: @text-color-secondary;
|
||||||
}
|
}
|
||||||
|
|
||||||
&__empty {
|
&__empty {
|
||||||
|
|||||||
Reference in New Issue
Block a user