hz/learning-system-mobile
1
0
Fork 0
mirror of https://codeup.aliyun.com/67762337eccfc218f6110e0e/vue/learning-system-mobile.git synced 2025-12-09 02:46:46 +08:00
Code Issues Packages Projects Releases Wiki Activity

ub

Browse Source
This commit is contained in:
lmj
2022-11-01 17:18:45 +08:00
parent 3dbe45311f
commit 6c3e762207
1 changed files with 59 additions and 28 deletions
Download Patch File Download Diff File Expand all files Collapse all files

87
pages/my/myub.vue
View File

@@ -1,18 +1,24 @@
<template> <template>
<view> <view style="background: #F0D8B0;width: 100%;height:100vh">
<view class="myub-top"> <view class="myub-top">
<view class="ub-content"> <view class="ub-content">
<view> <view class="ub-heard">
<view class="ub-tab" @click="ubtab(1)" :class="tab == 1 ? 'ub-tabactive' : ' ' ">课程学习<text></text></view> <view class="ub-tab" @click="ubtab(1)" :class="tab == 1 ? 'ub-tabactive' : ' ' ">课程学习<text></text></view>
<view class="ub-tab" @click="ubtab(2)" :class="tab == 2 ? 'ub-tabactive' : ' ' ">知识贡献<text></text></view> <view class="ub-tab" @click="ubtab(2)" :class="tab == 2 ? 'ub-tabactive' : ' ' ">知识贡献<text></text></view>
<view class="ub-tab" @click="ubtab(3)" :class="tab == 3 ? 'ub-tabactive' : ' ' ">平台活跃<text></text></view> <view class="ub-tab" @click="ubtab(3)" :class="tab == 3 ? 'ub-tabactive' : ' ' ">平台活跃<text></text></view>
</view> </view>
<view class="ub-listbox"> <view class="ub-listbox">
<view class="listbox-list"> <view class="listbox-list">
<view class="classify">分类</view> <view class="classify" style="text-align: center;">分类</view>
<view class="description">描述</view> <view class="description" style="text-align: center;">描述</view>
<view class="experience">经验值/U币</view> <view class="upper" style="text-align: center;">经验值/U币</view>
<view class="upper">每日上限</view> <view class="upper" style="text-align: center;">每日上限</view>
</view>
<view class="lsitbox-info">
<view class="classify">发布音视频教程</view>
<view class="description">每上传一个音视频课</view>
<view class="upper" style="text-align: center;">+60</view>
<view class="upper" style="text-align: center;">30</view>
</view> </view>
</view> </view>
</view> </view>
@@ -37,11 +43,31 @@
</script> </script>
<style lang="scss" scoped> <style lang="scss" scoped>
.lsitbox-info{
display:flex ;
width: 100%;
font-size: 28upx;
color: #834B3B;
margin-top: 20upx;
padding-bottom: 20upx;
border-bottom: 2px solid rgba(153,153,153,0.1);
}
.classify{
width: 25%;
}
.description{
flex: 1;
}
.upper{
width: 20%;
}
.ub-listbox{ .ub-listbox{
width: 100%; width: 100%;
height: 100%; height: 100%;
.listbox-list { .listbox-list {
display:flex ; display:flex ;
color: #FF7721;
font-size: 24upx;
} }
} }
@@ -58,30 +84,35 @@
height: 100%; height: 100%;
border-radius: 6px; border-radius: 6px;
padding: 45upx 30upx; padding: 45upx 30upx;
.ub-tab{ .ub-heard{
color: #999999; width: 100%;
float: left; height: 100upx;
font-size: 32upx; .ub-tab{
margin-right: 44upx; color: #999999;
position: relative; float: left;
text{ font-size: 32upx;
width: 42px; margin-right: 44upx;
height: 4px; position: relative;
background: linear-gradient(180deg, #FFA31F 0%, #FF6E0E 100%); text{
border-radius: 13px; width: 84upx;
position: absolute; height: 8upx;
left: 15%; background: linear-gradient(180deg, #FFA31F 0%, #FF6E0E 100%);
top: 120%; border-radius: 13px;
display: none; position: absolute;
} left: 15%;
} top: 120%;
.ub-tabactive{ display: none;
font-weight: 500; }
color: #333333; }
text{ .ub-tabactive{
display: inline-block; font-weight: 500;
color: #333333;
text{
display: inline-block;
}
} }
} }
} }
} }
</style> </style>