From d05dd90b7b29bec9bdbdddfa40ef2ef10b7582a0 Mon Sep 17 00:00:00 2001 From: chen <2659004835@qq.com> Date: Thu, 23 Dec 2021 19:27:42 +0800 Subject: [PATCH] =?UTF-8?q?=E6=96=B0=E5=A2=9E=E6=95=99=E5=B8=88=E8=AF=A6?= =?UTF-8?q?=E6=83=85?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- package.json | 1 + src/assets/css/electron.css | 35 ++++++- src/components/babyAlbum.vue | 37 ++++--- src/components/babyAlbumDetail.vue | 124 +++++++++++++++++++++++ src/components/newsInformation.vue | 62 ++++++++---- src/components/newsInformationDetail.vue | 55 ++++++++++ src/components/teacherStyle.vue | 49 +++++---- src/components/teacherStyleDetail.vue | 44 ++++++++ src/main.js | 3 +- 9 files changed, 359 insertions(+), 51 deletions(-) create mode 100644 src/components/babyAlbumDetail.vue create mode 100644 src/components/newsInformationDetail.vue create mode 100644 src/components/teacherStyleDetail.vue diff --git a/package.json b/package.json index 9e3dc7e..01598e0 100644 --- a/package.json +++ b/package.json @@ -41,6 +41,7 @@ "rimraf": "^2.6.0", "semver": "^5.3.0", "shelljs": "^0.7.6", + "swiper": "^3.4.2", "uglifyjs-webpack-plugin": "^1.1.1", "url-loader": "^0.5.8", "vue-loader": "^13.3.0", diff --git a/src/assets/css/electron.css b/src/assets/css/electron.css index bbf5acb..e7a4f84 100644 --- a/src/assets/css/electron.css +++ b/src/assets/css/electron.css @@ -15,6 +15,7 @@ img { .clips1{display: -webkit-box;-webkit-box-orient: vertical;-webkit-line-clamp: 1;overflow: hidden;text-overflow: ellipsis;word-wrap: break-word;word-break:break-all;} .clips2{display: -webkit-box;-webkit-box-orient: vertical;-webkit-line-clamp: 2;overflow: hidden;text-overflow: ellipsis;word-wrap: break-word;word-break:break-all;} .clips3{display: -webkit-box;-webkit-box-orient: vertical;-webkit-line-clamp: 3;overflow: hidden;text-overflow: ellipsis;word-wrap: break-word;word-break:break-all;} +.clips4{display: -webkit-box;-webkit-box-orient: vertical;-webkit-line-clamp: 4;overflow: hidden;text-overflow: ellipsis;word-wrap: break-word;word-break:break-all;} /* 头部导航 */ .header-box { position: sticky; @@ -456,8 +457,6 @@ img { font-weight: bold; color: #3F3F3F; text-align: center; - border-bottom: 1px solid #D3D3D3; - padding-bottom: 15px; } .yiqing-content { height: 680px; @@ -468,7 +467,10 @@ img { color: #666666; line-height: 30px; margin-top: 18px; + border-top: 1px solid #D3D3D3; + padding-top: 15px; } +.back-img {width: 48px;height: 48px;position: absolute;top: 20px;right: 20px;} .yiqing-content::-webkit-scrollbar { display: none; } @@ -516,6 +518,35 @@ img { .notice-title img{width: 21px;height: 21px;margin-right: 12px;} .notice-title div{font-size: 18px;color: #3F3F3F;font-weight: bold;} .noticeInfo-time {font-size: 14px;color: #959595;} +/* 新闻动态 */ +.news-box {display: flex;border-bottom: 1px solid #D3D3D3;padding-bottom: 18px;margin-top: 18px;} +.news-box:first-child {margin-top: 0px;} +.news-img {width: 202px;height: auto;object-fit: cover;margin-right: 20px;flex-shrink: 0;} +.news-right-box {display: flex;flex-direction: column;justify-content: space-between;} +.news-content-box {display: flex;justify-content: space-between;align-items: flex-end;} +.news-content-box .clips1 {font-size: 20px;font-weight: 800;color: #3F3F3F;margin-right: 30px;} +.new-time-box {font-size: 14px;font-weight: 500;color: #959595;flex-shrink: 0;width: 170px;display: flex;justify-content: space-between;} +.news-right-box .clips3 {font-size: 16px;font-weight: 400;color: #666666;line-height: 30px;margin-top: 16px;margin-bottom: 24px;} +.news-num-box {display: flex;align-items: center;} +.news-num-box img {width: 21px;height: 14px;margin-right: 10px;} +.news-num-box div {font-size: 14px;font-weight: 500;color: #9C7CFA;} +/* 教师风采 */ +.teacher-title {text-align: left;padding-right: 50px;} +.teacher-content-box {border-top: 1px solid #D3D3D3;margin-top: 18px;padding-top: 23px;display: flex;} +.teacher-img {width: 208px;height: 208px;border-radius: 100%;border: 5px solid #ECE6FF;flex-shrink: 0;margin-right: 58px;} +.teacher-right-box {font-size: 16px;color: #666666;line-height: 30px;} +/* 宝宝相册详情 */ +.babyalbum-detail-box { + width: 1200px; + height: 818px; + background: #FFFFFF; + border: 3px solid #7557CC; + border-radius: 15px; + margin: 0 auto; + margin-top: 57px; + margin-bottom: 110px; + padding: 32px 40px; +} @media screen and (min-width:768px) and (max-width:1024px) { .header-box { background-color: #000000; diff --git a/src/components/babyAlbum.vue b/src/components/babyAlbum.vue index be3bfbd..e8e2d6f 100644 --- a/src/components/babyAlbum.vue +++ b/src/components/babyAlbum.vue @@ -1,19 +1,26 @@ + diff --git a/src/components/newsInformation.vue b/src/components/newsInformation.vue index 00b1994..4fe249b 100644 --- a/src/components/newsInformation.vue +++ b/src/components/newsInformation.vue @@ -1,34 +1,60 @@ + + diff --git a/src/components/teacherStyle.vue b/src/components/teacherStyle.vue index f57cd30..a3be844 100644 --- a/src/components/teacherStyle.vue +++ b/src/components/teacherStyle.vue @@ -1,37 +1,50 @@ + + diff --git a/src/main.js b/src/main.js index 99c2810..e1f9b57 100644 --- a/src/main.js +++ b/src/main.js @@ -7,7 +7,8 @@ Vue.prototype.$axios = axios import https from './config.js' Vue.prototype.$https = https; import router from './router' - +import 'swiper/dist/css/swiper.min.css' +import 'swiper/dist/js/swiper.min' /* eslint-disable no-new */ new Vue({ el: '#app',