更新组件演示页面,方便用户直接使用组件,去除tn-button的默认背景色,tn-avatar修改参数默认值,修复tn-avatar-group最开始头像进行了偏移、修复无法使用标签的bug,tn-badge修改参数默认值,tn-collapse-item修复背景颜色失效问题,滚动通知移除默认背景颜色和字体大小,tn-count-down修复时间单位不正确问题,列表组件修复背景颜色问题,tn-nav-bar返回按钮修改为可进行修改的图标,tn-step添加点击步骤进行跳转,tn-loading修复默认激活颜色出错问题,tn-tag移除默认背景颜色,优化阴影大小css

This commit is contained in:
JaylenTech
2022-02-08 19:55:15 +08:00
parent 043ee3f585
commit 946bb52c03
94 changed files with 6296 additions and 4727 deletions

View File

@@ -0,0 +1,90 @@
<template>
<view class="demo-title">
<view>
<view v-if="type === 'first'" class="main_title">
<view v-if="leftIcon" class="main_title__icon main_title__icon--left" :class="[`tn-icon-${leftIcon}`]"></view>
<view class="main_title__content">{{ title }}</view>
<view v-if="rightIcon" class="main_title__icon main_title__icon--right" :class="[`tn-icon-${rightIcon}`]"></view>
</view>
<view v-if="type === 'second'" class="second_title">
<view class="second_title__content">{{ title }}</view>
</view>
</view>
<view class="content" :class="[{
'content--padding': contentPadding
}]">
<slot></slot>
</view>
</view>
</template>
<script>
export default {
name: 'demo-title',
props: {
// 标题类型
type: {
type: String,
default: 'first'
},
// 标题
title: {
type: String,
default: ''
},
// 左图标
leftIcon: {
type: String,
default: 'star'
},
// 右图标
rightIcon: {
type: String,
default: 'star'
},
// 内容容器是否有两边边距
contentPadding: {
type: Boolean,
default: true
}
}
}
</script>
<style lang="scss" scoped>
.main_title {
display: flex;
align-items: center;
justify-content: center;
margin-top: 50rpx;
font-size: 36rpx;
font-weight: bold;
&__content {
padding: 0 18rpx;
}
&__icon {
font-size: 34rpx;
}
}
.second_title {
margin: 24rpx 0;
margin-left: 30rpx;
&__content {
font-size: 32rpx;
font-weight: bold;
}
}
.content {
margin-top: 30rpx;
&--padding {
margin-left: 30rpx;
margin-right: 30rpx;
}
}
</style>