8000 debug css · pycoder404/blog-vue@6d5e8b8 · GitHub
[go: up one dir, main page]
Skip to content

Commit 6d5e8b8

Browse files
pycoder404pycoder404
committed
debug css
1 parent c5d9517 commit 6d5e8b8

File tree

5 files changed

+25
-20
lines changed

5 files changed

+25
-20
lines changed

‎public/index.html

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -18,6 +18,7 @@
1818
<style>
1919
body {
2020
height: 100%;
21+
margin:0;
2122
}
2223

2324
</style>

‎src/App.vue

Lines changed: 4 additions & 10 deletions
Original file line numberDiff line numberDiff line change
@@ -1,17 +1,12 @@
11
<template>
2-
<!-- <img alt="Vue logo" src="./assets/logo.png">-->
3-
<!-- <HelloWorld msg="Welcome to Your Vue.js App"/>-->
4-
<div id="app">
5-
<router-view></router-view>
6-
</div>
7-
2+
<router-view></router-view>
83
</template>
94

105
<script>
116
12-
export default {
13-
name: 'App'
14-
}
7+
export default {
8+
name: 'App'
9+
}
1510
</script>
1611

1712
<style>
@@ -21,7 +16,6 @@ export default {
2116
-moz-osx-font-smoothing: grayscale;
2217
text-align: center;
2318
color: #2c3e50;
24-
margin: 5px 5px auto;
2519
height: 100vh;
2620
}
2721
</style>

‎src/layout/components/MainFooter.vue

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -18,7 +18,7 @@
1818
height: 40px;
1919
overflow: hidden;
2020
display: block;
21-
background: #f7f4f4;
21+
background: #fff;
2222
box-shadow: 0 1px 4px rgba(0, 21, 41, .08);
2323
}
2424
</style>

‎src/layout/index.vue

Lines changed: 9 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -1,29 +1,29 @@
11
<template>
22
<div class="container">
3-
<el-row class="el-margin-side">
3+
<el-row style="border-bottom: solid 1px rgba(0, 0, 0, 0.125)">
44
<el-col :span="24">
55
<main-header></main-header>
66
</el-col>
77
</el-row>
88

9-
<el-row class="el-margin-side main-content">
9+
<el-row class="main-content">
1010
<el-col :span="24">
1111
<app-main class="main-container"></app-main>
1212
</el-col>
1313
</el-row>
1414

15-
<el-row class="el-margin-side">
15+
<el-row style="border-top: solid 1px rgba(0, 0, 0, 0.125)">
1616
<el-col :span="24">
1717
<main-footer></main-footer>
1818
</el-col>
1919
</el-row>
2020
</div>
2121

22-
2322
</template>
2423

2524
<script>
2625
import {MainHeader, AppMain, MainFooter} from './components'
26+
2727
export default {
2828
name: 'LayOut',
2929
components: {
@@ -50,6 +50,7 @@
5050
top: 0;
5151
}
5252
}
53+
5354
.container {
5455
height: 100%;
5556
width: 100%;
@@ -58,13 +59,16 @@
5859
justify-content: space-between;
5960
box-sizing: border-box;
6061
}
62+
6163
.el-margin-side {
6264
margin-left: 5px;
6365
margin-right: 5px;
6466
}
67+
6568
.main-content {
66-
flex:1;
69+
flex: 1;
6770
}
71+
6872
.drawer-bg {
6973
background: #000;
7074
opacity: 0.3;

‎src/views/article/detail.vue

Lines changed: 10 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -1,12 +1,13 @@
11
<template>
22
<el-row>
33
<el-col :span="4">
4-
<div class="col-bg">
4+
<div class="col-bg">
55
<p>left sidebar</p>
66
</div>
77
</el-col>
88

9-
<el-col :span="16">
9+
10+
<el-col class="border-side" :span="16">
1011
<div class="col-bg" style="background-color: white">
1112
<div class="content-margin-left">
1213
<h3>{{ articleDetail.title }}</h3>
@@ -33,9 +34,9 @@
3334
</div>
3435
<br>
3536
</div>
36-
3737
</el-col>
3838

39+
3940
<el-col :span="4">
4041
<div class="col-bg">
4142
<div v-html="articleDetail.toc"/>
@@ -132,13 +133,18 @@
132133
text-align: right;
133134
}
134135
136+
.border-side {
137+
border-left-style: solid;
138+
border-right-style: solid;
139+
border-width: 1px;
140+
border-color:rgba(0, 0, 0, 0.125);
141+
}
135142
136143
.col-bg {
137144
text-align: left;
138145
height: 100%;
139146
border-radius: 4px;
140147
margin-left: 15px;
141-
background: #d3dce6;
142148
}
143149
144150
</style>

0 commit comments

Comments
 (0)
0