forgeplus-react/src/home/index.scss

111 lines
1.9 KiB
SCSS

.homePage {
background: #fff;
// 首页多个部分公共样式
.ant-btn-primary {
background-color: #4154f1;
border-color: #4154f1;
height: 56px;
box-shadow: 0px 0px 9px 2px rgba(65, 84, 241, 0.33) !important;
border-radius: 6px;
}
.text-center {
text-align: center;
}
.homePage-blue-tit {
color: #000870;
font-size: 34px;
margin-bottom: 0;
}
.homePage-subhead {
font-size: 16px;
color: #666;
}
// 首页特定头部样式起
&.newHeaders {
background-color: #1a2358;
}
.head-nav ul#header-nav li a {
font-size: 16px;
color: #fff;
}
.head-nav ul#header-nav li:hover a,
.head-nav ul#header-nav li.active a {
color: #ffa13a;
}
.head-nav ul#header-nav li.active a::after {
background-color: #ffa13a;
}
.logoDiv img {
min-width: 45px;
height: 45px;
}
.color-home {
color: #fff;
}
.color-home:hover {
color: #4154f1;
}
.register-button {
height: 43px ;
margin-left: 20px;
padding: 0 25px;
font-size: 14px;
}
// 首页特定头部样式止
}
// 波浪样式起
.waves {
position: relative;
width: 100%;
height: 8vh;
}
// .waves-low {
// height: 6vh;
// }
.parallax > use {
animation: move-forever 25s cubic-bezier(0.55, 0.5, 0.45, 0.5) infinite;
}
.parallax > use:nth-child(1) {
animation-delay: -2s;
animation-duration: 7s;
}
.parallax > use:nth-child(2) {
animation-delay: -3s;
animation-duration: 10s;
}
.parallax > use:nth-child(3) {
animation-delay: -4s;
animation-duration: 13s;
}
.parallax > use:nth-child(4) {
animation-delay: -5s;
animation-duration: 20s;
}
@keyframes move-forever {
0% {
transform: translate3d(-90px, 0, 0);
}
100% {
transform: translate3d(85px, 0, 0);
}
} /*Shrinking for mobile*/
@media (max-width: 768px) {
.waves {
height: 8vh;
}
}
// 波浪样式止