+
{i.topics &&
{i.topics.slice(0, 2).map(item => {item.name})}
}
-
{i.name}
+
{i.name}
{i.description &&
{i.description}
}
{rollingButton({href: url, name: "查看详情", hoverName: "查看详情", classname: 'mt10'})}
diff --git a/src/forums/list/index.jsx b/src/forums/list/index.jsx
index 2e7618a8..46111a15 100644
--- a/src/forums/list/index.jsx
+++ b/src/forums/list/index.jsx
@@ -45,11 +45,8 @@ function List(props) {
function init(updatedTags){
const tagByState = updatedTags.filter(i=>i.title.includes(tagNameByState))
setForumTagDetail(tagByState && !!tagByState.length ? tagByState[0] : updatedTags[0]);
- if(tagByState && !tagByState.length) return
- const targetDiv = document.getElementById("forums-list3-id");
- const targetDivRect = targetDiv.getBoundingClientRect();
- targetDiv && window.scrollTo({
- top: targetDivRect.top+window.screenY,
+ tagByState && !!tagByState.length && window.scrollTo({
+ top: 850,
behavior: 'smooth'
})
}
@@ -154,7 +151,7 @@ function List(props) {
{item.subject}
- {index === 0 && new}
+ {index === 0 && NEW}
{item.is_original && 原创}
@@ -186,7 +183,7 @@ function List(props) {
{forumTag.map((item, index) => {
const isSelected = forumTagDetail && forumTagDetail.id === item.id;
- const forums = item.essencePosts[0] || {};
+ const forums = item.essencePosts && item.essencePosts[0] || {};
return (
{setForumTagDetail(item)}}>
@@ -247,7 +244,7 @@ function List(props) {
{forumListByTag.length === 0 && (
)}
-
{ setPage(page) }} className='center mt30' />
+ { setPage(page) }} className='edu-txt-right mt30' />
diff --git a/src/forums/list/index.scss b/src/forums/list/index.scss
index ee0c3eae..38ac4728 100644
--- a/src/forums/list/index.scss
+++ b/src/forums/list/index.scss
@@ -7,6 +7,9 @@
padding: 0 3px;
margin-left: 10px;
margin-right: 0px;
+ &+.ant-tag{
+ margin-left: 6px;
+ }
}
}
@@ -71,6 +74,7 @@
cursor: pointer;
padding: 10px 15px 10px 15px;
line-height: normal;
+ position: relative;
.forums-subject {
padding: 8px 0;
@@ -79,6 +83,18 @@
color: #091221;
}
}
+ &::after {
+ position: absolute;
+ bottom: -1px;
+ left: 5%;
+ content: '';
+ width: 0;
+ height: 1px;
+ background-color: #2149d4;
+ }
+ &-active::after{
+ animation: bottomflowLight 3s forwards;
+ }
}
.forums-list-item:not(:last-of-type):not(.forums-list-item-active) {
@@ -89,8 +105,8 @@
}
.forums-list-item:hover, .forums-list-item-active {
- background-color: #f7f9fd;
- border-radius: 10px;
+ background-image: linear-gradient(180deg,#f7f9fd00 0%, #f7f9fd 100%);
+ border-radius: 4px;
font-weight: bold;
.forums-subject {
@@ -132,16 +148,16 @@
&.active{
border-color: #2149d4;
&::before{
- content: '\e791';
+ content: '\e880';
font-family: "iconfont";
position: absolute;
- bottom: -32px;
- font-size: 26px;
+ bottom: -20px;
+ font-size: 13px;
left: 48%;
color: #2149d4;
}
}
- &:nth-of-type(2) .forums-section-item{
+ &:nth-of-type(2) .forums-section-item, &:nth-of-type(4) .forums-section-item{
background-image:linear-gradient(90deg,#D7DEFF 0% 49.37%,#C7CFFF 100%);
}
}
@@ -212,15 +228,31 @@
}
}
.forums-list4-item-link{
+ position: relative;
.icon-jiantou3{
display: none;
}
+ &::before{
+ content: '';
+ position: absolute;
+ bottom: 0;
+ left: 0;
+ width: 0;
+ height: 1px;
+ background-color: #2149d4;
+ transition: width 1s ease;
+ }
&:hover{
- padding-right: 20px;
color:#2149d4;
+ &::before{
+ width: 100%;
+ }
.icon-jiantou3{
display: inline-block;
}
+ & ~ .ant-tag{
+ display: none;
+ }
}
}
}
@@ -238,4 +270,14 @@
transform: rotate(-8deg);
transform-origin: center bottom;
}
+}
+
+@keyframes bottomflowLight {
+ 0% {
+ width: 0;
+ }
+
+ 100% {
+ width: 90%;
+ }
}
\ No newline at end of file
diff --git a/src/news/list/index.jsx b/src/news/list/index.jsx
index 481a5886..4acd16eb 100644
--- a/src/news/list/index.jsx
+++ b/src/news/list/index.jsx
@@ -9,6 +9,7 @@ import RenderHtml from "../../components/render-html";
import icon2 from '../image/icon2.png'
import icon13 from '../image/icon13.png'
import icon14 from '../image/icon14.png'
+import { rollingButton } from "../../components/button";
function List() {
const [list1, setList1] = useState([]);
@@ -72,7 +73,7 @@ function List() {
{item.summary}
-
+ {rollingButton({href: `/news/${item.id}`, classname: "black-border-button"})}
{item.publishTime}发布