修改第五个动画

This commit is contained in:
何童崇 2021-11-17 14:39:10 +08:00
parent e4d4375102
commit bdcc7a4699
11 changed files with 769 additions and 94 deletions

View File

@ -1,8 +1,8 @@
@font-face {
font-family: "iconfont"; /* Project id 2340181 */
src: url('iconfont.woff2?t=1629767316093') format('woff2'),
url('iconfont.woff?t=1629767316093') format('woff'),
url('iconfont.ttf?t=1629767316093') format('truetype');
src: url('iconfont.woff2?t=1637120496912') format('woff2'),
url('iconfont.woff?t=1637120496912') format('woff'),
url('iconfont.ttf?t=1637120496912') format('truetype');
}
.iconfont {
@ -13,6 +13,254 @@
-moz-osx-font-smoothing: grayscale;
}
.icon-zhishitupu:before {
content: "\e8fc";
}
.icon-jisuanji1:before {
content: "\e8fd";
}
.icon-dianzi1:before {
content: "\e8ff";
}
.icon-junshililun1:before {
content: "\e900";
}
.icon-ruanjiangongcheng1:before {
content: "\e901";
}
.icon-yixue1:before {
content: "\e902";
}
.icon-tongxin1:before {
content: "\e904";
}
.icon-zhengcefagui1:before {
content: "\e906";
}
.icon-dashuju:before {
content: "\e8f3";
}
.icon-rengongzhineng:before {
content: "\e8f6";
}
.icon-a-shuangyinhao12x:before {
content: "\e8f2";
}
.icon-dingbu:before {
content: "\e8ee";
}
.icon-bangzhu1:before {
content: "\e8ef";
}
.icon-yijianfankui2:before {
content: "\e8f0";
}
.icon-fenxiang:before {
content: "\e8f1";
}
.icon-dizhi:before {
content: "\e8eb";
}
.icon-youxiang1:before {
content: "\e8ec";
}
.icon-dianhuaicon:before {
content: "\e8ed";
}
.icon-tianjiaicon:before {
content: "\e8e8";
}
.icon-lingshengicon:before {
content: "\e8ea";
}
.icon-gengduoicon:before {
content: "\e8e5";
}
.icon-shijianicon:before {
content: "\e8e7";
}
.icon-mimaicon:before {
content: "\e8e1";
}
.icon-gouicon:before {
content: "\e8e2";
}
.icon-zhankaiicon:before {
content: "\e8e3";
}
.icon-wenjian7:before {
content: "\e8e0";
}
.icon-xiangyoujiantou:before {
content: "\e8de";
}
.icon-xiangzuojiantou:before {
content: "\e8df";
}
.icon-a-liulanicon2x:before {
content: "\e8dd";
}
.icon-wenjianicon:before {
content: "\e8dc";
}
.icon-a-yuanquan2x:before {
content: "\e8db";
}
.icon-xiangmubiaoqian:before {
content: "\e8da";
}
.icon-icon:before {
content: "\e8ce";
}
.icon-tar:before {
content: "\e8cf";
}
.icon-a-fuzhi2:before {
content: "\e8d0";
}
.icon-fujian1:before {
content: "\e8d1";
}
.icon-a-bianji1:before {
content: "\e8d2";
}
.icon-banbenicon:before {
content: "\e8d3";
}
.icon-shanchuicon2:before {
content: "\e8d4";
}
.icon-a-lajitong_icon3x:before {
content: "\e8d5";
}
.icon-xialaanniu2:before {
content: "\e8d6";
}
.icon-xiazai-icon:before {
content: "\e8d7";
}
.icon-master_icon1:before {
content: "\e8d8";
}
.icon-shangchuanicon:before {
content: "\e8d9";
}
.icon-gerenziliao1:before {
content: "\e8c7";
}
.icon-lichengbeiicon:before {
content: "\e885";
}
.icon-cangkushezhiicon:before {
content: "\e889";
}
.icon-dongtaiicon:before {
content: "\e88a";
}
.icon-gongzuoliuicon:before {
content: "\e88b";
}
.icon-yixiuicon1:before {
content: "\e89b";
}
.icon-a-wikiicon1:before {
content: "\e8c6";
}
.icon-daimakuicon1:before {
content: "\e8c5";
}
.icon-wodetongzhi:before {
content: "\e8c8";
}
.icon-tongzhiguanli:before {
content: "\e8c9";
}
.icon-xuanzhong3:before {
content: "\e8ca";
}
.icon-xitongtongzhiicon:before {
content: "\e8cb";
}
.icon-xiaoxi2:before {
content: "\e8cc";
}
.icon-sshmiyue:before {
content: "\e8cd";
}
.icon-gerenziliao:before {
content: "\e8c4";
}
.icon-xinshouzhiyin:before {
content: "\e8e4";
}
.icon-xinjianxiangmu:before {
content: "\e8e6";
}
.icon-jiaruketang1:before {
content: "\e8e9";
}
.icon-xiangmugonggao:before {
content: "\e8c2";
}
@ -105,10 +353,6 @@
content: "\e883";
}
.icon-cangkushezhiicon:before {
content: "\e885";
}
.icon-lianjieicon:before {
content: "\e887";
}
@ -117,18 +361,6 @@
content: "\e888";
}
.icon-lichengbeiicon:before {
content: "\e889";
}
.icon-gongzuoliuicon:before {
content: "\e88a";
}
.icon-dongtaiicon:before {
content: "\e88b";
}
.icon-morendianzan_icon:before {
content: "\e88e";
}
@ -233,10 +465,6 @@
content: "\e898";
}
.icon-weixuanzhongqingqiuicon:before {
content: "\e89b";
}
.icon-xiezuozheguanliicon:before {
content: "\e8a1";
}

File diff suppressed because one or more lines are too long

View File

@ -5,6 +5,440 @@
"css_prefix_text": "icon-",
"description": "",
"glyphs": [
{
"icon_id": "25748537",
"name": "知识图谱",
"font_class": "zhishitupu",
"unicode": "e8fc",
"unicode_decimal": 59644
},
{
"icon_id": "25748551",
"name": "计算机",
"font_class": "jisuanji1",
"unicode": "e8fd",
"unicode_decimal": 59645
},
{
"icon_id": "25748553",
"name": "电子",
"font_class": "dianzi1",
"unicode": "e8ff",
"unicode_decimal": 59647
},
{
"icon_id": "25748554",
"name": "军事理论",
"font_class": "junshililun1",
"unicode": "e900",
"unicode_decimal": 59648
},
{
"icon_id": "25748555",
"name": "软件工程",
"font_class": "ruanjiangongcheng1",
"unicode": "e901",
"unicode_decimal": 59649
},
{
"icon_id": "25748556",
"name": "医学",
"font_class": "yixue1",
"unicode": "e902",
"unicode_decimal": 59650
},
{
"icon_id": "25748558",
"name": "通信",
"font_class": "tongxin1",
"unicode": "e904",
"unicode_decimal": 59652
},
{
"icon_id": "25748560",
"name": "政策法规",
"font_class": "zhengcefagui1",
"unicode": "e906",
"unicode_decimal": 59654
},
{
"icon_id": "25748528",
"name": "大数据",
"font_class": "dashuju",
"unicode": "e8f3",
"unicode_decimal": 59635
},
{
"icon_id": "25748531",
"name": "人工智能",
"font_class": "rengongzhineng",
"unicode": "e8f6",
"unicode_decimal": 59638
},
{
"icon_id": "25733167",
"name": "双引号(1)@2x",
"font_class": "a-shuangyinhao12x",
"unicode": "e8f2",
"unicode_decimal": 59634
},
{
"icon_id": "25701947",
"name": "顶部",
"font_class": "dingbu",
"unicode": "e8ee",
"unicode_decimal": 59630
},
{
"icon_id": "25701948",
"name": "帮助",
"font_class": "bangzhu1",
"unicode": "e8ef",
"unicode_decimal": 59631
},
{
"icon_id": "25701949",
"name": "意见反馈",
"font_class": "yijianfankui2",
"unicode": "e8f0",
"unicode_decimal": 59632
},
{
"icon_id": "25701950",
"name": "分享",
"font_class": "fenxiang",
"unicode": "e8f1",
"unicode_decimal": 59633
},
{
"icon_id": "25580217",
"name": "地址",
"font_class": "dizhi",
"unicode": "e8eb",
"unicode_decimal": 59627
},
{
"icon_id": "25580218",
"name": "邮箱",
"font_class": "youxiang1",
"unicode": "e8ec",
"unicode_decimal": 59628
},
{
"icon_id": "25580219",
"name": "电话icon",
"font_class": "dianhuaicon",
"unicode": "e8ed",
"unicode_decimal": 59629
},
{
"icon_id": "25284174",
"name": "添加icon",
"font_class": "tianjiaicon",
"unicode": "e8e8",
"unicode_decimal": 59624
},
{
"icon_id": "25284175",
"name": "铃声icon",
"font_class": "lingshengicon",
"unicode": "e8ea",
"unicode_decimal": 59626
},
{
"icon_id": "25204490",
"name": "更多icon",
"font_class": "gengduoicon",
"unicode": "e8e5",
"unicode_decimal": 59621
},
{
"icon_id": "25204491",
"name": "时间icon",
"font_class": "shijianicon",
"unicode": "e8e7",
"unicode_decimal": 59623
},
{
"icon_id": "25188228",
"name": "密码icon",
"font_class": "mimaicon",
"unicode": "e8e1",
"unicode_decimal": 59617
},
{
"icon_id": "25188229",
"name": "钩icon",
"font_class": "gouicon",
"unicode": "e8e2",
"unicode_decimal": 59618
},
{
"icon_id": "25188230",
"name": "展开icon",
"font_class": "zhankaiicon",
"unicode": "e8e3",
"unicode_decimal": 59619
},
{
"icon_id": "24656750",
"name": "文件",
"font_class": "wenjian7",
"unicode": "e8e0",
"unicode_decimal": 59616
},
{
"icon_id": "630094",
"name": "向右箭头",
"font_class": "xiangyoujiantou",
"unicode": "e8de",
"unicode_decimal": 59614
},
{
"icon_id": "630095",
"name": "向左箭头",
"font_class": "xiangzuojiantou",
"unicode": "e8df",
"unicode_decimal": 59615
},
{
"icon_id": "24600282",
"name": "浏览icon@2x",
"font_class": "a-liulanicon2x",
"unicode": "e8dd",
"unicode_decimal": 59613
},
{
"icon_id": "24567893",
"name": "文件icon",
"font_class": "wenjianicon",
"unicode": "e8dc",
"unicode_decimal": 59612
},
{
"icon_id": "24527422",
"name": "圆圈@2x",
"font_class": "a-yuanquan2x",
"unicode": "e8db",
"unicode_decimal": 59611
},
{
"icon_id": "24378423",
"name": "项目标签",
"font_class": "xiangmubiaoqian",
"unicode": "e8da",
"unicode_decimal": 59610
},
{
"icon_id": "24368060",
"name": "icon",
"font_class": "icon",
"unicode": "e8ce",
"unicode_decimal": 59598
},
{
"icon_id": "24368061",
"name": "tar",
"font_class": "tar",
"unicode": "e8cf",
"unicode_decimal": 59599
},
{
"icon_id": "24289113",
"name": "复制 (2)",
"font_class": "a-fuzhi2",
"unicode": "e8d0",
"unicode_decimal": 59600
},
{
"icon_id": "24289114",
"name": "附件",
"font_class": "fujian1",
"unicode": "e8d1",
"unicode_decimal": 59601
},
{
"icon_id": "24289115",
"name": "编 辑",
"font_class": "a-bianji1",
"unicode": "e8d2",
"unicode_decimal": 59602
},
{
"icon_id": "24289116",
"name": "版本icon",
"font_class": "banbenicon",
"unicode": "e8d3",
"unicode_decimal": 59603
},
{
"icon_id": "24289117",
"name": "删除icon",
"font_class": "shanchuicon2",
"unicode": "e8d4",
"unicode_decimal": 59604
},
{
"icon_id": "24289118",
"name": "垃圾桶_icon@3x",
"font_class": "a-lajitong_icon3x",
"unicode": "e8d5",
"unicode_decimal": 59605
},
{
"icon_id": "24289119",
"name": "下拉按钮",
"font_class": "xialaanniu2",
"unicode": "e8d6",
"unicode_decimal": 59606
},
{
"icon_id": "24289120",
"name": "下载-icon",
"font_class": "xiazai-icon",
"unicode": "e8d7",
"unicode_decimal": 59607
},
{
"icon_id": "24289121",
"name": "master_icon",
"font_class": "master_icon1",
"unicode": "e8d8",
"unicode_decimal": 59608
},
{
"icon_id": "24289122",
"name": "上传icon",
"font_class": "shangchuanicon",
"unicode": "e8d9",
"unicode_decimal": 59609
},
{
"icon_id": "24059956",
"name": "个人资料",
"font_class": "gerenziliao1",
"unicode": "e8c7",
"unicode_decimal": 59591
},
{
"icon_id": "24059409",
"name": "里程碑icon",
"font_class": "lichengbeiicon",
"unicode": "e885",
"unicode_decimal": 59525
},
{
"icon_id": "24059410",
"name": "仓库设置icon",
"font_class": "cangkushezhiicon",
"unicode": "e889",
"unicode_decimal": 59529
},
{
"icon_id": "24059411",
"name": "动态icon",
"font_class": "dongtaiicon",
"unicode": "e88a",
"unicode_decimal": 59530
},
{
"icon_id": "24059412",
"name": "工作流icon",
"font_class": "gongzuoliuicon",
"unicode": "e88b",
"unicode_decimal": 59531
},
{
"icon_id": "24059413",
"name": "易修icon",
"font_class": "yixiuicon1",
"unicode": "e89b",
"unicode_decimal": 59547
},
{
"icon_id": "24059414",
"name": "wiki icon",
"font_class": "a-wikiicon1",
"unicode": "e8c6",
"unicode_decimal": 59590
},
{
"icon_id": "24047186",
"name": "代码库icon",
"font_class": "daimakuicon1",
"unicode": "e8c5",
"unicode_decimal": 59589
},
{
"icon_id": "24047189",
"name": "我的通知",
"font_class": "wodetongzhi",
"unicode": "e8c8",
"unicode_decimal": 59592
},
{
"icon_id": "24047190",
"name": "通知管理",
"font_class": "tongzhiguanli",
"unicode": "e8c9",
"unicode_decimal": 59593
},
{
"icon_id": "24047191",
"name": "选中",
"font_class": "xuanzhong3",
"unicode": "e8ca",
"unicode_decimal": 59594
},
{
"icon_id": "24047192",
"name": "系统通知icon",
"font_class": "xitongtongzhiicon",
"unicode": "e8cb",
"unicode_decimal": 59595
},
{
"icon_id": "24047193",
"name": "消息",
"font_class": "xiaoxi2",
"unicode": "e8cc",
"unicode_decimal": 59596
},
{
"icon_id": "24047194",
"name": "ssh密钥",
"font_class": "sshmiyue",
"unicode": "e8cd",
"unicode_decimal": 59597
},
{
"icon_id": "24014152",
"name": "个人资料",
"font_class": "gerenziliao",
"unicode": "e8c4",
"unicode_decimal": 59588
},
{
"icon_id": "23655968",
"name": "新手指引",
"font_class": "xinshouzhiyin",
"unicode": "e8e4",
"unicode_decimal": 59620
},
{
"icon_id": "23655969",
"name": "新建项目",
"font_class": "xinjianxiangmu",
"unicode": "e8e6",
"unicode_decimal": 59622
},
{
"icon_id": "23658111",
"name": "加入课堂",
"font_class": "jiaruketang1",
"unicode": "e8e9",
"unicode_decimal": 59625
},
{
"icon_id": "23791639",
"name": "项目公告",
@ -166,13 +600,6 @@
"unicode": "e883",
"unicode_decimal": 59523
},
{
"icon_id": "23472256",
"name": "仓库设置icon",
"font_class": "cangkushezhiicon",
"unicode": "e885",
"unicode_decimal": 59525
},
{
"icon_id": "23472258",
"name": "链接icon",
@ -187,27 +614,6 @@
"unicode": "e888",
"unicode_decimal": 59528
},
{
"icon_id": "23472260",
"name": "里程碑icon",
"font_class": "lichengbeiicon",
"unicode": "e889",
"unicode_decimal": 59529
},
{
"icon_id": "23472261",
"name": "工作流icon",
"font_class": "gongzuoliuicon",
"unicode": "e88a",
"unicode_decimal": 59530
},
{
"icon_id": "23472262",
"name": "动态icon",
"font_class": "dongtaiicon",
"unicode": "e88b",
"unicode_decimal": 59531
},
{
"icon_id": "23472263",
"name": "默认点赞_icon",
@ -390,13 +796,6 @@
"unicode": "e898",
"unicode_decimal": 59544
},
{
"icon_id": "23144155",
"name": "未选中请求icon",
"font_class": "weixuanzhongqingqiuicon",
"unicode": "e89b",
"unicode_decimal": 59547
},
{
"icon_id": "23144158",
"name": "协作者管理icon",

Binary file not shown.

Binary file not shown.

Binary file not shown.

View File

@ -16,16 +16,37 @@ function FifthSection({ fifth }) {
<div className="fifth-main clearfix">
<div className="circle-wave">
<ul className="icon-circle">
<li>1</li>
<li>2</li>
<li>3</li>
<li>4</li>
<li>5</li>
<li>6</li>
<li>7</li>
<li>8</li>
<li>9</li>
<li>10</li>
<li>
<i className="iconfont icon-zhishitupu"></i>
<span>知识图谱</span>
</li>
<li><i className="iconfont icon-jisuanji1"></i>
<span>计算机</span>
</li>
<li><i className="iconfont icon-dianzi1"></i>
<span>电子</span>
</li>
<li><i className="iconfont icon-junshililun1"></i>
<span>军事理论</span>
</li>
<li><i className="iconfont icon-ruanjiangongcheng1"></i>
<span>软件工程</span>
</li>
<li><i className="iconfont icon-yixue1"></i>
<span>医学</span>
</li>
<li><i className="iconfont icon-tongxin1"></i>
<span>通信</span>
</li>
<li><i className="iconfont icon-zhengcefagui1"></i>
<span>政策法规</span>
</li>
<li><i className="iconfont icon-dashuju"></i>
<span>大数据</span>
</li>
<li><i className="iconfont icon-rengongzhineng"></i>
<span>人工智能</span>
</li>
</ul>
<div className="circleBox">

View File

@ -4,7 +4,7 @@
.fifth-main {
display: flex;
width: 1200px;
max-width: 100%;
max-width: 98%;
margin: 5vh auto;
}
@ -13,70 +13,98 @@
width: 600px;
height: 600px;
flex: none;
&:hover .icon-circle{
animation-play-state:paused !important;
}
}
// ul,li{
// margin: 0;
// list-style-type: none;
// padding: 0;
// }
.icon-circle {
position: absolute;
left: 20px;
// left: 20px;
width: 560px;
height: 560px;
background-color: #fff;
// background-color: #2bebd7;
border-radius: 50%;
animation: iconCircle infinite 20s linear;
// animation: iconCircle infinite 20s linear;
li {
width: 70px;
height: 70px;
position: absolute;
background-color: red;
background-color: #254DEA;
border-radius: 50%;
color: #fff;
line-height: 70px;
text-align: center;
left: 50%;
margin-left: -20px;
margin-left: -30px;
margin-top: -20px;
cursor: pointer;
.iconfont{
font-size: 20px !important;
cursor: pointer;
}
}
li:nth-of-type(2) {
background: #E33230;
transform: rotate(36deg);
transform-origin: 20px 300px;
}
li:nth-of-type(3) {
background: #0766FB;
transform: rotate(72deg);
transform-origin: 20px 300px;
}
li:nth-of-type(4) {
background: #F02C66;
transform: rotate(108deg);
transform-origin: 20px 300px;
}
li:nth-of-type(5) {
background: #6038FF;
transform: rotate(144deg);
transform-origin: 20px 300px;
}
li:nth-of-type(6) {
background: #F85E55;
transform: rotate(180deg);
transform-origin: 20px 300px;
}
li:nth-of-type(7) {
background: #C13CFF;
transform: rotate(216deg);
transform-origin: 20px 300px;
}
li:nth-of-type(8) {
background: #2CB840;
transform: rotate(252deg);
transform-origin: 20px 300px;
}
li:nth-of-type(9) {
background: #5744F6;
transform: rotate(288deg);
transform-origin: 20px 300px;
}
li:nth-of-type(10) {
background: #E9862E;
transform: rotate(324deg);
transform-origin: 20px 300px;
}
li{
span{
position: absolute;
left: 0;
border-radius: 50%;
width: 100%;
background: rgba(0,0,0,0.5);
visibility: hidden;
}
&:hover span{
visibility: visible;
z-index: 2;
}
}
}
@keyframes iconCircle {
@ -90,9 +118,9 @@
.circleBox {
position: relative;
width: 200px;
height: 560px;
margin: auto;
width: 160px;
height: 160px;
margin:200px auto 0;
}
.circle1,
@ -100,11 +128,10 @@
.circle3,
.circle4,
.circle5 {
width: 200px;
height: 200px;
width: 160px;
height: 160px;
border-radius: 50%;
position: absolute;
top: 180px;
}
.circle5 {

View File

@ -21,7 +21,7 @@
justify-content: space-between;
width: 1200px;
height: 82vh;
max-width: 100%;
max-width: 98%;
margin: 0 auto;
}

View File

@ -15,7 +15,7 @@
display: flex;
justify-content: space-between;
width: 1200px;
max-width: 100%;
max-width: 98%;
margin: 20px auto 50px;
}

View File

@ -25,9 +25,13 @@
}
// 首页特定头部样式起
&.newHeaders {
background-color: #1a2358;
}
.head-nav {
min-width: auto;
}
.head-nav ul#header-nav li a {
font-size: 16px;
color: #fff;
@ -54,17 +58,14 @@
}
.register-button {
height: 43px ;
height: 43px;
margin-left: 20px;
padding: 0 25px;
font-size: 14px;
}
// 首页特定头部样式止
}
// 波浪样式起
.waves {
position: relative;
@ -107,4 +108,3 @@
}
}
// 波浪样式止