-
{{ modules[15].form.title }}
+{{ modules[15].form.title }}
{{ modules[15].form.des }}
-
@@ -165,7 +163,7 @@
-
+
+ + -+
-
+
+
- -
-+ class="wow fadeInDown" + :data-wow-delay="(0.1 * i).toFixed(1) + 's'"> +{{ item.date }}
-{{ item.month }}
--{{ item.title }}
- + +{{ item.title }}+
- -
-
+ ++
{{ item.date }}
+{{ item.month }}
+++{{ item.title }}
+ +
+
+ -
+
{{ item.title }}
+{{ item.mainBody }}+
+
+ -
-
{{ item.title }}
-{{ item.mainBody }}+ @click="toArtice(item, modules[12].form)"> +{{ item.title }}+{{ item.releaseTime }}
-
- {{ item.title }}-
{{ item.releaseTime }}
-
-
- -
@@ -44,7 +45,7 @@
-
@@ -53,7 +54,7 @@
-
@@ -158,7 +159,7 @@ export default {
bottom: 0;
left: 0;
width: 60%;
- padding: 1.5rem 0 1.5rem 18%;
+ padding: 1.5rem 0 1.5rem 2%;
background: #7bacc4;
border-radius: 0px 100px 0px 0px;
opacity: 0.88;
@@ -222,4 +223,344 @@ export default {
line-height: 31px;
}
}
+
+@media (max-width: 1200px) {
+ body {
+ width: 100% !important;
+ }
+ .share {
+ width: 100%;
+ .inner {
+ width: 100%;
+ flex-direction: column;
+ .left {
+ width: 100%;
+ }
+ }
+ .des {
+ display: block;
+ padding: 0 10px;
+ }
+ .pic {
+ width: 100%;
+ }
+ .card {
+ width: 100%;
+ }
+ }
+ .group {
+ width: 100%;
+ flex-direction: column;
+ li {
+ width: 100%;
+ margin-top: 20px;
+ }
+ }
+}
+
+@media (max-width: 320px) {
+ .wrap {
+ .single-banner {
+ .banner-img {
+ height: 13rem;
+ }
+ .texts {
+ top: 7rem;
+ left: 2rem;
+ .banner-title {
+ font-size: 1.5rem;
+ margin-bottom: 0.5rem;
+ }
+ .banner-des {
+ font-size: 0.85rem;
+ }
+ }
+ }
+ }
+ .block {
+ padding: 2rem 0;
+ .inner {
+ .pic {
+ height: auto;
+ }
+ .card {
+ padding: 1.875rem 0 1.875rem 18.5%;
+ bottom: 0;
+ .title {
+ font-size: 1.4rem;
+ }
+ .en-text {
+ font-size: 0.9rem;
+ }
+ }
+ }
+ }
+}
+@media (min-width: 320px) and (max-width: 375px) {
+ .wrap {
+ .single-banner {
+ .banner-img {
+ height: 13rem;
+ }
+ .texts {
+ top: 7rem;
+ left: 2rem;
+ .banner-title {
+ font-size: 1.5rem;
+ margin-bottom: 0.5rem;
+ }
+ .banner-des {
+ font-size: 0.85rem;
+ }
+ }
+ }
+ }
+ .block {
+ padding: 2rem 0;
+ .inner {
+ .pic {
+ height: auto;
+ }
+ .card {
+ padding: 1.875rem 0 1.875rem 18.5%;
+ bottom: 0;
+ .title {
+ font-size: 1.4rem;
+ }
+ .en-text {
+ font-size: 0.9rem;
+ }
+ }
+ }
+ }
+ .group {
+ li {
+ height: auto;
+ }
+ }
+}
+@media (min-width: 375px) and (max-width: 480px) {
+ .wrap {
+ .single-banner {
+ .banner-img {
+ height: 13rem;
+ }
+ .texts {
+ top: 7rem;
+ left: 2rem;
+ .banner-title {
+ font-size: 1.5rem;
+ margin-bottom: 0.5rem;
+ }
+ .banner-des {
+ font-size: 0.85rem;
+ }
+ }
+ }
+ }
+ .block {
+ padding: 2rem 0;
+ .inner {
+ .pic {
+ height: auto;
+ }
+ .card {
+ padding: 1.875rem 0 1.875rem 18.5%;
+ bottom: 0;
+ .title {
+ font-size: 1.4rem;
+ }
+ .en-text {
+ font-size: 0.9rem;
+ }
+ }
+ }
+ }
+ .group {
+ li {
+ height: auto;
+ }
+ }
+}
+@media (min-width: 480px) and (max-width: 640px) {
+ .wrap {
+ .single-banner {
+ .banner-img {
+ height: 13rem;
+ }
+ .texts {
+ top: 7rem;
+ left: 2rem;
+ .banner-title {
+ font-size: 1.5rem;
+ margin-bottom: 0.5rem;
+ }
+ .banner-des {
+ font-size: 0.85rem;
+ }
+ }
+ }
+ }
+ .block {
+ padding: 2rem 0;
+ .inner {
+ .pic {
+ height: auto;
+ }
+ .card {
+ padding: 1.875rem 0 1.875rem 18.5%;
+ bottom: 0;
+ .title {
+ font-size: 1.4rem;
+ }
+ .en-text {
+ font-size: 0.9rem;
+ }
+ }
+ }
+ }
+ .group {
+ li {
+ height: auto;
+ }
+ }
+}
+@media (min-width: 640px) and (max-width: 768px) {
+ .wrap {
+ .single-banner {
+ .banner-img {
+ height: 13rem;
+ }
+ .texts {
+ top: 7rem;
+ left: 2rem;
+ .banner-title {
+ font-size: 1.5rem;
+ margin-bottom: 0.5rem;
+ }
+ .banner-des {
+ font-size: 0.85rem;
+ }
+ }
+ }
+ }
+ .block {
+ padding: 2rem 0;
+ .inner {
+ .pic {
+ height: auto;
+ }
+ .card {
+ padding: 1.875rem 0 1.875rem 18.5%;
+ bottom: 0;
+ .title {
+ font-size: 1.4rem;
+ }
+ .en-text {
+ font-size: 0.9rem;
+ }
+ }
+ }
+ }
+ .group {
+ flex-direction: row;
+ li {
+ .des {
+ line-height: 1rem;
+ }
+ }
+ }
+}
+@media (min-width: 768px) and (max-width: 980px) {
+ .wrap {
+ .single-banner {
+ .banner-img {
+ height: 13rem;
+ }
+ .texts {
+ top: 7rem;
+ left: 2rem;
+ .banner-title {
+ font-size: 1.5rem;
+ margin-bottom: 0.5rem;
+ }
+ .banner-des {
+ font-size: 0.85rem;
+ }
+ }
+ }
+ }
+ .block {
+ padding: 2rem 0;
+ .inner {
+ .pic {
+ height: auto;
+ }
+ .card {
+ padding: 1.875rem 0 1.875rem 18.5%;
+ bottom: 0;
+ .title {
+ font-size: 1.4rem;
+ }
+ .en-text {
+ font-size: 0.9rem;
+ }
+ }
+ }
+ }
+ .group {
+ flex-direction: row;
+ li {
+ .des {
+ line-height: 1rem;
+ }
+ }
+ }
+}
+@media (min-width: 980px) and (max-width: 1200px) {
+ .wrap {
+ .single-banner {
+ .banner-img {
+ height: 13rem;
+ }
+ .texts {
+ top: 7rem;
+ left: 2rem;
+ .banner-title {
+ font-size: 1.5rem;
+ margin-bottom: 0.5rem;
+ }
+ .banner-des {
+ font-size: 0.85rem;
+ }
+ }
+ }
+ }
+ .block {
+ padding: 2rem 0;
+ .inner {
+ .pic {
+ height: auto;
+ }
+ .card {
+ padding: 1.875rem 0 1.875rem 18.5%;
+ bottom: 0;
+ .title {
+ font-size: 1.4rem;
+ }
+ .en-text {
+ font-size: 0.9rem;
+ }
+ }
+ }
+ }
+ .group {
+ flex-direction: row;
+ li {
+ .des {
+ line-height: 1rem;
+ }
+ }
+ }
+}
\ No newline at end of file
diff --git a/src/styles/page/page.scss b/src/styles/page/page.scss
index c174486..3452179 100644
--- a/src/styles/page/page.scss
+++ b/src/styles/page/page.scss
@@ -129,3 +129,30 @@
}
}
}
+
+@media (max-width: 1200px) {
+ .wrap {
+ .single-banner {
+ .banner-img {
+ height: 35rem;
+ }
+ .texts {
+ top: 20rem;
+ left: 6rem;
+ }
+ }
+ }
+ .inner {
+ width: 90%;
+ }
+ .tabs {
+ overflow: hidden;
+ overflow-x: auto;
+ white-space: normal;
+ justify-content: normal;
+ display: -webkit-box;
+ li {
+ white-space: normal;
+ }
+ }
+}
-
{{ modules[21].form.title }}
+{{ modules[21].form.title }}
{{ modules[21].form.des }}
\ No newline at end of file
diff --git a/src/pages/application/index.vue b/src/pages/application/index.vue
index 4c669e8..7b0bc9d 100644
--- a/src/pages/application/index.vue
+++ b/src/pages/application/index.vue
@@ -373,4 +373,608 @@ export default {
color: #999;
}
}
+
+@media (max-width: 1520px) {
+ .app-inner {
+ width: 1558px;
+ }
+}
+
+@media (min-width: 280px) and (max-width: 1200px) {
+ .wrap {
+ /deep/ .el-carousel {
+ height: 15rem;
+ .el-carousel__container {
+ height: 15rem;
+ }
+ img {
+ height: 15rem;
+ }
+ }
+ }
+ .banner-item .banner-name {
+ font-size: 1.5rem;
+ bottom: 2.25rem;
+ left: 16.125rem;
+ }
+ .block {
+ padding: 50px 0;
+ .inner {
+ width: 95%;
+ margin: 0 auto;
+ .texts {
+ flex-direction: column;
+ .left {
+ width: 100%;
+ }
+ .bg {
+ margin: 0;
+ width: 100%;
+ height: 20rem !important;
+ }
+ }
+ }
+ .app {
+ li {
+ width: 100%;
+ }
+ }
+ .intro {
+ margin-bottom: 30px;
+ }
+ .group {
+ flex-direction: column;
+ li {
+ width: 100%;
+ img {
+ height: 20rem;
+ }
+ }
+ }
+ .news {
+ flex-direction: column;
+ li {
+ width: 95%;
+ margin: 0 auto;
+ flex-direction: column;
+ img {
+ width: 100%;
+ height: 12rem;
+ }
+ .texts {
+ margin-left: 0;
+ margin-top: 20px;
+ }
+ }
+ }
+ }
+}
+@media (max-width: 1200px) {
+ .block {
+ padding: 50px 0;
+ .inner {
+ width: 95%;
+ margin: 0 auto;
+ .texts {
+ flex-direction: column;
+ .left {
+ width: 100%;
+ }
+ .bg {
+ margin: 0;
+ width: 100%;
+ height: 450px;
+ }
+ }
+ }
+ .app {
+ li {
+ width: 100%;
+ }
+ }
+ .intro {
+ margin-bottom: 30px;
+ }
+ .group {
+ flex-direction: column;
+ li {
+ width: 100%;
+ }
+ }
+ .news {
+ flex-direction: column;
+ li {
+ width: 95%;
+ margin: 0 auto;
+ flex-direction: column;
+ img {
+ width: 100%;
+ height: 200px;
+ }
+ .texts {
+ margin-left: 0;
+ margin-top: 20px;
+ }
+ }
+ }
+ }
+}
+@media (max-width: 320px) {
+ .wrap {
+ /deep/ .el-carousel {
+ height: 12rem !important;
+ }
+ /deep/ .el-carousel__container {
+ height: 12rem !important;
+ }
+ /deep/ .el-carousel__item {
+ height: 12rem !important;
+ }
+ }
+ .banner-item {
+ img {
+ height: 12rem !important;
+ }
+ .banner-name {
+ font-size: 1.5rem;
+ line-height: 1rem;
+ left: 2rem;
+ bottom: 2rem;
+ }
+ }
+ .block {
+ padding: 1.25rem 0;
+ .inner {
+ h2 {
+ margin-left: 1.5rem !important;
+ }
+ .b-title {
+ font-size: 1.5rem;
+ }
+ .texts {
+ padding: 5rem 1.25rem;
+ h2 {
+ margin-left: 0 !important;
+ }
+ .bg {
+ height: auto !important;
+ }
+ }
+ .group {
+ li {
+ img {
+ height: auto;
+ }
+ }
+ }
+ .news {
+ li {
+ padding: 1.25rem;
+ img {
+ height: auto;
+ }
+ .texts {
+ padding: 1.25rem;
+ }
+ }
+ }
+ }
+ }
+}
+@media (min-width: 320px) and (max-width: 375px) {
+ .wrap {
+ /deep/ .el-carousel {
+ height: 12rem !important;
+ }
+ /deep/ .el-carousel__container {
+ height: 12rem !important;
+ }
+ /deep/ .el-carousel__item {
+ height: 12rem !important;
+ }
+ }
+ .banner-item {
+ img {
+ height: 12rem !important;
+ }
+ .banner-name {
+ font-size: 1.5rem;
+ line-height: 1rem;
+ left: 2rem;
+ bottom: 2rem;
+ }
+ }
+ .block {
+ padding: 1.25rem 0;
+ .inner {
+ h2 {
+ margin-left: 1.5rem !important;
+ }
+ .b-title {
+ font-size: 1.5rem;
+ }
+ .texts {
+ padding: 5rem 1.25rem;
+ h2 {
+ margin-left: 0 !important;
+ }
+ .bg {
+ height: auto !important;
+ }
+ }
+ .group {
+ li {
+ img {
+ height: auto;
+ }
+ }
+ }
+ .news {
+ li {
+ padding: 1.25rem;
+ img {
+ height: auto;
+ }
+ .texts {
+ padding: 1.25rem;
+ }
+ }
+ }
+ }
+ }
+}
+@media (min-width: 375px) and (max-width: 480px) {
+ .wrap {
+ /deep/ .el-carousel {
+ height: 12rem !important;
+ }
+ /deep/ .el-carousel__container {
+ height: 12rem !important;
+ }
+ /deep/ .el-carousel__item {
+ height: 12rem !important;
+ }
+ }
+ .banner-item {
+ img {
+ height: 12rem !important;
+ }
+ .banner-name {
+ font-size: 1.5rem;
+ line-height: 1rem;
+ left: 2rem;
+ bottom: 2rem;
+ }
+ }
+ .block {
+ padding: 1.25rem 0;
+ .inner {
+ h2 {
+ margin-left: 1.5rem !important;
+ }
+ .b-title {
+ font-size: 1.5rem;
+ }
+ .texts {
+ padding: 5rem 1.25rem;
+ h2 {
+ margin-left: 0 !important;
+ }
+ .bg {
+ height: auto !important;
+ }
+ }
+ .group {
+ li {
+ img {
+ height: auto;
+ }
+ }
+ }
+ .news {
+ li {
+ padding: 1.25rem;
+ img {
+ height: auto;
+ }
+ .texts {
+ padding: 1.25rem;
+ }
+ }
+ }
+ }
+ }
+}
+@media (min-width: 480px) and (max-width: 640px) {
+ .wrap {
+ /deep/ .el-carousel {
+ height: 12rem !important;
+ }
+ /deep/ .el-carousel__container {
+ height: 12rem !important;
+ }
+ /deep/ .el-carousel__item {
+ height: 12rem !important;
+ }
+ }
+ .banner-item {
+ img {
+ height: 12rem !important;
+ }
+ .banner-name {
+ font-size: 1.5rem;
+ line-height: 1rem;
+ left: 2rem;
+ bottom: 2rem;
+ }
+ }
+ .block {
+ padding: 1.25rem 0;
+ .inner {
+ h2 {
+ margin-left: 1.5rem !important;
+ }
+ .b-title {
+ font-size: 1.5rem;
+ }
+ .texts {
+ padding: 5rem 1.25rem;
+ h2 {
+ margin-left: 0 !important;
+ }
+ .bg {
+ height: auto !important;
+ }
+ }
+ .group {
+ li {
+ img {
+ height: auto;
+ }
+ }
+ }
+ .news {
+ li {
+ padding: 1.25rem;
+ img {
+ height: auto;
+ }
+ .texts {
+ padding: 1.25rem;
+ }
+ }
+ }
+ }
+ }
+}
+@media (min-width: 640px) and (max-width: 768px) {
+ .wrap {
+ /deep/ .el-carousel {
+ height: 12rem !important;
+ }
+ /deep/ .el-carousel__container {
+ height: 12rem !important;
+ }
+ /deep/ .el-carousel__item {
+ height: 12rem !important;
+ }
+ }
+ .banner-item {
+ img {
+ height: 12rem !important;
+ }
+ .banner-name {
+ font-size: 1.5rem;
+ line-height: 1rem;
+ left: 2rem;
+ bottom: 2rem;
+ }
+ }
+ .block {
+ padding: 1.25rem 0;
+ .inner {
+ h2 {
+ margin-left: 1.5rem !important;
+ }
+ .b-title {
+ font-size: 1.5rem;
+ }
+ .texts {
+ padding: 5rem 1.25rem;
+ h2 {
+ margin-left: 0 !important;
+ }
+ .bg {
+ height: auto !important;
+ }
+ }
+ .group {
+ li {
+ img {
+ height: auto;
+ }
+ }
+ }
+ .news {
+ li {
+ padding: 1.25rem;
+ img {
+ height: auto;
+ }
+ .texts {
+ padding: 1.25rem;
+ }
+ }
+ }
+ }
+ }
+}
+@media (min-width: 768px) and (max-width: 980px) {
+ .wrap {
+ /deep/ .el-carousel {
+ height: 12rem !important;
+ }
+ /deep/ .el-carousel__container {
+ height: 12rem !important;
+ }
+ /deep/ .el-carousel__item {
+ height: 12rem !important;
+ }
+ }
+ .banner-item {
+ img {
+ height: 12rem !important;
+ }
+ .banner-name {
+ font-size: 1.5rem;
+ line-height: 1rem;
+ left: 2rem;
+ bottom: 2rem;
+ }
+ }
+ .block {
+ padding: 1.25rem 0;
+ .inner {
+ h2 {
+ margin-left: 1.5rem !important;
+ }
+ .b-title {
+ font-size: 1.5rem;
+ }
+ .texts {
+ flex-direction: row;
+ padding: 3rem 1.25rem;
+ .left {
+ width: 50%;
+ }
+ h2 {
+ margin-left: 0 !important;
+ }
+ .bg {
+ width: 50%;
+ margin: -3rem 0 0 0;
+ height: auto !important;
+ }
+ }
+ .group {
+ flex-direction: row;
+ li {
+ width: calc((100% - 56px) / 3);
+ img {
+ height: auto;
+ }
+ .text {
+ line-height: 1.5rem;
+ }
+ }
+ }
+ .news {
+ flex-direction: row;
+ li {
+ width: calc((100% - 28px) / 2);
+ padding: 1.25rem;
+ img {
+ height: auto;
+ }
+ .texts {
+ padding: 1.25rem;
+ }
+ }
+ }
+ .app {
+ flex-direction: row;
+ li {
+ width: 45%;
+ &:nth-child(2n + 1) {
+ margin-right: 1rem;
+ }
+ }
+ }
+ }
+ }
+}
+@media (min-width: 980px) and (max-width: 1200px) {
+ .wrap {
+ /deep/ .el-carousel {
+ height: 12rem !important;
+ }
+ /deep/ .el-carousel__container {
+ height: 12rem !important;
+ }
+ /deep/ .el-carousel__item {
+ height: 12rem !important;
+ }
+ }
+ .banner-item {
+ img {
+ height: 12rem !important;
+ }
+ .banner-name {
+ font-size: 1.5rem;
+ line-height: 1rem;
+ left: 2rem;
+ bottom: 2rem;
+ }
+ }
+ .block {
+ padding: 1.25rem 0;
+ .inner {
+ h2 {
+ margin-left: 1.5rem !important;
+ }
+ .b-title {
+ font-size: 1.5rem;
+ }
+ .texts {
+ flex-direction: row;
+ padding: 3rem 1.25rem;
+ .left {
+ width: 50%;
+ }
+ h2 {
+ margin-left: 0 !important;
+ }
+ .bg {
+ width: 50%;
+ margin: -3rem 0 0 0;
+ height: auto !important;
+ }
+ }
+ .group {
+ flex-direction: row;
+ li {
+ width: calc((100% - 56px) / 3);
+ img {
+ height: auto;
+ }
+ .text {
+ line-height: 1.5rem;
+ }
+ }
+ }
+ .news {
+ flex-direction: row;
+ li {
+ width: calc((100% - 28px) / 2);
+ padding: 1.25rem;
+ img {
+ height: auto;
+ }
+ .texts {
+ padding: 1.25rem;
+ }
+ }
+ }
+ .app {
+ flex-direction: row;
+ li {
+ width: 45%;
+ &:nth-child(2n + 1) {
+ margin-right: 1rem;
+ }
+ }
+ }
+ }
+ }
+}
\ No newline at end of file
diff --git a/src/pages/article/activity.vue b/src/pages/article/activity.vue
index 8173f45..b1eefbc 100644
--- a/src/pages/article/activity.vue
+++ b/src/pages/article/activity.vue
@@ -11,7 +11,7 @@
@@ -118,10 +119,10 @@
{{ form.title }}
- +
\ No newline at end of file
diff --git a/src/pages/careers/index.vue b/src/pages/careers/index.vue
index d231040..9f64922 100644
--- a/src/pages/careers/index.vue
+++ b/src/pages/careers/index.vue
@@ -374,4 +374,500 @@ export default {
transition: 0.3s;
}
}
+
+@media (min-width: 280px) and (max-width: 1200px) {
+ .wrap {
+ /deep/ .el-carousel {
+ height: 15rem;
+ .el-carousel__container {
+ height: 15rem;
+ }
+ img {
+ height: 15rem;
+ }
+ }
+ }
+ .block {
+ padding: 50px 0;
+ .inner {
+ width: 95%;
+ margin: 0 auto;
+ .card {
+ flex-direction: column;
+ li {
+ margin-top: 20px;
+ width: 100%;
+ height: 27rem;
+ }
+ }
+ .people {
+ li {
+ padding: 200px 20px 30px;
+ .left {
+ width: 100%;
+ }
+ .pic {
+ top: -60px;
+ right: 13px;
+ width: 60%;
+ height: 12.5rem;
+ }
+ }
+ }
+ }
+ }
+ .shows {
+ li {
+ flex-direction: column;
+ align-items: flex-start;
+ height: 16rem;
+ .left {
+ padding: 10px;
+ h6 {
+ font-size: 1.5rem;
+ }
+ .sub {
+ margin: 0.5rem;
+ font-size: 1rem;
+ }
+ .des {
+ margin-bottom: 1.25rem;
+ }
+ .icon {
+ width: 3.5rem;
+ height: 3.5rem;
+ }
+ }
+ }
+ }
+}
+@media (max-width: 320px) {
+ .wrap {
+ /deep/ .el-carousel {
+ height: 12rem !important;
+ }
+ /deep/ .el-carousel__container {
+ height: 12rem !important;
+ }
+ /deep/ .el-carousel__item {
+ height: 12rem !important;
+ }
+ }
+ .banner-item {
+ img {
+ height: 12rem !important;
+ }
+ .banner-name {
+ font-size: 1.5rem;
+ line-height: 1rem;
+ left: 2rem;
+ bottom: 2rem;
+ }
+ }
+ .block {
+ padding: 1.25rem 0;
+ .inner {
+ .card {
+ li {
+ flex: none;
+ height: 25rem;
+ .pic {
+ height: 25rem;
+ }
+ }
+ }
+ .people {
+ li {
+ padding: 10rem 1.25rem 1.5rem;
+ .pic {
+ top: -40px;
+ height: auto;
+ }
+ }
+ }
+ }
+ }
+ .shows {
+ li {
+ height: auto;
+ .left {
+ h6 {
+ font-size: 1rem;
+ }
+ .sub {
+ font-size: 0.9rem;
+ }
+ .des {
+ font-size: 0.88rem;
+ margin-bottom: 0.5rem;
+ }
+ .icon {
+ width: 2rem;
+ height: 2rem;
+ }
+ }
+ }
+ }
+}
+@media (min-width: 320px) and (max-width: 375px) {
+ .wrap {
+ /deep/ .el-carousel {
+ height: 12rem !important;
+ }
+ /deep/ .el-carousel__container {
+ height: 12rem !important;
+ }
+ /deep/ .el-carousel__item {
+ height: 12rem !important;
+ }
+ }
+ .banner-item {
+ img {
+ height: 12rem !important;
+ }
+ .banner-name {
+ font-size: 1.5rem;
+ line-height: 1rem;
+ left: 2rem;
+ bottom: 2rem;
+ }
+ }
+ .block {
+ padding: 1.25rem 0;
+ .inner {
+ .card {
+ li {
+ flex: none;
+ height: 25rem;
+ .pic {
+ height: 25rem;
+ }
+ }
+ }
+ .people {
+ li {
+ padding: 10rem 1.25rem 1.5rem;
+ .pic {
+ top: -40px;
+ height: auto;
+ }
+ }
+ }
+ }
+ }
+ .shows {
+ li {
+ height: auto;
+ .left {
+ h6 {
+ font-size: 1rem;
+ }
+ .sub {
+ font-size: 0.9rem;
+ }
+ .des {
+ font-size: 0.88rem;
+ margin-bottom: 0.5rem;
+ }
+ .icon {
+ width: 2rem;
+ height: 2rem;
+ }
+ }
+ }
+ }
+}
+@media (min-width: 375px) and (max-width: 480px) {
+ .wrap {
+ /deep/ .el-carousel {
+ height: 12rem !important;
+ }
+ /deep/ .el-carousel__container {
+ height: 12rem !important;
+ }
+ /deep/ .el-carousel__item {
+ height: 12rem !important;
+ }
+ }
+ .banner-item {
+ img {
+ height: 12rem !important;
+ }
+ .banner-name {
+ font-size: 1.5rem;
+ line-height: 1rem;
+ left: 2rem;
+ bottom: 2rem;
+ }
+ }
+ .block {
+ padding: 1.25rem 0;
+ .inner {
+ .card {
+ li {
+ flex: none;
+ height: 25rem;
+ .pic {
+ height: 25rem;
+ }
+ }
+ }
+ .people {
+ li {
+ padding: 10rem 1.25rem 1.5rem;
+ .pic {
+ top: -40px;
+ height: auto;
+ }
+ }
+ }
+ }
+ }
+ .shows {
+ li {
+ height: auto;
+ .left {
+ h6 {
+ font-size: 1rem;
+ }
+ .sub {
+ font-size: 0.9rem;
+ }
+ .des {
+ font-size: 0.88rem;
+ margin-bottom: 0.5rem;
+ }
+ .icon {
+ width: 2rem;
+ height: 2rem;
+ }
+ }
+ }
+ }
+}
+@media (min-width: 480px) and (max-width: 640px) {
+ .wrap {
+ /deep/ .el-carousel {
+ height: 12rem !important;
+ }
+ /deep/ .el-carousel__container {
+ height: 12rem !important;
+ }
+ /deep/ .el-carousel__item {
+ height: 12rem !important;
+ }
+ }
+ .banner-item {
+ img {
+ height: 12rem !important;
+ }
+ .banner-name {
+ font-size: 1.5rem;
+ line-height: 1rem;
+ left: 2rem;
+ bottom: 2rem;
+ }
+ }
+ .block {
+ padding: 1.25rem 0;
+ .inner {
+ .card {
+ li {
+ flex: none;
+ height: 25rem;
+ .pic {
+ height: 25rem;
+ }
+ }
+ }
+ .people {
+ li {
+ margin-bottom: 15rem;
+ padding: 10rem 1.25rem 1.5rem;
+ .pic {
+ top: -40%;
+ height: auto;
+ }
+ }
+ }
+ }
+ }
+ .shows {
+ li {
+ height: auto;
+ .left {
+ padding: 2rem 2rem;
+ }
+ }
+ }
+}
+@media (min-width: 640px) and (max-width: 768px) {
+ .wrap {
+ /deep/ .el-carousel {
+ height: 12rem !important;
+ }
+ /deep/ .el-carousel__container {
+ height: 12rem !important;
+ }
+ /deep/ .el-carousel__item {
+ height: 12rem !important;
+ }
+ }
+ .banner-item {
+ img {
+ height: 12rem !important;
+ }
+ .banner-name {
+ font-size: 1.5rem;
+ line-height: 1rem;
+ left: 2rem;
+ bottom: 2rem;
+ }
+ }
+ .block {
+ padding: 1.25rem 0;
+ .inner {
+ .card {
+ li {
+ flex: none;
+ height: 25rem;
+ .pic {
+ height: 25rem;
+ }
+ }
+ }
+ .people {
+ li {
+ padding: 10rem 1.25rem 1.5rem;
+ margin-bottom: 15rem;
+ .pic {
+ top: -60%;
+ height: auto;
+ }
+ }
+ }
+ }
+ }
+ .shows {
+ li {
+ height: auto;
+ .left {
+ padding: 3rem 2rem;
+ }
+ }
+ }
+}
+@media (min-width: 768px) and (max-width: 980px) {
+ .wrap {
+ /deep/ .el-carousel {
+ height: 12rem !important;
+ }
+ /deep/ .el-carousel__container {
+ height: 12rem !important;
+ }
+ /deep/ .el-carousel__item {
+ height: 12rem !important;
+ }
+ }
+ .banner-item {
+ img {
+ height: 12rem !important;
+ }
+ .banner-name {
+ font-size: 1.5rem;
+ line-height: 1rem;
+ left: 2rem;
+ bottom: 2rem;
+ }
+ }
+ .block {
+ padding: 1.25rem 0;
+ .inner {
+ .card {
+ li {
+ flex: none;
+ height: 25rem;
+ .pic {
+ height: 25rem;
+ }
+ }
+ }
+ .people {
+ li {
+ margin-bottom: 20rem;
+ padding: 10rem 1.25rem 1.5rem;
+
+ .pic {
+ top: -85%;
+ height: auto;
+ }
+ }
+ }
+ }
+ }
+ .shows {
+ li {
+ height: auto;
+ .left {
+ padding: 4rem 2rem;
+ }
+ }
+ }
+}
+@media (min-width: 980px) and (max-width: 1200px) {
+ .wrap {
+ /deep/ .el-carousel {
+ height: 12rem !important;
+ }
+ /deep/ .el-carousel__container {
+ height: 12rem !important;
+ }
+ /deep/ .el-carousel__item {
+ height: 12rem !important;
+ }
+ }
+ .banner-item {
+ img {
+ height: 12rem !important;
+ }
+ .banner-name {
+ font-size: 1.5rem;
+ line-height: 1rem;
+ left: 2rem;
+ bottom: 2rem;
+ }
+ }
+ .block {
+ padding: 1.25rem 0;
+ .inner {
+ .card {
+ li {
+ flex: none;
+ height: 25rem;
+ .pic {
+ height: 25rem;
+ }
+ }
+ }
+ .people {
+ li {
+ margin-bottom: 30rem;
+ padding: 10rem 1.25rem 1.5rem;
+ .pic {
+ top: -115%;
+ height: auto;
+ }
+ }
+ }
+ }
+ }
+ .shows {
+ li {
+ height: auto;
+ .left {
+ padding: 4rem 2rem;
+ }
+ }
+ }
+}
\ No newline at end of file
diff --git a/src/pages/column/index.vue b/src/pages/column/index.vue
index 927f163..cb17dcd 100644
--- a/src/pages/column/index.vue
+++ b/src/pages/column/index.vue
@@ -210,7 +210,7 @@
- {{ item.activityStartTime + ' ~ ' + item.activityEndTime }}
+ {{ item.activityStartTime }}
- {{ item.activityStartTime + ' ~ ' + item.activityEndTime }}
+ {{ item.activityStartTime }}
@@ -286,7 +286,7 @@
- {{ item.activityStartTime + ' ~ ' + item.activityEndTime }}
+ {{ item.activityStartTime }}
- {{ item.activityStartTime + ' ~ ' + item.activityEndTime }}
+ {{ item.activityStartTime }}
@@ -390,7 +390,7 @@
- {{ item.activityStartTime + ' ~ ' + item.activityEndTime }}
+ {{ item.activityStartTime }}
- {{ item.activityStartTime + ' ~ ' + item.activityEndTime }}
+ {{ item.activityStartTime }}
@@ -1177,6 +1177,7 @@ export default {
.pic {
width: 30%;
height: auto;
+ object-fit: cover;
}
}
.media {
@@ -1366,6 +1367,7 @@ export default {
}
img {
max-width: 100%;
+ object-fit: cover;
}
}
.annex {
@@ -1408,4 +1410,140 @@ export default {
color: #333;
}
}
+
+@media (max-width: 1200px) {
+ .banner {
+ height: 15rem !important;
+ img {
+ height: 15rem !important;
+ }
+ .texts {
+ top: 6rem;
+ left: 3rem;
+ }
+ }
+ .article {
+ flex-direction: column;
+ width: 90%;
+ .columns {
+ width: 40%;
+ }
+ .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:not(.news-notice) {
+ flex-direction: column;
+ align-items: flex-start;
+ padding: 1rem;
+ margin-top: 1rem;
+ .pic {
+ width: 100%;
+ margin: 10px 0;
+ }
+ }
+ .readDetail {
+ align-items: flex-start;
+ .texts {
+ width: 100%;
+ padding-left: 0;
+ }
+ }
+ }
+ .media {
+ li {
+ padding: 0;
+ }
+ }
+
+ .right {
+ width: 95%;
+ margin: 20px auto;
+ }
+ }
+}
+
+@media (max-width: 640px) {
+ .banner {
+ height: 12rem !important;
+ img {
+ height: 12rem !important;
+ }
+ .texts {
+ left: 2rem;
+ bottom: 2rem;
+ .text {
+ font-size: 1.5rem;
+ }
+ }
+ }
+ .article {
+ .contents {
+ flex-direction: column;
+ padding: 0 15px;
+ }
+ .columns,
+ .article-wrap {
+ width: 100%;
+ margin-right: 0;
+ }
+ .articles {
+ li {
+ .leftBox {
+ padding-left: 0;
+ .titleDes {
+ line-height: 1.368rem;
+ }
+ }
+ }
+ }
+ .media {
+ margin-left: 0;
+ li {
+ width: calc(50% - 20px);
+ margin-right: 20px;
+ &:nth-child(2n) {
+ margin-right: 0;
+ }
+ }
+ }
+ }
+ .forms {
+ .switch {
+ width: 100%;
+ flex-direction: column;
+ margin-right: 0;
+ li {
+ width: 90%;
+ margin: 0 auto;
+ margin-top: 10px;
+ }
+ }
+ }
+}
diff --git a/src/pages/contactUs/index.vue b/src/pages/contactUs/index.vue
index 51753bc..72f1da7 100644
--- a/src/pages/contactUs/index.vue
+++ b/src/pages/contactUs/index.vue
@@ -197,4 +197,11 @@ export default {
background-color: #1583ff;
}
}
+@media (max-width: 1200px) {
+ .inner {
+ .contact {
+ padding: 3rem 1rem;
+ }
+ }
+}
diff --git a/src/pages/devHistory/index.vue b/src/pages/devHistory/index.vue
index 61ed9c0..36f5400 100644
--- a/src/pages/devHistory/index.vue
+++ b/src/pages/devHistory/index.vue
@@ -92,4 +92,57 @@ export default {
overflow: auto;
}
}
+@media (max-width: 1200px) {
+ .tab-content {
+ width: 90%;
+ span {
+ font-size: 1.35rem;
+ }
+ }
+
+ .block {
+ padding: 1.25rem 0;
+ .inner {
+ width: 90%;
+ h2 {
+ font-size: 1.5rem;
+ }
+ p {
+ font-size: 1rem;
+ margin: 10px 0 1.25rem;
+ }
+ .event {
+ flex-direction: column;
+ .time {
+ width: 100%;
+ li {
+ width: 100%;
+ justify-content: flex-start;
+ }
+ }
+ .right {
+ margin-top: 1.25rem;
+ width: 100%;
+ h6 {
+ font-size: 2rem;
+ }
+ .list {
+ li {
+ padding: 1.25rem;
+ flex-direction: column;
+ align-items: flex-start;
+ .texts {
+ width: 100%;
+ }
+ .pic {
+ width: 100%;
+ height: auto;
+ }
+ }
+ }
+ }
+ }
+ }
+ }
+}
diff --git a/src/pages/deviceIntroBeam/index.vue b/src/pages/deviceIntroBeam/index.vue
index 56a6aac..6fd0588 100644
--- a/src/pages/deviceIntroBeam/index.vue
+++ b/src/pages/deviceIntroBeam/index.vue
@@ -228,4 +228,62 @@ $banner-height: 21.6rem;
border-left: 4px solid #1583ff;
}
}
+
+@media (max-width: 1200px) {
+ .banner {
+ height: 12rem;
+ padding: 6rem 0 0 2rem;
+ }
+ .beamBox {
+ .imgText {
+ bottom: 4rem;
+ right: 4rem;
+ }
+ }
+ .share {
+ width: 90%;
+ padding-left: 0;
+ margin: 0 auto;
+ }
+ .beamBox {
+ display: flex;
+ flex-direction: column;
+ position: relative;
+
+ .left {
+ width: 100%;
+ }
+ .des {
+ -webkit-line-clamp: 100;
+ }
+ .pic {
+ margin-top: 10px;
+ width: 100%;
+ height: auto;
+ }
+ }
+ .intro {
+ width: 90%;
+ padding: 1rem 0;
+ height: auto;
+ .intro-inner {
+ flex-direction: column;
+ }
+ .pic {
+ width: 80%;
+ }
+ .des {
+ width: 80%;
+ height: auto;
+ padding: 2rem 0 0;
+ -webkit-line-clamp: 100;
+ }
+ }
+ .unit {
+ width: 95%;
+ img {
+ width: 100%;
+ }
+ }
+}
\ No newline at end of file
diff --git a/src/pages/deviceIntroLayout/index.vue b/src/pages/deviceIntroLayout/index.vue
index 468d3ae..d8192bb 100644
--- a/src/pages/deviceIntroLayout/index.vue
+++ b/src/pages/deviceIntroLayout/index.vue
@@ -193,4 +193,79 @@ $banner-height: 21.6rem;
border-left: 4px solid #1583ff;
}
}
+
+@media (max-width: 1400px) {
+ .share {
+ .card {
+ position: relative;
+ margin-left: -2.5%;
+ }
+ .inner {
+ max-width: none;
+ width: 95%;
+ .texts {
+ position: static;
+ display: flex;
+ flex-direction: column;
+ align-items: flex-end;
+ margin-left: 15%;
+ .des {
+ width: 100%;
+ -webkit-line-clamp: 100;
+ }
+ }
+ }
+ .pic {
+ width: 50%;
+ margin-top: 20px;
+ }
+ }
+
+ .bg {
+ width: 100%;
+ }
+ .intro {
+ height: 36rem;
+ margin-top: 0;
+ .pic {
+ width: 100%;
+ left: 0;
+ top: 6%;
+ }
+ }
+ .unit {
+ width: 95%;
+ img {
+ width: 100%;
+ }
+ }
+}
+@media (max-width: 980px) {
+ .share {
+ .pic {
+ width: 80%;
+ }
+ }
+}
+@media (max-width: 640px) {
+ .share {
+ .inner {
+ .texts {
+ margin: 0 auto;
+ }
+ }
+ .des {
+ margin-right: 0;
+ }
+ }
+ .intro {
+ height: auto;
+ .bg,
+ .pic {
+ position: static;
+ width: 100%;
+ height: auto;
+ }
+ }
+}
\ No newline at end of file
diff --git a/src/pages/deviceIntroLinear/index.vue b/src/pages/deviceIntroLinear/index.vue
index 002f932..9cc5cfd 100644
--- a/src/pages/deviceIntroLinear/index.vue
+++ b/src/pages/deviceIntroLinear/index.vue
@@ -244,4 +244,77 @@ $banner-height: 21.6rem;
height: 85%;
}
}
+
+@media (min-width: 280px) and (max-width: 620px) {
+ .inner {
+ flex-direction: column;
+
+ .left,
+ .right {
+ width: 50%;
+ margin: 20px auto;
+ }
+ }
+
+ .history {
+ .left {
+ .line {
+ width: 100%;
+ }
+ }
+ }
+ .block {
+ padding: 50px 0;
+ .inner {
+ .texts {
+ .bg {
+ width: 100%;
+ height: 200px;
+ margin: -50px 0px 0 0;
+ }
+ }
+ }
+ }
+}
+
+@media (max-width: 1200px) {
+ .banner {
+ height: 12rem;
+ padding: 6rem 0 0 2rem;
+ }
+
+ .history {
+ .inner {
+ width: 95%;
+ }
+ .texts {
+ flex-direction: column;
+ }
+ .bg {
+ margin: 0 auto;
+ }
+ }
+
+ .inner {
+ flex-direction: column;
+ width: 95%;
+ .left,
+ .right {
+ width: 95%;
+ margin: 20px auto;
+ }
+ }
+ .intro {
+ img {
+ height: auto;
+ }
+ }
+}
+@media (max-width: 980px) {
+ .history {
+ .bg {
+ width: 100%;
+ }
+ }
+}
diff --git a/src/pages/edu/index.vue b/src/pages/edu/index.vue
index 665ae7c..1cd578d 100644
--- a/src/pages/edu/index.vue
+++ b/src/pages/edu/index.vue
@@ -199,4 +199,505 @@ export default {
line-height: 32px;
}
}
+
+@media (max-width: 1520px) {
+ .list {
+ .pic {
+ width: 45%;
+ }
+ li:nth-child(odd) {
+ .texts {
+ width: 50%;
+ }
+ }
+ }
+}
+@media (min-width: 280px) and (max-width: 1200px) {
+ .wrap {
+ /deep/ .el-carousel {
+ height: 18rem;
+ .el-carousel__container {
+ height: 18rem;
+ }
+ img {
+ height: 18rem;
+ }
+ }
+ }
+ .banner-item .banner-name {
+ font-size: 1.5rem;
+ bottom: 5.25rem;
+ left: 14.125rem;
+ line-height: 2rem;
+ }
+ .block {
+ padding: 50px 0;
+ .inner {
+ width: 95%;
+ margin: 0 auto;
+ .b-title {
+ margin-bottom: 30px;
+ }
+ .intro {
+ margin-bottom: 30px;
+ }
+ .block-pic {
+ height: 15rem;
+ }
+ }
+ .list {
+ li {
+ margin-top: 20px;
+ .pic {
+ width: 100%;
+ height: 25rem;
+ }
+ .texts {
+ padding: 10px;
+ width: 70%;
+ top: 2rem;
+ height: auto;
+ left: 24%;
+ }
+ }
+ }
+ }
+}
+
+@media (max-width: 320px) {
+ .wrap {
+ /deep/ .el-carousel {
+ height: 12rem !important;
+ }
+ /deep/ .el-carousel__container {
+ height: 12rem !important;
+ }
+ /deep/ .el-carousel__item {
+ height: 12rem !important;
+ }
+ }
+ .banner-item {
+ img {
+ height: 12rem !important;
+ }
+ .banner-name {
+ font-size: 1rem;
+ line-height: 1.5rem;
+ left: 2rem;
+ bottom: 2rem;
+ }
+ }
+ .block {
+ padding: 1.25rem 0;
+ .inner {
+ .intro {
+ margin-bottom: 1rem;
+ }
+ .b-title {
+ font-size: 1.5rem;
+ }
+ .block-pic {
+ height: auto;
+ }
+ .list {
+ .wow {
+ .pic {
+ height: auto;
+ }
+ .texts {
+ h6 {
+ font-size: 1rem;
+ }
+ .sub {
+ font-size: 0.85rem;
+ line-height: 0.85rem;
+ margin-top: 0.5rem;
+ }
+ .des {
+ font-size: 0.85rem;
+ line-height: 0.85rem;
+ margin-top: 0.5rem;
+ }
+ }
+ }
+ }
+ }
+ }
+}
+@media (min-width: 320px) and (max-width: 375px) {
+ .wrap {
+ /deep/ .el-carousel {
+ height: 12rem !important;
+ }
+ /deep/ .el-carousel__container {
+ height: 12rem !important;
+ }
+ /deep/ .el-carousel__item {
+ height: 12rem !important;
+ }
+ }
+ .banner-item {
+ img {
+ height: 12rem !important;
+ }
+ .banner-name {
+ font-size: 1rem;
+ line-height: 1.5rem;
+ left: 2rem;
+ bottom: 2rem;
+ }
+ }
+ .block {
+ padding: 1.25rem 0;
+ .inner {
+ .intro {
+ margin-bottom: 1rem;
+ }
+ .b-title {
+ font-size: 1.5rem;
+ }
+ .block-pic {
+ height: auto;
+ }
+ .list {
+ .wow {
+ .pic {
+ height: auto;
+ }
+ .texts {
+ top: 5rem;
+ h6 {
+ font-size: 1.5rem;
+ }
+ .sub {
+ font-size: 1.05rem;
+ line-height: 1.05rem;
+ margin-top: 0.5rem;
+ }
+ .des {
+ font-size: 1.05rem;
+ line-height: 1.05rem;
+ margin-top: 0.5rem;
+ }
+ }
+ }
+ }
+ }
+ }
+}
+@media (min-width: 375px) and (max-width: 480px) {
+ .wrap {
+ /deep/ .el-carousel {
+ height: 12rem !important;
+ }
+ /deep/ .el-carousel__container {
+ height: 12rem !important;
+ }
+ /deep/ .el-carousel__item {
+ height: 12rem !important;
+ }
+ }
+ .banner-item {
+ img {
+ height: 12rem !important;
+ }
+ .banner-name {
+ font-size: 1rem;
+ line-height: 1.5rem;
+ left: 2rem;
+ bottom: 2rem;
+ }
+ }
+ .block {
+ padding: 1.25rem 0;
+ .inner {
+ .intro {
+ margin-bottom: 1rem;
+ }
+ .b-title {
+ font-size: 1.5rem;
+ }
+ .block-pic {
+ height: auto;
+ }
+ .list {
+ .wow {
+ .pic {
+ height: auto;
+ }
+ .texts {
+ top: 5rem;
+ h6 {
+ font-size: 1.8rem;
+ }
+ .sub {
+ font-size: 1.25rem;
+ line-height: 1.25rem;
+ margin-top: 0.5rem;
+ }
+ .des {
+ font-size: 1.25rem;
+ line-height: 1.25rem;
+ margin-top: 0.5rem;
+ }
+ }
+ }
+ }
+ }
+ }
+}
+@media (min-width: 480px) and (max-width: 640px) {
+ .wrap {
+ /deep/ .el-carousel {
+ height: 12rem !important;
+ }
+ /deep/ .el-carousel__container {
+ height: 12rem !important;
+ }
+ /deep/ .el-carousel__item {
+ height: 12rem !important;
+ }
+ }
+ .banner-item {
+ img {
+ height: 12rem !important;
+ }
+ .banner-name {
+ font-size: 1rem;
+ line-height: 1.5rem;
+ left: 2rem;
+ bottom: 2rem;
+ }
+ }
+ .block {
+ padding: 1.25rem 0;
+ .inner {
+ .intro {
+ margin-bottom: 1rem;
+ }
+ .b-title {
+ font-size: 1.5rem;
+ }
+ .block-pic {
+ height: auto;
+ }
+ .list {
+ .wow {
+ .pic {
+ height: auto;
+ }
+ .texts {
+ top: 5rem;
+ padding: 2rem;
+ h6 {
+ font-size: 2rem;
+ }
+ .sub {
+ font-size: 1.55rem;
+ line-height: 1.55rem;
+ margin-top: 0.5rem;
+ }
+ .des {
+ font-size: 1.55rem;
+ line-height: 1.55rem;
+ margin-top: 0.5rem;
+ }
+ }
+ }
+ }
+ }
+ }
+}
+@media (min-width: 640px) and (max-width: 768px) {
+ .wrap {
+ /deep/ .el-carousel {
+ height: 12rem !important;
+ }
+ /deep/ .el-carousel__container {
+ height: 12rem !important;
+ }
+ /deep/ .el-carousel__item {
+ height: 12rem !important;
+ }
+ }
+ .banner-item {
+ img {
+ height: 12rem !important;
+ }
+ .banner-name {
+ font-size: 1rem;
+ line-height: 1.5rem;
+ left: 2rem;
+ bottom: 2rem;
+ }
+ }
+ .block {
+ padding: 1.25rem 0;
+ .inner {
+ .intro {
+ margin-bottom: 1rem;
+ }
+ .b-title {
+ font-size: 1.5rem;
+ }
+ .block-pic {
+ height: auto;
+ }
+ .list {
+ .wow {
+ .pic {
+ width: 50%;
+ height: auto;
+ }
+ .texts {
+ top: 2rem;
+ left: 30%;
+ padding: 1.5rem;
+ h6 {
+ font-size: 2rem;
+ }
+ .sub {
+ font-size: 1.55rem;
+ line-height: 1.55rem;
+ margin-top: 0.5rem;
+ }
+ .des {
+ font-size: 1.55rem;
+ line-height: 1.55rem;
+ margin-top: 0.5rem;
+ }
+ }
+ }
+ }
+ }
+ }
+}
+@media (min-width: 768px) and (max-width: 980px) {
+ .wrap {
+ /deep/ .el-carousel {
+ height: 12rem !important;
+ }
+ /deep/ .el-carousel__container {
+ height: 12rem !important;
+ }
+ /deep/ .el-carousel__item {
+ height: 12rem !important;
+ }
+ }
+ .banner-item {
+ img {
+ height: 12rem !important;
+ }
+ .banner-name {
+ font-size: 1rem;
+ line-height: 1.5rem;
+ left: 2rem;
+ bottom: 2rem;
+ }
+ }
+ .block {
+ padding: 1.25rem 0;
+ .inner {
+ .intro {
+ margin-bottom: 1rem;
+ }
+ .b-title {
+ font-size: 1.5rem;
+ }
+ .block-pic {
+ height: auto;
+ }
+ .list {
+ .wow {
+ .pic {
+ width: 50%;
+ height: auto;
+ }
+ .texts {
+ top: 5rem;
+ left: 30%;
+ padding: 1.5rem;
+ h6 {
+ font-size: 2rem;
+ }
+ .sub {
+ font-size: 1.55rem;
+ line-height: 1.55rem;
+ margin-top: 0.5rem;
+ }
+ .des {
+ font-size: 1.55rem;
+ line-height: 1.55rem;
+ margin-top: 0.5rem;
+ }
+ }
+ }
+ }
+ }
+ }
+}
+@media (min-width: 980px) and (max-width: 1200px) {
+ .wrap {
+ /deep/ .el-carousel {
+ height: 12rem !important;
+ }
+ /deep/ .el-carousel__container {
+ height: 12rem !important;
+ }
+ /deep/ .el-carousel__item {
+ height: 12rem !important;
+ }
+ }
+ .banner-item {
+ img {
+ height: 12rem !important;
+ }
+ .banner-name {
+ font-size: 1rem;
+ line-height: 1.5rem;
+ left: 2rem;
+ bottom: 2rem;
+ }
+ }
+ .block {
+ padding: 1.25rem 0;
+ .inner {
+ .intro {
+ margin-bottom: 1rem;
+ }
+ .b-title {
+ font-size: 1.5rem;
+ }
+ .block-pic {
+ height: auto;
+ }
+ .list {
+ .wow {
+ .pic {
+ width: 50%;
+ height: auto;
+ }
+ .texts {
+ top: 5rem;
+ left: 30%;
+ padding: 1.5rem;
+ h6 {
+ font-size: 2rem;
+ }
+ .sub {
+ font-size: 1.55rem;
+ line-height: 1.55rem;
+ margin-top: 0.5rem;
+ }
+ .des {
+ font-size: 1.55rem;
+ line-height: 1.55rem;
+ margin-top: 0.5rem;
+ }
+ }
+ }
+ }
+ }
+ }
+}
\ No newline at end of file
diff --git a/src/pages/estate/event/index.vue b/src/pages/estate/event/index.vue
index 370cba2..4bd58ca 100644
--- a/src/pages/estate/event/index.vue
+++ b/src/pages/estate/event/index.vue
@@ -191,4 +191,51 @@ export default {
}
}
}
+
+@media (max-width: 1200px) {
+ .tab-content {
+ padding: 20px 0;
+ .org {
+ width: 100%;
+ padding: 15px;
+ flex-direction: column;
+ .left {
+ width: 100%;
+ }
+ }
+ }
+ .block {
+ padding: 2rem 0;
+ .inner {
+ width: 90%;
+ .event {
+ flex-direction: column;
+ .time {
+ width: 100%;
+ li {
+ width: 100%;
+ justify-content: flex-start;
+ }
+ }
+ .right {
+ width: 100%;
+ .list {
+ li {
+ padding: 1.25rem;
+ flex-direction: column;
+ .texts {
+ width: 100%;
+ }
+ .pic {
+ width: 100%;
+ height: auto;
+ margin-top: 1rem;
+ }
+ }
+ }
+ }
+ }
+ }
+ }
+}
\ No newline at end of file
diff --git a/src/pages/estate/index/index.vue b/src/pages/estate/index/index.vue
index ac2e917..2024d52 100644
--- a/src/pages/estate/index/index.vue
+++ b/src/pages/estate/index/index.vue
@@ -1,6 +1,7 @@
@@ -96,5 +97,24 @@ export default {
max-width: 85%;
margin: 0 auto;
text-align: center;
+ img {
+ object-fit: cover;
+ }
+}
+@media (max-width: 1200px) {
+ .tab-content {
+ padding: 20px 0;
+ .org {
+ width: 100%;
+ padding: 15px;
+ flex-direction: column;
+ .left {
+ width: 100%;
+ }
+ img {
+ display: none;
+ }
+ }
+ }
}
\ No newline at end of file
diff --git a/src/pages/estate/survey/index.vue b/src/pages/estate/survey/index.vue
index 17ba536..0eceae8 100644
--- a/src/pages/estate/survey/index.vue
+++ b/src/pages/estate/survey/index.vue
@@ -95,4 +95,23 @@ export default {
.lg-bg {
width: 40%;
}
+@media (max-width: 1300px) {
+ .tab-content {
+ padding: 20px 0;
+ }
+ .lg-bg {
+ width: 100%;
+ }
+ .survey {
+ width: 95%;
+ padding: 80px 86px 29px 47%;
+ margin-bottom: 2rem;
+ }
+}
+@media (max-width: 768px) {
+ .survey {
+ padding: 30px;
+ background: none;
+ }
+}
\ No newline at end of file
diff --git a/src/pages/exp/index.vue b/src/pages/exp/index.vue
index 65dc469..ea4ac9e 100644
--- a/src/pages/exp/index.vue
+++ b/src/pages/exp/index.vue
@@ -125,6 +125,7 @@ export default {
@import '../../styles/page/page.scss';
$banner-height: 21.6rem;
.wrap {
+ padding-bottom: 70px;
/deep/ .el-carousel {
height: $banner-height;
.el-carousel__container {
@@ -230,4 +231,329 @@ $banner-height: 21.6rem;
width: 28%;
}
}
+
+@media (min-width: 280px) and (max-width: 768px) {
+ .wrap {
+ /deep/ .el-carousel {
+ height: 15rem;
+ .el-carousel__container {
+ height: 15rem;
+ }
+ img {
+ height: 15rem;
+ }
+ }
+ }
+ .station {
+ .pic {
+ height: 20rem;
+ }
+ }
+ .list {
+ li {
+ height: 20rem;
+ h6 {
+ top: 5rem;
+ }
+ }
+ }
+}
+@media (max-width: 320px) {
+ .wrap {
+ /deep/ .el-carousel {
+ height: 13rem !important;
+ }
+ /deep/ .el-carousel__item {
+ height: 13rem !important;
+ }
+ /deep/ .el-carousel__container {
+ height: 13rem !important;
+ }
+ }
+ .banner-item {
+ img {
+ height: 13rem !important;
+ }
+ .banner-name {
+ padding: 7rem 0 0 1rem;
+ font-size: 1.5rem;
+ }
+ }
+ .block {
+ padding: 2rem 0;
+ .inner {
+ width: 90%;
+ .text-center {
+ .pic {
+ width: 100%;
+ height: auto;
+ }
+ }
+ }
+ }
+ .list {
+ width: 80%;
+ margin: 0 auto;
+ li {
+ margin-top: 1rem;
+ width: 100% !important;
+ }
+ }
+}
+@media (min-width: 320px) and (max-width: 375px) {
+ .wrap {
+ /deep/ .el-carousel {
+ height: 13rem !important;
+ }
+ /deep/ .el-carousel__item {
+ height: 13rem !important;
+ }
+ /deep/ .el-carousel__container {
+ height: 13rem !important;
+ }
+ }
+ .banner-item {
+ img {
+ height: 13rem !important;
+ }
+ .banner-name {
+ padding: 7rem 0 0 1rem;
+ font-size: 1.5rem;
+ }
+ }
+ .block {
+ padding: 2rem 0;
+ .inner {
+ width: 90%;
+ .text-center {
+ .pic {
+ width: 100%;
+ height: auto;
+ }
+ }
+ }
+ }
+ .list {
+ width: 80%;
+ margin: 0 auto;
+ li {
+ margin-top: 1rem;
+ width: 100% !important;
+ }
+ }
+}
+@media (min-width: 375px) and (max-width: 480px) {
+ .wrap {
+ /deep/ .el-carousel {
+ height: 13rem !important;
+ }
+ /deep/ .el-carousel__item {
+ height: 13rem !important;
+ }
+ /deep/ .el-carousel__container {
+ height: 13rem !important;
+ }
+ }
+ .banner-item {
+ img {
+ height: 13rem !important;
+ }
+ .banner-name {
+ padding: 7rem 0 0 1rem;
+ font-size: 1.5rem;
+ }
+ }
+ .block {
+ padding: 2rem 0;
+ .inner {
+ width: 90%;
+ .text-center {
+ .pic {
+ width: 100%;
+ height: auto;
+ }
+ }
+ }
+ }
+ .list {
+ width: 80%;
+ margin: 0 auto;
+ li {
+ margin-top: 1rem;
+ width: 100% !important;
+ }
+ }
+}
+@media (min-width: 480px) and (max-width: 640px) {
+ .wrap {
+ /deep/ .el-carousel {
+ height: 13rem !important;
+ }
+ /deep/ .el-carousel__item {
+ height: 13rem !important;
+ }
+ /deep/ .el-carousel__container {
+ height: 13rem !important;
+ }
+ }
+ .banner-item {
+ img {
+ height: 13rem !important;
+ }
+ .banner-name {
+ padding: 7rem 0 0 1rem;
+ font-size: 1.5rem;
+ }
+ }
+ .block {
+ padding: 2rem 0;
+ .inner {
+ width: 90%;
+ .text-center {
+ .pic {
+ width: 100%;
+ height: auto;
+ }
+ }
+ }
+ }
+ .list {
+ width: 80%;
+ margin: 0 auto;
+ li {
+ margin-top: 1rem;
+ width: 100% !important;
+ }
+ }
+}
+@media (min-width: 640px) and (max-width: 768px) {
+ .wrap {
+ /deep/ .el-carousel {
+ height: 13rem !important;
+ }
+ /deep/ .el-carousel__item {
+ height: 13rem !important;
+ }
+ /deep/ .el-carousel__container {
+ height: 13rem !important;
+ }
+ }
+ .banner-item {
+ img {
+ height: 13rem !important;
+ }
+ .banner-name {
+ padding: 7rem 0 0 1rem;
+ font-size: 1.5rem;
+ }
+ }
+ .block {
+ padding: 2rem 0;
+ .inner {
+ width: 90%;
+ .text-center {
+ .pic {
+ width: 100%;
+ height: auto;
+ }
+ }
+ }
+ }
+ .list {
+ width: 80%;
+ margin: 0 auto;
+ li {
+ margin-top: 1rem;
+ width: 100% !important;
+ }
+ }
+}
+@media (min-width: 768px) and (max-width: 980px) {
+ .wrap {
+ /deep/ .el-carousel {
+ height: 13rem !important;
+ }
+ /deep/ .el-carousel__item {
+ height: 13rem !important;
+ }
+ /deep/ .el-carousel__container {
+ height: 13rem !important;
+ }
+ }
+ .banner-item {
+ img {
+ height: 13rem !important;
+ }
+ .banner-name {
+ padding: 7rem 0 0 1rem;
+ font-size: 1.5rem;
+ }
+ }
+ .block {
+ padding: 2rem 0;
+ .inner {
+ width: 90%;
+ .text-center {
+ .pic {
+ width: 100%;
+ height: auto;
+ }
+ }
+ }
+ }
+ .list {
+ display: flex;
+ width: 100%;
+ li {
+ width: 25%;
+ }
+ }
+ .item3 {
+ width: 50% !important;
+ }
+}
+@media (min-width: 980px) and (max-width: 1200px) {
+ .wrap {
+ /deep/ .el-carousel {
+ height: 13rem !important;
+ }
+ /deep/ .el-carousel__item {
+ height: 13rem !important;
+ }
+ /deep/ .el-carousel__container {
+ height: 13rem !important;
+ }
+ }
+ .banner-item {
+ img {
+ height: 13rem !important;
+ }
+ .banner-name {
+ padding: 7rem 0 0 1rem;
+ font-size: 1.5rem;
+ }
+ }
+ .block {
+ padding: 2rem 0;
+ .inner {
+ width: 90%;
+ .text-center {
+ .pic {
+ width: 100%;
+ height: auto;
+ }
+ }
+ }
+ }
+ .list {
+ display: flex;
+ width: 100%;
+ li {
+ width: 25%;
+ }
+ }
+ .item3 {
+ width: 50% !important;
+ }
+}
\ No newline at end of file
diff --git a/src/pages/governance/index.vue b/src/pages/governance/index.vue
index e50284c..d866942 100644
--- a/src/pages/governance/index.vue
+++ b/src/pages/governance/index.vue
@@ -142,6 +142,7 @@ export default {
}
.bg {
margin: -122px 0 0 0;
+ object-fit: cover;
}
}
.cards {
@@ -215,6 +216,45 @@ export default {
.pic {
width: 48%;
height: 300px;
+ object-fit: cover;
+ }
+}
+
+@media (max-width: 1200px) {
+ .history {
+ .texts {
+ flex-direction: column;
+ }
+ .left {
+ width: 90%;
+ }
+ .bg {
+ width: 100%;
+ margin-top: 2rem;
+ }
+ }
+ .cards {
+ ul {
+ width: 98%;
+ }
+ li {
+ width: 100%;
+ margin: 0 0 20px 0;
+ }
+ }
+}
+@media (max-width: 640px) {
+ .committee {
+ .inner {
+ flex-direction: column;
+ }
+ .left {
+ width: 100%;
+ }
+ .pic {
+ width: 100%;
+ margin-top: 2rem;
+ }
}
}
diff --git a/src/pages/home/index.vue b/src/pages/home/index.vue
index 32e18bd..3600f32 100644
--- a/src/pages/home/index.vue
+++ b/src/pages/home/index.vue
@@ -35,7 +35,8 @@
-
@@ -265,7 +266,7 @@ export default {
console.log("🚀 ~ file: index.vue ~ line 138 ~ this.$post ~ this.modules", json)
// 获取文章列表
- if (json[2].form.column.length) {
+ if (json[2].form.column && json[2].form.column.length) {
const { column, articleNum } = json[2].form
this.$post(`${this.api.queryArticlesByColumnType}?columnId=${column[column.length - 1]}`).then(({ data }) => {
this.articles = Util.removeTag(data.slice(0, articleNum || 7))
@@ -273,13 +274,13 @@ export default {
this.carouselInterval()
}).catch(err => { })
}
- if (json[6].form.column.length) {
+ if (json[6].form.column && json[6].form.column.length) {
const { column, articleNum } = json[6].form
this.$post(`${this.api.queryArticlesByColumnType}?columnId=${column[column.length - 1]}`).then(({ data }) => {
this.articles2 = Util.removeTag(data.slice(0, articleNum || 4))
}).catch(err => { })
}
- if (json[8].form.column.length) {
+ if (json[8].form.column && json[8].form.column.length) {
const { column, articleNum } = json[8].form
this.$post(`${this.api.queryArticlesByColumnType}?columnId=${column[column.length - 1]}`).then(({ data }) => {
this.articles3 = Util.removeTag(data.slice(0, articleNum || 4))
@@ -337,6 +338,7 @@ export default {
.el-carousel__item,
img {
height: 100vh;
+ object-fit: cover;
}
}
.title {
@@ -382,6 +384,7 @@ export default {
cursor: pointer;
.pic {
transition: 0.5s;
+ object-fit: cover;
&:hover {
transform: scale(1.3);
}
@@ -457,6 +460,7 @@ export default {
.pic {
width: 100%;
// height: 259px;
+ object-fit: cover;
}
.texts {
padding: 40px 30px;
@@ -500,6 +504,7 @@ export default {
.pic {
width: 50%;
min-height: 465px;
+ object-fit: cover;
}
}
}
@@ -627,6 +632,7 @@ export default {
width: 100%;
height: 100%;
transition: 0.5s;
+ object-fit: cover;
}
&:hover {
.pic {
@@ -700,4 +706,118 @@ export default {
}
}
}
+
+@media (max-width: 1200px) {
+ .sfel-banner {
+ flex-direction: column;
+ .newBox {
+ width: 100% !important;
+ }
+ .right {
+ margin-top: 10px;
+ width: 100%;
+ height: 410px;
+ }
+ }
+ .card {
+ flex-direction: column;
+ li {
+ width: 100%;
+ margin-top: 20px;
+ }
+ }
+ .shop-shows {
+ flex-direction: column;
+ .left {
+ width: 100%;
+ }
+ .right {
+ width: 100%;
+ margin-top: 20px;
+ }
+ }
+ .shows {
+ flex-direction: column;
+ .left {
+ width: 100%;
+ }
+ .card-list {
+ width: 100%;
+ margin-top: 20px;
+ li {
+ flex-direction: column;
+ .pic {
+ width: 100% !important;
+ margin-right: 0;
+ }
+ .texts {
+ margin-top: 20px;
+ width: 100%;
+ }
+ }
+ }
+ }
+ .talent {
+ .shows {
+ .left {
+ width: 100%;
+ margin-bottom: 20px;
+ }
+ .pic {
+ width: 100%;
+ min-height: 0;
+ }
+ }
+ }
+ .media-wrap {
+ flex-direction: column;
+ .left {
+ width: 100%;
+ }
+ .right {
+ width: 100%;
+ margin-top: 20px;
+ }
+ }
+ .news {
+ flex-direction: column;
+ li {
+ margin-top: 30px;
+ width: 100%;
+ }
+ }
+ .slide,
+ .list {
+ flex-direction: column;
+ .texts,
+ .img-wrap {
+ width: 100%;
+ }
+ }
+ .list {
+ li {
+ width: 100% !important;
+ margin-top: 20px;
+ }
+ }
+ .slides {
+ div {
+ flex: 1;
+ }
+ }
+ .program {
+ .list {
+ li {
+ background-size: cover;
+ }
+ }
+ }
+ #part6 {
+ .slide {
+ .texts {
+ height: 430px;
+ }
+ }
+ }
+}
\ No newline at end of file
diff --git a/src/pages/estate/location/index.vue b/src/pages/estate/location/index.vue
index 71adce5..face7db 100644
--- a/src/pages/estate/location/index.vue
+++ b/src/pages/estate/location/index.vue
@@ -142,4 +142,22 @@ export default {
-webkit-line-clamp: 8;
}
}
+@media (max-width: 1200px) {
+ .tab-content {
+ width: 80%;
+ padding: 1.25rem 0;
+ .item {
+ padding: 0.85rem;
+ flex-direction: column !important;
+ .texts {
+ margin-top: 0.5rem;
+ width: 100%;
+ padding: 0;
+ }
+ }
+ .img-wrap {
+ height: auto;
+ }
+ }
+}
\ No newline at end of file
diff --git a/src/pages/estate/orgSetup/index.vue b/src/pages/estate/orgSetup/index.vue
index 68ed724..f6a4afa 100644
--- a/src/pages/estate/orgSetup/index.vue
+++ b/src/pages/estate/orgSetup/index.vue
@@ -30,7 +30,8 @@
alt="">
- ![]()
{{ modules[2].form.title }}
{{ modules[2].form.des }}
-
@@ -118,10 +119,10 @@
- 
\ No newline at end of file
diff --git a/src/pages/iasf/index.vue b/src/pages/iasf/index.vue
index bd8bd66..7eb9d56 100644
--- a/src/pages/iasf/index.vue
+++ b/src/pages/iasf/index.vue
@@ -1,5 +1,6 @@
+
@import url(../../plugins/wow/animate.css);
@import '../../styles/page/page.scss';
-$bannerHeight: calc(100vw / 2.03);
+$bannerHeight: 100vh;
$bannerMh: 800px;
.carousel {
z-index: 1;
@@ -554,14 +555,12 @@ $bannerMh: 800px;
left: 0;
width: 100%;
height: $bannerHeight;
- min-height: $bannerMh;
img {
height: $bannerHeight;
- min-height: $bannerMh;
+ object-fit: cover;
}
/deep/.el-carousel__container {
height: $bannerHeight;
- min-height: $bannerMh;
}
/deep/.el-carousel__arrow i {
font-size: 30px;
@@ -643,6 +642,7 @@ $bannerMh: 800px;
.pic {
width: 100%;
height: 100%;
+ object-fit: cover;
}
.project {
position: absolute;
@@ -726,6 +726,7 @@ $bannerMh: 800px;
}
.pic {
transition: 0.5s;
+ object-fit: cover;
}
.right {
position: relative;
@@ -789,6 +790,7 @@ $bannerMh: 800px;
width: 100%;
height: 100%;
transition: 0.5s;
+ object-fit: cover;
}
.pic-cover {
display: none;
@@ -840,6 +842,7 @@ $bannerMh: 800px;
width: 100%;
height: 100%;
transition: 0.5s;
+ object-fit: cover;
}
.texts {
position: absolute;
@@ -985,6 +988,7 @@ $bannerMh: 800px;
height: 259px;
margin-bottom: 28px;
border-radius: 50%;
+ object-fit: cover;
}
h6 {
font-size: 1.1rem;
@@ -1041,6 +1045,7 @@ $bannerMh: 800px;
}
.pic {
width: 50%;
+ object-fit: cover;
}
}
.about {
@@ -1075,6 +1080,7 @@ $bannerMh: 800px;
right: 0;
width: 632px;
height: 558px;
+ object-fit: cover;
}
}
@@ -1091,6 +1097,7 @@ $bannerMh: 800px;
}
img {
max-width: 100px;
+ object-fit: cover;
}
.text {
margin-top: 15px;
@@ -1160,4 +1167,97 @@ $bannerMh: 800px;
margin-right: 10px;
}
}
+
+@media (max-width: 1470px) {
+ .inner {
+ width: 95%;
+ }
+ .card {
+ li {
+ height: auto;
+ }
+ }
+ .about {
+ .pic {
+ width: 700px;
+ height: auto;
+ }
+ }
+}
+@media (max-width: 1370px) {
+ .card {
+ .texts {
+ padding: 0 1rem;
+ }
+ }
+ .about {
+ .inner {
+ height: auto;
+ text-align: center;
+ }
+ .left {
+ width: 100%;
+ }
+ .pic {
+ position: static;
+ width: auto;
+ max-width: 100%;
+ height: auto;
+ margin-top: 10px;
+ }
+ }
+}
+@media (max-width: 1200px) {
+ .carousel .texts {
+ left: 5%;
+ right: 5%;
+ }
+ .card {
+ flex-direction: column;
+ li {
+ margin-top: 1.25rem;
+ width: 100%;
+ }
+ }
+ .news {
+ flex-direction: column;
+ li {
+ width: 100%;
+ }
+ }
+ .news-banner {
+ flex-direction: column;
+ .pic-wrap,
+ .right {
+ width: 100%;
+ }
+ }
+ .news-carousel,
+ .people {
+ flex-direction: column;
+ li {
+ width: 100%;
+ margin-bottom: 10px;
+ }
+ }
+ .talent {
+ flex-direction: column;
+ .left,
+ .pic {
+ width: 100%;
+ }
+ .left {
+ padding-bottom: 50px;
+ margin-bottom: 10px;
+ }
+ }
+ .entry {
+ // flex-direction: column;
+ flex-wrap: wrap;
+ li {
+ width: 48% !important;
+ margin-bottom: 30px;
+ }
+ }
+}
\ No newline at end of file
diff --git a/src/pages/industrial/index.vue b/src/pages/industrial/index.vue
index 0a3946c..db79cfd 100644
--- a/src/pages/industrial/index.vue
+++ b/src/pages/industrial/index.vue
@@ -45,7 +45,7 @@
-
@@ -184,12 +184,15 @@ export default {
}
}
}
-.block-pic {
+/deep/.block-pic {
transition: 0.3s;
height: auto;
&.br {
border-radius: 270px;
}
+ img {
+ object-fit: cover;
+ }
&:hover {
transform: scale(1.05);
}
@@ -222,4 +225,10 @@ export default {
line-height: 1.6;
color: #8d8d8d;
}
+@media (max-width: 1200px) {
+ .table-wrap {
+ width: 100%;
+ overflow: auto;
+ }
+}
\ No newline at end of file
diff --git a/src/pages/mission/index.vue b/src/pages/mission/index.vue
index e6156fd..18b4e5a 100644
--- a/src/pages/mission/index.vue
+++ b/src/pages/mission/index.vue
@@ -110,9 +110,6 @@ export default {
diff --git a/src/pages/news/index.vue b/src/pages/news/index.vue
index 6d4e6ce..2d09702 100644
--- a/src/pages/news/index.vue
+++ b/src/pages/news/index.vue
@@ -535,6 +535,7 @@ export default {
.pic {
width: 100%;
height: auto;
+ object-fit: cover;
}
.texts {
padding: 2rem 1.5rem;
@@ -579,6 +580,7 @@ export default {
.pic {
transition: 0.3s;
height: auto;
+ object-fit: cover;
&:hover {
transform: scale(1.05);
}
@@ -618,6 +620,7 @@ export default {
width: 25rem;
height: 12.3125rem;
transition: 0.3s;
+ object-fit: cover;
&:hover {
transform: scale(1.05);
}
@@ -656,6 +659,7 @@ export default {
width: 8.25rem;
height: auto;
margin-right: 1.75rem;
+ object-fit: cover;
}
.texts {
width: 24.5rem;
@@ -700,6 +704,7 @@ export default {
.pic {
transition: 0.3s;
height: auto;
+ object-fit: cover;
&:hover {
transform: scale(1.05);
}
@@ -760,6 +765,7 @@ export default {
width: 10.7428rem;
height: auto;
margin-right: 1.6rem;
+ object-fit: cover;
}
h6 {
margin-bottom: 0.2714rem;
@@ -783,4 +789,995 @@ export default {
}
}
}
+
+@media (max-width: 1200px) {
+ .newsTab {
+ overflow-x: scroll;
+ display: -webkit-box;
+ }
+ .block {
+ padding: 50px 0;
+ .inner {
+ .more {
+ width: 100%;
+ margin: 20px auto 0;
+ }
+ .news-banner {
+ flex-direction: column;
+ img {
+ width: 100%;
+ }
+ .right {
+ margin-top: 10px;
+ width: 100%;
+ .inds {
+ left: 50%;
+ margin-left: -43px;
+ }
+ }
+ }
+ .card {
+ flex-direction: column;
+ .wow {
+ width: 95%;
+ margin: 20px auto;
+ }
+ }
+ .b-title {
+ font-size: 20px;
+ }
+ .intro {
+ font-size: 15px;
+ margin-bottom: 50px;
+ }
+ .shop-shows {
+ flex-direction: column;
+ .left {
+ width: 95%;
+ margin: 0 auto;
+ }
+ .right {
+ width: 93%;
+ margin: 20px auto;
+ .show-card {
+ flex-direction: column;
+ li {
+ width: 100%;
+ .pic {
+ width: 100%;
+ }
+ }
+ }
+ .card-list {
+ li {
+ .texts {
+ margin-right: 30px;
+ }
+ }
+ }
+ }
+ }
+ }
+ }
+}
+
+@media (min-width: 280px) and (max-width: 1200px) {
+ .wrap {
+ /deep/ .el-carousel {
+ height: 15rem;
+ .el-carousel__container {
+ height: 15rem;
+ }
+ img {
+ height: 15rem;
+ }
+ }
+ }
+ .banner-item .banner-name {
+ font-size: 1.5rem;
+ }
+ .newsTab {
+ li {
+ padding: 15px 10px;
+ font-size: 15px;
+ margin: 0;
+ }
+ }
+ .block {
+ padding: 20px 0;
+ .inner {
+ width: 90%;
+ .news-banner {
+ img {
+ height: 20rem;
+ }
+ }
+ .b-title {
+ margin-bottom: 20px;
+ }
+ .intro {
+ margin-bottom: 20px;
+ }
+ .shop-shows {
+ .left {
+ img {
+ height: 20rem;
+ }
+ }
+ }
+ .show-card {
+ .text {
+ font-size: 13px;
+ line-height: 20px;
+ white-space: inherit;
+ }
+ }
+ .card-list {
+ padding: 20px 10px;
+ li {
+ width: 100%;
+ img {
+ margin-right: 10px;
+ }
+ .texts {
+ margin-right: 10px;
+ h6 {
+ font-size: 15px;
+ font-weight: bold;
+ display: -webkit-box;
+ -webkit-box-orient: vertical;
+ -webkit-line-clamp: 3;
+ text-overflow: ellipsis;
+ overflow: hidden;
+ margin-bottom: 5px;
+ }
+ }
+ .des {
+ line-height: 15px;
+ }
+ .arrow {
+ margin-right: 0;
+ }
+ }
+ }
+ .shows {
+ flex-direction: column;
+ .left {
+ width: 100%;
+ .pic {
+ height: 20rem;
+ }
+ }
+ .card-list {
+ width: 100%;
+ padding: 20px 0;
+ li {
+ .pic {
+ width: 100px;
+ height: 7.5rem;
+ }
+ .texts {
+ h6 {
+ font-size: 15px;
+ font-weight: bold;
+ display: -webkit-box;
+ -webkit-box-orient: vertical;
+ -webkit-line-clamp: 1;
+ text-overflow: ellipsis;
+ overflow: hidden;
+ }
+ .text {
+ margin: 2px 0;
+ font-size: 12px;
+ display: -webkit-box;
+ -webkit-box-orient: vertical;
+ -webkit-line-clamp: 1;
+ text-overflow: ellipsis;
+ overflow: hidden;
+ }
+ }
+ }
+ }
+ }
+ }
+ }
+}
+@media (max-width: 320px) {
+ .wrap {
+ /deep/ .el-carousel {
+ height: 12rem;
+ }
+ /deep/ .el-carousel__container {
+ height: 12rem;
+ }
+ /deep/ .el-carousel__item {
+ height: 12rem;
+ }
+ }
+ .banner-item {
+ img {
+ height: 12rem !important;
+ }
+ .banner-name {
+ font-size: 1.5rem;
+ line-height: 1rem;
+ left: 2rem;
+ bottom: 2rem;
+ }
+ }
+ .newsTab {
+ .scollBox {
+ width: auto;
+ li {
+ padding: 1rem;
+ white-space: nowrap;
+ }
+ }
+ }
+ .block {
+ .inner {
+ .news-banner {
+ img {
+ height: auto;
+ }
+ .right {
+ padding: 1.25rem 1.25rem 5rem;
+ }
+ }
+ .card {
+ li {
+ .pic {
+ height: auto;
+ }
+ }
+ }
+ .shop-shows {
+ .left {
+ .pic {
+ height: auto;
+ }
+ .texts {
+ padding: 1.25rem;
+ }
+ }
+ .right {
+ .show-card {
+ li {
+ margin-top: 1.25rem;
+ .pic {
+ height: auto;
+ }
+ .text {
+ font-size: 1rem;
+ }
+ }
+ }
+ .card-list {
+ li {
+ .pic {
+ width: 6rem;
+ }
+ }
+ }
+ }
+ }
+ .shows {
+ .left {
+ .pic {
+ height: auto;
+ }
+ .texts {
+ padding: 1.25rem;
+ }
+ }
+ }
+ }
+ }
+ .conference {
+ .inner {
+ .shows {
+ .card-list {
+ li {
+ .pic {
+ height: auto !important;
+ }
+ }
+ }
+ }
+ }
+ }
+}
+@media (min-width: 320px) and (max-width: 375px) {
+ .wrap {
+ /deep/ .el-carousel {
+ height: 12rem;
+ }
+ /deep/ .el-carousel__container {
+ height: 12rem;
+ }
+ /deep/ .el-carousel__item {
+ height: 12rem;
+ }
+ }
+ .banner-item {
+ img {
+ height: 12rem !important;
+ }
+ .banner-name {
+ font-size: 1.5rem;
+ line-height: 1rem;
+ left: 2rem;
+ bottom: 2rem;
+ }
+ }
+ .newsTab {
+ .scollBox {
+ width: auto;
+ li {
+ padding: 1rem;
+ white-space: nowrap;
+ }
+ }
+ }
+ .block {
+ .inner {
+ .news-banner {
+ img {
+ height: auto;
+ }
+ .right {
+ padding: 1.25rem 1.25rem 5rem;
+ }
+ }
+ .card {
+ li {
+ .pic {
+ height: auto;
+ }
+ }
+ }
+ .shop-shows {
+ .left {
+ .pic {
+ height: auto;
+ }
+ .texts {
+ padding: 1.25rem;
+ }
+ }
+ .right {
+ .show-card {
+ li {
+ margin-top: 1.25rem;
+ .pic {
+ height: auto;
+ }
+ .text {
+ font-size: 1rem;
+ }
+ }
+ }
+ .card-list {
+ li {
+ .pic {
+ width: 6rem;
+ }
+ }
+ }
+ }
+ }
+ .shows {
+ .left {
+ .pic {
+ height: auto;
+ }
+ .texts {
+ padding: 1.25rem;
+ }
+ }
+ }
+ }
+ }
+ .conference {
+ .inner {
+ .shows {
+ .card-list {
+ li {
+ .pic {
+ height: auto !important;
+ }
+ }
+ }
+ }
+ }
+ }
+}
+@media (min-width: 375px) and (max-width: 480px) {
+ .wrap {
+ /deep/ .el-carousel {
+ height: 12rem;
+ }
+ /deep/ .el-carousel__container {
+ height: 12rem;
+ }
+ /deep/ .el-carousel__item {
+ height: 12rem;
+ }
+ }
+ .banner-item {
+ img {
+ height: 12rem !important;
+ }
+ .banner-name {
+ font-size: 1.5rem;
+ line-height: 1rem;
+ left: 2rem;
+ bottom: 2rem;
+ }
+ }
+ .newsTab {
+ .scollBox {
+ width: auto;
+ li {
+ padding: 1rem;
+ white-space: nowrap;
+ }
+ }
+ }
+ .block {
+ .inner {
+ .news-banner {
+ img {
+ height: auto;
+ }
+ .right {
+ padding: 1.25rem 1.25rem 5rem;
+ }
+ }
+ .card {
+ li {
+ .pic {
+ height: auto;
+ }
+ }
+ }
+ .shop-shows {
+ .left {
+ .pic {
+ height: auto;
+ }
+ .texts {
+ padding: 1.25rem;
+ }
+ }
+ .right {
+ .show-card {
+ li {
+ margin-top: 1.25rem;
+ .pic {
+ height: auto;
+ }
+ .text {
+ font-size: 1rem;
+ }
+ }
+ }
+ .card-list {
+ li {
+ .pic {
+ width: 30%;
+ }
+ }
+ }
+ }
+ }
+ .shows {
+ .left {
+ .pic {
+ height: auto;
+ }
+ .texts {
+ padding: 1.25rem;
+ }
+ }
+ }
+ }
+ }
+ .conference {
+ .inner {
+ .shows {
+ .card-list {
+ li {
+ .pic {
+ width: 35%;
+ height: auto !important;
+ }
+ }
+ }
+ }
+ }
+ }
+}
+@media (min-width: 480px) and (max-width: 640px) {
+ .wrap {
+ /deep/ .el-carousel {
+ height: 12rem;
+ }
+ /deep/ .el-carousel__container {
+ height: 12rem;
+ }
+ /deep/ .el-carousel__item {
+ height: 12rem;
+ }
+ }
+ .banner-item {
+ img {
+ height: 12rem !important;
+ }
+ .banner-name {
+ font-size: 1.5rem;
+ line-height: 1rem;
+ left: 2rem;
+ bottom: 2rem;
+ }
+ }
+ .newsTab {
+ .scollBox {
+ width: auto;
+ li {
+ padding: 1rem;
+ white-space: nowrap;
+ }
+ }
+ }
+ .block {
+ .inner {
+ .news-banner {
+ img {
+ height: auto;
+ }
+ .right {
+ padding: 1.25rem 1.25rem 5rem;
+ }
+ }
+ .card {
+ li {
+ .pic {
+ height: auto;
+ }
+ }
+ }
+ .shop-shows {
+ .left {
+ .pic {
+ height: auto;
+ }
+ .texts {
+ padding: 1.25rem;
+ }
+ }
+ .right {
+ .show-card {
+ li {
+ margin-top: 1.25rem;
+ .pic {
+ height: auto;
+ }
+ .text {
+ font-size: 1rem;
+ }
+ }
+ }
+ .card-list {
+ li {
+ .pic {
+ width: 30%;
+ }
+ }
+ }
+ }
+ }
+ .shows {
+ .left {
+ .pic {
+ height: auto;
+ }
+ .texts {
+ padding: 1.25rem;
+ }
+ }
+ }
+ }
+ }
+ .conference {
+ .inner {
+ .shows {
+ .card-list {
+ li {
+ .pic {
+ width: 35%;
+ height: auto !important;
+ }
+ }
+ }
+ }
+ }
+ }
+}
+@media (min-width: 640px) and (max-width: 768px) {
+ .wrap {
+ /deep/ .el-carousel {
+ height: 12rem;
+ }
+ /deep/ .el-carousel__container {
+ height: 12rem;
+ }
+ /deep/ .el-carousel__item {
+ height: 12rem;
+ }
+ }
+ .banner-item {
+ img {
+ height: 12rem !important;
+ }
+ .banner-name {
+ font-size: 1.5rem;
+ line-height: 1rem;
+ left: 2rem;
+ bottom: 2rem;
+ }
+ }
+ .newsTab {
+ .scollBox {
+ width: auto;
+ li {
+ padding: 1rem;
+ white-space: nowrap;
+ }
+ }
+ }
+ .block {
+ .inner {
+ .news-banner {
+ flex-direction: row;
+ img {
+ width: 50%;
+ height: auto;
+ }
+ .right {
+ margin-top: 0;
+ padding: 1.25rem 1.25rem 5rem;
+ }
+ }
+ .card {
+ flex-direction: row;
+ li {
+ width: 30% !important;
+ margin-right: 0.5rem;
+ margin: 0 0.5rem 0 0 !important;
+ .pic {
+ height: auto;
+ }
+ &:last-child() {
+ margin-right: 0 !important;
+ }
+ }
+ }
+ .shop-shows {
+ flex-direction: row;
+ .left {
+ margin-right: 0.5rem;
+ .pic {
+ height: auto;
+ }
+ .texts {
+ padding: 1.25rem;
+ }
+ }
+ .right {
+ margin-top: 0;
+ .show-card {
+ li {
+ .pic {
+ height: auto;
+ }
+ .text {
+ font-size: 1rem;
+ }
+ &:nth-child(2) {
+ margin-top: 0.5rem;
+ }
+ }
+ }
+ .card-list {
+ li {
+ .pic {
+ width: 30%;
+ }
+ }
+ }
+ }
+ }
+ .shows {
+ flex-direction: row;
+ .left {
+ .pic {
+ height: auto;
+ }
+ .texts {
+ padding: 1.25rem;
+ }
+ }
+ .card-list {
+ padding: 0;
+ }
+ }
+ }
+ }
+ .conference {
+ .inner {
+ .shows {
+ .card-list {
+ li {
+ .pic {
+ width: 35%;
+ height: auto !important;
+ }
+ }
+ }
+ }
+ }
+ }
+}
+@media (min-width: 768px) and (max-width: 980px) {
+ .wrap {
+ /deep/ .el-carousel {
+ height: 12rem;
+ }
+ /deep/ .el-carousel__container {
+ height: 12rem;
+ }
+ /deep/ .el-carousel__item {
+ height: 12rem;
+ }
+ }
+ .banner-item {
+ img {
+ height: 12rem !important;
+ }
+ .banner-name {
+ font-size: 1.5rem;
+ line-height: 1rem;
+ left: 2rem;
+ bottom: 2rem;
+ }
+ }
+ .newsTab {
+ .scollBox {
+ width: auto;
+ li {
+ padding: 1rem;
+ white-space: nowrap;
+ }
+ }
+ }
+ .block {
+ .inner {
+ .news-banner {
+ flex-direction: row;
+ img {
+ width: 50%;
+ height: auto;
+ }
+ .right {
+ margin-top: 0;
+ padding: 1.25rem 1.25rem 5rem;
+ }
+ }
+ .card {
+ flex-direction: row;
+ li {
+ width: 30% !important;
+ margin-right: 0.5rem;
+ margin: 0 0.5rem 0 0 !important;
+ .pic {
+ height: auto;
+ }
+ &:last-child() {
+ margin-right: 0 !important;
+ }
+ }
+ }
+ .shop-shows {
+ flex-direction: row;
+ .left {
+ margin-right: 0.5rem;
+ .pic {
+ height: auto;
+ }
+ .texts {
+ padding: 1.25rem;
+ }
+ }
+ .right {
+ margin-top: 0;
+ .show-card {
+ li {
+ .pic {
+ height: auto;
+ }
+ .text {
+ font-size: 1rem;
+ }
+ &:nth-child(2) {
+ margin-top: 0.5rem;
+ }
+ }
+ }
+ .card-list {
+ li {
+ .pic {
+ width: 30%;
+ }
+ }
+ }
+ }
+ }
+ .shows {
+ flex-direction: row;
+ .left {
+ .pic {
+ height: auto;
+ }
+ .texts {
+ padding: 1.25rem;
+ }
+ }
+ .card-list {
+ padding: 0;
+ }
+ }
+ }
+ }
+ .conference {
+ .inner {
+ .shows {
+ .card-list {
+ li {
+ .pic {
+ width: 35%;
+ height: auto !important;
+ }
+ }
+ }
+ }
+ }
+ }
+}
+@media (min-width: 980px) and (max-width: 1200px) {
+ .wrap {
+ /deep/ .el-carousel {
+ height: 21.6rem;
+ }
+ /deep/ .el-carousel__container {
+ height: 21.6rem;
+ }
+ /deep/ .el-carousel__item {
+ height: 21.6rem;
+ }
+ }
+ .banner-item {
+ img {
+ height: 21.6rem !important;
+ }
+ .banner-name {
+ font-size: 1.5rem;
+ line-height: 1rem;
+ left: 2rem;
+ bottom: 2rem;
+ }
+ }
+ .newsTab {
+ .scollBox {
+ width: auto;
+ li {
+ padding: 1rem;
+ white-space: nowrap;
+ }
+ }
+ }
+ .block {
+ .inner {
+ .news-banner {
+ flex-direction: row;
+ img {
+ width: 50%;
+ height: auto;
+ }
+ .right {
+ margin-top: 0;
+ padding: 1.25rem 1.25rem 5rem;
+ }
+ }
+ .card {
+ flex-direction: row;
+ li {
+ width: 30% !important;
+ margin-right: 0.5rem;
+ margin: 0 0.5rem 0 0 !important;
+ .pic {
+ height: auto;
+ }
+ &:last-child() {
+ margin-right: 0 !important;
+ }
+ }
+ }
+ .shop-shows {
+ flex-direction: row;
+ .left {
+ margin-right: 0.5rem;
+ .pic {
+ height: auto;
+ }
+ .texts {
+ padding: 1.25rem;
+ }
+ }
+ .right {
+ margin-top: 0;
+ .show-card {
+ flex-direction: row;
+ li {
+ .pic {
+ height: auto;
+ }
+ .text {
+ font-size: 1rem;
+ }
+ &:nth-child(2) {
+ margin-top: 0;
+ }
+ }
+ }
+ .card-list {
+ li {
+ .pic {
+ width: 30%;
+ }
+ }
+ }
+ }
+ }
+ .shows {
+ flex-direction: row;
+ .left {
+ .pic {
+ height: auto;
+ }
+ .texts {
+ padding: 1.25rem;
+ }
+ }
+ .card-list {
+ padding: 0;
+ }
+ }
+ }
+ }
+ .conference {
+ .inner {
+ .shows {
+ .card-list {
+ li {
+ .pic {
+ width: 35%;
+ height: auto !important;
+ }
+ }
+ }
+ }
+ }
+ }
+}
\ No newline at end of file
diff --git a/src/pages/newsPress/index.vue b/src/pages/newsPress/index.vue
index 38b7bb4..93f80d8 100644
--- a/src/pages/newsPress/index.vue
+++ b/src/pages/newsPress/index.vue
@@ -190,4 +190,399 @@ export default {
height: 3.3rem;
}
}
+
+@media (max-width: 1200px) {
+ .inner {
+ width: 95%;
+ .list {
+ li {
+ margin-top: 20px;
+ .pic {
+ width: 100%;
+ height: 500px;
+ }
+ .texts {
+ padding: 20px 10px 10px;
+ top: 30px;
+ h6 {
+ font-size: 2rem;
+ }
+ .sub {
+ margin: 10px 0;
+ }
+ .des {
+ margin-bottom: 10px;
+ }
+ }
+ }
+ }
+ }
+}
+@media (max-width: 320px) {
+ .wrap {
+ /deep/ .el-carousel {
+ height: 12rem !important;
+ }
+ /deep/ .el-carousel__container {
+ height: 12rem !important;
+ }
+ /deep/ .el-carousel__item {
+ height: 12rem !important;
+ }
+ }
+
+ .banner-item {
+ img {
+ height: 12rem !important;
+ }
+ .banner-name {
+ font-size: 1.5rem;
+ line-height: 1rem;
+ left: 2rem;
+ bottom: 2rem;
+ }
+ }
+ .inner {
+ /deep/ .el-breadcrumb__item {
+ font-size: 1rem;
+ }
+ .list {
+ li {
+ .pic {
+ height: auto !important;
+ }
+ .texts {
+ top: 1rem;
+ h6 {
+ font-size: 1rem !important;
+ }
+ .sub {
+ font-size: 0.85rem;
+ }
+ .des {
+ font-size: 0.85rem;
+ line-height: 0.85rem;
+ }
+ img {
+ width: 2rem;
+ height: 2rem;
+ }
+ }
+ }
+ }
+ }
+}
+@media (min-width: 320px) and (max-width: 375px) {
+ .wrap {
+ /deep/ .el-carousel {
+ height: 12rem !important;
+ }
+ /deep/ .el-carousel__container {
+ height: 12rem !important;
+ }
+ /deep/ .el-carousel__item {
+ height: 12rem !important;
+ }
+ }
+ .banner-item {
+ img {
+ height: 12rem !important;
+ }
+ .banner-name {
+ font-size: 1.5rem;
+ line-height: 1rem;
+ left: 2rem;
+ bottom: 2rem;
+ }
+ }
+ .inner {
+ /deep/ .el-breadcrumb__item {
+ font-size: 1rem;
+ }
+ .list {
+ li {
+ .pic {
+ height: auto !important;
+ }
+ .texts {
+ top: 4rem;
+ h6 {
+ font-size: 1.5rem !important;
+ }
+ .sub {
+ font-size: 1.2rem;
+ }
+ .des {
+ font-size: 1rem;
+ line-height: 1rem;
+ }
+ img {
+ width: 2rem;
+ height: 2rem;
+ }
+ }
+ }
+ }
+ }
+}
+@media (min-width: 375px) and (max-width: 480px) {
+ .wrap {
+ /deep/ .el-carousel {
+ height: 12rem !important;
+ }
+ /deep/ .el-carousel__container {
+ height: 12rem !important;
+ }
+ /deep/ .el-carousel__item {
+ height: 12rem !important;
+ }
+ }
+ .banner-item {
+ img {
+ height: 12rem !important;
+ }
+ .banner-name {
+ font-size: 1.5rem;
+ line-height: 1rem;
+ left: 2rem;
+ bottom: 2rem;
+ }
+ }
+ .inner {
+ /deep/ .el-breadcrumb__item {
+ font-size: 1rem;
+ }
+ .list {
+ li {
+ .pic {
+ height: auto !important;
+ }
+ .texts {
+ top: 4rem;
+ h6 {
+ font-size: 1.5rem !important;
+ }
+ .sub {
+ font-size: 1.2rem;
+ }
+ .des {
+ font-size: 1rem;
+ line-height: 1rem;
+ }
+ img {
+ width: 2rem;
+ height: 2rem;
+ }
+ }
+ }
+ }
+ }
+}
+@media (min-width: 480px) and (max-width: 640px) {
+ .wrap {
+ /deep/ .el-carousel {
+ height: 12rem !important;
+ }
+ /deep/ .el-carousel__container {
+ height: 12rem !important;
+ }
+ /deep/ .el-carousel__item {
+ height: 12rem !important;
+ }
+ }
+ .banner-item {
+ img {
+ height: 12rem !important;
+ }
+ .banner-name {
+ font-size: 1.5rem;
+ line-height: 1rem;
+ left: 2rem;
+ bottom: 2rem;
+ }
+ }
+ .inner {
+ /deep/ .el-breadcrumb__item {
+ font-size: 1rem;
+ }
+ .list {
+ li {
+ .pic {
+ width: 47%;
+ height: auto !important;
+ }
+ .texts {
+ top: 2rem;
+ h6 {
+ font-size: 1.5rem !important;
+ }
+ .sub {
+ font-size: 1.2rem;
+ }
+ .des {
+ font-size: 1rem;
+ line-height: 1rem;
+ }
+ img {
+ width: 2rem;
+ height: 2rem;
+ }
+ }
+ }
+ }
+ }
+}
+@media (min-width: 640px) and (max-width: 768px) {
+ .wrap {
+ /deep/ .el-carousel {
+ height: 12rem !important;
+ }
+ /deep/ .el-carousel__container {
+ height: 12rem !important;
+ }
+ /deep/ .el-carousel__item {
+ height: 12rem !important;
+ }
+ }
+ .banner-item {
+ img {
+ height: 12rem !important;
+ }
+ .banner-name {
+ font-size: 1.5rem;
+ line-height: 1rem;
+ left: 2rem;
+ bottom: 2rem;
+ }
+ }
+ .inner {
+ .list {
+ li {
+ .pic {
+ width: 47%;
+ height: auto !important;
+ }
+ .texts {
+ top: 4rem;
+ h6 {
+ font-size: 2rem !important;
+ }
+ .sub {
+ font-size: 1.5rem;
+ }
+ .des {
+ font-size: 1.3rem;
+ line-height: 1.3rem;
+ }
+ img {
+ width: 2rem;
+ height: 2rem;
+ }
+ }
+ }
+ }
+ }
+}
+@media (min-width: 768px) and (max-width: 980px) {
+ .wrap {
+ /deep/ .el-carousel {
+ height: 12rem !important;
+ }
+ /deep/ .el-carousel__container {
+ height: 12rem !important;
+ }
+ /deep/ .el-carousel__item {
+ height: 12rem !important;
+ }
+ }
+ .banner-item {
+ img {
+ height: 12rem !important;
+ }
+ .banner-name {
+ font-size: 1.5rem;
+ line-height: 1rem;
+ left: 2rem;
+ bottom: 2rem;
+ }
+ }
+ .inner {
+ .list {
+ li {
+ .pic {
+ width: 47%;
+ height: auto !important;
+ }
+ .texts {
+ top: 6rem;
+ h6 {
+ font-size: 2rem !important;
+ }
+ .sub {
+ font-size: 1.5rem;
+ }
+ .des {
+ font-size: 1.3rem;
+ line-height: 1.3rem;
+ }
+ img {
+ width: 2rem;
+ height: 2rem;
+ }
+ }
+ }
+ }
+ }
+}
+@media (min-width: 980px) and (max-width: 1200px) {
+ .wrap {
+ /deep/ .el-carousel {
+ height: 12rem !important;
+ }
+ /deep/ .el-carousel__container {
+ height: 12rem !important;
+ }
+ /deep/ .el-carousel__item {
+ height: 12rem !important;
+ }
+ }
+ .banner-item {
+ img {
+ height: 12rem !important;
+ }
+ .banner-name {
+ font-size: 1.5rem;
+ line-height: 1rem;
+ left: 2rem;
+ bottom: 2rem;
+ }
+ }
+ .inner {
+ .list {
+ li {
+ .pic {
+ width: 47%;
+ height: auto !important;
+ }
+ .texts {
+ top: 8rem;
+ h6 {
+ font-size: 2rem !important;
+ }
+ .sub {
+ font-size: 1.5rem;
+ }
+ .des {
+ font-size: 1.3rem;
+ line-height: 1.3rem;
+ }
+ img {
+ width: 2rem;
+ height: 2rem;
+ }
+ }
+ }
+ }
+ }
+}
\ No newline at end of file
diff --git a/src/pages/newsProcurement/index.vue b/src/pages/newsProcurement/index.vue
index 8f17b32..c325f73 100644
--- a/src/pages/newsProcurement/index.vue
+++ b/src/pages/newsProcurement/index.vue
@@ -190,4 +190,464 @@ export default {
height: 3.3rem;
}
}
+
+@media (max-width: 1520px) {
+ .list {
+ li {
+ &:nth-child(even) {
+ .texts {
+ left: 25px;
+ }
+ }
+ }
+ .texts {
+ right: 25px;
+ width: 55%;
+ }
+ }
+}
+
+@media (min-width: 280px) and (max-width: 1200px) {
+ .wrap {
+ /deep/ .el-carousel {
+ height: 18rem;
+ .el-carousel__container {
+ height: 18rem;
+ }
+ img {
+ height: 18rem;
+ }
+ }
+ }
+ .banner-item .banner-name[data-v-1525064c] {
+ font-size: 1.5rem;
+ }
+
+ .inner {
+ width: 95%;
+ .list {
+ li {
+ margin-top: 20px;
+ .pic {
+ width: 100%;
+ height: 25rem !important;
+ }
+ .texts {
+ padding: 10px 5px 10px !important;
+ top: 30px;
+ height: auto;
+ h6 {
+ font-size: 1.5rem !important;
+ }
+ p {
+ font-size: 1rem;
+ margin: 5px 0 !important;
+ line-height: 1.5rem;
+ }
+ .sub {
+ margin: 10px 0;
+ }
+ .des {
+ margin-bottom: 10px;
+ }
+ }
+ }
+ }
+ }
+}
+
+@media (max-width: 1200px) {
+ .inner {
+ width: 95%;
+ .list {
+ li {
+ margin-top: 20px;
+ .pic {
+ width: 100%;
+ height: 500px;
+ }
+ .texts {
+ padding: 20px 10px 10px;
+ top: 30px;
+ h6 {
+ font-size: 2rem;
+ }
+ .sub {
+ margin: 10px 0;
+ }
+ .des {
+ margin-bottom: 10px;
+ }
+ }
+ }
+ }
+ }
+}
+@media (max-width: 320px) {
+ .wrap {
+ /deep/ .el-carousel {
+ height: 12rem !important;
+ }
+ /deep/ .el-carousel__container {
+ height: 12rem !important;
+ }
+ /deep/ .el-carousel__item {
+ height: 12rem !important;
+ }
+ }
+
+ .banner-item {
+ img {
+ height: 12rem !important;
+ }
+ .banner-name {
+ font-size: 1.5rem;
+ line-height: 1rem;
+ left: 2rem;
+ bottom: 2rem;
+ }
+ }
+ .inner {
+ /deep/ .el-breadcrumb__item {
+ font-size: 1rem;
+ }
+ .list {
+ li {
+ .pic {
+ height: auto !important;
+ }
+ .texts {
+ top: 1rem;
+ h6 {
+ font-size: 1rem !important;
+ }
+ .sub {
+ font-size: 0.85rem;
+ }
+ .des {
+ font-size: 0.85rem;
+ line-height: 0.85rem;
+ }
+ img {
+ width: 2rem;
+ height: 2rem;
+ }
+ }
+ }
+ }
+ }
+}
+@media (min-width: 320px) and (max-width: 375px) {
+ .wrap {
+ /deep/ .el-carousel {
+ height: 12rem !important;
+ }
+ /deep/ .el-carousel__container {
+ height: 12rem !important;
+ }
+ /deep/ .el-carousel__item {
+ height: 12rem !important;
+ }
+ }
+ .banner-item {
+ img {
+ height: 12rem !important;
+ }
+ .banner-name {
+ font-size: 1.5rem;
+ line-height: 1rem;
+ left: 2rem;
+ bottom: 2rem;
+ }
+ }
+ .inner {
+ /deep/ .el-breadcrumb__item {
+ font-size: 1rem;
+ }
+ .list {
+ li {
+ .pic {
+ height: auto !important;
+ }
+ .texts {
+ top: 4rem;
+ h6 {
+ font-size: 1.5rem !important;
+ }
+ .sub {
+ font-size: 1.2rem;
+ }
+ .des {
+ font-size: 1rem;
+ line-height: 1rem;
+ }
+ img {
+ width: 2rem;
+ height: 2rem;
+ }
+ }
+ }
+ }
+ }
+}
+@media (min-width: 375px) and (max-width: 480px) {
+ .wrap {
+ /deep/ .el-carousel {
+ height: 12rem !important;
+ }
+ /deep/ .el-carousel__container {
+ height: 12rem !important;
+ }
+ /deep/ .el-carousel__item {
+ height: 12rem !important;
+ }
+ }
+ .banner-item {
+ img {
+ height: 12rem !important;
+ }
+ .banner-name {
+ font-size: 1.5rem;
+ line-height: 1rem;
+ left: 2rem;
+ bottom: 2rem;
+ }
+ }
+ .inner {
+ /deep/ .el-breadcrumb__item {
+ font-size: 1rem;
+ }
+ .list {
+ li {
+ .pic {
+ height: auto !important;
+ }
+ .texts {
+ top: 4rem;
+ h6 {
+ font-size: 1.5rem !important;
+ }
+ .sub {
+ font-size: 1.2rem;
+ }
+ .des {
+ font-size: 1rem;
+ line-height: 1rem;
+ }
+ img {
+ width: 2rem;
+ height: 2rem;
+ }
+ }
+ }
+ }
+ }
+}
+@media (min-width: 480px) and (max-width: 640px) {
+ .wrap {
+ /deep/ .el-carousel {
+ height: 12rem !important;
+ }
+ /deep/ .el-carousel__container {
+ height: 12rem !important;
+ }
+ /deep/ .el-carousel__item {
+ height: 12rem !important;
+ }
+ }
+ .banner-item {
+ img {
+ height: 12rem !important;
+ }
+ .banner-name {
+ font-size: 1.5rem;
+ line-height: 1rem;
+ left: 2rem;
+ bottom: 2rem;
+ }
+ }
+ .inner {
+ /deep/ .el-breadcrumb__item {
+ font-size: 1rem;
+ }
+ .list {
+ li {
+ .pic {
+ width: 47%;
+ height: auto !important;
+ }
+ .texts {
+ top: 2rem;
+ h6 {
+ font-size: 1.5rem !important;
+ }
+ .sub {
+ font-size: 1.2rem;
+ }
+ .des {
+ font-size: 1rem;
+ line-height: 1rem;
+ }
+ img {
+ width: 2rem;
+ height: 2rem;
+ }
+ }
+ }
+ }
+ }
+}
+@media (min-width: 640px) and (max-width: 768px) {
+ .wrap {
+ /deep/ .el-carousel {
+ height: 12rem !important;
+ }
+ /deep/ .el-carousel__container {
+ height: 12rem !important;
+ }
+ /deep/ .el-carousel__item {
+ height: 12rem !important;
+ }
+ }
+ .banner-item {
+ img {
+ height: 12rem !important;
+ }
+ .banner-name {
+ font-size: 1.5rem;
+ line-height: 1rem;
+ left: 2rem;
+ bottom: 2rem;
+ }
+ }
+ .inner {
+ .list {
+ li {
+ .pic {
+ width: 47%;
+ height: auto !important;
+ }
+ .texts {
+ top: 4rem;
+ h6 {
+ font-size: 2rem !important;
+ }
+ .sub {
+ font-size: 1.5rem;
+ }
+ .des {
+ font-size: 1.3rem;
+ line-height: 1.3rem;
+ }
+ img {
+ width: 2rem;
+ height: 2rem;
+ }
+ }
+ }
+ }
+ }
+}
+@media (min-width: 768px) and (max-width: 980px) {
+ .wrap {
+ /deep/ .el-carousel {
+ height: 12rem !important;
+ }
+ /deep/ .el-carousel__container {
+ height: 12rem !important;
+ }
+ /deep/ .el-carousel__item {
+ height: 12rem !important;
+ }
+ }
+ .banner-item {
+ img {
+ height: 12rem !important;
+ }
+ .banner-name {
+ font-size: 1.5rem;
+ line-height: 1rem;
+ left: 2rem;
+ bottom: 2rem;
+ }
+ }
+ .inner {
+ .list {
+ li {
+ .pic {
+ width: 47%;
+ height: auto !important;
+ }
+ .texts {
+ top: 6rem;
+ h6 {
+ font-size: 2rem !important;
+ }
+ .sub {
+ font-size: 1.5rem;
+ }
+ .des {
+ font-size: 1.3rem;
+ line-height: 1.3rem;
+ }
+ img {
+ width: 2rem;
+ height: 2rem;
+ }
+ }
+ }
+ }
+ }
+}
+@media (min-width: 980px) and (max-width: 1200px) {
+ .wrap {
+ /deep/ .el-carousel {
+ height: 12rem !important;
+ }
+ /deep/ .el-carousel__container {
+ height: 12rem !important;
+ }
+ /deep/ .el-carousel__item {
+ height: 12rem !important;
+ }
+ }
+ .banner-item {
+ img {
+ height: 12rem !important;
+ }
+ .banner-name {
+ font-size: 1.5rem;
+ line-height: 1rem;
+ left: 2rem;
+ bottom: 2rem;
+ }
+ }
+ .inner {
+ .list {
+ li {
+ .pic {
+ width: 47%;
+ height: auto !important;
+ }
+ .texts {
+ top: 8rem;
+ h6 {
+ font-size: 2rem !important;
+ }
+ .sub {
+ font-size: 1.5rem;
+ }
+ .des {
+ font-size: 1.3rem;
+ line-height: 1.3rem;
+ }
+ img {
+ width: 2rem;
+ height: 2rem;
+ }
+ }
+ }
+ }
+ }
+}
\ No newline at end of file
diff --git a/src/pages/org/index.vue b/src/pages/org/index.vue
index 93e1b80..0f80412 100644
--- a/src/pages/org/index.vue
+++ b/src/pages/org/index.vue
@@ -104,4 +104,31 @@ export default {
width: 1200px;
margin: 0 auto;
}
+@media (max-width: 1300px) {
+ .org {
+ width: 100%;
+ padding: 15px;
+ .left {
+ width: 60%;
+ }
+ .pic {
+ width: 30%;
+ height: auto;
+ }
+ }
+ .lg-bg {
+ width: 85%;
+ }
+}
+@media (max-width: 980px) {
+ .org {
+ flex-direction: column;
+ .pic {
+ display: none;
+ }
+ .left {
+ width: 100%;
+ }
+ }
+}
\ No newline at end of file
diff --git a/src/pages/overview/index.vue b/src/pages/overview/index.vue
index b775492..6947b94 100644
--- a/src/pages/overview/index.vue
+++ b/src/pages/overview/index.vue
@@ -384,7 +384,85 @@ export default {
}
.pic {
width: 50%;
- // height: 700px;
+ // object-fit: cover;
+ }
+}
+
+@media (min-width: 2000px) {
+ .scan {
+ .scan-inner {
+ justify-content: flex-start;
+ }
+ }
+}
+@media (max-width: 1400px) {
+ .history {
+ .texts {
+ flex-direction: column;
+ }
+ .left {
+ width: 100%;
+ }
+ .bg {
+ width: auto;
+ max-width: 100%;
+ height: auto;
+ margin: 20px 0 0 0;
+ }
+ }
+ .scan {
+ .scan-inner {
+ flex-direction: column;
+ }
+ .left {
+ width: 100%;
+ }
+ .pic {
+ width: 100%;
+ margin-top: 2rem;
+ }
+ }
+ .fac {
+ .event {
+ .texts {
+ position: static;
+ margin-top: 20px;
+ }
+ }
+ }
+}
+@media (max-width: 920px) {
+ .core {
+ .texts {
+ top: 20px !important;
+ left: 20px !important;
+ right: 20px !important;
+ width: auto;
+ }
+ }
+ .scan {
+ padding: 20px;
+ }
+ .fac {
+ .l-card {
+ flex-direction: column;
+ li {
+ width: 100%;
+ margin-bottom: 1rem;
+ }
+ }
+ }
+}
+@media (max-width: 750px) {
+ .core {
+ .texts {
+ position: static;
+ padding: 20px;
+ color: #333;
+ }
+ .line {
+ background: #333;
+ }
}
}
diff --git a/src/pages/overviewDevHistory/index.vue b/src/pages/overviewDevHistory/index.vue
index 99df704..915585e 100644
--- a/src/pages/overviewDevHistory/index.vue
+++ b/src/pages/overviewDevHistory/index.vue
@@ -212,4 +212,58 @@ export default {
}
}
}
+
+@media (max-width: 1200px) {
+ .tab-content {
+ width: 90%;
+ span {
+ font-size: 1.35rem;
+ }
+ }
+
+ .block {
+ padding: 1.25rem 0;
+ .inner {
+ width: 90%;
+ h2 {
+ font-size: 1.5rem;
+ }
+ p {
+ font-size: 1rem;
+ margin: 10px 0 1.25rem;
+ }
+ .event {
+ flex-direction: column;
+ .time {
+ width: 100%;
+ li {
+ width: 100%;
+ justify-content: flex-start;
+ }
+ }
+ .right {
+ margin-top: 1.25rem;
+ width: 100%;
+ h6 {
+ font-size: 2rem;
+ }
+ .list {
+ li {
+ padding: 1.25rem;
+ flex-direction: column;
+ align-items: flex-start;
+ .texts {
+ width: 100%;
+ }
+ .pic {
+ width: 100%;
+ height: auto;
+ }
+ }
+ }
+ }
+ }
+ }
+ }
+}
\ No newline at end of file
diff --git a/src/pages/overviewIntro/index.vue b/src/pages/overviewIntro/index.vue
index 366e32c..d6fca43 100644
--- a/src/pages/overviewIntro/index.vue
+++ b/src/pages/overviewIntro/index.vue
@@ -187,4 +187,36 @@ export default {
right: 90%;
}
}
+
+@media (max-width: 1200px) {
+ .tab-content {
+ width: 90%;
+ margin: auto;
+ padding-top: 1.25rem;
+ .intro {
+ flex-direction: column;
+ .pic {
+ width: 100%;
+ }
+ }
+ .intro-bg {
+ padding-top: 3rem;
+ .texts {
+ h6 {
+ font-size: 1.6rem;
+ }
+ }
+ }
+ .right {
+ width: 100% !important;
+ margin-top: 1.25rem;
+ .text {
+ margin-top: 1.25rem;
+ }
+ }
+ span {
+ font-size: 1.35rem;
+ }
+ }
+}
\ No newline at end of file
diff --git a/src/pages/overviewLocation/index.vue b/src/pages/overviewLocation/index.vue
index 9cbf6ba..6cffa3a 100644
--- a/src/pages/overviewLocation/index.vue
+++ b/src/pages/overviewLocation/index.vue
@@ -76,4 +76,12 @@ export default {
color: #020202;
line-height: 1.6rem;
}
+@media (max-width: 1200px) {
+ .tab-content {
+ width: 90%;
+ span {
+ font-size: 1.35rem;
+ }
+ }
+}
\ No newline at end of file
diff --git a/src/pages/overviewSetup/index.vue b/src/pages/overviewSetup/index.vue
index 971e9ac..993551f 100644
--- a/src/pages/overviewSetup/index.vue
+++ b/src/pages/overviewSetup/index.vue
@@ -98,10 +98,30 @@ export default {
.pic {
width: 320px;
height: 282px;
+ object-fit: cover;
}
}
.lg-bg {
width: 1200px;
margin: 0 auto;
}
+@media (max-width: 1200px) {
+ .tab-content {
+ padding: 20px 0;
+ .org {
+ width: 95%;
+ padding: 15px;
+ flex-direction: column;
+ .pic {
+ display: none;
+ }
+ .left {
+ width: 100%;
+ }
+ }
+ }
+ .lg-bg {
+ width: 90%;
+ }
+}
\ No newline at end of file
diff --git a/src/pages/overviewTrailer/index.vue b/src/pages/overviewTrailer/index.vue
index 3f17de8..970bec7 100644
--- a/src/pages/overviewTrailer/index.vue
+++ b/src/pages/overviewTrailer/index.vue
@@ -84,4 +84,14 @@ export default {
color: #020202;
line-height: 1.6rem;
}
+
+@media (max-width: 1200px) {
+ .tab-content {
+ width: 95%;
+ margin: 0 auto;
+ .video {
+ max-height: 18rem;
+ }
+ }
+}
\ No newline at end of file
diff --git a/src/pages/publication/index.vue b/src/pages/publication/index.vue
index 2d08050..152a1f3 100644
--- a/src/pages/publication/index.vue
+++ b/src/pages/publication/index.vue
@@ -117,6 +117,7 @@ export default {
.banner-img {
width: 100%;
height: 24rem;
+ object-fit: cover;
}
.texts {
position: absolute;
@@ -157,4 +158,25 @@ export default {
padding: 20px 0;
margin: 0 auto;
}
+@media (max-width: 1200px) {
+ .single-banner {
+ .texts {
+ top: 10rem;
+ left: 6rem;
+ }
+ }
+ .tabs {
+ // flex-direction: column;
+ width: 100%;
+ overflow-x: scroll;
+ li {
+ padding: 1.25rem 0;
+ margin: 0 1.25rem;
+ }
+ }
+ .tab-content {
+ width: 90%;
+ margin: 0 auto;
+ }
+}
\ No newline at end of file
diff --git a/src/pages/publication/monograph.vue b/src/pages/publication/monograph.vue
index 451768c..c704856 100644
--- a/src/pages/publication/monograph.vue
+++ b/src/pages/publication/monograph.vue
@@ -3,8 +3,7 @@
{{ modules[3].form.des }}
@@ -222,6 +222,7 @@ export default { width: 560px; height: 500px; margin: -122px -83px 0 0; + object-fit: cover; } } .land { @@ -231,6 +232,7 @@ export default { .pic { width: 50%; height: 450px; + object-fit: cover; } .right { width: 50%; @@ -292,6 +294,7 @@ export default { height: 423px; margin: -20px -20px 0 0; border-radius: 100px 0 0 0; + object-fit: cover; } } } @@ -325,6 +328,7 @@ export default { left: 0; width: 100%; height: 100%; + object-fit: cover; } .icon { position: relative; @@ -354,6 +358,7 @@ export default { img { width: 100%; height: 220px; + object-fit: cover; } .texts { padding: 20px 24px; @@ -371,4 +376,78 @@ export default { text-shadow: 0px 0px 20px rgba(176, 176, 176, 0.21); } } + +@media (max-width: 1200px) { + .history { + .texts { + flex-direction: column; + } + .left { + width: 100%; + } + .bg { + width: 100%; + height: auto; + margin-top: 1rem; + } + } + .land { + .inner { + flex-direction: column; + } + .pic, + .right { + width: 100%; + } + h6 { + margin-left: 0; + } + .right { + margin-top: 1rem; + } + .text { + height: auto; + } + } + .plan { + li { + flex-direction: column !important; + height: auto; + .left, + .pic { + width: 100%; + } + .pic { + margin: 1rem 0 0 !important; + } + } + } + .app { + li { + width: calc((100% - 10px) / 2); + height: 267px; + &:nth-child(2n) { + margin-right: 0; + } + } + } + .news { + flex-direction: column; + li { + width: 100%; + margin: 0 0 20px 0; + } + } +} +@media (max-width: 780px) { + .app { + li { + width: 100%; + margin-right: 0; + } + } + .plan-title:after { + display: none; + } +} diff --git a/src/pages/lightSources/index.vue b/src/pages/lightSources/index.vue index acd30a8..ba6c88d 100644 --- a/src/pages/lightSources/index.vue +++ b/src/pages/lightSources/index.vue @@ -17,7 +17,7 @@ data-wow-delay="0.8s">{{ modules[1].form.des }}
{{$t('column.Publicationtime')}}：
-
\ No newline at end of file
diff --git a/src/pages/publication/patent.vue b/src/pages/publication/patent.vue
index e0d5baf..5a55759 100644
--- a/src/pages/publication/patent.vue
+++ b/src/pages/publication/patent.vue
@@ -155,4 +155,18 @@ export default {
cursor: pointer;
}
}
+@media (max-width: 640px) {
+ .forms {
+ flex-direction: column;
+ align-items: flex-start;
+ .item {
+ display: flex;
+ margin-bottom: 20px;
+ margin-right: 0;
+ }
+ .search {
+ width: 100%;
+ }
+ }
+}
\ No newline at end of file
diff --git a/src/pages/publication/single.vue b/src/pages/publication/single.vue
index b71e13d..9fbf893 100644
--- a/src/pages/publication/single.vue
+++ b/src/pages/publication/single.vue
@@ -129,4 +129,10 @@ export default {
padding: 20px 0;
margin: 0 auto;
}
+@media (max-width: 1200px) {
+ .tab-content {
+ width: 90%;
+ margin: 0 auto;
+ }
+}
\ No newline at end of file
diff --git a/src/pages/publication/thesis.vue b/src/pages/publication/thesis.vue
index bf9c7c2..56cdf80 100644
--- a/src/pages/publication/thesis.vue
+++ b/src/pages/publication/thesis.vue
@@ -3,8 +3,7 @@
{{$t('column.publicationyear')}}：
-
\ No newline at end of file
diff --git a/src/pages/publish/show.vue b/src/pages/publish/show.vue
index d72f54d..6a02c75 100644
--- a/src/pages/publish/show.vue
+++ b/src/pages/publish/show.vue
@@ -240,4 +240,19 @@ export default {
}
}
}
+@media (max-width: 1084px) {
+ .content {
+ width: 95%;
+ }
+ .article {
+ flex-direction: column;
+ .left,
+ .right {
+ width: 100%;
+ }
+ .right {
+ margin: 20px 0 0;
+ }
+ }
+}
\ No newline at end of file
diff --git a/src/pages/research/index.vue b/src/pages/research/index.vue
index 3c28c23..537fc49 100644
--- a/src/pages/research/index.vue
+++ b/src/pages/research/index.vue
@@ -289,4 +289,808 @@ export default {
line-height: 1.3rem;
}
}
+
+@media (min-width: 280px) and (max-width: 1200px) {
+ .wrap {
+ /deep/ .el-carousel {
+ height: 18rem;
+ .el-carousel__container {
+ height: 18rem;
+ }
+ img {
+ height: 18rem;
+ }
+ }
+ }
+ .block {
+ padding: 50px 0;
+ .intro {
+ margin-bottom: 30px;
+ }
+ .area {
+ flex-direction: column;
+ li {
+ width: 95%;
+ margin: 1.25rem auto;
+ }
+ }
+ .group,
+ .news {
+ flex-direction: column;
+ li {
+ width: 95%;
+ margin: 20px auto;
+ }
+ }
+ }
+ .area {
+ li {
+ height: auto;
+ .pic {
+ height: 20rem;
+ }
+ .texts {
+ height: 10rem;
+ }
+ }
+ }
+ .group img {
+ height: 20rem;
+ }
+ .news img {
+ height: 20rem;
+ }
+}
+@media (max-width: 320px) {
+ .wrap {
+ /deep/ .el-carousel {
+ height: 12rem !important;
+ }
+ /deep/ .el-carousel__container {
+ height: 12rem !important;
+ }
+ /deep/ .el-carousel__item {
+ height: 12rem !important;
+ }
+ }
+ .banner-item {
+ img {
+ height: 12rem !important;
+ }
+ .banner-name {
+ font-size: 1.5rem;
+ line-height: 1rem;
+ left: 2rem;
+ bottom: 2rem;
+ }
+ }
+ .block {
+ padding: 1.25rem 0;
+ .b-title {
+ font-size: 1.5rem;
+ margin-bottom: 1rem;
+ }
+ .group,
+ .news {
+ li {
+ img {
+ height: auto;
+ }
+ .text {
+ font-size: 1.5rem;
+ line-height: 1.8rem;
+ }
+ }
+ }
+ }
+}
+@media (min-width: 320px) and (max-width: 375px) {
+ .wrap {
+ /deep/ .el-carousel {
+ height: 12rem !important;
+ }
+ /deep/ .el-carousel__container {
+ height: 12rem !important;
+ }
+ /deep/ .el-carousel__item {
+ height: 12rem !important;
+ }
+ }
+ .banner-item {
+ img {
+ height: 12rem !important;
+ }
+ .banner-name {
+ font-size: 1.5rem;
+ line-height: 1rem;
+ left: 2rem;
+ bottom: 2rem;
+ }
+ }
+ .block {
+ padding: 1.25rem 0;
+ .b-title {
+ font-size: 1.5rem;
+ margin-bottom: 1rem;
+ }
+ .group,
+ .news {
+ li {
+ img {
+ height: auto;
+ }
+ .text {
+ font-size: 1.5rem;
+ line-height: 1.8rem;
+ }
+ }
+ }
+ }
+}
+@media (min-width: 375px) and (max-width: 480px) {
+ .wrap {
+ /deep/ .el-carousel {
+ height: 12rem !important;
+ }
+ /deep/ .el-carousel__container {
+ height: 12rem !important;
+ }
+ /deep/ .el-carousel__item {
+ height: 12rem !important;
+ }
+ }
+ .banner-item {
+ img {
+ height: 12rem !important;
+ }
+ .banner-name {
+ font-size: 1.5rem;
+ line-height: 1rem;
+ left: 2rem;
+ bottom: 2rem;
+ }
+ }
+ .block {
+ padding: 1.25rem 0;
+ .b-title {
+ font-size: 1.5rem;
+ margin-bottom: 1rem;
+ }
+ .group,
+ .news {
+ li {
+ img {
+ height: auto;
+ }
+ .text {
+ font-size: 1.5rem;
+ line-height: 1.8rem;
+ }
+ }
+ }
+ .area {
+ li {
+ .pic {
+ height: 22rem;
+ }
+ }
+ }
+ }
+}
+@media (min-width: 480px) and (max-width: 640px) {
+ .wrap {
+ /deep/ .el-carousel {
+ height: 12rem !important;
+ }
+ /deep/ .el-carousel__container {
+ height: 12rem !important;
+ }
+ /deep/ .el-carousel__item {
+ height: 12rem !important;
+ }
+ }
+ .banner-item {
+ img {
+ height: 12rem !important;
+ }
+ .banner-name {
+ font-size: 1.5rem;
+ line-height: 1rem;
+ left: 2rem;
+ bottom: 2rem;
+ }
+ }
+ .block {
+ padding: 1.25rem 0;
+ .b-title {
+ font-size: 1.5rem;
+ margin-bottom: 1rem;
+ }
+ .group,
+ .news {
+ li {
+ img {
+ height: auto;
+ }
+ .text {
+ font-size: 1.5rem;
+ line-height: 1.8rem;
+ }
+ }
+ }
+ .area {
+ li {
+ .pic {
+ height: auto;
+ }
+ }
+ }
+ }
+}
+@media (min-width: 640px) and (max-width: 768px) {
+ .wrap {
+ /deep/ .el-carousel {
+ height: 12rem !important;
+ }
+ /deep/ .el-carousel__container {
+ height: 12rem !important;
+ }
+ /deep/ .el-carousel__item {
+ height: 12rem !important;
+ }
+ }
+ .banner-item {
+ img {
+ height: 12rem !important;
+ }
+ .banner-name {
+ font-size: 1.5rem;
+ line-height: 1rem;
+ left: 2rem;
+ bottom: 2rem;
+ }
+ }
+ .block {
+ padding: 1.25rem 0;
+ .b-title {
+ font-size: 1.5rem;
+ margin-bottom: 1rem;
+ }
+ .group,
+ .news {
+ li {
+ img {
+ height: auto;
+ }
+ .text {
+ font-size: 1.5rem;
+ line-height: 1.8rem;
+ }
+ }
+ }
+ .area {
+ flex-direction: row;
+ li {
+ width: 19%;
+ .pic {
+ height: auto;
+ }
+ }
+ }
+ }
+}
+@media (min-width: 768px) and (max-width: 980px) {
+ .wrap {
+ /deep/ .el-carousel {
+ height: 12rem !important;
+ }
+ /deep/ .el-carousel__container {
+ height: 12rem !important;
+ }
+ /deep/ .el-carousel__item {
+ height: 12rem !important;
+ }
+ }
+ .banner-item {
+ img {
+ height: 12rem !important;
+ }
+ .banner-name {
+ font-size: 1.5rem;
+ line-height: 1rem;
+ left: 2rem;
+ bottom: 2rem;
+ }
+ }
+ .block {
+ padding: 1.25rem 0;
+ .b-title {
+ font-size: 1.5rem;
+ margin-bottom: 1rem;
+ }
+ .group,
+ .news {
+ flex-direction: row;
+ li {
+ width: calc((100% - 3rem) / 3);
+ margin: 0 0.8rem 1.95rem 0;
+ -webkit-transition: 0.3s;
+ img {
+ height: auto;
+ }
+ .text {
+ font-size: 1.5rem;
+ line-height: 1.8rem;
+ }
+ }
+ }
+ .area {
+ flex-direction: row;
+ li {
+ width: 19%;
+ .pic {
+ height: auto;
+ }
+ }
+ }
+ }
+}
+@media (min-width: 980px) and (max-width: 1200px) {
+ .wrap {
+ /deep/ .el-carousel {
+ height: 12rem !important;
+ }
+ /deep/ .el-carousel__container {
+ height: 12rem !important;
+ }
+ /deep/ .el-carousel__item {
+ height: 12rem !important;
+ }
+ }
+ .banner-item {
+ img {
+ height: 12rem !important;
+ }
+ .banner-name {
+ font-size: 1.5rem;
+ line-height: 1rem;
+ left: 2rem;
+ bottom: 2rem;
+ }
+ }
+ .block {
+ padding: 1.25rem 0;
+ .b-title {
+ font-size: 1.5rem;
+ margin-bottom: 1rem;
+ }
+ .group,
+ .news {
+ flex-direction: row;
+ li {
+ width: calc((100% - 3rem) / 3);
+ margin: 0 0.8rem 1.95rem 0;
+ -webkit-transition: 0.3s;
+ img {
+ height: auto;
+ }
+ .text {
+ font-size: 1.5rem;
+ line-height: 1.8rem;
+ }
+ }
+ }
+ .area {
+ flex-direction: row;
+ li {
+ width: 19%;
+ .pic {
+ height: auto;
+ }
+ }
+ }
+ }
+}
+
+@media (min-width: 280px) and (max-width: 1200px) {
+ .wrap {
+ /deep/ .el-carousel {
+ height: 18rem;
+ .el-carousel__container {
+ height: 18rem;
+ }
+ img {
+ height: 18rem;
+ }
+ }
+ }
+ .block {
+ padding: 50px 0;
+ .intro {
+ margin-bottom: 30px;
+ }
+ .area {
+ flex-direction: column;
+ li {
+ width: 95%;
+ margin: 1.25rem auto;
+ }
+ }
+ .group,
+ .news {
+ flex-direction: column;
+ li {
+ width: 95%;
+ margin: 20px auto;
+ }
+ }
+ }
+ .area {
+ li {
+ height: auto;
+ .pic {
+ height: 20rem;
+ }
+ .texts {
+ height: 10rem;
+ }
+ }
+ }
+ .group img {
+ height: 20rem;
+ }
+ .news img {
+ height: 20rem;
+ }
+}
+@media (max-width: 320px) {
+ .wrap {
+ /deep/ .el-carousel {
+ height: 12rem !important;
+ }
+ /deep/ .el-carousel__container {
+ height: 12rem !important;
+ }
+ /deep/ .el-carousel__item {
+ height: 12rem !important;
+ }
+ }
+ .banner-item {
+ img {
+ height: 12rem !important;
+ }
+ .banner-name {
+ font-size: 1.5rem;
+ line-height: 1rem;
+ left: 2rem;
+ bottom: 2rem;
+ }
+ }
+ .block {
+ padding: 1.25rem 0;
+ .b-title {
+ font-size: 1.5rem;
+ margin-bottom: 1rem;
+ }
+ .group,
+ .news {
+ li {
+ img {
+ height: auto;
+ }
+ .text {
+ font-size: 1.5rem;
+ line-height: 1.8rem;
+ }
+ }
+ }
+ }
+}
+@media (min-width: 320px) and (max-width: 375px) {
+ .wrap {
+ /deep/ .el-carousel {
+ height: 12rem !important;
+ }
+ /deep/ .el-carousel__container {
+ height: 12rem !important;
+ }
+ /deep/ .el-carousel__item {
+ height: 12rem !important;
+ }
+ }
+ .banner-item {
+ img {
+ height: 12rem !important;
+ }
+ .banner-name {
+ font-size: 1.5rem;
+ line-height: 1rem;
+ left: 2rem;
+ bottom: 2rem;
+ }
+ }
+ .block {
+ padding: 1.25rem 0;
+ .b-title {
+ font-size: 1.5rem;
+ margin-bottom: 1rem;
+ }
+ .group,
+ .news {
+ li {
+ img {
+ height: auto;
+ }
+ .text {
+ font-size: 1.5rem;
+ line-height: 1.8rem;
+ }
+ }
+ }
+ }
+}
+@media (min-width: 375px) and (max-width: 480px) {
+ .wrap {
+ /deep/ .el-carousel {
+ height: 12rem !important;
+ }
+ /deep/ .el-carousel__container {
+ height: 12rem !important;
+ }
+ /deep/ .el-carousel__item {
+ height: 12rem !important;
+ }
+ }
+ .banner-item {
+ img {
+ height: 12rem !important;
+ }
+ .banner-name {
+ font-size: 1.5rem;
+ line-height: 1rem;
+ left: 2rem;
+ bottom: 2rem;
+ }
+ }
+ .block {
+ padding: 1.25rem 0;
+ .b-title {
+ font-size: 1.5rem;
+ margin-bottom: 1rem;
+ }
+ .group,
+ .news {
+ li {
+ img {
+ height: auto;
+ }
+ .text {
+ font-size: 1.5rem;
+ line-height: 1.8rem;
+ }
+ }
+ }
+ .area {
+ li {
+ .pic {
+ height: 22rem;
+ }
+ }
+ }
+ }
+}
+@media (min-width: 480px) and (max-width: 640px) {
+ .wrap {
+ /deep/ .el-carousel {
+ height: 12rem !important;
+ }
+ /deep/ .el-carousel__container {
+ height: 12rem !important;
+ }
+ /deep/ .el-carousel__item {
+ height: 12rem !important;
+ }
+ }
+ .banner-item {
+ img {
+ height: 12rem !important;
+ }
+ .banner-name {
+ font-size: 1.5rem;
+ line-height: 1rem;
+ left: 2rem;
+ bottom: 2rem;
+ }
+ }
+ .block {
+ padding: 1.25rem 0;
+ .b-title {
+ font-size: 1.5rem;
+ margin-bottom: 1rem;
+ }
+ .group,
+ .news {
+ li {
+ img {
+ height: auto;
+ }
+ .text {
+ font-size: 1.5rem;
+ line-height: 1.8rem;
+ }
+ }
+ }
+ .area {
+ li {
+ .pic {
+ height: auto;
+ }
+ }
+ }
+ }
+}
+@media (min-width: 640px) and (max-width: 768px) {
+ .wrap {
+ /deep/ .el-carousel {
+ height: 12rem !important;
+ }
+ /deep/ .el-carousel__container {
+ height: 12rem !important;
+ }
+ /deep/ .el-carousel__item {
+ height: 12rem !important;
+ }
+ }
+ .banner-item {
+ img {
+ height: 12rem !important;
+ }
+ .banner-name {
+ font-size: 1.5rem;
+ line-height: 1rem;
+ left: 2rem;
+ bottom: 2rem;
+ }
+ }
+ .block {
+ padding: 1.25rem 0;
+ .b-title {
+ font-size: 1.5rem;
+ margin-bottom: 1rem;
+ }
+ .group,
+ .news {
+ li {
+ img {
+ height: auto;
+ }
+ .text {
+ font-size: 1.5rem;
+ line-height: 1.8rem;
+ }
+ }
+ }
+ .area {
+ flex-direction: row;
+ li {
+ width: 19%;
+ .pic {
+ height: auto;
+ }
+ }
+ }
+ }
+}
+@media (min-width: 768px) and (max-width: 980px) {
+ .wrap {
+ /deep/ .el-carousel {
+ height: 12rem !important;
+ }
+ /deep/ .el-carousel__container {
+ height: 12rem !important;
+ }
+ /deep/ .el-carousel__item {
+ height: 12rem !important;
+ }
+ }
+ .banner-item {
+ img {
+ height: 12rem !important;
+ }
+ .banner-name {
+ font-size: 1.5rem;
+ line-height: 1rem;
+ left: 2rem;
+ bottom: 2rem;
+ }
+ }
+ .block {
+ padding: 1.25rem 0;
+ .b-title {
+ font-size: 1.5rem;
+ margin-bottom: 1rem;
+ }
+ .group,
+ .news {
+ flex-direction: row;
+ li {
+ width: calc((100% - 3rem) / 3);
+ margin: 0 0.8rem 1.95rem 0;
+ -webkit-transition: 0.3s;
+ img {
+ height: auto;
+ }
+ .text {
+ font-size: 1.5rem;
+ line-height: 1.8rem;
+ }
+ }
+ }
+ .area {
+ flex-direction: row;
+ li {
+ width: 19%;
+ .pic {
+ height: auto;
+ }
+ }
+ }
+ }
+}
+@media (min-width: 980px) and (max-width: 1200px) {
+ .wrap {
+ /deep/ .el-carousel {
+ height: 12rem !important;
+ }
+ /deep/ .el-carousel__container {
+ height: 12rem !important;
+ }
+ /deep/ .el-carousel__item {
+ height: 12rem !important;
+ }
+ }
+ .banner-item {
+ img {
+ height: 12rem !important;
+ }
+ .banner-name {
+ font-size: 1.5rem;
+ line-height: 1rem;
+ left: 2rem;
+ bottom: 2rem;
+ }
+ }
+ .block {
+ padding: 1.25rem 0;
+ .b-title {
+ font-size: 1.5rem;
+ margin-bottom: 1rem;
+ }
+ .group,
+ .news {
+ flex-direction: row;
+ li {
+ width: calc((100% - 3rem) / 3);
+ margin: 0 0.8rem 1.95rem 0;
+ -webkit-transition: 0.3s;
+ img {
+ height: auto;
+ }
+ .text {
+ font-size: 1.5rem;
+ line-height: 1.8rem;
+ }
+ }
+ }
+ .area {
+ flex-direction: row;
+ li {
+ width: 19%;
+ .pic {
+ height: auto;
+ }
+ }
+ }
+ }
+}
\ No newline at end of file
diff --git a/src/pages/researchTeam/index.vue b/src/pages/researchTeam/index.vue
index f47ba9c..1e423c3 100644
--- a/src/pages/researchTeam/index.vue
+++ b/src/pages/researchTeam/index.vue
@@ -238,4 +238,60 @@ export default {
}
}
}
+@media (max-width: 1200px) {
+ .content {
+ width: 95%;
+ }
+ .article {
+ flex-direction: column;
+ .left,
+ .right {
+ width: 100%;
+ }
+ .left {
+ margin-bottom: 30px;
+ }
+ }
+}
+@media (max-width: 980px) {
+ .article {
+ .team-wrap {
+ display: flex;
+ align-items: flex-start;
+ }
+ .letter {
+ flex-direction: column;
+ margin: 16px 10px 0 0;
+ .item {
+ border: 1px solid #dbdbdb;
+ border-top: 0;
+ &:first-child {
+ border-top: 1px solid #dbdbdb;
+ border-radius: 4px 4px 0 0;
+ }
+ &:last-child {
+ border-radius: 0 0 4px 4px;
+ }
+ }
+ }
+ .teams {
+ flex: 1;
+ }
+ }
+}
+@media (max-width: 640px) {
+ .article {
+ .left {
+ .search {
+ width: 50%;
+ }
+ }
+ .teams {
+ flex-direction: column;
+ li {
+ width: 100%;
+ }
+ }
+ }
+}
\ No newline at end of file
diff --git a/src/pages/science/index.vue b/src/pages/science/index.vue
index c0d80b6..caca043 100644
--- a/src/pages/science/index.vue
+++ b/src/pages/science/index.vue
@@ -162,4 +162,266 @@ export default {
font-size: 0.88rem;
}
}
+
+@media (max-width: 1200px) {
+ body {
+ width: 100% !important;
+ }
+ .inner {
+ width: 80%;
+ }
+ .item {
+ img {
+ }
+ .rightText {
+ right: 12px !important;
+ }
+ .texts {
+ width: 85%;
+ box-sizing: border-box;
+ left: -1rem;
+ &:nth-child(2) {
+ right: -1.5rem !important;
+ }
+ .des {
+ -webkit-line-clamp: inherit;
+ }
+ }
+ }
+}
+@media (max-width: 320px) {
+ .wrap {
+ .single-banner {
+ .banner-img {
+ height: 12rem;
+ }
+ .texts {
+ top: 5rem;
+ left: 2rem;
+ .banner-title {
+ font-size: 1.5rem;
+ margin-bottom: 0.5rem;
+ }
+ .banner-des {
+ font-size: 0.85rem;
+ }
+ }
+ }
+ }
+ .block {
+ .inner {
+ img {
+ height: 18rem;
+ }
+ .texts {
+ padding: 1.25rem;
+ top: 1.5rem;
+ h6 {
+ font-size: 1.2rem;
+ }
+ .des {
+ font-size: 0.75rem;
+ }
+ }
+ }
+ }
+}
+@media (min-width: 320px) and (max-width: 375px) {
+ .wrap {
+ .single-banner {
+ .banner-img {
+ height: 12rem;
+ }
+ .texts {
+ top: 5rem;
+ left: 2rem;
+ .banner-title {
+ font-size: 1.5rem;
+ margin-bottom: 0.5rem;
+ }
+ .banner-des {
+ font-size: 0.85rem;
+ }
+ }
+ }
+ }
+ .block {
+ .inner {
+ img {
+ height: 18rem;
+ }
+ .texts {
+ padding: 1.25rem;
+ top: 1.5rem;
+ h6 {
+ font-size: 1.4rem;
+ }
+ .des {
+ font-size: 0.75rem;
+ }
+ }
+ }
+ }
+}
+@media (min-width: 375px) and (max-width: 480px) {
+ .wrap {
+ .single-banner {
+ .banner-img {
+ height: 12rem;
+ }
+ .texts {
+ top: 5rem;
+ left: 2rem;
+ .banner-title {
+ font-size: 1.5rem;
+ margin-bottom: 0.5rem;
+ }
+ .banner-des {
+ font-size: 0.85rem;
+ }
+ }
+ }
+ }
+ .block {
+ .inner {
+ img {
+ height: 18rem;
+ }
+ .texts {
+ padding: 1.25rem;
+ top: 1.5rem;
+ h6 {
+ font-size: 1.4rem;
+ }
+ .des {
+ font-size: 0.75rem;
+ }
+ }
+ }
+ }
+}
+@media (min-width: 480px) and (max-width: 640px) {
+ .wrap {
+ .single-banner {
+ .banner-img {
+ height: 12rem;
+ }
+ .texts {
+ top: 5rem;
+ left: 2rem;
+ .banner-title {
+ font-size: 1.5rem;
+ margin-bottom: 0.5rem;
+ }
+ .banner-des {
+ font-size: 0.85rem;
+ }
+ }
+ }
+ }
+ .block {
+ .inner {
+ img {
+ height: 18rem;
+ }
+ .texts {
+ padding: 1.25rem;
+ top: 1.5rem;
+ }
+ }
+ }
+}
+@media (min-width: 640px) and (max-width: 768px) {
+ .wrap {
+ .single-banner {
+ .banner-img {
+ height: 12rem;
+ }
+ .texts {
+ top: 5rem;
+ left: 2rem;
+ .banner-title {
+ font-size: 1.5rem;
+ margin-bottom: 0.5rem;
+ }
+ .banner-des {
+ font-size: 0.85rem;
+ }
+ }
+ }
+ }
+ .block {
+ .inner {
+ img {
+ height: 18rem;
+ }
+ .texts {
+ padding: 1.25rem;
+ top: 1.5rem;
+ }
+ }
+ }
+}
+@media (min-width: 768px) and (max-width: 980px) {
+ .wrap {
+ .single-banner {
+ .banner-img {
+ height: 12rem;
+ }
+ .texts {
+ top: 5rem;
+ left: 2rem;
+ .banner-title {
+ font-size: 1.5rem;
+ margin-bottom: 0.5rem;
+ }
+ .banner-des {
+ font-size: 0.85rem;
+ }
+ }
+ }
+ }
+ .block {
+ .inner {
+ img {
+ height: 18rem;
+ }
+ .texts {
+ padding: 1.25rem;
+ top: 1.5rem;
+ }
+ }
+ }
+}
+@media (min-width: 980px) and (max-width: 1200px) {
+ .wrap {
+ .single-banner {
+ .banner-img {
+ height: 12rem;
+ }
+ .texts {
+ top: 5rem;
+ left: 2rem;
+ .banner-title {
+ font-size: 1.5rem;
+ margin-bottom: 0.5rem;
+ }
+ .banner-des {
+ font-size: 0.85rem;
+ }
+ }
+ }
+ }
+ .block {
+ .inner {
+ img {
+ height: 18rem;
+ }
+ .texts {
+ padding: 1.25rem;
+ top: 1.5rem;
+ }
+ }
+ }
+}
diff --git a/src/pages/scientific/index.vue b/src/pages/scientific/index.vue
index 724d997..e762b31 100644
--- a/src/pages/scientific/index.vue
+++ b/src/pages/scientific/index.vue
@@ -126,6 +126,7 @@ export default {
.pic {
width: 100%;
height: 100%;
+ object-fit: cover;
}
.texts {
position: absolute;
@@ -290,4 +291,43 @@ export default {
line-height: 1.6;
}
}
+@media (max-width: 1200px) {
+ .items {
+ li {
+ .texts {
+ left: 0;
+ width: 98%;
+ }
+ &:nth-child(even) {
+ .texts {
+ right: auto;
+ }
+ }
+ }
+ }
+ .about {
+ height: 30rem;
+ }
+}
+@media (max-width: 780px) {
+ .program {
+ .slide {
+ flex-direction: column;
+ }
+ .texts {
+ width: 100%;
+ }
+ .img-wrap {
+ width: 100%;
+ height: 250px;
+ }
+ .list {
+ flex-direction: column;
+ li {
+ width: 100%;
+ margin-bottom: 1rem;
+ }
+ }
+ }
+}
diff --git a/src/pages/sfel/index.vue b/src/pages/sfel/index.vue
index 4ed2aff..d15ee23 100644
--- a/src/pages/sfel/index.vue
+++ b/src/pages/sfel/index.vue
@@ -515,6 +515,7 @@ export default {
height: 100vh;
img {
height: 100vh;
+ object-fit: cover;
}
}
}
@@ -569,6 +570,7 @@ export default {
cursor: pointer;
.pic {
transition: 0.5s;
+ object-fit: cover;
&:hover {
transform: scale(1.3);
}
@@ -663,6 +665,7 @@ export default {
.pic {
width: 100%;
height: auto;
+ object-fit: cover;
}
.texts {
padding: 2rem 1.5rem;
@@ -704,6 +707,7 @@ export default {
width: 100%;
height: 100%;
transition: 0.5s;
+ object-fit: cover;
}
.text {
position: absolute;
@@ -835,6 +839,7 @@ export default {
width: 100%;
height: 100%;
transition: 0.5s;
+ object-fit: cover;
}
.text {
position: absolute;
@@ -883,6 +888,7 @@ export default {
}
.pic {
transition: 0.5s;
+ object-fit: cover;
}
&:hover {
.pic {
@@ -911,6 +917,7 @@ export default {
width: 10.4375rem;
height: 10.4375rem;
margin-right: 1.8rem;
+ object-fit: cover;
}
.texts {
width: calc(100% - 12.5rem);
@@ -962,6 +969,7 @@ export default {
width: 100%;
height: 100%;
transition: 0.5s;
+ object-fit: cover;
}
.text {
position: absolute;
@@ -1027,6 +1035,7 @@ export default {
width: 100%;
height: 100%;
transition: 0.5s;
+ object-fit: cover;
}
.texts {
padding: 2rem 1.4rem;
@@ -1091,6 +1100,7 @@ export default {
img {
width: 100%;
height: 24.05rem;
+ object-fit: cover;
}
.texts {
padding: 0 0.9rem 2.5rem;
@@ -1142,6 +1152,7 @@ export default {
width: 100%;
height: 100%;
transition: 0.5s;
+ object-fit: cover;
}
&:hover {
.pic {
@@ -1216,4 +1227,1017 @@ export default {
}
}
}
+
+@media (max-width: 1520px) {
+ .conference .card-list {
+ width: 734px;
+ .texts {
+ width: 460px;
+ }
+ }
+}
+@media (max-width: 1200px) {
+ .tools {
+ display: none;
+ }
+ .sfel-banner {
+ flex-direction: column;
+ .newBox {
+ width: 100% !important;
+ }
+ .right {
+ margin-top: 10px;
+ width: 100%;
+ height: 410px;
+ }
+ }
+ .card {
+ flex-direction: column;
+ li {
+ width: 100%;
+ margin-top: 20px;
+ }
+ }
+ .shop-shows {
+ flex-direction: column;
+ .left {
+ width: 100%;
+ }
+ .right {
+ width: 100%;
+ margin-top: 20px;
+ }
+ }
+ .shows {
+ flex-direction: column;
+ .left {
+ width: 100%;
+ }
+ .card-list {
+ width: 100%;
+ margin-top: 20px;
+ li {
+ flex-direction: column;
+ .pic {
+ width: 100% !important;
+ margin-right: 0;
+ }
+ .texts {
+ margin-top: 20px;
+ width: 100%;
+ }
+ }
+ }
+ }
+ .media-wrap {
+ flex-direction: column;
+ .left {
+ width: 100%;
+ }
+ .right {
+ width: 100%;
+ margin-top: 20px;
+ }
+ }
+ .news {
+ flex-direction: column;
+ li {
+ margin-top: 30px;
+ width: 100%;
+ }
+ }
+ .slide,
+ .list {
+ flex-direction: column;
+ .texts,
+ .img-wrap {
+ width: 100%;
+ }
+ }
+ .list {
+ li {
+ width: 100% !important;
+ margin-top: 20px;
+ }
+ }
+ .slides {
+ div {
+ flex: 1;
+ }
+ }
+ #part6 {
+ .slide {
+ .texts {
+ height: auto;
+ }
+ }
+ }
+}
+@media (min-width: 280px) and (max-width: 1200px) {
+ .block {
+ padding: 2rem 0;
+ }
+ .shop-shows {
+ .slide {
+ height: 18rem;
+ }
+ }
+ .wrap {
+ /deep/ .el-carousel {
+ height: 18rem;
+ img {
+ height: 18rem;
+ }
+ }
+ /deep/ .el-carousel__container {
+ height: 18rem !important;
+ }
+ }
+ .sfel-banner {
+ .newBox {
+ height: 20rem !important;
+ }
+ .right {
+ padding: 1.25rem;
+ height: 20rem;
+ }
+ }
+ .conference {
+ .left {
+ height: 20rem;
+ }
+ }
+ .card-list {
+ li {
+ .pic {
+ height: 15rem !important;
+ }
+ }
+ }
+ .slides {
+ .item {
+ height: 10rem !important;
+ }
+ }
+ .img-wrap {
+ height: 20rem !important;
+ }
+ .news {
+ .wow {
+ img {
+ height: 20rem;
+ }
+ }
+ }
+}
+@media (max-width: 320px) {
+ .wrap {
+ /deep/ .el-carousel {
+ height: 12rem;
+ }
+ /deep/ .el-carousel__container {
+ height: 12rem !important;
+ }
+ /deep/ .el-carousel__item {
+ height: 12rem;
+ img {
+ height: 12rem;
+ }
+ }
+ }
+ .block {
+ .inner {
+ width: 90%;
+ .title {
+ padding-bottom: 1rem;
+ margin-bottom: 1rem;
+ h5 {
+ font-size: 1rem;
+ span {
+ font-size: 0.75rem;
+ }
+ }
+ span {
+ font-size: 0.85rem;
+ }
+ }
+ .sfel-banner {
+ .newBox {
+ height: auto !important;
+ }
+ .right {
+ h6 {
+ font-size: 1.072rem;
+ word-break: break-all;
+ }
+ .des {
+ font-size: 0.9rem;
+ margin: 1rem 0;
+ }
+ .meta {
+ font-size: 0.8rem;
+ }
+ }
+ }
+ .card {
+ margin-top: 1.25rem;
+ li {
+ .pic {
+ height: auto;
+ }
+ }
+ }
+ .shop-shows {
+ .slide {
+ height: auto;
+ p {
+ line-height: 1.7rem;
+ }
+ }
+ }
+ .shows {
+ .left {
+ height: auto;
+ .text {
+ line-height: 2rem;
+ font-size: 0.95rem;
+ }
+ }
+ .card-list {
+ li {
+ .pic {
+ height: auto !important;
+ }
+ }
+ }
+ }
+ .media-wrap {
+ .right {
+ .img-wrap {
+ height: auto !important;
+ }
+ }
+ }
+ .news {
+ li {
+ img {
+ height: auto;
+ }
+ }
+ }
+ .slide {
+ .img-wrap {
+ height: auto !important;
+ }
+ }
+ }
+ }
+ .media-wrap {
+ .left {
+ .slides {
+ .item {
+ // height: auto !important;
+ height: 8rem;
+ }
+ }
+ }
+ }
+}
+@media (min-width: 320px) and (max-width: 375px) {
+ .wrap {
+ /deep/ .el-carousel {
+ height: 15rem;
+ }
+ /deep/ .el-carousel__container {
+ height: 15rem !important;
+ }
+ /deep/ .el-carousel__item {
+ height: 15rem;
+ img {
+ height: 15rem;
+ }
+ }
+ }
+ .block {
+ .inner {
+ width: 90%;
+ .title {
+ padding-bottom: 1rem;
+ margin-bottom: 1rem;
+ h5 {
+ font-size: 1rem;
+ span {
+ font-size: 0.75rem;
+ }
+ }
+ span {
+ font-size: 0.85rem;
+ }
+ }
+ .sfel-banner {
+ .newBox {
+ height: auto !important;
+ }
+ .right {
+ h6 {
+ font-size: 1.072rem;
+ word-break: break-all;
+ }
+ .des {
+ font-size: 0.9rem;
+ margin: 1rem 0;
+ }
+ .meta {
+ font-size: 0.8rem;
+ }
+ }
+ }
+ .card {
+ margin-top: 1.25rem;
+ li {
+ .pic {
+ height: auto;
+ }
+ }
+ }
+ .shop-shows {
+ .slide {
+ height: auto;
+ p {
+ line-height: 1.7rem;
+ }
+ }
+ }
+ .shows {
+ .left {
+ height: auto;
+ .text {
+ line-height: 2rem;
+ font-size: 0.95rem;
+ }
+ }
+ .card-list {
+ li {
+ .pic {
+ height: auto !important;
+ }
+ }
+ }
+ }
+ .media-wrap {
+ .right {
+ .img-wrap {
+ height: auto !important;
+ }
+ }
+ }
+ .news {
+ li {
+ img {
+ height: auto;
+ }
+ }
+ }
+ .slide {
+ .img-wrap {
+ height: auto !important;
+ }
+ }
+ }
+ }
+ .media-wrap {
+ .left {
+ .slides {
+ .item {
+ // height: auto !important;
+ height: 8rem;
+ }
+ }
+ }
+ }
+}
+@media (min-width: 375px) and (max-width: 480px) {
+ .wrap {
+ /deep/ .el-carousel {
+ height: 15rem;
+ }
+ /deep/ .el-carousel__container {
+ height: 15rem !important;
+ }
+ /deep/ .el-carousel__item {
+ height: 15rem;
+ img {
+ height: 15rem;
+ }
+ }
+ }
+ .block {
+ .inner {
+ width: 90%;
+ .title {
+ padding-bottom: 1rem;
+ margin-bottom: 1rem;
+ h5 {
+ font-size: 1rem;
+ span {
+ font-size: 0.75rem;
+ }
+ }
+ span {
+ font-size: 0.85rem;
+ }
+ }
+ .sfel-banner {
+ .newBox {
+ height: auto !important;
+ }
+ .right {
+ h6 {
+ font-size: 1.072rem;
+ word-break: break-all;
+ }
+ .des {
+ font-size: 0.9rem;
+ margin: 1rem 0;
+ }
+ .meta {
+ font-size: 0.8rem;
+ }
+ }
+ }
+ .card {
+ margin-top: 1.25rem;
+ li {
+ .pic {
+ height: auto;
+ }
+ }
+ }
+ .shop-shows {
+ .slide {
+ height: auto;
+ p {
+ line-height: 1.7rem;
+ }
+ }
+ }
+ .shows {
+ .left {
+ height: auto;
+ .text {
+ line-height: 2rem;
+ font-size: 0.95rem;
+ }
+ }
+ .card-list {
+ li {
+ .pic {
+ height: auto !important;
+ }
+ }
+ }
+ }
+ .media-wrap {
+ .right {
+ .img-wrap {
+ height: auto !important;
+ }
+ }
+ }
+ .news {
+ li {
+ img {
+ // height: auto;
+ }
+ }
+ }
+ .slide {
+ .img-wrap {
+ height: auto !important;
+ }
+ }
+ }
+ }
+ .media-wrap {
+ .left {
+ .slides {
+ .item {
+ height: auto !important;
+ }
+ }
+ }
+ }
+}
+@media (min-width: 480px) and (max-width: 640px) {
+ .wrap {
+ /deep/ .el-carousel {
+ height: 15rem;
+ }
+ /deep/ .el-carousel__container {
+ height: 15rem !important;
+ }
+ /deep/ .el-carousel__item {
+ height: 15rem;
+ img {
+ height: 15rem;
+ }
+ }
+ }
+ .block {
+ .inner {
+ width: 90%;
+ .title {
+ padding-bottom: 1rem;
+ margin-bottom: 1rem;
+ h5 {
+ font-size: 1rem;
+ span {
+ font-size: 0.75rem;
+ }
+ }
+ span {
+ font-size: 0.85rem;
+ }
+ }
+ .sfel-banner {
+ .newBox {
+ height: auto !important;
+ }
+ .right {
+ h6 {
+ font-size: 1.072rem;
+ word-break: break-all;
+ }
+ .des {
+ font-size: 0.9rem;
+ margin: 1rem 0;
+ }
+ .meta {
+ font-size: 0.8rem;
+ }
+ }
+ }
+ .card {
+ margin-top: 1.25rem;
+ li {
+ .pic {
+ height: auto;
+ }
+ }
+ }
+ .shop-shows {
+ .slide {
+ height: auto;
+ p {
+ line-height: 1.7rem;
+ }
+ }
+ }
+ .shows {
+ .left {
+ height: auto;
+ .text {
+ line-height: 2rem;
+ font-size: 0.95rem;
+ }
+ }
+ .card-list {
+ li {
+ .pic {
+ height: auto !important;
+ }
+ }
+ }
+ }
+ .media-wrap {
+ .right {
+ .img-wrap {
+ height: auto !important;
+ }
+ }
+ }
+ .news {
+ li {
+ img {
+ height: auto;
+ }
+ }
+ }
+ .slide {
+ .img-wrap {
+ height: auto !important;
+ }
+ }
+ }
+ }
+ .media-wrap {
+ .left {
+ .slides {
+ .item {
+ height: auto !important;
+ }
+ }
+ }
+ }
+}
+@media (min-width: 640px) and (max-width: 768px) {
+ .wrap {
+ /deep/ .el-carousel {
+ height: 15rem;
+ }
+ /deep/ .el-carousel__container {
+ height: 15rem !important;
+ }
+ /deep/ .el-carousel__item {
+ height: 15rem;
+ img {
+ height: 15rem;
+ }
+ }
+ }
+ .block {
+ .inner {
+ width: 90%;
+ .title {
+ padding-bottom: 1rem;
+ margin-bottom: 1rem;
+ h5 {
+ font-size: 1rem;
+ span {
+ font-size: 0.75rem;
+ }
+ }
+ span {
+ font-size: 0.85rem;
+ }
+ }
+ .sfel-banner {
+ flex-direction: row;
+ .newBox {
+ height: auto !important;
+ }
+ .right {
+ margin-top: 0;
+ h6 {
+ font-size: 1.072rem;
+ word-break: break-all;
+ }
+ .des {
+ font-size: 0.9rem;
+ margin: 1rem 0;
+ }
+ .meta {
+ font-size: 0.8rem;
+ }
+ }
+ }
+ .card {
+ flex-direction: row;
+ margin-top: 1.25rem;
+ li {
+ width: calc((100% - 56px) / 3);
+ .pic {
+ height: auto;
+ }
+ }
+ }
+ .shop-shows {
+ flex-direction: row;
+ .left {
+ width: 50%;
+ }
+ .right {
+ width: 50%;
+ margin-top: 0;
+ }
+ .slide {
+ height: auto;
+ p {
+ line-height: 1.7rem;
+ }
+ }
+ }
+ .shows {
+ flex-direction: row;
+ .left {
+ width: 48%;
+ .text {
+ line-height: 2rem;
+ font-size: 0.95rem;
+ }
+ }
+ .card-list {
+ width: 50%;
+ margin-top: 0;
+ li {
+ .pic {
+ height: auto !important;
+ }
+ }
+ }
+ }
+ .media-wrap {
+ .right {
+ .img-wrap {
+ height: auto !important;
+ }
+ }
+ }
+ .news {
+ flex-direction: row;
+ li {
+ img {
+ height: auto;
+ }
+ }
+ }
+ .slide {
+ flex-direction: row;
+ .img-wrap {
+ height: auto !important;
+ }
+ }
+ .list {
+ flex-direction: row;
+ }
+ }
+ }
+ .media-wrap {
+ .left {
+ .slides {
+ .item {
+ height: auto !important;
+ }
+ }
+ }
+ }
+}
+@media (min-width: 768px) and (max-width: 980px) {
+ .wrap {
+ /deep/ .el-carousel {
+ height: 15rem;
+ }
+ /deep/ .el-carousel__container {
+ height: 15rem !important;
+ }
+ /deep/ .el-carousel__item {
+ height: 15rem;
+ img {
+ height: 15rem;
+ }
+ }
+ }
+ .block {
+ .inner {
+ width: 90%;
+ .title {
+ padding-bottom: 1rem;
+ margin-bottom: 1rem;
+ h5 {
+ font-size: 1rem;
+ span {
+ font-size: 0.75rem;
+ }
+ }
+ span {
+ font-size: 0.85rem;
+ }
+ }
+ .sfel-banner {
+ flex-direction: row;
+ .newBox {
+ height: auto !important;
+ }
+ .right {
+ margin-top: 0;
+ h6 {
+ font-size: 1.072rem;
+ word-break: break-all;
+ }
+ .des {
+ font-size: 0.9rem;
+ margin: 1rem 0;
+ }
+ .meta {
+ font-size: 0.8rem;
+ }
+ }
+ }
+ .card {
+ flex-direction: row;
+ margin-top: 1.25rem;
+ li {
+ width: calc((100% - 56px) / 3);
+ .pic {
+ height: auto;
+ }
+ }
+ }
+ .shop-shows {
+ flex-direction: row;
+ .left {
+ width: 50%;
+ }
+ .right {
+ width: 50%;
+ margin-top: 0;
+ }
+ .slide {
+ height: auto;
+ p {
+ line-height: 1.7rem;
+ }
+ }
+ }
+ .shows {
+ flex-direction: row;
+ .left {
+ width: 48%;
+ .text {
+ line-height: 2rem;
+ font-size: 0.95rem;
+ }
+ }
+ .card-list {
+ width: 50%;
+ margin-top: 0;
+ li {
+ .pic {
+ height: auto !important;
+ }
+ }
+ }
+ }
+ .media-wrap {
+ flex-direction: row;
+ .right {
+ margin-top: 0;
+ .img-wrap {
+ height: auto !important;
+ }
+ }
+ }
+ .news {
+ flex-direction: row;
+ li {
+ img {
+ height: auto;
+ }
+ }
+ }
+ .slide {
+ flex-direction: row;
+ .img-wrap {
+ height: auto !important;
+ }
+ }
+ .list {
+ flex-direction: row;
+ }
+ }
+ }
+ .media-wrap {
+ .left {
+ .slides {
+ .item {
+ height: auto !important;
+ }
+ }
+ }
+ }
+}
+@media (min-width: 980px) and (max-width: 1200px) {
+ .wrap {
+ /deep/ .el-carousel {
+ height: 15rem;
+ }
+ /deep/ .el-carousel__container {
+ height: 15rem !important;
+ }
+ /deep/ .el-carousel__item {
+ height: 15rem;
+ img {
+ height: 15rem;
+ }
+ }
+ }
+ .block {
+ .inner {
+ width: 90%;
+ .title {
+ padding-bottom: 1rem;
+ margin-bottom: 1rem;
+ h5 {
+ font-size: 1rem;
+ span {
+ font-size: 0.75rem;
+ }
+ }
+ span {
+ font-size: 0.85rem;
+ }
+ }
+ .sfel-banner {
+ flex-direction: row;
+ .newBox {
+ height: auto !important;
+ }
+ .right {
+ margin-top: 0;
+ h6 {
+ font-size: 1.072rem;
+ word-break: break-all;
+ }
+ .des {
+ font-size: 0.9rem;
+ margin: 1rem 0;
+ }
+ .meta {
+ font-size: 0.8rem;
+ }
+ }
+ }
+ .card {
+ flex-direction: row;
+ margin-top: 1.25rem;
+ li {
+ width: calc((100% - 56px) / 3);
+ .pic {
+ height: auto;
+ }
+ }
+ }
+ .shop-shows {
+ flex-direction: row;
+ .left {
+ width: 50%;
+ }
+ .right {
+ width: 50%;
+ margin-top: 0;
+ }
+ .slide {
+ height: auto;
+ p {
+ line-height: 1.7rem;
+ }
+ }
+ }
+ .shows {
+ flex-direction: row;
+ .left {
+ width: 48%;
+ .text {
+ line-height: 2rem;
+ font-size: 0.95rem;
+ }
+ }
+ .card-list {
+ width: 50%;
+ margin-top: 0;
+ li {
+ .pic {
+ height: auto !important;
+ }
+ }
+ }
+ }
+ .media-wrap {
+ flex-direction: row;
+ .right {
+ margin-top: 0;
+ .img-wrap {
+ height: auto !important;
+ }
+ }
+ }
+ .news {
+ flex-direction: row;
+ li {
+ img {
+ height: auto;
+ }
+ }
+ }
+ .slide {
+ flex-direction: row;
+ .img-wrap {
+ height: auto !important;
+ }
+ }
+ .list {
+ flex-direction: row;
+ }
+ }
+ }
+ .media-wrap {
+ .left {
+ .slides {
+ .item {
+ height: auto !important;
+ }
+ }
+ }
+ }
+}
\ No newline at end of file
diff --git a/src/pages/sfelNew/index.vue b/src/pages/sfelNew/index.vue
index 535747d..c255783 100644
--- a/src/pages/sfelNew/index.vue
+++ b/src/pages/sfelNew/index.vue
@@ -1,6 +1,7 @@
-
-
+
@@ -16,226 +17,229 @@
-
-
-
-
-
- - {{ modules[1].form.title }} - {{ modules[1].form.subTitle }} -
- MORE -
-
-
-
+ {{ curArticle.title }}
- - --
-
-
+
+
-
+
+
+
-
- + {{ modules[1].form.title }} + {{ modules[1].form.subTitle }} +
+ MORE-
-
-
+
+ {{ curArticle.title }}
+ + +-
+
+
-
-
-
-
-
- - {{ modules[3].form.title }} - {{ modules[3].form.subTitle }} -
- MORE -
-
-
-
-
-
-
-
-
-
- ![]()
-
- {{ item.title }}
-
-
+
-
-
-
-
-
- ![]()
- {{ modules[7].form.title }} - {{ modules[7].form.subTitle }} -
- MORE +
+
+
-
+
+ + {{ modules[3].form.title }} + {{ modules[3].form.subTitle }} +
+ MORE +
+
+
+
+
+
+
+
+
+
+ ![]()
+
+ {{ item.title }}
+
+
+ -
+
+
-
-
@@ -246,6 +250,7 @@ import mixins from '@/mixins/page'
import Setting from '@/setting'
import Util from '@/libs/util'
import WOW from 'wow.js'
+import $ from 'jquery'
export default {
mixins: [mixins],
data () {
@@ -258,10 +263,13 @@ export default {
articles4: [],
curInd: 0,
curArticle: {},
+ hide: false,
+ lastScrollTop: 0
}
},
mounted () {
new WOW().init()
+ if (this.$store.getters.getModelType) document.onscroll = this.throttle(this.scroll, 200)
},
methods: {
// 获取文章详情
@@ -353,6 +361,89 @@ export default {
toAnchor (e) {
const el = document.querySelector(`#part${e.id}`)
el && el.scrollIntoView()
+ },
+
+ scroll () {
+ let scrollTop = window.pageYOffset || document.documentElement.scrollTop || document.body.scrollTop
+
+ if (this.lastScrollTop < scrollTop && !this.hide) {
+ // this.hide = true
+ // document.querySelector(`#part2`).scrollIntoView({
+ // behavior: 'smooth'
+ // })
+ this.hide = true
+ setTimeout(() => {
+ $(window).scrollTop(100)
+ // window.scrollTo({
+ // top: window.innerWidth / 2.03,
+ // behavior: 'smooth' // 平滑滚动
+ // });
+ // this.scrollTop(window.innerWidth / 2.03, 200)
+ }, 300)
+
+ } else if (this.lastScrollTop > scrollTop && scrollTop == 0 && this.hide) {
+ // this.hide = false
+ // document.querySelector(`#part1`).scrollIntoView({
+ // behavior: 'smooth'
+ // })
+ // window.scrollTo({
+ // top: 0,
+ // behavior: 'smooth' // 平滑滚动
+ // });
+ this.hide = false
+ setTimeout(() => {
+ $(window).scrollTop(0)
+ // window.scrollTo({
+ // top: 0,
+ // behavior: 'smooth' // 平滑滚动
+ // });
+ // this.scrollTop(0, 200)
+ }, 300)
+ }
+ this.lastScrollTop = scrollTop
+ },
+ scrollTop (number = 0, time) {
+ if (!time) {
+ document.body.scrollTop = document.documentElement.scrollTop = number;
+ return number;
+ }
+ const spacingTime = 20; // 设置循环的间隔时间 值越小消耗性能越高
+ let spacingInex = time / spacingTime; // 计算循环的次数
+ let nowTop = document.body.scrollTop + document.documentElement.scrollTop; // 获取当前滚动条位置
+ let everTop = (number - nowTop) / spacingInex; // 计算每次滑动的距离
+ let scrollTimer = setInterval(() => {
+ if (spacingInex > 0) {
+ spacingInex--;
+ this.scrollTop(nowTop += everTop);
+ } else {
+ clearInterval(scrollTimer); // 清除计时器
+ }
+ }, spacingTime);
+ },
+ // 节流
+ throttle (fn, time) {
+ // 上一次的执行时间
+ let pre = 0
+ let timeout = null
+ return function (...args) {
+ const now = Date.now()
+ // 时间差超过了设定的时间间隔
+ if (now - pre > time) {
+ pre = now
+ fn.apply(this, args)
+ } else {
+ // 没有超过设定的时间间隔,则后续的事件会直接清除
+ if (timeout) {
+ clearTimeout(timeout)
+ timeout = null
+ }
+ // 最后一次的事件会触发
+ timeout = setTimeout(() => {
+ pre = now
+ fn.apply(this, args)
+ }, time);
+ }
+ }
}
}
};
@@ -361,19 +452,42 @@ export default {
\ No newline at end of file
diff --git a/src/pages/speech/index.vue b/src/pages/speech/index.vue
index 62cddf6..8dc6e4a 100644
--- a/src/pages/speech/index.vue
+++ b/src/pages/speech/index.vue
@@ -115,4 +115,17 @@ export default {
}
}
}
+@media (max-width: 920px) {
+ .inner {
+ flex-direction: column;
+ justify-content: center;
+ align-items: center;
+ .pic {
+ max-width: 100%;
+ }
+ .texts {
+ margin: 20px 0 0;
+ }
+ }
+}
diff --git a/src/pages/talent/index.vue b/src/pages/talent/index.vue
index 413212c..8e4d0bf 100644
--- a/src/pages/talent/index.vue
+++ b/src/pages/talent/index.vue
@@ -298,4 +298,360 @@ export default {
line-height: 1.5rem;
}
}
+
+@media (min-width: 280px) and (max-width: 1200px) {
+ .single-banner {
+ .texts {
+ left: 200px;
+ .banner-title {
+ font-size: 2.2rem;
+ }
+ }
+ }
+ .block {
+ padding: 30px 0;
+ .inner {
+ .item {
+ flex-direction: column;
+ padding: 1.5rem;
+ }
+ .texts {
+ width: 100%;
+ padding: 1.5rem;
+ }
+ }
+ }
+ .style {
+ /deep/ .el-carousel__container {
+ height: 27rem !important;
+ }
+ .wow {
+ margin-bottom: 2rem;
+ }
+ .item {
+ height: 25rem;
+ }
+ }
+}
+
+@media (max-width: 320px) {
+ .single-banner {
+ .banner-img {
+ height: 12rem;
+ }
+ .texts {
+ left: 2rem;
+ top: 3rem;
+ .banner-title {
+ font-size: 1.5rem;
+ }
+ .banner-des {
+ font-size: 1rem;
+ }
+ }
+ }
+ .block {
+ .inner {
+ width: 100%;
+ .item {
+ .img-wrap {
+ width: 100%;
+ height: auto;
+ }
+ }
+ }
+ }
+ .style {
+ width: 100%;
+ /deep/ .el-carousel {
+ height: 13rem !important;
+ }
+ /deep/ .el-carousel__container {
+ height: 13rem !important;
+ }
+ .item {
+ height: 13rem;
+ .text {
+ line-height: 1.5rem;
+ font-size: 1rem;
+ }
+ }
+ }
+}
+@media (min-width: 320px) and (max-width: 375px) {
+ .single-banner {
+ .banner-img {
+ height: 12rem;
+ }
+ .texts {
+ left: 2rem;
+ top: 3rem;
+ .banner-title {
+ font-size: 1.5rem;
+ }
+ .banner-des {
+ font-size: 1rem;
+ }
+ }
+ }
+ .block {
+ .inner {
+ width: 100%;
+ .item {
+ .img-wrap {
+ width: 100%;
+ height: auto;
+ }
+ }
+ }
+ }
+ .style {
+ width: 100%;
+ /deep/ .el-carousel {
+ height: 13rem !important;
+ }
+ /deep/ .el-carousel__container {
+ height: 13rem !important;
+ }
+ .item {
+ height: 13rem;
+ .text {
+ line-height: 1.5rem;
+ font-size: 1rem;
+ }
+ }
+ }
+}
+@media (min-width: 375px) and (max-width: 480px) {
+ .single-banner {
+ .banner-img {
+ height: 12rem;
+ }
+ .texts {
+ left: 2rem;
+ top: 3rem;
+ .banner-title {
+ font-size: 1.5rem;
+ }
+ .banner-des {
+ font-size: 1rem;
+ }
+ }
+ }
+ .block {
+ .inner {
+ width: 100%;
+ .item {
+ .img-wrap {
+ width: 100%;
+ height: auto;
+ }
+ }
+ }
+ }
+ .style {
+ width: 100%;
+ /deep/ .el-carousel {
+ height: 13rem !important;
+ }
+ /deep/ .el-carousel__container {
+ height: 13rem !important;
+ }
+ .item {
+ height: 13rem;
+ .text {
+ line-height: 1.5rem;
+ font-size: 1rem;
+ }
+ }
+ }
+}
+@media (min-width: 480px) and (max-width: 640px) {
+ .single-banner {
+ .banner-img {
+ height: 12rem;
+ }
+ .texts {
+ left: 2rem;
+ top: 3rem;
+ .banner-title {
+ font-size: 1.5rem;
+ }
+ .banner-des {
+ font-size: 1rem;
+ }
+ }
+ }
+ .block {
+ .inner {
+ width: 100%;
+ .item {
+ .img-wrap {
+ width: 100%;
+ height: auto;
+ }
+ }
+ }
+ }
+ .style {
+ width: 100%;
+ /deep/ .el-carousel {
+ height: 13rem !important;
+ }
+ /deep/ .el-carousel__container {
+ height: 13rem !important;
+ }
+ .item {
+ height: 13rem;
+ .text {
+ line-height: 1.5rem;
+ font-size: 1rem;
+ }
+ }
+ }
+}
+@media (min-width: 640px) and (max-width: 768px) {
+ .single-banner {
+ .banner-img {
+ height: 12rem;
+ }
+ .texts {
+ left: 2rem;
+ top: 3rem;
+ .banner-title {
+ font-size: 1.5rem;
+ }
+ .banner-des {
+ font-size: 1rem;
+ }
+ }
+ }
+ .block {
+ .inner {
+ width: 100%;
+ .item {
+ .img-wrap {
+ width: 100%;
+ height: auto;
+ }
+ }
+ }
+ }
+ .style {
+ width: 100%;
+ /deep/ .el-carousel {
+ height: 13rem !important;
+ }
+ /deep/ .el-carousel__container {
+ height: 13rem !important;
+ }
+ .item {
+ height: 13rem;
+ .text {
+ line-height: 1.5rem;
+ font-size: 1rem;
+ }
+ }
+ }
+}
+@media (min-width: 768px) and (max-width: 980px) {
+ .single-banner {
+ .banner-img {
+ height: 12rem;
+ }
+ .texts {
+ left: 2rem;
+ top: 3rem;
+ .banner-title {
+ font-size: 1.5rem;
+ }
+ .banner-des {
+ font-size: 1rem;
+ }
+ }
+ }
+ .block {
+ .inner {
+ width: 100%;
+ .item {
+ width: 100%;
+ flex-direction: row;
+ .img-wrap {
+ width: 60%;
+ height: auto;
+ }
+ .texts {
+ width: 80%;
+ margin-left: 1.5rem;
+ }
+ }
+ }
+ }
+ .style {
+ width: 100%;
+ /deep/ .el-carousel {
+ height: 18rem !important;
+ }
+ /deep/ .el-carousel__container {
+ height: 18rem !important;
+ }
+ .item {
+ height: 18rem;
+ .text {
+ line-height: 1.5rem;
+ font-size: 1rem;
+ }
+ }
+ }
+}
+@media (min-width: 980px) and (max-width: 1200px) {
+ .single-banner {
+ .banner-img {
+ height: 12rem;
+ }
+ .texts {
+ left: 2rem;
+ top: 3rem;
+ .banner-title {
+ font-size: 1.5rem;
+ }
+ .banner-des {
+ font-size: 1rem;
+ }
+ }
+ }
+ .block {
+ .inner {
+ width: 100%;
+ .item {
+ width: 100%;
+ flex-direction: row;
+ .img-wrap {
+ width: 60%;
+ height: auto;
+ }
+ .texts {
+ width: 80%;
+ margin-left: 1.5rem;
+ }
+ }
+ }
+ }
+ .style {
+ width: 100%;
+ /deep/ .el-carousel {
+ height: 20rem !important;
+ }
+ /deep/ .el-carousel__container {
+ height: 20rem !important;
+ }
+ .item {
+ height: 20rem;
+ .text {
+ line-height: 1.5rem;
+ font-size: 1rem;
+ }
+ }
+ }
+}
\ No newline at end of file
diff --git a/src/pages/talentCenter/index.vue b/src/pages/talentCenter/index.vue
index e73f206..674e65d 100644
--- a/src/pages/talentCenter/index.vue
+++ b/src/pages/talentCenter/index.vue
@@ -322,4 +322,311 @@ export default {
}
}
}
+
+@media (max-width: 1200px) {
+ .content {
+ width: 98%;
+ }
+ .article {
+ flex-direction: column;
+ .left,
+ .right {
+ width: 100%;
+ }
+ .left {
+ margin-bottom: 30px;
+ }
+ }
+}
+
+@media (min-width: 280px) and (max-width: 750px) {
+ .article {
+ .recruit {
+ li {
+ flex-direction: column;
+ }
+ .pic {
+ width: 100%;
+ margin-bottom: 10px;
+ }
+ }
+ .notice {
+ flex-direction: column;
+ li {
+ width: 100%;
+ }
+ }
+ }
+}
+@media (max-width: 1200px) {
+ .content {
+ .article {
+ flex-direction: column;
+ .left {
+ width: 100%;
+ .recruit {
+ li {
+ flex-direction: column;
+ .pic {
+ width: 100%;
+ }
+ .texts {
+ margin-top: 0.8rem;
+ }
+ }
+ }
+ .notice {
+ flex-direction: column;
+ li {
+ width: 100%;
+ }
+ }
+ }
+ .right {
+ width: 100%;
+ .el-tree {
+ display: none;
+ }
+ }
+ }
+ }
+}
+@media (max-width: 320px) {
+ .wrap {
+ .single-banner {
+ .banner-img {
+ height: 13rem;
+ }
+ .texts {
+ left: 3rem;
+ top: 7rem;
+ }
+ }
+ }
+ .content {
+ .article {
+ .left {
+ .recruit {
+ li {
+ .pic {
+ height: 13rem;
+ }
+ }
+ }
+ .notice {
+ li {
+ height: auto;
+ .pic {
+ height: 13rem;
+ }
+ }
+ }
+ }
+ }
+ }
+}
+@media (min-width: 320px) and (max-width: 375px) {
+ .wrap {
+ .single-banner {
+ .banner-img {
+ height: 15rem;
+ }
+ .texts {
+ left: 3rem;
+ top: 7rem;
+ }
+ }
+ }
+ .content {
+ .article {
+ .left {
+ .recruit {
+ li {
+ .pic {
+ height: 15rem;
+ }
+ }
+ }
+ .notice {
+ li {
+ height: auto;
+ .pic {
+ height: 15rem;
+ }
+ }
+ }
+ }
+ }
+ }
+}
+@media (min-width: 375px) and (max-width: 480px) {
+ .wrap {
+ .single-banner {
+ .banner-img {
+ height: 18rem;
+ }
+ .texts {
+ left: 3rem;
+ top: 10rem;
+ }
+ }
+ }
+ .content {
+ .article {
+ .left {
+ .recruit {
+ li {
+ .pic {
+ height: 18rem;
+ }
+ }
+ }
+ .notice {
+ li {
+ height: auto;
+ .pic {
+ height: 18rem;
+ }
+ }
+ }
+ }
+ }
+ }
+}
+@media (min-width: 480px) and (max-width: 640px) {
+ .wrap {
+ .single-banner {
+ .banner-img {
+ height: 20rem;
+ }
+ .texts {
+ left: 3rem;
+ top: 12rem;
+ }
+ }
+ }
+ .content {
+ .article {
+ .left {
+ .recruit {
+ li {
+ .pic {
+ height: 22rem;
+ }
+ }
+ }
+ .notice {
+ li {
+ height: auto;
+ .pic {
+ height: 22rem;
+ }
+ }
+ }
+ }
+ }
+ }
+}
+@media (min-width: 640px) and (max-width: 768px) {
+ .wrap {
+ .single-banner {
+ .banner-img {
+ height: 22rem;
+ }
+ .texts {
+ left: 3rem;
+ top: 14rem;
+ }
+ }
+ }
+ .content {
+ .article {
+ .left {
+ .recruit {
+ li {
+ .pic {
+ height: 26rem;
+ }
+ }
+ }
+ .notice {
+ li {
+ height: auto;
+ .pic {
+ height: 26rem;
+ }
+ }
+ }
+ }
+ }
+ }
+}
+@media (min-width: 768px) and (max-width: 980px) {
+ .wrap {
+ .single-banner {
+ .banner-img {
+ height: 26rem;
+ }
+ .texts {
+ left: 3rem;
+ top: 16rem;
+ }
+ }
+ }
+ .content {
+ .article {
+ .left {
+ .recruit {
+ li {
+ .pic {
+ height: 30rem;
+ }
+ }
+ }
+ .notice {
+ li {
+ height: auto;
+ .pic {
+ height: 30rem;
+ }
+ }
+ }
+ }
+ }
+ }
+}
+@media (min-width: 980px) and (max-width: 1200px) {
+ .wrap {
+ .single-banner {
+ .banner-img {
+ height: 30rem;
+ }
+ .texts {
+ left: 3rem;
+ top: 18rem;
+ }
+ }
+ }
+ .content {
+ .article {
+ .left {
+ .recruit {
+ li {
+ .pic {
+ height: 35rem;
+ }
+ }
+ }
+ .notice {
+ li {
+ height: auto;
+ .pic {
+ height: 35rem;
+ }
+ }
+ }
+ }
+ }
+ }
+}
\ No newline at end of file
diff --git a/src/pages/talentCentre/index.vue b/src/pages/talentCentre/index.vue
index c78fadc..6c2a611 100644
--- a/src/pages/talentCentre/index.vue
+++ b/src/pages/talentCentre/index.vue
@@ -204,6 +204,7 @@ export default {
.pic {
width: 100%;
height: 100%;
+ object-fit: cover;
}
.texts {
position: absolute;
@@ -269,4 +270,50 @@ export default {
}
}
}
+
+@media (max-width: 1200px) {
+ .content {
+ width: 90%;
+ }
+ .article {
+ flex-direction: column;
+ .left {
+ width: 100%;
+ .recruit {
+ li {
+ flex-direction: column;
+ .pic {
+ width: 100%;
+ }
+ .texts {
+ margin-top: 0.8rem;
+ }
+ }
+ }
+ .notice {
+ flex-direction: column;
+ li {
+ width: 100%;
+ }
+ }
+ }
+ .right {
+ width: 100%;
+ }
+ }
+}
+@media (max-width: 480px) {
+ .article {
+ .left {
+ .people {
+ li {
+ .texts {
+ left: 10px;
+ right: auto;
+ }
+ }
+ }
+ }
+ }
+}
\ No newline at end of file
diff --git a/src/pages/team/index.vue b/src/pages/team/index.vue
index 0ea1896..cabceb6 100644
--- a/src/pages/team/index.vue
+++ b/src/pages/team/index.vue
@@ -101,6 +101,7 @@ export default {
width: 224px;
height: 268px;
margin-right: 25px;
+ object-fit: cover;
}
h6 {
font-size: 1.2rem;
@@ -120,4 +121,26 @@ export default {
}
}
}
+@media (max-width: 1200px) {
+ .content {
+ width: 95%;
+ flex-direction: column;
+ .left,
+ .right {
+ width: 100%;
+ }
+ }
+}
+@media (max-width: 640px) {
+ .content {
+ .list {
+ li {
+ flex-direction: column;
+ }
+ .pic {
+ margin: 0 0 20px 0;
+ }
+ }
+ }
+}
\ No newline at end of file
diff --git a/src/pages/userSharing/index.vue b/src/pages/userSharing/index.vue
index 65edc85..1bb1eb2 100644
--- a/src/pages/userSharing/index.vue
+++ b/src/pages/userSharing/index.vue
@@ -18,7 +18,8 @@
-
-
-
- ![]()
+
+
-
+
+
+
+
+
+
+ + {{ modules[7].form.title }} + {{ modules[7].form.subTitle }} +
+ MORE +
+
+
+
+
+
+
+ ![]()
+
+ {{ articles3[0].title }}
+
+ ![]()
+
+ {{ articles3[1].title }}
+ -
+
+
+
+
+ ![]()
-
- {{ articles3[0].title }}
- ![]()
+
+ {{ articles3[5].title }}
+{{ articles3[5].mainBody }}
+
+
-
+
-
+
+
+ + {{ modules[11].form.title }} + {{ modules[11].form.subTitle }} +
+ MORE +
+
+
+ {{ articles4[0].title }}
+{{ articles4[0].mainBody }}
+
+
+ ![]()
-
{{ articles3[1].title }}
-
-
-
-
- ![]()
-
-
-
- {{ articles3[5].title }}
-{{ articles3[5].mainBody }}
-
-
-
-
-
- - {{ modules[11].form.title }} - {{ modules[11].form.subTitle }} -
- MORE +
-
-
-
- {{ articles4[0].title }}
-{{ articles4[0].mainBody }}
-
-
- ![]()
-
- -
-
-
USERS SHARE
{{ modules[1].form.des }}
+ data-wow-delay="0.8s"
+ v-html="modules[1].form.des">