Browse Source

成长首页ui细节调整

test
wzl 1 year ago
parent
commit
4fc2bb2fa3
1 changed files with 17 additions and 12 deletions
  1. +17
    -12
      src/views/development/index.vue

+ 17
- 12
src/views/development/index.vue View File

@@ -10,7 +10,7 @@
</div> </div>
</router-link> </router-link>
<div class="gap">当前任务</div> <div class="gap">当前任务</div>
<div class="task radius">
<div class="task">
<div class="image"> <div class="image">
<img src="@/assets/development/images/task.png" alt="" /> <img src="@/assets/development/images/task.png" alt="" />
</div> </div>
@@ -47,7 +47,7 @@
</div> </div>
<div class="levels"> <div class="levels">
<div <div
class="level"
class="level radius"
v-for="(item, index) in levels" v-for="(item, index) in levels"
:key="index" :key="index"
:class="{ :class="{
@@ -183,11 +183,14 @@ export default {
font-weight: 400; font-weight: 400;
} }
.radius { .radius {
border-radius: 70px;
border-radius: 60px;
} }
.bold { .bold {
font-weight: bold; font-weight: bold;
} }
.gap {
padding-left: 35px;
}
.devlopment { .devlopment {
padding-top: 30px; padding-top: 30px;
font-weight: bold; font-weight: bold;
@@ -213,6 +216,7 @@ export default {
position: relative; position: relative;
width: 100%; width: 100%;
height: 750px; height: 750px;
border-radius: 40px;
background: #ff5f8b; background: #ff5f8b;


.image { .image {
@@ -233,7 +237,7 @@ export default {
display: flex; display: flex;
justify-content: space-between; justify-content: space-between;
align-items: flex-end; align-items: flex-end;
padding: 20px 60px;
padding: 20px 40px;
.mid-text { .mid-text {
font-size: 30px; font-size: 30px;
} }
@@ -290,9 +294,8 @@ export default {
overflow: hidden; overflow: hidden;
position: relative; position: relative;
width: 100%; width: 100%;
height: 300px;
height: 270px;
color: white; color: white;
border-radius: 60px;
margin-top: 20px; margin-top: 20px;
background: #b3b3b3; background: #b3b3b3;


@@ -313,23 +316,25 @@ export default {


.level-info-level { .level-info-level {
.level-info-text { .level-info-text {
font-size: 50px;
letter-spacing: 2px;
} }
.level-info-status { .level-info-status {
font-size: 25px;
font-weight: 400;
} }
} }
.level-info-title { .level-info-title {
.level-info-title-text {
}
.level-info-title-desc {
}
font-size: 34px;
letter-spacing: 2px;
} }
} }
.tip { .tip {
position: absolute; position: absolute;
right: 20px; right: 20px;
top: 20px; top: 20px;
width: 150px;
height: 215.5px;
width: 120px;
height: 173px;
z-index: 3; z-index: 3;
} }
} }


Loading…
Cancel
Save