Thanks to visit codestin.com
Credit goes to github.com

Skip to content

Commit d98c503

Browse files
authored
refine style (PanJiaChen#843)
* refine style * refine 404 style * refine
1 parent a575670 commit d98c503

File tree

9 files changed

+57
-30
lines changed

9 files changed

+57
-30
lines changed

src/components/GithubCorner/index.vue

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
11
<template>
22
<a href="https://github.com/PanJiaChen/vue-element-admin" target="_blank" class="github-corner" aria-label="View source on Github">
3-
<svg width="80" height="80" viewBox="0 0 250 250" style="fill:#40c9c6; color:#fff; position: absolute; top: 84px; border: 0; right: 0;"
3+
<svg width="80" height="80" viewBox="0 0 250 250" style="fill:#40c9c6; color:#fff;"
44
aria-hidden="true">
55
<path d="M0,0 L115,115 L130,115 L142,142 L250,250 L250,0 Z"></path>
66
<path d="M128.3,109.0 C113.8,99.7 119.0,89.6 119.0,89.6 C122.0,82.7 120.5,78.6 120.5,78.6 C119.2,72.0 123.4,76.3 123.4,76.3 C127.3,80.9 125.5,87.3 125.5,87.3 C122.9,97.6 130.6,101.9 134.4,103.2"

src/styles/sidebar.scss

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -4,6 +4,7 @@
44
min-height: 100%;
55
transition: margin-left .28s;
66
margin-left: 180px;
7+
position: relative;
78
}
89
// 侧边栏
910
.sidebar-container {

src/views/clipboard/index.vue

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -34,7 +34,7 @@ export default {
3434
},
3535
clipboardSuccess() {
3636
this.$message({
37-
message: '复制成功',
37+
message: 'Copy successfully',
3838
type: 'success',
3939
duration: 1500
4040
})

src/views/dashboard/admin/components/TransactionTable.vue

Lines changed: 4 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -2,7 +2,7 @@
22
<el-table :data="list" style="width: 100%;padding-top: 15px;">
33
<el-table-column label="Order_No" min-width="200">
44
<template slot-scope="scope">
5-
{{scope.row.order_no}}
5+
{{scope.row.order_no | orderNoFilter}}
66
</template>
77
</el-table-column>
88
<el-table-column label="Price" width="195" align="center">
@@ -34,6 +34,9 @@ export default {
3434
pending: 'danger'
3535
}
3636
return statusMap[status]
37+
},
38+
orderNoFilter(str) {
39+
return str.substring(0, 30)
3740
}
3841
},
3942
created() {

src/views/dashboard/admin/index.vue

Lines changed: 5 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,7 @@
11
<template>
22
<div class="dashboard-editor-container">
3-
<github-corner></github-corner>
3+
4+
<github-corner style="position: absolute; top: 0px; border: 0; right: 0;"></github-corner>
45

56
<panel-group @handleSetLineChartData="handleSetLineChartData"></panel-group>
67

@@ -30,17 +31,18 @@
3031
<el-col :xs="{span: 24}" :sm="{span: 24}" :md="{span: 24}" :lg="{span: 12}" :xl="{span: 12}" style="padding-right:8px;margin-bottom:30px;">
3132
<transaction-table></transaction-table>
3233
</el-col>
33-
<el-col :xs="{span: 24}" :sm="{span: 12}" :md="{span: 12}" :lg="{span: 6}" :xl="{span: 5}" style="margin-bottom:30px;">
34+
<el-col :xs="{span: 24}" :sm="{span: 12}" :md="{span: 12}" :lg="{span: 6}" :xl="{span: 6}" style="margin-bottom:30px;">
3435
<todo-list></todo-list>
3536
</el-col>
36-
<el-col :xs="{span: 24}" :sm="{span: 12}" :md="{span: 12}" :lg="{span: 6}" :xl="{span: 5}" style="margin-bottom:30px;" >
37+
<el-col :xs="{span: 24}" :sm="{span: 12}" :md="{span: 12}" :lg="{span: 6}" :xl="{span: 6}" style="margin-bottom:30px;">
3738
<box-card></box-card>
3839
</el-col>
3940
</el-row>
4041

4142
</div>
4243
</template>
4344

45+
4446
<script>
4547
import GithubCorner from '@/components/GithubCorner'
4648
import PanelGroup from './components/PanelGroup'

src/views/dashboard/editor/index.vue

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -4,10 +4,10 @@
44
<pan-thumb style="float: left" :image="avatar"> Your roles:
55
<span class="pan-info-roles" :key='item' v-for="item in roles">{{item}}</span>
66
</pan-thumb>
7-
<github-corner></github-corner>
7+
<github-corner style="position: absolute; top: 0px; border: 0; right: 0;"></github-corner>
88
<div class="info-container">
99
<span class="display_name">{{name}}</span>
10-
<span style="font-size:20px;padding-top:20px;display:inline-block;">editor : dashboard</span>
10+
<span style="font-size:20px;padding-top:20px;display:inline-block;">Editor's Dashboard</span>
1111
</div>
1212
</div>
1313
<div>

src/views/errorPage/401.vue

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -57,6 +57,7 @@ export default {
5757
.pan-back-btn {
5858
background: #008489;
5959
color: #fff;
60+
border: none!important;
6061
}
6162
.pan-gif {
6263
margin: 0 auto;

src/views/errorPage/404.vue

Lines changed: 29 additions & 21 deletions
Original file line numberDiff line numberDiff line change
@@ -1,25 +1,28 @@
11
<template>
2-
<div style="background:#f0f2f5;margin-top: -20px;height:100%;">
3-
<div class="wscn-http404">
4-
<div class="pic-404">
5-
<img class="pic-404__parent" :src="img_404" alt="404">
6-
<img class="pic-404__child left" :src="img_404_cloud" alt="404">
7-
<img class="pic-404__child mid" :src="img_404_cloud" alt="404">
8-
<img class="pic-404__child right" :src="img_404_cloud" alt="404">
9-
</div>
10-
<div class="bullshit">
11-
<div class="bullshit__oops">OOPS!</div>
12-
<div class="bullshit__info">版权所有
13-
<a class='link-type' href='https://wallstreetcn.com' target='_blank'>华尔街见闻</a>
2+
<div style="background:#f0f2f5;height:100%;">
3+
<div class="wscn-http404-container">
4+
<div class="wscn-http404">
5+
<div class="pic-404">
6+
<img class="pic-404__parent" :src="img_404" alt="404">
7+
<img class="pic-404__child left" :src="img_404_cloud" alt="404">
8+
<img class="pic-404__child mid" :src="img_404_cloud" alt="404">
9+
<img class="pic-404__child right" :src="img_404_cloud" alt="404">
10+
</div>
11+
<div class="bullshit">
12+
<div class="bullshit__oops">OOPS!</div>
13+
<div class="bullshit__info">版权所有
14+
<a class='link-type' href='https://wallstreetcn.com' target='_blank'>华尔街见闻</a>
15+
</div>
16+
<div class="bullshit__headline">{{ message }}</div>
17+
<div class="bullshit__info">请检查您输入的网址是否正确,请点击以下按钮返回主页或者发送错误报告</div>
18+
<a href="" class="bullshit__return-home">返回首页</a>
1419
</div>
15-
<div class="bullshit__headline">{{ message }}</div>
16-
<div class="bullshit__info">请检查您输入的网址是否正确,请点击以下按钮返回主页或者发送错误报告</div>
17-
<a href="" class="bullshit__return-home">返回首页</a>
1820
</div>
1921
</div>
2022
</div>
2123
</template>
2224

25+
2326
<script>
2427
import img_404 from '@/assets/404_images/404.png'
2528
import img_404_cloud from '@/assets/404_images/404_cloud.png'
@@ -34,24 +37,28 @@ export default {
3437
},
3538
computed: {
3639
message() {
37-
return '特朗普说这个页面你不能进......'
40+
return '网管说这个页面你不能进......'
3841
}
3942
}
4043
}
4144
</script>
4245

4346
<style rel="stylesheet/scss" lang="scss" scoped>
47+
.wscn-http404-container{
48+
transform: translate(-50%,-50%);
49+
position: absolute;
50+
top: 40%;
51+
left: 50%;
52+
}
4453
.wscn-http404 {
4554
position: relative;
4655
width: 1200px;
47-
margin: 20px auto 60px;
48-
padding: 0 100px;
56+
padding: 0 50px;
4957
overflow: hidden;
5058
.pic-404 {
5159
position: relative;
5260
float: left;
5361
width: 600px;
54-
padding: 150px 0;
5562
overflow: hidden;
5663
&__parent {
5764
width: 100%;
@@ -163,7 +170,7 @@ export default {
163170
position: relative;
164171
float: left;
165172
width: 300px;
166-
padding: 150px 0;
173+
padding: 30px 0;
167174
overflow: hidden;
168175
&__oops {
169176
font-size: 32px;
@@ -179,7 +186,8 @@ export default {
179186
&__headline {
180187
font-size: 20px;
181188
line-height: 24px;
182-
color: #1482f0;
189+
color: #222;
190+
font-weight: bold;
183191
opacity: 0;
184192
margin-bottom: 10px;
185193
animation-name: slideUp;

src/views/layout/components/AppMain.vue

Lines changed: 13 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,5 @@
11
<template>
2-
<section class="app-main" style="min-height: 100%">
2+
<section class="app-main">
33
<transition name="fade-transform" mode="out-in">
44
<keep-alive :include="cachedViews">
55
<router-view :key="key"></router-view>
@@ -21,3 +21,15 @@ export default {
2121
}
2222
}
2323
</script>
24+
25+
<style scoped>
26+
.app-main {
27+
position: absolute;
28+
top: 84px; /* navbar + tags-view = 50 +34 */
29+
left: 0;
30+
right: 0;
31+
bottom: 0;
32+
margin: auto;
33+
}
34+
</style>
35+

0 commit comments

Comments
 (0)