增加荣誉简介 但是less写的好像有大问题
continuous-integration/drone/push Build is passing
Details
continuous-integration/drone/push Build is passing
Details
parent
72c73b8dc6
commit
2ac0198bf2
|
|
@ -0,0 +1,94 @@
|
||||||
|
import React from "react";
|
||||||
|
import QueueAnim from "rc-queue-anim";
|
||||||
|
import TweenOne from "rc-tween-one";
|
||||||
|
import { Row, Col } from "antd";
|
||||||
|
import OverPack from "rc-scroll-anim/lib/ScrollOverPack";
|
||||||
|
import { getChildrenToRender } from "./utils";
|
||||||
|
|
||||||
|
class Content31 extends React.PureComponent {
|
||||||
|
getDelay = (e, b) => (e % b) * 100 + Math.floor(e / b) * 100 + b * 100;
|
||||||
|
|
||||||
|
render() {
|
||||||
|
const { ...props } = this.props;
|
||||||
|
const { dataSource, isMobile } = props;
|
||||||
|
delete props.dataSource;
|
||||||
|
delete props.isMobile;
|
||||||
|
let clearFloatNum = 0;
|
||||||
|
const children = dataSource.block.children.map((item, i) => {
|
||||||
|
const childObj = item.children;
|
||||||
|
const delay = isMobile ? i * 50 : this.getDelay(i, 24 / item.md);
|
||||||
|
const liAnim = {
|
||||||
|
opacity: 0,
|
||||||
|
type: "from",
|
||||||
|
ease: "easeOutQuad",
|
||||||
|
delay,
|
||||||
|
};
|
||||||
|
const childrenAnim = { ...liAnim, x: "+=10", delay: delay + 100 };
|
||||||
|
clearFloatNum += item.md;
|
||||||
|
clearFloatNum = clearFloatNum > 24 ? 0 : clearFloatNum;
|
||||||
|
return (
|
||||||
|
<TweenOne
|
||||||
|
component={Col}
|
||||||
|
animation={liAnim}
|
||||||
|
key={item.name}
|
||||||
|
{...item}
|
||||||
|
componentProps={{ md: item.md, xs: item.xs }}
|
||||||
|
className={
|
||||||
|
!clearFloatNum
|
||||||
|
? `${item.className || ""} clear-both`.trim()
|
||||||
|
: item.className
|
||||||
|
}
|
||||||
|
>
|
||||||
|
<TweenOne
|
||||||
|
animation={{
|
||||||
|
x: "-=10",
|
||||||
|
opacity: 0,
|
||||||
|
type: "from",
|
||||||
|
ease: "easeOutQuad",
|
||||||
|
}}
|
||||||
|
key="img"
|
||||||
|
{...childObj.icon}
|
||||||
|
>
|
||||||
|
<img src={childObj.icon.children} width="100%" alt="img" />
|
||||||
|
</TweenOne>
|
||||||
|
<div {...childObj.textWrapper}>
|
||||||
|
<TweenOne
|
||||||
|
key="h2"
|
||||||
|
animation={childrenAnim}
|
||||||
|
component="h2"
|
||||||
|
{...childObj.title}
|
||||||
|
>
|
||||||
|
{childObj.title.children}
|
||||||
|
</TweenOne>
|
||||||
|
<TweenOne
|
||||||
|
key="p"
|
||||||
|
animation={{ ...childrenAnim, delay: delay + 200 }}
|
||||||
|
component="div"
|
||||||
|
{...childObj.content}
|
||||||
|
>
|
||||||
|
{childObj.content.children}
|
||||||
|
</TweenOne>
|
||||||
|
</div>
|
||||||
|
</TweenOne>
|
||||||
|
);
|
||||||
|
});
|
||||||
|
return (
|
||||||
|
<div {...props} {...dataSource.wrapper}>
|
||||||
|
<div {...dataSource.page}>
|
||||||
|
<div {...dataSource.titleWrapper}>
|
||||||
|
{dataSource.titleWrapper.children.map(getChildrenToRender)}
|
||||||
|
</div>
|
||||||
|
<OverPack {...dataSource.OverPack}>
|
||||||
|
<QueueAnim key="u" type="bottom">
|
||||||
|
<Row key="row" {...dataSource.block}>
|
||||||
|
{children}
|
||||||
|
</Row>
|
||||||
|
</QueueAnim>
|
||||||
|
</OverPack>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
export default Content31;
|
||||||
|
|
@ -2193,3 +2193,259 @@ export const Content40DataSource = {
|
||||||
),
|
),
|
||||||
},
|
},
|
||||||
};
|
};
|
||||||
|
export const Feature31DataSource = {
|
||||||
|
wrapper: { className: "home-page-wrapper content3-wrapper" },
|
||||||
|
page: { className: "home-page content3" },
|
||||||
|
OverPack: { playScale: 0.3 },
|
||||||
|
titleWrapper: {
|
||||||
|
className: "title-wrapper",
|
||||||
|
children: [
|
||||||
|
{
|
||||||
|
name: "title",
|
||||||
|
children: (
|
||||||
|
<span>
|
||||||
|
<span>
|
||||||
|
<span>
|
||||||
|
<p>
|
||||||
|
协会荣誉
|
||||||
|
<br />
|
||||||
|
</p>
|
||||||
|
</span>
|
||||||
|
</span>
|
||||||
|
</span>
|
||||||
|
),
|
||||||
|
className: "title-h1 keedh95kxlm-editor_css",
|
||||||
|
},
|
||||||
|
{
|
||||||
|
name: "content",
|
||||||
|
className: "title-content",
|
||||||
|
children: (
|
||||||
|
<span>
|
||||||
|
<span>
|
||||||
|
<span>
|
||||||
|
<p>仅摘取近期部分荣誉展示</p>
|
||||||
|
</span>
|
||||||
|
</span>
|
||||||
|
</span>
|
||||||
|
),
|
||||||
|
},
|
||||||
|
],
|
||||||
|
},
|
||||||
|
block: {
|
||||||
|
className: "content3-block-wrapper",
|
||||||
|
children: [
|
||||||
|
{
|
||||||
|
name: "block0",
|
||||||
|
className: "content3-block",
|
||||||
|
md: 8,
|
||||||
|
xs: 24,
|
||||||
|
children: {
|
||||||
|
icon: {
|
||||||
|
className: "content3-icon",
|
||||||
|
children:
|
||||||
|
"https://zos.alipayobjects.com/rmsportal/ScHBSdwpTkAHZkJ.png",
|
||||||
|
},
|
||||||
|
textWrapper: { className: "content3-text" },
|
||||||
|
title: {
|
||||||
|
className: "content3-title",
|
||||||
|
children: (
|
||||||
|
<span>
|
||||||
|
<p>五星级社团</p>
|
||||||
|
</span>
|
||||||
|
),
|
||||||
|
},
|
||||||
|
content: {
|
||||||
|
className: "content3-content keedl4m5lk-editor_css",
|
||||||
|
children: (
|
||||||
|
<span>
|
||||||
|
<span>
|
||||||
|
<span>
|
||||||
|
<p>
|
||||||
|
2016年协会荣升为浙江大学<b>五星级社团</b>，至今
|
||||||
|
<b>已经连续四年</b>保持这一称号
|
||||||
|
<br />
|
||||||
|
</p>
|
||||||
|
</span>
|
||||||
|
</span>
|
||||||
|
</span>
|
||||||
|
),
|
||||||
|
},
|
||||||
|
},
|
||||||
|
},
|
||||||
|
{
|
||||||
|
name: "block1",
|
||||||
|
className: "content3-block",
|
||||||
|
md: 8,
|
||||||
|
xs: 24,
|
||||||
|
children: {
|
||||||
|
icon: {
|
||||||
|
className: "content3-icon",
|
||||||
|
children:
|
||||||
|
"https://zos.alipayobjects.com/rmsportal/NKBELAOuuKbofDD.png",
|
||||||
|
},
|
||||||
|
textWrapper: { className: "content3-text" },
|
||||||
|
title: {
|
||||||
|
className: "content3-title",
|
||||||
|
children: (
|
||||||
|
<span>
|
||||||
|
<p>十佳社团</p>
|
||||||
|
</span>
|
||||||
|
),
|
||||||
|
},
|
||||||
|
content: {
|
||||||
|
className: "content3-content keedn4gkykf-editor_css",
|
||||||
|
children: (
|
||||||
|
<span>
|
||||||
|
<p>
|
||||||
|
2016-2019年连续<b>获得三年</b>十佳社团荣誉称号，近九年
|
||||||
|
<b>累计获得七次</b>十佳社团称号
|
||||||
|
</p>
|
||||||
|
</span>
|
||||||
|
),
|
||||||
|
},
|
||||||
|
},
|
||||||
|
},
|
||||||
|
{
|
||||||
|
name: "block2",
|
||||||
|
className: "content3-block",
|
||||||
|
md: 8,
|
||||||
|
xs: 24,
|
||||||
|
children: {
|
||||||
|
icon: {
|
||||||
|
className: "content3-icon",
|
||||||
|
children:
|
||||||
|
"https://zos.alipayobjects.com/rmsportal/xMSBjgxBhKfyMWX.png",
|
||||||
|
},
|
||||||
|
textWrapper: { className: "content3-text" },
|
||||||
|
title: {
|
||||||
|
className: "content3-title",
|
||||||
|
children: (
|
||||||
|
<span>
|
||||||
|
<p>五佳课程</p>
|
||||||
|
</span>
|
||||||
|
),
|
||||||
|
},
|
||||||
|
content: {
|
||||||
|
className: "content3-content keedi0sp7vt-editor_css",
|
||||||
|
children: (
|
||||||
|
<span>
|
||||||
|
<span>
|
||||||
|
<p>
|
||||||
|
近年来协会连续多次获得“<b>五佳课程</b>
|
||||||
|
”，“精品课程一等奖”等称号，精品课程也备受学员好评
|
||||||
|
</p>
|
||||||
|
</span>
|
||||||
|
</span>
|
||||||
|
),
|
||||||
|
},
|
||||||
|
},
|
||||||
|
},
|
||||||
|
{
|
||||||
|
name: "block3",
|
||||||
|
className: "content3-block",
|
||||||
|
md: 8,
|
||||||
|
xs: 24,
|
||||||
|
children: {
|
||||||
|
icon: {
|
||||||
|
className: "content3-icon",
|
||||||
|
children:
|
||||||
|
"https://zos.alipayobjects.com/rmsportal/MNdlBNhmDBLuzqp.png",
|
||||||
|
},
|
||||||
|
textWrapper: { className: "content3-text" },
|
||||||
|
title: {
|
||||||
|
className: "content3-title",
|
||||||
|
children: (
|
||||||
|
<span>
|
||||||
|
<p>精品活动</p>
|
||||||
|
</span>
|
||||||
|
),
|
||||||
|
},
|
||||||
|
content: {
|
||||||
|
className: "content3-content keedtwaja47-editor_css",
|
||||||
|
children: (
|
||||||
|
<span>
|
||||||
|
<span>
|
||||||
|
<p>
|
||||||
|
在学生社团文化节上举办的精品活动多次获得奖项，2019年、2018年均获得二等奖
|
||||||
|
</p>
|
||||||
|
</span>
|
||||||
|
</span>
|
||||||
|
),
|
||||||
|
},
|
||||||
|
},
|
||||||
|
},
|
||||||
|
{
|
||||||
|
name: "block4",
|
||||||
|
className: "content3-block",
|
||||||
|
md: 8,
|
||||||
|
xs: 24,
|
||||||
|
children: {
|
||||||
|
icon: {
|
||||||
|
className: "content3-icon",
|
||||||
|
children:
|
||||||
|
"https://zos.alipayobjects.com/rmsportal/UsUmoBRyLvkIQeO.png",
|
||||||
|
},
|
||||||
|
textWrapper: { className: "content3-text" },
|
||||||
|
title: {
|
||||||
|
className: "content3-title",
|
||||||
|
children: (
|
||||||
|
<span>
|
||||||
|
<span>
|
||||||
|
<span>
|
||||||
|
<p>公益先锋</p>
|
||||||
|
</span>
|
||||||
|
</span>
|
||||||
|
</span>
|
||||||
|
),
|
||||||
|
},
|
||||||
|
content: {
|
||||||
|
className: "content3-content",
|
||||||
|
children: (
|
||||||
|
<span>
|
||||||
|
<p>
|
||||||
|
2019年协会获得<b>至美公益项目</b>二等奖，同年获
|
||||||
|
<b>“尚德学子”</b>
|
||||||
|
奖学金社会公益奖，2015年获年度浙江大学最美公益集体。
|
||||||
|
<br />
|
||||||
|
</p>
|
||||||
|
</span>
|
||||||
|
),
|
||||||
|
},
|
||||||
|
},
|
||||||
|
},
|
||||||
|
{
|
||||||
|
name: "block5",
|
||||||
|
className: "content3-block",
|
||||||
|
md: 8,
|
||||||
|
xs: 24,
|
||||||
|
children: {
|
||||||
|
icon: {
|
||||||
|
className: "content3-icon",
|
||||||
|
children:
|
||||||
|
"https://zos.alipayobjects.com/rmsportal/ipwaQLBLflRfUrg.png",
|
||||||
|
},
|
||||||
|
textWrapper: { className: "content3-text" },
|
||||||
|
title: {
|
||||||
|
className: "content3-title",
|
||||||
|
children: (
|
||||||
|
<span>
|
||||||
|
<p>社会实践</p>
|
||||||
|
</span>
|
||||||
|
),
|
||||||
|
},
|
||||||
|
content: {
|
||||||
|
className: "content3-content",
|
||||||
|
children: (
|
||||||
|
<span>
|
||||||
|
<p>
|
||||||
|
2019年赴甘肃酒泉暑期社会实践团获杭州日报2019大学生社会实践擂台赛优秀奖、浙江大学优秀实践团队。2017年获浙江大学年度暑期大学生社会实践活动优秀论文
|
||||||
|
<br />
|
||||||
|
</p>
|
||||||
|
</span>
|
||||||
|
),
|
||||||
|
},
|
||||||
|
},
|
||||||
|
},
|
||||||
|
],
|
||||||
|
},
|
||||||
|
};
|
||||||
|
|
|
||||||
|
|
@ -275,3 +275,18 @@
|
||||||
font-size: 16px;
|
font-size: 16px;
|
||||||
margin: 0px 0px 12px;
|
margin: 0px 0px 12px;
|
||||||
}
|
}
|
||||||
|
#Feature3_1 .ant-col > .content3-text > .keedl4m5lk-editor_css {
|
||||||
|
font-size: 17px;
|
||||||
|
}
|
||||||
|
#Feature3_1 .ant-col > .content3-text > .keedn4gkykf-editor_css {
|
||||||
|
font-size: 16px;
|
||||||
|
}
|
||||||
|
#Feature3_1 .ant-col > .content3-text > .keedi0sp7vt-editor_css {
|
||||||
|
font-size: 16px;
|
||||||
|
}
|
||||||
|
#Feature3_1 .ant-col > .content3-text > .keedtwaja47-editor_css {
|
||||||
|
font-size: 16px;
|
||||||
|
}
|
||||||
|
#Feature3_1 .home-page > .title-wrapper > .keedh95kxlm-editor_css {
|
||||||
|
font-size: 34px;
|
||||||
|
}
|
||||||
|
|
|
||||||
|
|
@ -0,0 +1,52 @@
|
||||||
|
@content3: content3;
|
||||||
|
.@{content3}-wrapper {
|
||||||
|
min-height: 764px;
|
||||||
|
.@{content3} {
|
||||||
|
height: 100%;
|
||||||
|
overflow: hidden;
|
||||||
|
& .title-content {
|
||||||
|
text-align: center;
|
||||||
|
}
|
||||||
|
&-block-wrapper {
|
||||||
|
position: relative;
|
||||||
|
.@{content3}-block {
|
||||||
|
display: inline-block;
|
||||||
|
padding: 48px 24px;
|
||||||
|
vertical-align: top;
|
||||||
|
.@{content3}-icon {
|
||||||
|
display: inline-block;
|
||||||
|
width: 15%;
|
||||||
|
vertical-align: top;
|
||||||
|
}
|
||||||
|
.@{content3}-text {
|
||||||
|
width: 85%;
|
||||||
|
display: inline-block;
|
||||||
|
padding-left: 8%;
|
||||||
|
}
|
||||||
|
&.clear-both {
|
||||||
|
clear: both;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
@media screen and (max-width: 767px) {
|
||||||
|
.@{content3}-wrapper {
|
||||||
|
min-height: 1080px;
|
||||||
|
.@{content3} {
|
||||||
|
&-block-wrapper {
|
||||||
|
margin: 20px auto;
|
||||||
|
height: auto;
|
||||||
|
.@{content3}-block {
|
||||||
|
.@{content3}-title {
|
||||||
|
font-size: 20px;
|
||||||
|
}
|
||||||
|
&.queue-anim-leaving {
|
||||||
|
position: relative !important;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
@ -9,6 +9,7 @@ import Feature2 from "./Feature2";
|
||||||
import Feature1 from "./Feature1";
|
import Feature1 from "./Feature1";
|
||||||
import Content3 from "./Content3";
|
import Content3 from "./Content3";
|
||||||
import Feature8 from "./Feature8";
|
import Feature8 from "./Feature8";
|
||||||
|
import Feature3 from "./Feature3";
|
||||||
import Feature6 from "./Feature6";
|
import Feature6 from "./Feature6";
|
||||||
import Content5 from "./Content5";
|
import Content5 from "./Content5";
|
||||||
import Content9 from "./Content9";
|
import Content9 from "./Content9";
|
||||||
|
|
@ -21,6 +22,7 @@ import {
|
||||||
Feature20DataSource,
|
Feature20DataSource,
|
||||||
Feature10DataSource,
|
Feature10DataSource,
|
||||||
Feature30DataSource,
|
Feature30DataSource,
|
||||||
|
Feature31DataSource,
|
||||||
Feature80DataSource,
|
Feature80DataSource,
|
||||||
Feature60DataSource,
|
Feature60DataSource,
|
||||||
Content40DataSource,
|
Content40DataSource,
|
||||||
|
|
@ -120,10 +122,10 @@ export default class Home extends React.Component {
|
||||||
dataSource={Content50DataSource}
|
dataSource={Content50DataSource}
|
||||||
isMobile={this.state.isMobile}
|
isMobile={this.state.isMobile}
|
||||||
/>,
|
/>,
|
||||||
<Content9
|
<Feature3
|
||||||
id="Content9_0"
|
id="Feature3_1"
|
||||||
key="Content9_0"
|
key="Feature3_1"
|
||||||
dataSource={Content90DataSource}
|
dataSource={Feature31DataSource}
|
||||||
isMobile={this.state.isMobile}
|
isMobile={this.state.isMobile}
|
||||||
/>,
|
/>,
|
||||||
|
|
||||||
|
|
|
||||||
Loading…
Reference in New Issue