这是一个渐变式天蓝色风格，为各位衬底的单调的白色加点料！😜
/* 跳动标题 */
.Hero-title {
animation: my-face 5s infinite ease-in-out;
display: inline-block;
margin: 0 5px;
}
@keyframes my-face {
2% {
transform: translate(0,1.5px) rotate(1.5deg);
}
4% {
transform: translate(0,-1.5px) rotate(-0.5deg);
}
6% {
transform: translate(0,1.5px) rotate(-1.5deg);
}
8% {
transform: translate(0,-1.5px) rotate(-1.5deg);
}
10% {
transform: translate(0,2.5px) rotate(1.5deg);
}
12% {
transform: translate(0,-0.5px) rotate(1.5deg);
}
14% {
transform: translate(0,-1.5px) rotate(1.5deg);
}
16% {
transform: translate(0,-0.5px) rotate(-1.5deg);
}
18% {
transform: translate(0,0.5px) rotate(-1.5deg);
}
20% {
transform: translate(0,-1.5px) rotate(2.5deg);
}
22% {
transform: translate(0,0.5px) rotate(-1.5deg);
}
24% {
transform: translate(0,1.5px) rotate(1.5deg);
}
26% {
transform: translate(0,0.5px) rotate(0.5deg);
}
28% {
transform: translate(0,0.5px) rotate(1.5deg);
}
30% {
transform: translate(0,-0.5px) rotate(2.5deg);
}
32% {
transform: translate(0,1.5px) rotate(-0.5deg);
}
34% {
transform: translate(0,1.5px) rotate(-0.5deg);
}
36% {
transform: translate(0,-1.5px) rotate(2.5deg);
}
38% {
transform: translate(0,1.5px) rotate(-1.5deg);
}
40% {
transform: translate(0,-0.5px) rotate(2.5deg);
}
42% {
transform: translate(0,2.5px) rotate(-1.5deg);
}
44% {
transform: translate(0,1.5px) rotate(0.5deg);
}
46% {
transform: translate(0,-1.5px) rotate(2.5deg);
}
48% {
transform: translate(0,-0.5px) rotate(0.5deg);
}
50% {
transform: translate(0,0.5px) rotate(0.5deg);
}
52% {
transform: translate(0,2.5px) rotate(2.5deg);
}
54% {
transform: translate(0,-1.5px) rotate(1.5deg);
}
56% {
transform: translate(0,2.5px) rotate(2.5deg);
}
58% {
transform: translate(0,0.5px) rotate(2.5deg);
}
60% {
transform: translate(0,2.5px) rotate(2.5deg);
}
62% {
transform: translate(0,-0.5px) rotate(2.5deg);
}
64% {
transform: translate(0,-0.5px) rotate(1.5deg);
}
66% {
transform: translate(0,1.5px) rotate(-0.5deg);
}
68% {
transform: translate(0,-1.5px) rotate(-0.5deg);
}
70% {
transform: translate(0,1.5px) rotate(0.5deg);
}
72% {
transform: translate(0,2.5px) rotate(1.5deg);
}
74% {
transform: translate(0,-0.5px) rotate(0.5deg);
}
76% {
transform: translate(0,-0.5px) rotate(2.5deg);
}
78% {
transform: translate(0,-0.5px) rotate(1.5deg);
}
80% {
transform: translate(0,1.5px) rotate(1.5deg);
}
82% {
transform: translate(0,-0.5px) rotate(0.5deg);
}
84% {
transform: translate(0,1.5px) rotate(2.5deg);
}
86% {
transform: translate(0,-1.5px) rotate(-1.5deg);
}
88% {
transform: translate(0,-0.5px) rotate(2.5deg);
}
90% {
transform: translate(0,2.5px) rotate(-0.5deg);
}
92% {
transform: translate(0,0.5px) rotate(-0.5deg);
}
94% {
transform: translate(0,2.5px) rotate(0.5deg);
}
96% {
transform: translate(0,-0.5px) rotate(1.5deg);
}
98% {
transform: translate(0,-1.5px) rotate(-0.5deg);
}
0%,100% {
transform: translate(0,0) rotate(0deg);
}
}
/* 不要在全部标签页上展示竖排、信息流广告，以及在线用户、论坛统计 */
.TagsPage .item-forumStatisticsWidget {
display: none !important;
}
@media screen and (max-width: 600px) {
.item-forumStatisticsWidget {
display: none;
}
}
body {
background-image: linear-gradient(147deg, transparent 0%, transparent 8%,rgba(51,175,195, 0.08) 8%, rgba(51,175,195, 0.08) 46%,transparent 46%, transparent 100%),linear-gradient(107deg, transparent 0%, transparent 21%,rgba(51,175,195, 0.08) 21%, rgba(51,175,195, 0.08) 53%,transparent 53%, transparent 100%),linear-gradient(288deg, transparent 0%, transparent 35%,rgba(51,175,195, 0.08) 35%, rgba(51,175,195, 0.08) 91%,transparent 91%, transparent 100%),linear-gradient(90deg, rgb(255,255,255),rgb(255,255,255));
.CommentPost.Post--by-actor {
// This sets the left border to be the same color as the forum primary.
border-left: solid @config-primary-color;
}
.Hero {
background-image: linear-gradient(to top, #fff1eb 0%, #ace0f9 100%);
}
/* 卡片主题 */
.IndexPage .DiscussionListItem,
.UserPage .DiscussionListItem,
.DiscussionPage-discussion .DiscussionListItem {
transition: all 0.1s;
/* 动画时间 */;
}
@media (min-width: 991px) {
.IndexPage .DiscussionList-discussions>li:not(:first-child) .DiscussionListItem:hover {
/* 悬浮效果 */
transform: scale(1.01);
/* 缩放 */;
}
}
@media (min-width: 768px) {
/* pc 端 */
.IndexPage .DiscussionListItem-content,
.UserPage .DiscussionListItem-content,
.DiscussionPage-discussion .DiscussionListItem-content {
/* 首页、用户页、讨论页卡片大小、描边 */
padding-left: 80px;
padding-right: 80px;
padding-top: 10px;
border-radius: 8px;
padding-bottom: 10px;
border: 1px solid #dbdfe6!important;
}
.IndexPage .Post.CommentPost,
.UserPage .Post.CommentPost,
.DiscussionPage-discussion .Post.CommentPost {
margin-top: 20px;
border-radius: 8px;
border: 1px solid #dbdfe6 !important;
}
.IndexPage .DiscussionListItem-info>.item-tags,
.UserPage .DiscussionListItem-info>.item-tags {
top: 23px !important;
}
.DiscussionListItem {
position: relative;
margin-right: 0;
padding-right: 0;
padding-left: 0;
margin-left: 0;
border-radius: 8px;
margin-top: 15px;
}
}
@media (min-width: 768px) {
.IndexPage .DiscussionListItem:hover {
background-color: #fff;
-webkit-box-shadow: 0px 8px 24px 3px rgba(84,102,134,0.1) !important;
box-shadow: 0px 8px 24px 3px rgba(84,102,134,0.1) !important;
}
}
/* banner */
.WelcomeHero {
color: #282828;
}
记得主色调调为蓝色哦！