|
|
|
|
@ -399,54 +399,106 @@
|
|
|
|
|
color: #ffbb3f;
|
|
|
|
|
}
|
|
|
|
|
.notice{
|
|
|
|
|
width: 49%;
|
|
|
|
|
width: 55%;
|
|
|
|
|
height: 40px;
|
|
|
|
|
border-radius: 8px;
|
|
|
|
|
border: 1px solid #eee;
|
|
|
|
|
margin: 36px auto 10px;
|
|
|
|
|
margin: 36px auto 14px;
|
|
|
|
|
overflow: hidden;
|
|
|
|
|
float: left;
|
|
|
|
|
font-weight: bold;
|
|
|
|
|
}
|
|
|
|
|
.notice__inner{
|
|
|
|
|
height: 100%;
|
|
|
|
|
font-size: 14px;
|
|
|
|
|
color: #333;
|
|
|
|
|
animation: roll 36s linear infinite;
|
|
|
|
|
margin-top: 0
|
|
|
|
|
}
|
|
|
|
|
.notice__item{
|
|
|
|
|
font-size: 38px;
|
|
|
|
|
height: 40px;
|
|
|
|
|
line-height: 40px;
|
|
|
|
|
padding: 0 12px;
|
|
|
|
|
white-space: nowrap;
|
|
|
|
|
position: relative;
|
|
|
|
|
overflow: hidden;
|
|
|
|
|
text-overflow: ellipsis;
|
|
|
|
|
}
|
|
|
|
|
.notice__item{
|
|
|
|
|
position: absolute;
|
|
|
|
|
top: 0;
|
|
|
|
|
left: 100%;
|
|
|
|
|
height: 100%;
|
|
|
|
|
z-index: -1;
|
|
|
|
|
@keyframes roll {
|
|
|
|
|
0% {
|
|
|
|
|
margin-top: 0;
|
|
|
|
|
}
|
|
|
|
|
.notice__item-first{
|
|
|
|
|
padding-right: 70%;
|
|
|
|
|
animation: rollFirst 25s linear infinite;
|
|
|
|
|
4% {
|
|
|
|
|
margin-top: 0;
|
|
|
|
|
}
|
|
|
|
|
.notice__item-second{
|
|
|
|
|
padding-right: 53%;
|
|
|
|
|
animation: rollSecond 25s linear 12s infinite;
|
|
|
|
|
8% {
|
|
|
|
|
margin-top: 0;
|
|
|
|
|
}
|
|
|
|
|
@keyframes rollFirst {
|
|
|
|
|
0% {
|
|
|
|
|
transform: translateX(0);
|
|
|
|
|
12% {
|
|
|
|
|
margin-top: -40px;
|
|
|
|
|
}
|
|
|
|
|
100% {
|
|
|
|
|
transform: translateX(-200%);
|
|
|
|
|
16% {
|
|
|
|
|
margin-top: -40px;
|
|
|
|
|
}
|
|
|
|
|
20% {
|
|
|
|
|
margin-top: -80px;
|
|
|
|
|
}
|
|
|
|
|
@keyframes rollSecond {
|
|
|
|
|
0% {
|
|
|
|
|
transform: translateX(0);
|
|
|
|
|
24% {
|
|
|
|
|
margin-top: -80px;
|
|
|
|
|
}
|
|
|
|
|
28% {
|
|
|
|
|
margin-top: -120px;
|
|
|
|
|
}
|
|
|
|
|
32% {
|
|
|
|
|
margin-top: -120px;
|
|
|
|
|
}
|
|
|
|
|
36% {
|
|
|
|
|
margin-top: -160px;
|
|
|
|
|
}
|
|
|
|
|
40% {
|
|
|
|
|
margin-top: -160px;
|
|
|
|
|
}
|
|
|
|
|
44% {
|
|
|
|
|
margin-top: -200px;
|
|
|
|
|
}
|
|
|
|
|
48% {
|
|
|
|
|
margin-top: -200px;
|
|
|
|
|
}
|
|
|
|
|
52% {
|
|
|
|
|
margin-top: -240px;
|
|
|
|
|
}
|
|
|
|
|
56% {
|
|
|
|
|
margin-top: -240px;
|
|
|
|
|
}
|
|
|
|
|
60% {
|
|
|
|
|
margin-top: -200px;
|
|
|
|
|
}
|
|
|
|
|
64% {
|
|
|
|
|
margin-top: -200px;
|
|
|
|
|
}
|
|
|
|
|
68% {
|
|
|
|
|
margin-top: -160px;
|
|
|
|
|
}
|
|
|
|
|
72% {
|
|
|
|
|
margin-top: -160px;
|
|
|
|
|
}
|
|
|
|
|
76% {
|
|
|
|
|
margin-top: -120px;
|
|
|
|
|
}
|
|
|
|
|
80% {
|
|
|
|
|
margin-top: -120px;
|
|
|
|
|
}
|
|
|
|
|
84% {
|
|
|
|
|
margin-top: -80px;
|
|
|
|
|
}
|
|
|
|
|
88% {
|
|
|
|
|
margin-top: -80px;
|
|
|
|
|
}
|
|
|
|
|
92% {
|
|
|
|
|
margin-top: -40px;
|
|
|
|
|
}
|
|
|
|
|
96% {
|
|
|
|
|
margin-top: -40px;
|
|
|
|
|
}
|
|
|
|
|
100% {
|
|
|
|
|
transform: translateX(-200%);
|
|
|
|
|
margin-top: 0;
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
</style>
|
|
|
|
|
</style>
|
|
|
|
|
</head>
|
|
|
|
|
<body class="layui-bg-gray" style="">
|
|
|
|
|
<div id="content">
|
|
|
|
|
@ -458,17 +510,24 @@
|
|
|
|
|
<div class="layui-container">
|
|
|
|
|
<div class="notice">
|
|
|
|
|
<div class="notice__inner">
|
|
|
|
|
<i class="layui-icon layui-icon-speaker" style="font-size: 32px;background-color: white;height: 100%;display: inline-block;"></i>
|
|
|
|
|
<span class="notice__item notice__item-first">
|
|
|
|
|
[[${#strings.abbreviate(noticeList[0].noticeTitle,33)}]]
|
|
|
|
|
【[[${#dates.format(noticeList[0].createTime, 'yyyy年MM月dd日')}]]】
|
|
|
|
|
</span>
|
|
|
|
|
<span class="notice__item notice__item-second">
|
|
|
|
|
[[${#strings.abbreviate(noticeList[1].noticeTitle,33)}]]
|
|
|
|
|
【[[${#dates.format(noticeList[1].createTime, 'yyyy年MM月dd日')}]]】
|
|
|
|
|
</span>
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
<div class="notice__item" th:each="notice,status : ${noticeList}">
|
|
|
|
|
<a style="color: #c70011" th:href="@{/public_view.html(type=1,id=${notice.noticeId})}" th:title="${notice.noticeTitle}" target="_blank" >[[${#strings.abbreviate(notice.noticeTitle,33)}]]</a>
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
<!-- <div class="notice">-->
|
|
|
|
|
<!-- <div class="notice__inner">-->
|
|
|
|
|
<!-- <i class="layui-icon layui-icon-speaker" style="font-size: 32px;background-color: white;height: 100%;display: inline-block;"></i>-->
|
|
|
|
|
<!-- <span class="notice__item notice__item-first">-->
|
|
|
|
|
<!-- [[${#strings.abbreviate(noticeList[0].noticeTitle,33)}]]-->
|
|
|
|
|
<!-- 【[[${#dates.format(noticeList[0].createTime, 'yyyy年MM月dd日')}]]】-->
|
|
|
|
|
<!-- </span>-->
|
|
|
|
|
<!-- <span class="notice__item notice__item-second">-->
|
|
|
|
|
<!-- [[${#strings.abbreviate(noticeList[1].noticeTitle,33)}]]-->
|
|
|
|
|
<!-- 【[[${#dates.format(noticeList[1].createTime, 'yyyy年MM月dd日')}]]】-->
|
|
|
|
|
<!-- </span>-->
|
|
|
|
|
<!-- </div>-->
|
|
|
|
|
<!-- </div>-->
|
|
|
|
|
<div class="layui-row layui-col-space1">
|
|
|
|
|
<div class="layui-col-md6">
|
|
|
|
|
<div class="layui-carousel" id="ID-carousel-demo-image" style="width: 650px;height: 433px;">
|
|
|
|
|
|
dshclm
9 months ago