更新组件演示页面,方便用户直接使用组件,去除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

@@ -1,5 +1,6 @@
<template>
<view class="template">
<view class="vip">
<view class="top-backgroup">
<image src='https://tnuiimage.tnkjapp.com/index_bg/template_new.jpg' mode='widthFix' class='backgroud-image'></image>
</view>
@@ -20,11 +21,19 @@
getRandomCoolBg(content_index)
]"
>
<view class="nav-link">
<view class='title'>{{ content_item.title }}</view>
<view class="tn-flex tn-flex-col-center tn-flex-row-between">
<view class="nav-link">
<view class='title'>{{ content_item.title }}</view>
</view>
<view class="icon">
<view :class="['tn-icon-' + content_item.icon]"></view>
</view>
</view>
<view class="icon">
<view :class="['tn-icon-' + content_item.icon]"></view>
<view class="author">
<view class='name tn-text-sm tn-color-gray' style="margin-left: -10rpx;">
<text class="tn-icon-code tn-padding-right-xs"></text>
<text class=""> {{ content_item.author }} </text>
</view>
</view>
</navigator>
</block>
@@ -32,7 +41,7 @@
</block>
<view class="tn-padding-bottom"></view>
</view>
</template>
@@ -109,19 +118,40 @@
padding: 0rpx 12rpx 0rpx;
justify-content: space-between;
/* 列表元素 start */
.nav-list-item {
padding: 50rpx 30rpx 36rpx 30rpx;
border-radius: 12rpx;
width: 100%;
margin: 0 18rpx 40rpx;
margin: 0 18rpx 90rpx;
background-size: cover;
background-position: center;
position: relative;
z-index: 99;
display: flex;
align-items: center;
justify-content: space-between;
// display: flex;
// align-items: center;
// justify-content: space-between;
.author-title{
position: absolute;
z-index: -1;
background-color: #FFFFFF;
width: 100%;
height: 100%;
left: 0;
bottom: -100%;
border-radius: 10upx;
opacity: 1;
transform: scale(1);
.title {
color: #000000;
text-align: left;
}
}
/* 元素标题 start */
.nav-link {
@@ -160,6 +190,22 @@
border-radius: 5000rpx;
}
/* 元素图标 end */
/* 作者信息 start*/
.author {
// background-color: red;
box-shadow: 0rpx 0rpx 30rpx 0rpx rgba(0, 0, 0, 0.12);
border-radius: 0 0 15rpx 15rpx;
position: absolute;
width: 85%;
line-height: 50rpx;
left: 50%;
bottom: -50rpx;
transform: translateX(-50%);
z-index: -1;
text-align: center;
}
/* 作者信息 end*/
}
/* 列表元素 end */
}

View File

@@ -57,15 +57,6 @@
<view class="tn-margin-left-sm tn-color-cyan tn-icon-link"></view>
</view>
</tn-list-cell>
<tn-list-cell :hover="true" :unlined="true" :radius="true" :fontSize="30" @click="navTuniaoUI">
<view class="tn-flex tn-flex-col-center">
<view class="icon1__item--icon tn-flex tn-flex-row-center tn-flex-col-center tn-cool-bg-color-16 tn-color-white" >
<view class="tn-icon-vip-fill"></view>
</view>
<view class="tn-margin-left-sm tn-flex-1">图鸟UI</view>
<view class="tn-margin-left-sm tn-color-orangeyellow">会员版</view>
</view>
</tn-list-cell>
<tn-list-cell :hover="true" :unlined="true" :radius="true" :fontSize="30" @click="copyGitee">
<view class="tn-flex tn-flex-col-center">
<view class="icon1__item--icon tn-flex tn-flex-row-center tn-flex-col-center tn-cool-bg-color-1 tn-color-white">
@@ -160,12 +151,6 @@
appId: 'wxa698b1eee960632f'
})
},
// 跳转到图鸟UI会员版
navTuniaoUI() {
uni.navigateToMiniProgram({
appId: 'wxf3d81a452b88ff4b'
})
},
// 跳转到会员协议
navPlus() {