fix: problem of component style in night mode; 🐛

修复:夜晚模式下组件样式问题;
This commit is contained in:
iczer
2020-07-08 11:49:12 +08:00
parent 32577b038a
commit 719dba0bd9
24 changed files with 86 additions and 187 deletions

View File

@@ -81,7 +81,7 @@ export default {
margin: 0;
}
p:first-child {
color: rgba(0,0,0,.45);
color: @text-color-second;
font-size: 12px;
line-height: 20px;
margin-bottom: 4px;

View File

@@ -51,7 +51,7 @@ export default {
max-width: 720px;
}
.author {
color: rgba(0,0,0,.45);
color: @text-color-second;
margin-top: 16px;
line-height: 22px;
& > :global(.ant-avatar) {
@@ -63,7 +63,7 @@ export default {
top: 1px;
}
& > em {
color: rgba(0,0,0,.25);
color: @disabled-color;
font-style: normal;
margin-left: 16px;
}

View File

@@ -47,7 +47,7 @@ export default {
line-height: 20px;
height: 20px;
& > span {
color: rgba(0,0,0,.45);
color: @text-color-second;
flex: 1;
font-size: 12px;
}

View File

@@ -1,5 +1,5 @@
<template>
<a-card :bordered="false">
<a-card class="result-error" :bordered="false">
<result style="margin-bottom: 16px; margin-top: 48px" :is-success="false" :title="title" :description="description">
<template slot="action">
<a-button type="primary" >返回修改</a-button>
@@ -9,12 +9,12 @@
您提交的内容有如下错误
</div>
<div style="margin-bottom: 16px">
<a-icon type="close-circle-o" style="color: #f5222d; margin-right: 8px"/>
<a-icon class="error-icon" type="close-circle-o"/>
您的账户已被冻结
<a style="margin-left: 16px">立即解冻 <a-icon type="right" /></a>
</div>
<div>
<a-icon type="close-circle-o" style="color: #f5222d; margin-right: 8px"/>
<a-icon class="error-icon" type="close-circle-o"/>
您的账户还不具备申请资格
<a style="margin-left: 16px">立即升级 <a-icon type="right" /></a>
</div>
@@ -24,7 +24,7 @@
</template>
<script>
import Result from '../../components/result/Result'
import Result from '@/components/result/Result'
export default {
name: 'Error',
components: {Result},
@@ -37,6 +37,11 @@ export default {
}
</script>
<style scoped>
<style scoped lang="less">
.result-error{
.error-icon{
color: @red-6;
margin-right: 8px
}
}
</style>

View File

@@ -1,37 +1,37 @@
<template>
<a-card :bordered="false">
<result :is-success="true" :description="description" :title="title">
<template slot="action">
<a-button type="primary">返回列表</a-button>
<a-button style="margin-left: 8px">查看项目</a-button>
<a-button style="margin-left: 8px" @click="print">打印</a-button>
</template>
<div>
<div style="font-size: 16px; color: rgba(0, 0, 0, 0.85); font-weight: 500; margin-bottom: 20px;">项目名称</div>
<detail-list size="small" style="max-width: 800px; margin-bottom: 8px">
<detail-list-item term="项目ID">20180724089</detail-list-item>
<detail-list-item term="负责人">曲丽丽</detail-list-item>
<detail-list-item term="生效时间">016-12-12 ~ 2017-12-12</detail-list-item>
</detail-list>
<a-steps :current="1" progressDot>
<a-step title="创建项目">
<a-step-item-group slot="description">
<a-step-item title="曲丽丽" icon="dingding-o"/>
<a-step-item title="2016-12-12 12:32"/>
</a-step-item-group>
</a-step>
<a-step title="部门初审">
<a-step-item-group slot="description">
<a-step-item title="周毛毛" icon="dingding-o" :iconStyle="{color: '#00A0E9'}"/>
<a-step-item title="催一下" :titleStyle="{color: '#00A0E9'}"/>
</a-step-item-group>
</a-step>
<a-step title="财务复核"></a-step>
<a-step title="完成" ></a-step>
</a-steps>
</div>
</result>
</a-card>
<a-card class="result-success" :bordered="false">
<result :is-success="true" :description="description" :title="title">
<template slot="action">
<a-button class="action" type="primary">返回列表</a-button>
<a-button class="action" >查看项目</a-button>
<a-button class="action" @click="print">打印</a-button>
</template>
<div>
<div class="project-name">项目名称</div>
<detail-list size="small" style="max-width: 800px; margin-bottom: 8px">
<detail-list-item term="项目ID">20180724089</detail-list-item>
<detail-list-item term="负责人">曲丽丽</detail-list-item>
<detail-list-item term="生效时间">016-12-12 ~ 2017-12-12</detail-list-item>
</detail-list>
<a-steps :current="1" progressDot>
<a-step title="创建项目">
<a-step-item-group slot="description">
<a-step-item title="曲丽丽" icon="dingding-o"/>
<a-step-item title="2016-12-12 12:32"/>
</a-step-item-group>
</a-step>
<a-step title="部门初审">
<a-step-item-group slot="description">
<a-step-item title="周毛毛" icon="dingding-o" :iconStyle="{color: '#00A0E9'}"/>
<a-step-item title="催一下" :titleStyle="{color: '#00A0E9'}"/>
</a-step-item-group>
</a-step>
<a-step title="财务复核"></a-step>
<a-step title="完成" ></a-step>
</a-steps>
</div>
</result>
</a-card>
</template>
<script>
@@ -61,6 +61,16 @@ export default {
}
</script>
<style scoped>
<style scoped lang="less">
.result-success{
.action:not(:first-child){
margin-left: 8px;
}
.project-name{
font-size: 16px;
color: @title-color;
font-weight: 500;
margin-bottom: 20px;
}
}
</style>