<!--
 * @Author: ch
 * @Date: 2022-03-26 14:32:03
 * @LastEditors: ch
 * @LastEditTime: 2022-04-09 15:08:38
 * @Description: file content
-->
<template>
	<view>
		<view class="msgItem" v-for="item in 5" :key="item">
			<view class="msgItem--title">
				<text>退款消息</text>
				<text class="msgItem--time">03-23 00:00</text>
			</view>
			<view class="msgItem--con">
				<image class="msgItem--img" src="@/static/testImg/3.png" mode="widthFix"/>
				<view class="msgItem--desc">马士兵新款多线程与高并发专项训练突破课程书籍项训练突破课程书籍项训练突破</view>
			</view>
		</view>
	</view>
</template>
<script>
export default {
	
}
</script>
<style lang="scss" scoped>
.msgItem{
	padding: 40rpx 0 0 40rpx;
	&--title{
		display: flex;
		justify-content: space-between;
		align-items: center;
		padding-right: 40rpx;
		font-size: $font-size-lg;
		color: $color-grey6;
	}
	&--time{
		font-size: $font-size-sm;
		color: $color-grey4;
	}
	&--con{
		display: flex;
		border-bottom: 1px solid $color-grey2;
		padding: 40rpx 0;
	}
	&--img{
		width: 140rpx;
		height: 140rpx;
		border-radius: 12rpx;
		margin-right: 40rpx;
	}
	&--desc{
		width: 455rpx;
		font-size: $font-size-base;
		line-height: 39rpx;
		color: $color-grey5;
	}
}
</style>