|
|
|
@ -1,5 +1,6 @@ |
|
|
|
|
<template> |
|
|
|
|
<div v-show="loaded" |
|
|
|
|
<div class="party" |
|
|
|
|
v-show="loaded" |
|
|
|
|
:class="['wrap', { activity: info.listStyleId === 15 }]"> |
|
|
|
|
<div class="banner"> |
|
|
|
|
<img width="100%" |
|
|
|
@ -778,40 +779,18 @@ export default { |
|
|
|
|
</script> |
|
|
|
|
|
|
|
|
|
<style lang="scss" scoped> |
|
|
|
|
.wrap { |
|
|
|
|
.banner { |
|
|
|
|
height: 24rem; |
|
|
|
|
position: relative; |
|
|
|
|
height: 24rem; |
|
|
|
|
color: #fff; |
|
|
|
|
img { |
|
|
|
|
height: 24rem; |
|
|
|
|
} |
|
|
|
|
.texts { |
|
|
|
|
position: absolute; |
|
|
|
|
bottom: 87px; |
|
|
|
|
top: auto; |
|
|
|
|
left: 213px; |
|
|
|
|
} |
|
|
|
|
} |
|
|
|
|
} |
|
|
|
|
.el-tree-node__content { |
|
|
|
|
padding-left: 10px !important; |
|
|
|
|
} |
|
|
|
|
.l-title { |
|
|
|
|
font-weight: 600; |
|
|
|
|
font-size: 1.024rem; |
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
.banner { |
|
|
|
|
position: relative; |
|
|
|
|
height: 14rem; |
|
|
|
|
|
|
|
|
|
color: #fff; |
|
|
|
|
|
|
|
|
|
.texts { |
|
|
|
|
position: absolute; |
|
|
|
|
top: 6.15rem; |
|
|
|
|
left: 12.15rem; |
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
.text { |
|
|
|
|
font-size: 2.16rem; |
|
|
|
@ -824,6 +803,12 @@ export default { |
|
|
|
|
font-size: 1.6rem; |
|
|
|
|
} |
|
|
|
|
} |
|
|
|
|
.el-tree-node__content { |
|
|
|
|
padding-left: 10px !important; |
|
|
|
|
} |
|
|
|
|
.l-title { |
|
|
|
|
font-weight: 600; |
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
.column-wrap { |
|
|
|
|
padding: 2rem 0; |
|
|
|
@ -962,15 +947,6 @@ export default { |
|
|
|
|
border-top: 1px solid #f8f9f9; |
|
|
|
|
cursor: pointer; |
|
|
|
|
|
|
|
|
|
// &:before { |
|
|
|
|
// content: ''; |
|
|
|
|
// width: 2px; |
|
|
|
|
// height: 2px; |
|
|
|
|
// margin: 0 10px 0 20px; |
|
|
|
|
// background-color: #666; |
|
|
|
|
// border-radius: 50%; |
|
|
|
|
// } |
|
|
|
|
|
|
|
|
|
&:hover { |
|
|
|
|
color: #0c84eb; |
|
|
|
|
} |
|
|
|
@ -1134,22 +1110,6 @@ export default { |
|
|
|
|
overflow: hidden; |
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
.column { |
|
|
|
|
width: 100%; |
|
|
|
|
margin-bottom: 1.25rem; |
|
|
|
|
|
|
|
|
|
/deep/.el-tree-node__content { |
|
|
|
|
height: 44px; |
|
|
|
|
background-color: #e5edf8; |
|
|
|
|
border-bottom: 2px solid #fff; |
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
/deep/.el-tree--highlight-current .el-tree-node.is-current > .el-tree-node__content { |
|
|
|
|
color: #fff; |
|
|
|
|
background-color: #0f5698; |
|
|
|
|
} |
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
.list { |
|
|
|
|
margin-bottom: 1rem; |
|
|
|
|
|
|
|
|
@ -1211,104 +1171,36 @@ export default { |
|
|
|
|
} |
|
|
|
|
} |
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
@media (max-width: 1200px) { |
|
|
|
|
.article { |
|
|
|
|
flex-direction: column; |
|
|
|
|
|
|
|
|
|
.left { |
|
|
|
|
width: 100%; |
|
|
|
|
|
|
|
|
|
.forms { |
|
|
|
|
flex-direction: column; |
|
|
|
|
justify-content: center; |
|
|
|
|
align-items: center; |
|
|
|
|
|
|
|
|
|
.item, |
|
|
|
|
.search { |
|
|
|
|
margin: 20px 0 0 0; |
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
.item:first-child { |
|
|
|
|
margin: 0; |
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
div { |
|
|
|
|
width: 100%; |
|
|
|
|
} |
|
|
|
|
} |
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
.article-wrap { |
|
|
|
|
width: 90%; |
|
|
|
|
margin: 0 auto; |
|
|
|
|
|
|
|
|
|
.articles { |
|
|
|
|
li { |
|
|
|
|
.pic { |
|
|
|
|
margin-top: 20px; |
|
|
|
|
} |
|
|
|
|
.party { |
|
|
|
|
/deep/.columns { |
|
|
|
|
.el-tree-node__content { |
|
|
|
|
&:hover { |
|
|
|
|
color: $partyTheme; |
|
|
|
|
} |
|
|
|
|
} |
|
|
|
|
.is-current > .el-tree-node__content { |
|
|
|
|
background-color: $lightPartyTheme; |
|
|
|
|
&:after { |
|
|
|
|
background-color: $partyTheme; |
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
.right { |
|
|
|
|
width: 95%; |
|
|
|
|
margin: 20px auto; |
|
|
|
|
.el-tree-node__label, |
|
|
|
|
.custom-tree-node { |
|
|
|
|
color: $partyTheme; |
|
|
|
|
} |
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
.banner { |
|
|
|
|
.texts { |
|
|
|
|
left: 50px; |
|
|
|
|
top: 110px; |
|
|
|
|
} |
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
.column-wrap { |
|
|
|
|
.article { |
|
|
|
|
flex-direction: column; |
|
|
|
|
|
|
|
|
|
.left { |
|
|
|
|
width: 100%; |
|
|
|
|
|
|
|
|
|
.item { |
|
|
|
|
width: 80%; |
|
|
|
|
margin: 20px auto; |
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
.search { |
|
|
|
|
width: 80%; |
|
|
|
|
margin: 20px auto; |
|
|
|
|
margin-top: 0; |
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
.contents { |
|
|
|
|
.articles { |
|
|
|
|
li:not(.news-notice) { |
|
|
|
|
flex-direction: column; |
|
|
|
|
|
|
|
|
|
.texts { |
|
|
|
|
width: 100%; |
|
|
|
|
|
|
|
|
|
.meta { |
|
|
|
|
font-size: 0.5rem; |
|
|
|
|
} |
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
.pic { |
|
|
|
|
width: 95%; |
|
|
|
|
margin: 0 auto; |
|
|
|
|
} |
|
|
|
|
} |
|
|
|
|
} |
|
|
|
|
} |
|
|
|
|
.readDetailBtn { |
|
|
|
|
background-color: $partyTheme; |
|
|
|
|
border-color: $partyTheme; |
|
|
|
|
} |
|
|
|
|
} |
|
|
|
|
/deep/.el-pagination.is-background .el-pager li:not(.disabled).active { |
|
|
|
|
background-color: $partyTheme !important; |
|
|
|
|
} |
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
@media (min-width: 280px) and (max-width: 1200px) { |
|
|
|
|
@media (max-width: 1200px) { |
|
|
|
|
.banner { |
|
|
|
|
height: 15rem !important; |
|
|
|
|
img { |
|
|
|
@ -1320,226 +1212,65 @@ export default { |
|
|
|
|
} |
|
|
|
|
} |
|
|
|
|
.article { |
|
|
|
|
flex-direction: column; |
|
|
|
|
|
|
|
|
|
.columns { |
|
|
|
|
width: 40%; |
|
|
|
|
.el-tree-node__content { |
|
|
|
|
padding: 0 !important; |
|
|
|
|
} |
|
|
|
|
span { |
|
|
|
|
font-size: 0.8rem; |
|
|
|
|
white-space: nowrap; |
|
|
|
|
overflow: hidden; |
|
|
|
|
text-overflow: ellipsis; |
|
|
|
|
} |
|
|
|
|
} |
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
.column-wrap { |
|
|
|
|
.article { |
|
|
|
|
flex-direction: column; |
|
|
|
|
|
|
|
|
|
.left { |
|
|
|
|
width: 100%; |
|
|
|
|
|
|
|
|
|
.contents { |
|
|
|
|
.articles { |
|
|
|
|
li:not(.news-notice) { |
|
|
|
|
.forms { |
|
|
|
|
flex-direction: column; |
|
|
|
|
justify-content: center; |
|
|
|
|
align-items: center; |
|
|
|
|
|
|
|
|
|
.pic { |
|
|
|
|
width: 95%; |
|
|
|
|
margin: 0 auto; |
|
|
|
|
height: 15rem; |
|
|
|
|
} |
|
|
|
|
} |
|
|
|
|
} |
|
|
|
|
} |
|
|
|
|
} |
|
|
|
|
} |
|
|
|
|
} |
|
|
|
|
.item, |
|
|
|
|
.search { |
|
|
|
|
margin: 20px 0 0 0; |
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
@media (max-width: 320px) { |
|
|
|
|
.banner { |
|
|
|
|
height: 12rem !important; |
|
|
|
|
img { |
|
|
|
|
height: 12rem !important; |
|
|
|
|
} |
|
|
|
|
.texts { |
|
|
|
|
left: 2rem; |
|
|
|
|
bottom: 2rem; |
|
|
|
|
.text { |
|
|
|
|
font-size: 1.5rem; |
|
|
|
|
} |
|
|
|
|
} |
|
|
|
|
} |
|
|
|
|
.contents { |
|
|
|
|
.article-wrap { |
|
|
|
|
.articles { |
|
|
|
|
.pic { |
|
|
|
|
height: auto !important; |
|
|
|
|
} |
|
|
|
|
.otherData { |
|
|
|
|
margin-top: 1rem; |
|
|
|
|
.leftBox { |
|
|
|
|
padding-left: 0; |
|
|
|
|
.titleDes { |
|
|
|
|
line-height: 1.368rem; |
|
|
|
|
} |
|
|
|
|
} |
|
|
|
|
} |
|
|
|
|
} |
|
|
|
|
} |
|
|
|
|
.item:first-child { |
|
|
|
|
margin: 0; |
|
|
|
|
} |
|
|
|
|
.forms { |
|
|
|
|
.switch { |
|
|
|
|
|
|
|
|
|
div { |
|
|
|
|
width: 100%; |
|
|
|
|
flex-direction: column; |
|
|
|
|
margin-right: 0; |
|
|
|
|
li { |
|
|
|
|
width: 90%; |
|
|
|
|
margin: 0 auto; |
|
|
|
|
margin-top: 10px; |
|
|
|
|
} |
|
|
|
|
} |
|
|
|
|
} |
|
|
|
|
} |
|
|
|
|
@media (min-width: 320px) and (max-width: 375px) { |
|
|
|
|
.banner { |
|
|
|
|
height: 12rem !important; |
|
|
|
|
img { |
|
|
|
|
height: 12rem !important; |
|
|
|
|
} |
|
|
|
|
.texts { |
|
|
|
|
left: 2rem; |
|
|
|
|
bottom: 2rem; |
|
|
|
|
.text { |
|
|
|
|
font-size: 1.5rem; |
|
|
|
|
} |
|
|
|
|
} |
|
|
|
|
} |
|
|
|
|
.contents { |
|
|
|
|
|
|
|
|
|
.article-wrap { |
|
|
|
|
.articles { |
|
|
|
|
.pic { |
|
|
|
|
height: auto !important; |
|
|
|
|
} |
|
|
|
|
.otherData { |
|
|
|
|
margin-top: 1rem; |
|
|
|
|
.leftBox { |
|
|
|
|
padding-left: 0; |
|
|
|
|
.titleDes { |
|
|
|
|
line-height: 1.368rem; |
|
|
|
|
} |
|
|
|
|
} |
|
|
|
|
} |
|
|
|
|
} |
|
|
|
|
} |
|
|
|
|
} |
|
|
|
|
.forms { |
|
|
|
|
.switch { |
|
|
|
|
width: 100%; |
|
|
|
|
flex-direction: column; |
|
|
|
|
margin-right: 0; |
|
|
|
|
li { |
|
|
|
|
width: 90%; |
|
|
|
|
margin: 0 auto; |
|
|
|
|
margin-top: 10px; |
|
|
|
|
} |
|
|
|
|
} |
|
|
|
|
} |
|
|
|
|
} |
|
|
|
|
@media (min-width: 375px) and (max-width: 480px) { |
|
|
|
|
.banner { |
|
|
|
|
height: 12rem !important; |
|
|
|
|
img { |
|
|
|
|
height: 12rem !important; |
|
|
|
|
} |
|
|
|
|
.texts { |
|
|
|
|
left: 2rem; |
|
|
|
|
bottom: 2rem; |
|
|
|
|
.text { |
|
|
|
|
font-size: 1.5rem; |
|
|
|
|
} |
|
|
|
|
} |
|
|
|
|
} |
|
|
|
|
.contents { |
|
|
|
|
.article-wrap { |
|
|
|
|
|
|
|
|
|
.articles { |
|
|
|
|
.pic { |
|
|
|
|
height: auto !important; |
|
|
|
|
} |
|
|
|
|
.otherData { |
|
|
|
|
li { |
|
|
|
|
flex-direction: column; |
|
|
|
|
align-items: flex-start; |
|
|
|
|
padding: 1rem; |
|
|
|
|
margin-top: 1rem; |
|
|
|
|
.leftBox { |
|
|
|
|
padding-left: 0; |
|
|
|
|
.titleDes { |
|
|
|
|
line-height: 1.368rem; |
|
|
|
|
} |
|
|
|
|
} |
|
|
|
|
} |
|
|
|
|
} |
|
|
|
|
} |
|
|
|
|
} |
|
|
|
|
.forms { |
|
|
|
|
.switch { |
|
|
|
|
.pic { |
|
|
|
|
width: 100%; |
|
|
|
|
flex-direction: column; |
|
|
|
|
margin-right: 0; |
|
|
|
|
li { |
|
|
|
|
width: 90%; |
|
|
|
|
margin: 0 auto; |
|
|
|
|
margin-top: 10px; |
|
|
|
|
} |
|
|
|
|
} |
|
|
|
|
margin: 10px 0; |
|
|
|
|
} |
|
|
|
|
} |
|
|
|
|
@media (min-width: 480px) and (max-width: 640px) { |
|
|
|
|
.banner { |
|
|
|
|
height: 12rem !important; |
|
|
|
|
img { |
|
|
|
|
height: 12rem !important; |
|
|
|
|
} |
|
|
|
|
.readDetail { |
|
|
|
|
.texts { |
|
|
|
|
left: 2rem; |
|
|
|
|
bottom: 2rem; |
|
|
|
|
.text { |
|
|
|
|
font-size: 1.5rem; |
|
|
|
|
} |
|
|
|
|
} |
|
|
|
|
} |
|
|
|
|
.contents { |
|
|
|
|
.article-wrap { |
|
|
|
|
.articles { |
|
|
|
|
.pic { |
|
|
|
|
height: auto !important; |
|
|
|
|
} |
|
|
|
|
.otherData { |
|
|
|
|
margin-top: 1rem; |
|
|
|
|
.leftBox { |
|
|
|
|
padding-left: 0; |
|
|
|
|
.titleDes { |
|
|
|
|
line-height: 1.368rem; |
|
|
|
|
} |
|
|
|
|
} |
|
|
|
|
} |
|
|
|
|
} |
|
|
|
|
} |
|
|
|
|
} |
|
|
|
|
.forms { |
|
|
|
|
.switch { |
|
|
|
|
width: 100%; |
|
|
|
|
flex-direction: column; |
|
|
|
|
margin-right: 0; |
|
|
|
|
li { |
|
|
|
|
width: 90%; |
|
|
|
|
margin: 0 auto; |
|
|
|
|
margin-top: 10px; |
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
.right { |
|
|
|
|
width: 95%; |
|
|
|
|
margin: 20px auto; |
|
|
|
|
} |
|
|
|
|
} |
|
|
|
|
} |
|
|
|
|
@media (min-width: 640px) and (max-width: 768px) { |
|
|
|
|
|
|
|
|
|
@media (max-width: 640px) { |
|
|
|
|
.banner { |
|
|
|
|
height: 12rem !important; |
|
|
|
|
img { |
|
|
|
@ -1553,112 +1284,18 @@ export default { |
|
|
|
|
} |
|
|
|
|
} |
|
|
|
|
} |
|
|
|
|
.article { |
|
|
|
|
.contents { |
|
|
|
|
.article-wrap { |
|
|
|
|
.articles { |
|
|
|
|
.pic { |
|
|
|
|
height: auto !important; |
|
|
|
|
} |
|
|
|
|
.otherData { |
|
|
|
|
margin-top: 1rem; |
|
|
|
|
.leftBox { |
|
|
|
|
padding-left: 0; |
|
|
|
|
.titleDes { |
|
|
|
|
line-height: 1.368rem; |
|
|
|
|
} |
|
|
|
|
} |
|
|
|
|
} |
|
|
|
|
} |
|
|
|
|
} |
|
|
|
|
} |
|
|
|
|
.forms { |
|
|
|
|
.switch { |
|
|
|
|
width: 100%; |
|
|
|
|
flex-direction: column; |
|
|
|
|
margin-right: 0; |
|
|
|
|
li { |
|
|
|
|
width: 90%; |
|
|
|
|
margin: 0 auto; |
|
|
|
|
margin-top: 10px; |
|
|
|
|
} |
|
|
|
|
} |
|
|
|
|
} |
|
|
|
|
} |
|
|
|
|
@media (min-width: 768px) and (max-width: 980px) { |
|
|
|
|
.banner { |
|
|
|
|
height: 12rem !important; |
|
|
|
|
img { |
|
|
|
|
height: 12rem !important; |
|
|
|
|
} |
|
|
|
|
.texts { |
|
|
|
|
left: 2rem; |
|
|
|
|
bottom: 2rem; |
|
|
|
|
.text { |
|
|
|
|
font-size: 1.5rem; |
|
|
|
|
} |
|
|
|
|
} |
|
|
|
|
padding: 0 15px; |
|
|
|
|
} |
|
|
|
|
.contents { |
|
|
|
|
.columns, |
|
|
|
|
.article-wrap { |
|
|
|
|
.articles { |
|
|
|
|
.pic { |
|
|
|
|
height: auto !important; |
|
|
|
|
} |
|
|
|
|
.otherData { |
|
|
|
|
margin-top: 1rem; |
|
|
|
|
.leftBox { |
|
|
|
|
padding-left: 0; |
|
|
|
|
.titleDes { |
|
|
|
|
line-height: 1.368rem; |
|
|
|
|
} |
|
|
|
|
} |
|
|
|
|
} |
|
|
|
|
} |
|
|
|
|
} |
|
|
|
|
} |
|
|
|
|
.forms { |
|
|
|
|
.switch { |
|
|
|
|
width: 100%; |
|
|
|
|
flex-direction: column; |
|
|
|
|
margin-right: 0; |
|
|
|
|
li { |
|
|
|
|
width: 90%; |
|
|
|
|
margin: 0 auto; |
|
|
|
|
margin-top: 10px; |
|
|
|
|
} |
|
|
|
|
} |
|
|
|
|
} |
|
|
|
|
} |
|
|
|
|
@media (min-width: 980px) and (max-width: 1200px) { |
|
|
|
|
.article { |
|
|
|
|
.articles { |
|
|
|
|
.pic { |
|
|
|
|
width: 40%; |
|
|
|
|
height: auto; |
|
|
|
|
} |
|
|
|
|
} |
|
|
|
|
} |
|
|
|
|
.banner { |
|
|
|
|
height: 14rem !important; |
|
|
|
|
img { |
|
|
|
|
height: 14rem !important; |
|
|
|
|
} |
|
|
|
|
.texts { |
|
|
|
|
left: 2rem; |
|
|
|
|
bottom: 2rem; |
|
|
|
|
.text { |
|
|
|
|
font-size: 1.5rem; |
|
|
|
|
} |
|
|
|
|
} |
|
|
|
|
} |
|
|
|
|
.contents { |
|
|
|
|
.article-wrap { |
|
|
|
|
.articles { |
|
|
|
|
.pic { |
|
|
|
|
height: auto !important; |
|
|
|
|
} |
|
|
|
|
.otherData { |
|
|
|
|
margin-top: 1rem; |
|
|
|
|
li { |
|
|
|
|
.leftBox { |
|
|
|
|
padding-left: 0; |
|
|
|
|
.titleDes { |
|
|
|
@ -1668,7 +1305,6 @@ export default { |
|
|
|
|
} |
|
|
|
|
} |
|
|
|
|
} |
|
|
|
|
} |
|
|
|
|
.forms { |
|
|
|
|
.switch { |
|
|
|
|
width: 100%; |
|
|
|
@ -1682,24 +1318,4 @@ export default { |
|
|
|
|
} |
|
|
|
|
} |
|
|
|
|
} |
|
|
|
|
@media (min-width: 1200px) and (max-width: 1300px) { |
|
|
|
|
.article { |
|
|
|
|
.articles { |
|
|
|
|
.pic { |
|
|
|
|
width: 40%; |
|
|
|
|
height: auto; |
|
|
|
|
} |
|
|
|
|
} |
|
|
|
|
} |
|
|
|
|
} |
|
|
|
|
@media (min-width: 1300px) { |
|
|
|
|
.article { |
|
|
|
|
.articles { |
|
|
|
|
.pic { |
|
|
|
|
width: 40%; |
|
|
|
|
height: auto; |
|
|
|
|
} |
|
|
|
|
} |
|
|
|
|
} |
|
|
|
|
} |
|
|
|
|
</style> |
|
|
|
|