From 69494808b8ce6a39b161649b5e444f2f6f836628 Mon Sep 17 00:00:00 2001 From: unknown <qq1940665526@163.com> Date: 星期一, 17 六月 2024 17:19:58 +0800 Subject: [PATCH] 优化 --- src/books/sportsAndHealth/css/default.less | 346 +++++++++++++++++++++++++++++++++++++++++++++++++-------- 1 files changed, 298 insertions(+), 48 deletions(-) diff --git a/src/books/sportsAndHealth/css/default.less b/src/books/sportsAndHealth/css/default.less index f777519..775f1d2 100644 --- a/src/books/sportsAndHealth/css/default.less +++ b/src/books/sportsAndHealth/css/default.less @@ -18,7 +18,6 @@ font-size: 18px; .chapter { - textarea { width: 100%; font-family: 'FZLTXIHJW'; @@ -45,25 +44,29 @@ box-sizing: border-box; } - .bodystyle-chapter001 { + .gif-Con { + max-width: 200px; + } + + .bodystyle-chapter { display: flex; justify-content: space-between; align-items: center; width: 100%; position: relative; - .bj-chapter001-bj-icon { + .bj-chapter-bj-icon { width: 100%; padding-top: 15px; } - .bj-chapter001-con { + .bj-chapter-con { width: 60%; position: absolute; left: 0; top: 5%; - .bj-chapter001-con-icon { + .bj-chapter-con-icon { width: 100%; img { @@ -71,6 +74,74 @@ width: 100%; } } + } + } + + .header-odd { + width: 100%; + height: 100px; + display: flex; + justify-content: flex-end; + align-items: flex-end; + + span { + margin-right: 28px; + font-family: 'FZLTXIHJW'; + font-size: 18px; + } + span:nth-child(3) { + margin-right: 0; + } + + .mk { + color: #f39938; + font-weight: 700; + } + + .sub { + color: #808285; + font-weight: 600; + } + + .sub-title { + color: #a8a9ad; + } + + .sub-page { + color: #a8a9ad; + } + } + + .line-page { + width: 1px; + height: 100%; + border-left: 2px dotted #eee; + margin:0 14px; + } + + .header-even { + width: 100%; + height: 100px; + display: flex; + justify-content: flex-start; + align-items: flex-end; + span { + margin-left: 28px; + font-family: 'FZLTXIHJW'; + font-size: 18px; + } + + .sub-page { + color: #a8a9ad; + } + + .book-title { + color: #f39938; + font-weight: 700; + } + + span:nth-child(3){ + margin-left: 0; } } @@ -212,12 +283,13 @@ span { display: block; - height: 25px; - line-height: 15px; + height: 30px; + line-height: 19px; border: 1px solid #89a0d0; padding: 5px 15px; box-sizing: border-box; border-radius: 5px; + font-size: 14px; cursor: pointer; -webkit-user-select: none; /* Safari 3.1+ */ @@ -274,6 +346,10 @@ } } + .textHeader { + min-height: 1150px; + } + .bj-img { position: absolute; left: 0; @@ -286,18 +362,20 @@ background-repeat: no-repeat; display: flex; justify-content: flex-start; + } - .bj-empyt-chapter01 { - width: 40%; - height: 100%; - } + .bj-empyt-chapter { + width: 40%; + height: 100%; + margin-right: 5%; + } - .bj-text01 { - width: 60%; - height: 50%; - padding-top: 60%; - padding-right: 10%; - } + .bj-text { + padding-top: 60%; + padding-right: 10%; + float: right; + height: auto; + width: 100%; } .bj-img02 { @@ -312,18 +390,6 @@ background-repeat: no-repeat; display: flex; justify-content: flex-start; - - .bj-empyt-chapter02 { - width: 40%; - height: 100%; - } - - .bj-text02 { - width: 60%; - height: 50%; - padding-top: 60%; - padding-right: 10%; - } } .bj-img03 { @@ -338,18 +404,6 @@ background-repeat: no-repeat; display: flex; justify-content: flex-start; - - .bj-empyt-chapter03 { - width: 40%; - height: 100%; - } - - .bj-text03 { - width: 60%; - height: 50%; - padding-top: 50%; - padding-right: 10%; - } } .bj-byb { @@ -555,6 +609,7 @@ margin: 0; // font-weight: 900; margin-bottom: 10px; + text-indent: 2em; } @@ -745,7 +800,7 @@ font-family: "瀹嬩綋"; font-size: 18px; text-align: justify; - padding: 10% 10%; + padding: 6% 10% 10% 10%; box-sizing: border-box; line-height: 30px; } @@ -1658,7 +1713,18 @@ } @media screen and (max-width: 800px) { + + .chapter { + .coverImg { + height: 100%; + overflow: hidden; + } + + .page-box { + min-height: 1000px !important; + } + .pdf-tips-con { width: 100%; min-width: 200px; @@ -1671,22 +1737,19 @@ .pdf-wall { max-width: 180px; position: relative; - left: 30px; - top: 25px; - border: 2px dotted #5d78bb; display: flex; flex-direction: column; justify-content: flex-start; align-items: flex-start; - border: 2px dotted #5d78bb; padding: 10px; box-sizing: border-box; border-radius: 10px; + top: 0 !important; .pdf-item { display: flex; flex-direction: column; - justify-content: flex-start; + justify-content: center; align-items: center; img { @@ -1694,7 +1757,6 @@ } span { - min-width: 150px; font-size: 14px; text-align: center; font-family: 'FZLTXIHJW'; @@ -1724,13 +1786,201 @@ justify-content: center; flex-wrap: wrap; } + + + .bj-img { + display: flex; + flex-direction: column; + justify-content: flex-start; + background-size: 100% 50%; + } + + .bj-img02 { + display: flex; + flex-direction: column; + justify-content: flex-start; + background-size: 100% 50%; + } + + .bj-img02 { + display: flex; + flex-direction: column; + justify-content: flex-start; + background-size: 100% 50%; + } + + .bj-empyt-chapter { + height: 50%; + } + + .bj-text { + width: 100%; + padding-top: 0%; + padding: 0 10%; + box-sizing: border-box; + } + + .tablePublic table tr th{ + padding: 0; + width: auto !important; + } + + div.bk-xyx { + padding: 2.5em 1.2em; + } + } + } + + @media screen and (max-width:700px) { + + .chapter { + + .coverImg { + margin: 0; + } + + .page-box { + min-height: 800px !important; + } + + .img-float { + width: 130px; + } + + .bodystyle-chapter { + flex-direction: column; + + .bj-chapter-con { + width: auto; + position: relative; + } + } + + } + } + + @media screen and (max-width:600px) { + .chapter { + + .coverImg { + margin: 0; + height: 100%; + } + + .page-box { + min-height: 500px !important; + margin-bottom: 20px; + } + + .bj-img { + display: flex; + flex-direction: column; + justify-content: flex-start; + background-size: 100% 30%; + } + + .bj-img02 { + display: flex; + flex-direction: column; + justify-content: flex-start; + background-size: 100% 30%; + } + + .bj-img03 { + display: flex; + flex-direction: column; + justify-content: flex-start; + background-size: 100% 20%; + + .bj-text { + width: 100%; + padding-top: 0%; + padding: 35% 10% 0 10% !important; + box-sizing: border-box; + + p { + line-height: 28px; + } + } + } + + .pdf-text { + .pdf-con { + flex-direction: column; + + .pdf-view { + margin-bottom: 10px; + } + } + } + + + .bj-empyt-chapter { + height: 30%; + } + + .bj-text { + width: 100%; + padding-top: 0%; + padding: 0 10%; + box-sizing: border-box; + } } } } } } +.pdfModal { + width: 100%; + height: 90vh; +} +@media screen and (max-width:800px) { + .pdfModal { + width: 100%; + height: 60vh; + } + + .custom-dialog { + .el-dialog { + width: 90vw !important; + } + } +} + + +.custom-dialog { + .el-dialog__body { + padding: 0; + } + + .el-dialog__header { + background-color: rgba(0, 0, 0, 0.8); + + .header_title { + display: flex; + justify-content: space-between; + align-items: center; + color: #fff; + font-weight: 900; + font-size: 16px; + font-family: 'FZLTXIHJW'; + + span:nth-child(2):hover { + cursor: pointer; + } + } + + .el-dialog__title, + .el-dialog__headerbtn .el-dialog__close { + color: #fff; + font-weight: 900; + font-size: 16px; + font-family: 'FZLTXIHJW'; + } + } +} .tablePublic input[type="checkbox"]:checked+.checkmark { background: #000 !important; -- Gitblit v1.9.1