A1300399510/GterForumWeB
2
1
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

a1300399510@qq.com 提交于 2023/03/30 -18:20:01

Browse Source
This commit is contained in:
XiaoMo 2023-03-30 18:20:10 +08:00
parent 2697677779
commit 4377bb0900
1 changed files with 66 additions and 10 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

72
src/views/detail/detailIndex.vue
View File

@ -13,8 +13,24 @@
</div> </div>
<div class="detail-title-box"> <div class="detail-title-box">
<div class="detail-title-jinghua flexcenter">精华</div> <div class="detail-title-item detail-title-jinghua flexcenter">精华</div>
<div class="detail-title-label flexcenter">生活贴士</div> <div class="detail-title-item detail-title-label flexcenter">生活贴士</div>
香港永久居民的申请步骤和过程
</div>
<!-- -->
<div class="card flexflex">
<div class="card-item shadow">
<div class="card-head">
<img class="card-head-icon" src="" />
<div class="card-head-content flexflex">
<div class="card-head-name">闫旭Mike</div>
<div class="card-head-time">2022-7-6 14:56</div>
</div>
<div class="card-head-fool"></div>
</div>
</div>
</div> </div>
@ -89,20 +105,60 @@ export default {
.detail-title-box { .detail-title-box {
padding: .191rem 0.2933rem 0; padding: .72rem 0.2933rem 0;
color: #000;
font-size: .56rem;
font-weight: 650;
.detail-title-jinghua { .detail-title-item {
width: 1rem;
height: .64rem;
border-radius: .5rem .5rem 0;
font-size: .32rem; font-size: .32rem;
color: #fff; color: #fff;
height: .64rem;
display: inline-flex;
margin-right: .16rem;
font-weight: 400;
&.detail-title-jinghua {
width: 1rem;
border-radius: .5rem .5rem 0;
background: linear-gradient(-57.3808deg, rgb(178, 152, 232) 0%, rgb(88, 70, 195) 100%); background: linear-gradient(-57.3808deg, rgb(178, 152, 232) 0%, rgb(88, 70, 195) 100%);
} }
.detail-title-label { &.detail-title-label {
background: rgb(51, 51, 51); background: rgb(51, 51, 51);
padding: 0 .16rem;
display: inline-flex;
border-radius: .16rem;
}
}
}
.card {
margin-top: .48rem;
justify-content: center;
.card-item {
width: 9.4rem;
border-radius: .4rem;
background: #fff;
.card-head {
.card-head-icon {
width: .96rem;
height: .96rem;
border-radius: 50%;
}
.card-head-content {}
} }
} }
}
} }
</style> </style>