Skip to content

M
mr-julyedu
Commit 923eb032 by xuzhenghua
Options

样式

parent c28b7ac2
Showing with 88 additions and 47 deletions
src/assets/css/index.scss
......@@ -74,6 +74,7 @@ body {
color: $body-color;
background-color: $body-bg;
font-size: 0.24rem;
padding-bottom: constant(safe-area-inset-bottom);
}
// Links
......
src/common/Tag/index.js
......@@ -3,7 +3,7 @@ import './tag.scss'
export default class Tag extends PureComponent {
render() {
return (
<span className="tag" {...this.props}>
<span className={this.props.name} {...this.props}>
{this.props.children}
</span>
)
......
src/common/Tag/tag.scss
.tag{
.tagLately, .tagHot{
display: block;
max-width: 100%;
overflow: hidden;
......@@ -6,9 +6,12 @@
margin-bottom: 10px;
font-size:12px;
padding:4px 10px;
color:#555;
border-radius: 3px;
border-radius: 11px;
float: left;
background-color: #f0f2f5;
background-color: #F5F5F5;
line-height: 20px;
color: #666;
}
.tagHot{
color: #333;
}
\ No newline at end of file
src/components/Index/index.scss
......@@ -156,10 +156,12 @@
margin-top: 15px;
.scroll-list {
height: 100%;
height: 102px;
margin: 5px 0;
display: flex;
overflow: hidden;
position: absolute;
padding: 5px;
.scroll-item {
display: inline-block;
......@@ -168,7 +170,6 @@
margin-right: 20px;
box-shadow: 0px 0px 5px 0px rgba(0, 0, 0, 0.1);
background-color: $bg_fff;
border: 1px solid rgba(0, 0, 0, .1);
border-radius: 5px;
.item-box {
......@@ -211,7 +212,7 @@
}
.item-btn {
padding: 0 5px;
padding: 0 12px;
height: 20px;
text-align: center;
border: none;
......@@ -354,7 +355,7 @@
横向滚动
*/
.scroll-box {
height: 92px;
height: 112px;
}
......@@ -387,7 +388,7 @@
left: 0;
right: 0;
bottom: 0;
z-index: 2;
z-index: 51;
background-color: rgba(0, 0, 0, .6);
.live-room-content {
......
src/components/classify/index.js
......@@ -43,7 +43,7 @@ class Classify extends Component {
employment: res.data.data.special[1] || [],
special: res.data.data.special[2] || [],
})
}
} else {
Toast.info(res.data.msg, 2)
......@@ -131,7 +131,10 @@ function ClassCourseBox(props) {
return (
<div className="class-course">
<p className='course-items-title'>
<img src={require('./image/tips.png')} alt=""/>
{
props.title &&
<img src={require('./image/tips.png')} alt=""/>
}
{props.title}
</p>
{props.type === 1 &&
......
src/components/detail/btnstatus/index.scss
......@@ -7,7 +7,7 @@
background-color: $bg_fff;
display: flex;
justify-content: space-between;
border-top: 1px solid $sp_e7eaf1;
box-shadow:0px 0px 5px 0px rgba(0, 0, 0, 0.1);
z-index: 3;
.consult {
......
src/components/detail/index.scss
......@@ -101,7 +101,7 @@
// height: 66px;
border-top: 1px solid #e7eaf1;
margin: 0 12px;
display: flow-root;
display: flex;
label {
float: left;
......
src/components/detail/outline/index.js
......@@ -105,13 +105,13 @@ class OutLine extends Component {
{
// 已购买直播结束已上传视频：正常播放按钮，点击播放课程
!introduce.is_aist && item.class_status === 2 &&
<Link to={`/play?id=${introduce.v_course_id}`} className='iconfont icondanseshixintubiao-23 icon-right-22'></Link>
<Link to={`/play?id=${introduce.v_course_id + '&video_id=' + item.video_id}`} className='iconfont icondanseshixintubiao-23 icon-right-22'></Link>
}
{
// 返现课程 是返现课程 未开课 已开课 是返现课程 未开课 已开课 已练习
introduce.is_aist && item.is_open && introduce.is_baoming === 1 &&
<Link to={`/play?id=${introduce.v_course_id}`} className='aist aist_open'></Link>
<Link to={`/play?id=${introduce.v_course_id + '&video_id=' + item.video_id}`} className='aist aist_open'></Link>
}
......
src/components/examination/index.js
......@@ -2,13 +2,14 @@ import React, { PureComponent } from 'react'
import './examination.scss'
import classnames from 'classnames'
import { Tag } from '../../common'
import {HeaderBar, Tag} from '../../common'
import OpenApp from './OpenApp'
import { http, html, htmlDecode} from '@/utils'
import { config } from 'rxjs';
import { Object } from 'core-js';
export default class Examination extends PureComponent {
constructor(props) {
......@@ -45,6 +46,7 @@ export default class Examination extends PureComponent {
} = this.state
return (
<div className='examination'>
<HeaderBar title='每日一题' arrow={true} cart={false}></HeaderBar>
<div className="question-container">
<div className="topic">
<Tag className='category-tag'>{category}</Tag>
......
src/components/my/index.js
......@@ -75,9 +75,8 @@ class My extends PureComponent {
</Item>
</Link>
{
(isVIP === 0 || !isVIP) &&
!isVIP &&
<a href="javascript:;" className="my-isvip" onClick={() => this.toCourseDetail(139)}></a>
// <Link className="my-isvip" to={`/detail?id=139`}></Link>
}
</List>
}
......@@ -89,7 +88,11 @@ class My extends PureComponent {
{list}
<div className="am-list-header"></div>
{
!uid &&
<div className="am-list-header"></div>
}
<List className="my-list-content">
<Link to='/purchased'>
......
src/components/my/index.scss
.flex-container {
.my-tab {
width: 100%;
......
src/components/preferential/index.scss
......@@ -116,6 +116,7 @@
.am-tabs-default-bar-tab-active {
background: linear-gradient(90deg, $bg_active 0%, #5077F3 100%);
color: $white;
border: none!important;
}
.am-tabs-default-bar-underline {
display: none;
......
src/components/scholarship/CategoryItem/CategoryItem.scss
......@@ -35,11 +35,14 @@
height: 28px;
line-height: 28px;
text-align: center;
width: 90px;
padding: 0 10px;
color: #fff;
font-size: 12px;
background-color: #ff4000;
border-radius: 3px;
}
}
.am-tabs-default-bar-content .am-tabs-default-bar-tab{
width: 100px!important;
}
}
src/components/scholarship/index.js
......@@ -106,7 +106,7 @@ class _Scholarship extends Component {
};
// 保存二维码 TODO 失败
saveImage = () => {
};
// 分销赚钱
shareCategory = (course_id, money) => {
......@@ -199,9 +199,9 @@ class _Scholarship extends Component {
rowID
) => {
return (
<CategoryItem
{...rowData}
key={rowID}
<CategoryItem
{...rowData}
key={rowID}
share={this.shareCategory}
toDetail={this.toCourseDetail}
/>
......@@ -237,7 +237,7 @@ class _Scholarship extends Component {
<Flex justify='between'>
<i className={'iconfont iconiconfront-68 back'} onClick={this.goback}></i>
<span className={"common-ft-15"}>账户资金</span>
<i className={'iconfont iconaccounttip tip-info'} onClick={this.showDocument}></i>
<i className={'iconfont iconiconfront-22 tip-info'} onClick={this.showDocument}></i>
</Flex>
</WingBlank>
<WhiteSpace></WhiteSpace>
......
src/components/scholarship/scholarship.scss
......@@ -5,9 +5,11 @@
.common-ft-14 {
font-size: 14px;
}
.common-ft-15 {
font-size: 15px;
}
.common-ft-25 {
font-size: 25px;
}
......@@ -22,15 +24,18 @@
.tip-info {
font-size: 22px;
}
.draw-cash {
width: 80px;
height: 30px;
line-height: 30px;
border: 1px solid rgba(255, 255, 255, 1);
border-radius: 15px;
color: #fff;
font-size: 16px;
text-align: center;
}
.login-check {
width: 90px;
height: 30px;
......@@ -40,18 +45,20 @@
line-height: 30px;
text-align: center;
}
.drawCash {
height: 24px;
line-height: 24px;
}
}
.runtimeList {
height: 30px;
background-color: #FFF4CE;
color: #333333;
font-size: 12px;
text-align: center;
line-height: 30px;
height: 30px;
background-color: #FFF4CE;
color: #333333;
font-size: 12px;
text-align: center;
line-height: 30px;
}
.money {
......@@ -59,4 +66,17 @@
color: $bg_ff3131;
}
//.am-tabs-default-bar {
// border-bottom: 1px solid #E7EAF1;
//}
//.am-tabs-default-bar-top .am-tabs-default-bar-content, .am-tabs-default-bar-bottom .am-tabs-default-bar-content {
// display: flex;
// justify-content: space-around;
//}
//.am-tabs-default-bar-top .am-tabs-default-bar-tab {
// width: 60px !important;
//}
//.am-tabs-default-bar-top .am-tabs-default-bar-tab::after {
// background-color: #fff!important;
//}
}
src/components/search/index.js
......@@ -73,7 +73,7 @@ class Search extends PureComponent {
key={i}
to={`/search-result?word=${encodeURIComponent(v)}`}
>
<Tag>{v}</Tag>
<Tag name={"tagLately"}>{v}</Tag>
</Link>
)
})
......@@ -82,7 +82,7 @@ class Search extends PureComponent {
</div>
</div>
<div className="search-land search-hot">
<label>
<label className={'search-history'}>
<span>热门搜索</span>
</label>
<div className="search-tag">
......@@ -94,7 +94,7 @@ class Search extends PureComponent {
to={`/search-result?word=${encodeURIComponent(v)}`}
onClick={this.storeHistory.bind(this, v)}
>
<Tag>{v}</Tag>
<Tag name={"tagHot"}>{v}</Tag>
</Link>
)
})
......
src/components/search/search_header.scss
.search-head{
height:44px;
display: flex;
background-color: #fff;
background-color: #F7F9FC;
border-bottom: 1px solid #eee;
.left{
width:44px;
......@@ -18,9 +18,10 @@ border-bottom: 1px solid #eee;
.center{
flex: 1;
.am-search{
background-color: #fff;
background-color: #F7F9FC;
.am-search-input{
background-color: #f7f7f7;
background-color: #EBEFF5;
border-radius:44px;
}
}
......@@ -32,7 +33,7 @@ border-bottom: 1px solid #eee;
.am-icon-md{
padding:11px;
}
}
.right-btn{
width:auto;
......
src/components/video/index.js
......@@ -318,7 +318,7 @@ class Video extends Component {
getVideoList = () => {
http.get(`${API.home}/m/course/play/${this.courseID}`)
http.get(`${API.home}/m/course/play/${this.courseID + '?video_id=' + getParam('video_id')}`)
.then(res => {
const data = res.data
if (data.code === 200) {
......
src/components/video/recommendation/index.js
......@@ -62,8 +62,8 @@ class Recommendation extends PureComponent {
this.state.list.map(item => {
const Info = (
<div className="info">
<p className='title'>{item.course_title}</p>
<p className='des'>{item.simpledescription}</p>
<p className='title text-overflow-1'>{item.course_title}</p>
<p className='des text-overflow-2'>{item.simpledescription}</p>
<Bottom
item={item}
/>
......
src/components/video/recommendation/recommendation.scss
.recommendation {
padding-top: 20px;
margin-top: 15px;
border-top: 10px solid #f5f5f5;
& > .title {
font-size: $font_16;
padding-left: 15px;
margin-top: 15px;
}
.info {
display: flex;
flex-wrap: wrap;
width: 52.3%;
.title{
font-size: 15px;
......@@ -37,5 +40,4 @@
align-self: flex-end;
}
}
}
\ No newline at end of file
src/components/video/video.scss
......@@ -15,6 +15,8 @@ $tabHeight: 44px;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
background-color: #09f;
border: none;
}
}
......@@ -101,7 +103,7 @@ $tabHeight: 44px;
max-height: $tabHeight;
line-height: $tabHeight;
text-align: center;
background: #F7F9FC;
background: #fff;
flex: 1 0 auto;
display: flex;
justify-content: center;
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment