修改首页搜索,top3,功能模块,课程推荐样式

v2
king 1 year ago
parent 9fb280b866
commit 9f5e6af772
  1. 11
      src/components/videoCover/videoCover.scss
  2. 2
      src/components/videoCover/videoCover.tsx
  3. 1
      src/pages/home/components/curRecommended.tsx
  4. 2
      src/pages/home/components/feature.tsx
  5. 2
      src/pages/home/components/feature_recommended.tsx
  6. 4
      src/pages/home/components/search.tsx
  7. 21
      src/pages/home/home.module.scss
  8. 4
      src/pages/home/home.tsx

@ -33,13 +33,18 @@
}
.marker {
font-size: 24rpx;
font-family: PingFang SC-Medium, PingFang SC;
font-weight: 500;
color: #FFFFFF;
height: 34rpx;
padding: 0 8rpx;
position: absolute;
background: rgba(#000, .5);
color: #fff;
padding: 0 10px;
border-radius: 0 0 0 10px;
border-radius: 0 0 8px 0;
top: 0;
right: 0;
left: 0;
}
Image {

@ -30,8 +30,8 @@ const VideoCover: FC<VideoCoverProps> = (opt: VideoCoverProps) => {
<View className='video' onClick={jump}>
<View className='upper'>
<Img height={180} src={opt.thumb} mode='widthFix'/>
{opt.content && <View className='content'>{opt.content}</View>}
{opt.marker && <View className='marker'>{opt.marker}</View>}
{opt.content && <View className='content'>{opt.content}</View>}
</View>
<View className='box'>
<View className='title'>{opt.title}</View>

@ -47,6 +47,7 @@ const CurRecommended: FC = () => {
id={c.id}
depId={c.id}
key={c.id}
marker={`${c.class_hour}`}
/>)
}
</View>

@ -23,7 +23,7 @@ const Feature: FC = () => {
<View className='flex justify-around' style={{marginBottom: '20px'}}>
{
list.map(d => <View className='text-center' onClick={() => jump(d.url)}>
<Image src={d.image} style={{width: '48px', height: '48px'}}/>
<Image src={d.image} style={{width: '48px', height: '48px', verticalAlign: 'middle'}}/>
<View className={styles.featureList}>{d.text}</View>
</View>)
}

@ -151,7 +151,7 @@ const FeatureRecommended: FC<Props> = (props) => {
return (
<View className={styles.feature}>
<Swiper nextMargin='30px' style={{height: '440rpx'}}>
<Swiper nextMargin='30px' style={{height: '450rpx'}}>
{
data.map(d => <SwiperItem key={d.url}>
<Image

@ -13,9 +13,9 @@ export const Search: FC = () => {
return (
<View className={styles.search} onClick={jump}>
<Image src={search} mode='widthFix' style={{width: 18,verticalAlign:'middle'}}/>
<Image src={search} mode='widthFix' style={{width: 16, height: 16, verticalAlign: 'middle'}}/>
{/*<Icon name='search' size={18} color='#808080'/>*/}
<View className='ml-1'></View>
<View></View>
</View>
)
}

@ -80,9 +80,12 @@
margin-bottom: 40rpx;
font-size: 28rpx;
font-family: PingFang SC-Medium, PingFang SC;
font-weight: 500;
color: #909795;
line-height: 1;
view {
margin-left: 8rpx;
}
}
.adware {
@ -101,21 +104,21 @@
font-family: PingFang SC-Bold, PingFang SC;
font-weight: bold;
color: #323635;
margin-top: 20px;
margin-top: 18rpx;
}
.courseTag {
width: 162px;
height: 46rpx;
margin: 0 auto 30rpx;
margin: 0 auto 10rpx;
display: block;
}
.feature {
color: #323635;
background: #fff;
padding: 30rpx 0 30rpx 30rpx;
padding: 20rpx 0 25rpx 25rpx;
margin-bottom: 40rpx;
border-radius: 20rpx;
position: relative;
@ -125,7 +128,7 @@
content: '';
display: block;
position: absolute;
right: 0;
right: -1px;
top: 0;
bottom: 0;
width: 40rpx;
@ -136,7 +139,7 @@
.featureTitle {
max-width: 212px;
height: 50rpx;
padding-bottom: 20rpx;
padding-bottom: 10rpx;
}
.featureText {
@ -144,7 +147,7 @@
}
.featureTextTitle {
font-size: 32rpx;
font-size: 28rpx;
font-family: PingFang SC-Medium, PingFang SC;
font-weight: 500;
color: #323635;
@ -155,7 +158,7 @@
}
.featureTextDescription {
font-size: 28rpx;
font-size: 24rpx;
font-family: PingFang SC-Medium, PingFang SC;
font-weight: 500;
color: #909795;
@ -163,7 +166,7 @@
white-space: nowrap;
text-overflow: ellipsis;
-o-text-overflow: ellipsis;
line-height: 2;
line-height: 3;
}
.ranking {

@ -51,8 +51,8 @@ const Home: FC = () => {
cancelBack
leftNode={
<>
<Image src={logo} style={{height: "100%"}} mode='heightFix'/>
<Text style={{fontWeight: 'bold'}} className='ml-2'></Text>
<Image src={logo} style={{height: "110%"}} mode='heightFix'/>
<Text className='ml-1 font-36'></Text>
</>
}
>

Loading…
Cancel
Save