You cannot select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
78 lines
1.5 KiB
Vue
78 lines
1.5 KiB
Vue
8 months ago
|
<template>
|
||
|
|
<view class="g-components-panel-about">
|
||
|
|
<view :class="color">
|
||
|
|
<!-- <view class="g_h_10"></view> -->
|
||
|
|
<view class="g_flex_row_between g_h_36 g_radius_4 _bg">
|
||
|
|
<view class="g_flex_column_center">
|
||
|
|
<view class="g_flex_row_start g_pl_12">
|
||
|
|
<view class="g_flex_c _icon" style="width: 20px;height: 20px;border-radius: 8px;">
|
||
|
|
<i class="iconfont icon-xiaoxitongzhi _i" style="font-size: 13px;"></i>
|
||
|
|
</view>
|
||
|
|
<view class="g_fs_12 g_ml_5 _str" style="line-height:20px">{{str}}</view>
|
||
|
|
</view>
|
||
|
|
</view>
|
||
|
|
<view class="g_pr_12 g_flex_column_center">
|
||
|
|
<view class="btn g_w_42 g_h_24 g_radius_13 g_flex_c g_fs_12 _btn">关注</view>
|
||
|
|
</view>
|
||
|
|
</view>
|
||
|
|
</view>
|
||
|
|
</view>
|
||
|
|
</template>
|
||
|
|
<script>
|
||
|
|
/* 关注
|
||
|
|
*/
|
||
|
|
export default {
|
||
|
|
props:{
|
||
|
|
str:{
|
||
|
|
type:String,
|
||
|
|
default:()=>{
|
||
|
|
return "关注公众号，不错过重要通知"
|
||
|
|
}
|
||
|
|
},
|
||
|
|
color:{
|
||
|
|
type:String,
|
||
|
|
default:()=>{
|
||
|
|
return "green"
|
||
|
|
}
|
||
|
|
}
|
||
|
|
}
|
||
|
|
}
|
||
|
|
</script>
|
||
|
|
|
||
|
|
<style lang="scss">
|
||
|
|
.g-components-panel-about{
|
||
|
|
.green{
|
||
|
|
._bg{
|
||
|
|
background-color: rgba(0,182,102,0.08);;
|
||
|
|
}
|
||
|
|
._icon{
|
||
|
|
background: rgba(0,182,102,0.70);
|
||
|
|
}
|
||
|
|
._str{
|
||
|
|
color: #3578f6;
|
||
|
|
}
|
||
|
|
._i{
|
||
|
|
color: #fff;
|
||
|
|
}
|
||
|
|
._btn{
|
||
|
|
border: 1px solid rgba(0,182,102,0.80);
|
||
|
|
color: #3578f6;
|
||
|
|
}
|
||
|
|
}
|
||
|
|
.red{
|
||
|
|
._bg{
|
||
|
|
background-color: #FFEEE9;
|
||
|
|
}
|
||
|
|
._icon{
|
||
|
|
background: #ffdede;
|
||
|
|
}
|
||
|
|
._str,._i{
|
||
|
|
color: #ff4400;
|
||
|
|
}
|
||
|
|
._btn{
|
||
|
|
border: 1px solid #ff0000;
|
||
|
|
color: #ff4400;
|
||
|
|
}
|
||
|
|
}
|
||
|
|
}
|
||
|
|
</style>
|