kylin
/
zdxtDrillProgram
1
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity
Browse Source

样式优化

h5_css
蟑螂恶霸 3 years ago
parent
c891577f5a
commit
332fde1f73
8 changed files with 106 additions and 144 deletions
Whitespace
Show all changes Ignore whitespace when comparing lines Ignore changes in amount of whitespace Ignore changes in whitespace at EOL
Unified View
Diff Options
Show Stats Download Patch File Download Diff File
  1. 17
      pages/knowledge/knowledge.vue
  2. 18
      static/base_css.css
  3. 13
      subpkg/address/address.vue
  4. 14
      subpkg/complete/complete.vue
  5. 17
      subpkg/feedback/feedback.vue
  6. 12
      subpkg/list/list.vue
  7. 49
      subpkg/review/review.vue
  8. 6
      subpkg/role/role.vue

17
pages/knowledge/knowledge.vue
View File

@ -4,7 +4,7 @@
<view class="secbar"> <view class="secbar">
<view class="title">知识库</view> <view class="title">知识库</view>
</view> </view>
<view class="mainwrap2"> <view class="mainwrap">
<view class="subwrap"> <view class="subwrap">
<view class="message-list"> <view class="message-list">
<view class="artlist" v-for="(item, i) in knowledgeList" :key="i" @click="navClickHandler(item)"> <view class="artlist" v-for="(item, i) in knowledgeList" :key="i" @click="navClickHandler(item)">
@ -66,21 +66,25 @@
this.queryObj.pageNum++ this.queryObj.pageNum++
this.getContentList() this.getContentList()
}, },
components: {tabbar}, components: {
tabbar
},
} }
</script> </script>
<style lang="scss"> <style lang="scss">
@import url("@/static/base_css.css"); @import url("@/static/base_css.css");
.mainwrap {
top: 5vh;
height: 80vh;
}
.title { .title {
margin-top: 0; margin-top: 0;
padding-top: 16rpx; padding-top: 16rpx;
} }
.mainwrap2 {
height: calc(100% - 300rpx);
}
.artlist { .artlist {
margin: 2% 0 3.5%; margin: 2% 0 3.5%;
padding: 4% 3%; padding: 4% 3%;
@ -91,6 +95,7 @@
border-radius: 20rpx; border-radius: 20rpx;
box-sizing: border-box; box-sizing: border-box;
} }
.timetop { .timetop {
margin: 0 0 3%; margin: 0 0 3%;
/* padding: 0 0 2%; /* padding: 0 0 2%;

18
static/base_css.css
View File

@ -47,7 +47,7 @@ img {
z-index: 9999; z-index: 9999;
padding: 0 5%; padding: 0 5%;
width: 100%; width: 100%;
height: 90rpx; height: 6vh;
color: #fff; color: #fff;
line-height: 30px; line-height: 30px;
background-color: #bac6fc; background-color: #bac6fc;
@ -59,8 +59,8 @@ img {
.mainwrap { .mainwrap {
position: relative; position: relative;
top: 90rpx; top: 6vh;
height: calc(100% - 250rpx); height: 84vh;
width: 100%; width: 100%;
background-image: linear-gradient(to bottom, #bac6fc, transparent 50%); background-image: linear-gradient(to bottom, #bac6fc, transparent 50%);
box-sizing: content-box; box-sizing: content-box;
@ -216,9 +216,9 @@ h3.contit span {
.secbar { .secbar {
position: relative; position: relative;
z-index: 99; z-index: 99;
top: 90rpx; top: 6vh;
width: 100%; width: 100%;
height: 90rpx; height: 6vh;
background-color: #bac6fc; background-color: #bac6fc;
} }
@ -258,16 +258,16 @@ h3.contit span {
top: 0; top: 0;
overflow: hidden; overflow: hidden;
overflow-y: auto; overflow-y: auto;
padding: 1% 3%; padding: 1% 3% 9%;
width: 94%; width: 94%;
height: 100%; height: 100%;
} }
.mainwrap2, .mainwrap3, .tabwrap { .mainwrap2, .mainwrap3, .tabwrap {
position: relative; position: relative;
top: 90rpx; top: 6vh;
width: 100%; width: 100%;
height: calc(100% - 180rpx); height: 88vh;
background-image: linear-gradient(to bottom, #bac6fc, transparent 40%); background-image: linear-gradient(to bottom, #bac6fc, transparent 40%);
box-sizing: content-box; box-sizing: content-box;
overflow: hidden; overflow: hidden;
@ -275,7 +275,7 @@ h3.contit span {
.mainwrap3 { .mainwrap3 {
top: 0; top: 0;
height: calc(100% - 160rpx); height: 89vh;
overflow-y: hidden; overflow-y: hidden;
} }

13
subpkg/address/address.vue
View File

@ -7,10 +7,6 @@
<view class="mainwrap2"> <view class="mainwrap2">
<view class="subwrap"> <view class="subwrap">
<!-- 底部的边框线 -->
<image src="/static/cart_border@2x.png" class="address-border"></image>
<!-- 循环渲染地址信息 --> <!-- 循环渲染地址信息 -->
<view> <view>
@ -40,7 +36,7 @@
</view> </view>
<!-- 选择收货地址的盒子 --> <!-- 选择收货地址的盒子 -->
<view class="address-choose-box"> <view class="address-choose-box">
<button type="primary" size="mini" class="uni-button" @click="chooseAddress">批量刪除</button> <button type="primary" size="mini" class="uni-button" @click="chooseAddress">全部刪除</button>
<button type="primary" size="mini" class="uni-button" @click="chooseAddress">新增地址</button> <button type="primary" size="mini" class="uni-button" @click="chooseAddress">新增地址</button>
</view> </view>
</view> </view>
@ -60,7 +56,7 @@
options: [{ options: [{
text: '删除', text: '删除',
style: { style: {
backgroundColor: '#C00000' backgroundColor: '#fb1010'
} }
}], }],
addressList: [] addressList: []
@ -149,9 +145,6 @@
<style lang="scss"> <style lang="scss">
@import url("@/static/base_css.css"); @import url("@/static/base_css.css");
.mainwrap2 {
height: calc(100% - 350rpx);
}
.address-border { .address-border {
display: block; display: block;
@ -165,7 +158,7 @@
bottom: 0; bottom: 0;
padding: 10rpx 0 50rpx 0; padding: 10rpx 0 50rpx 0;
width: 100vw; width: 100vw;
height: 90rpx; height: 7vh;
border-top: 1px solid #ddd; border-top: 1px solid #ddd;
background-color: #fff; background-color: #fff;

14
subpkg/complete/complete.vue
View File

@ -6,7 +6,7 @@
<image class="animg" src="/static/images/joy.png"></image> <image class="animg" src="/static/images/joy.png"></image>
</view> </view>
<view class="mainwrap"> <view class="mainwrap2">
<view class="title">恭喜完成本次演练！</view> <view class="title">恭喜完成本次演练！</view>
<view class="question-wrap"> <view class="question-wrap">
<view class="question-list"> <view class="question-list">
@ -444,9 +444,8 @@
} }
} }
.mainwrap { .mainwrap2 {
height: calc(100% - 150rpx); height: 94vh;
overflow-y: auto;
} }
.title { .title {
@ -494,10 +493,11 @@
margin: 2% 3%; margin: 2% 3%;
padding: 2%; padding: 2%;
width: 90%; width: 90%;
min-height: 400rpx; height: 25vh;
background: #fff; background: #fff;
border: 1px solid #18c569; border: 1px solid #18c569;
border-radius: 10px; border-radius: 20rpx;
overflow-y: auto;
} }
.qucont { .qucont {
@ -538,7 +538,7 @@
.question-record { .question-record {
margin: 3% 3% 5%; margin: 3% 3% 5%;
width: 94%; width: 94%;
height: 25%; height: 23vh;
overflow: hidden; overflow: hidden;
label { label {

17
subpkg/feedback/feedback.vue
View File

@ -5,7 +5,7 @@
<view class="title">建议与意见反馈</view> <view class="title">建议与意见反馈</view>
</view> </view>
<view class="mainwrap2"> <view class="mainwrap2">
<view class="subwrap">
<view class="table_index"> <view class="table_index">
<!-- <uni-section title="建议与反馈" type="line"></uni-section> --> <!-- <uni-section title="建议与反馈" type="line"></uni-section> -->
<uni-forms :modelValue="formData"> <uni-forms :modelValue="formData">
@ -18,7 +18,7 @@
<button class="uni-button" size="mini" type="primary" @click="toTable">提交</button> <button class="uni-button" size="mini" type="primary" @click="toTable">提交</button>
</uni-forms> </uni-forms>
</view> </view>
</view>
</view> </view>
</view> </view>
</template> </template>
@ -69,12 +69,17 @@
</script> </script>
<style scoped> <style scoped>
@import url("@/static/base_css.css"); @import url("@/static/base_css.css");
.table_index { .table_index {
margin: 0 3%;
padding: 50rpx 30rpx;
width: 94%;
height: 82vh;
background-image: linear-gradient(to bottom, #fff, transparent); background-image: linear-gradient(to bottom, #fff, transparent);
height: 100%; border-radius: 20rpx;
padding: 50px 30px; box-sizing: border-box;
border-radius: 3%; }
.uni-easyinput__content-textarea {
height: 500rpx;
} }
.uni-button { .uni-button {
font-size: 30rpx; font-size: 30rpx;

12
subpkg/list/list.vue
View File

@ -132,16 +132,16 @@
@import url("@/static/base_css.css"); @import url("@/static/base_css.css");
.mainwrap3 { .mainwrap3 {
top: 50rpx; top: 3.5vh;
height: calc(100% - 160rpx) height: 90.5vh;
} }
swiper { swiper {
position: relative; position: relative;
top: 30px; top: 3vh;
margin: 0 3%; margin: 0 3%;
width: 94%; width: 94%;
height: 280rpx; height: 18vh;
.swiper-item, .swiper-item,
image { image {
@ -149,7 +149,7 @@
margin-left: 0.1%; margin-left: 0.1%;
height: 100%; height: 100%;
align-items: center; align-items: center;
border-radius: 10px; border-radius: 20rpx;
} }
} }
.nav-list { .nav-list {
@ -159,7 +159,7 @@
margin: 4% 3%; margin: 4% 3%;
padding: 0 0 8%; padding: 0 0 8%;
width: 94%; width: 94%;
height: 55%; height: 52vh;
overflow-y: auto; overflow-y: auto;
.nav-item { .nav-item {

49
subpkg/review/review.vue
View File

@ -96,7 +96,7 @@
margin: 0 3%; margin: 0 3%;
padding: 3%; padding: 3%;
width: 88%; width: 88%;
height: 240rpx; height: 13vh;
background-color: #fff; background-color: #fff;
border-radius: 20rpx; border-radius: 20rpx;
border: 1px solid rgba(151, 1, 188, .45); border: 1px solid rgba(151, 1, 188, .45);
@ -104,10 +104,11 @@
font-size: 32rpx; font-size: 32rpx;
line-height: 1.5; line-height: 1.5;
} }
.question-info{ .question-info{
margin-top: 20rpx; margin-top: 20rpx;
padding-top: 50rpx; padding-top: 50rpx;
height: calc(100% - 420rpx); height: 62vh;
overflow: hidden; overflow: hidden;
} }
@ -116,51 +117,9 @@
height: 100%; height: 100%;
} }
.question-item { .question-list image {
position: relative;
margin: 2% 0 3%;
width: 100%;
height: 320rpx;
border-radius: 20rpx;
overflow: hidden;
}
.question-item image, .question-list image {
width: 100%;
height: 100%;
}
.question-num {
position: absolute;
z-index: 10;
width: 100%; width: 100%;
height: 100%; height: 100%;
background-color: rgba(0, 0, 0, .45);
}
.question-txt {
position: absolute;
z-index: 100;
top: 3%;
left: 2%;
width: 96%;
color:#fff;
}
.question-txt .imgbox {
display: inline-block;
position: relative;
top: 20rpx;
margin: 0 12rpx;
width: 66rpx;
height: 66rpx;
}
.question-txt .ordnum {
position: absolute;
left: 48rpx;
top: 22rpx;
font-size: 38rpx;
} }
.thumbtack { .thumbtack {

6
subpkg/role/role.vue
View File

@ -138,7 +138,7 @@
} }
.mainwrap3 { .mainwrap3 {
top: 0; top: 0;
height: 100%; height: 94vh;
overflow: hidden; overflow: hidden;
} }
@ -199,7 +199,7 @@
.startbtn { .startbtn {
position: relative; position: relative;
z-index: 1; z-index: 1;
bottom: 40%; bottom: 33vh;
width: 100%; width: 100%;
height: 30%; height: 30%;
background:no-repeat 47.5% center; background:no-repeat 47.5% center;
@ -224,7 +224,7 @@
.cnote { .cnote {
position: absolute; position: absolute;
bottom: 3%; bottom: 3vh;
width: 100%; width: 100%;
color: rgba(255, 255, 255, .5); color: rgba(255, 255, 255, .5);
font-size: 0.75rem; font-size: 0.75rem;

Write Preview
Loading…
Cancel
Save