From 6479762082828573d293e68b0c37fa953f048c62 Mon Sep 17 00:00:00 2001 From: XiaoMo Date: Wed, 29 Mar 2023 14:38:43 +0800 Subject: [PATCH] =?UTF-8?q?a1300399510@qq.com=20=E6=8F=90=E4=BA=A4?= =?UTF-8?q?=E4=BA=8E=202023/03/29=20-14:38:27?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .gitignore | 7 + src/App.vue | 39 +-- src/assets/css/normalize.css | 2 +- src/assets/css/public.scss | 96 +++---- src/assets/img/icon/search-cross.png | Bin 0 -> 2077 bytes src/assets/img/icon/topRight .png | Bin 0 -> 8017 bytes src/components/HeaderNav.vue | 382 +++++++++++++-------------- src/components/PlateNavigation.vue | 32 +++ src/components/SearchBox.vue | 334 +++++++++++------------ src/components/SvgIcon.vue | 63 ++--- src/views/collect/Collect.vue | 123 ++++----- src/views/index.vue | 5 +- src/views/recommend/Recommend.vue | 82 +++--- 13 files changed, 578 insertions(+), 587 deletions(-) create mode 100755 .gitignore create mode 100755 src/assets/img/icon/search-cross.png create mode 100755 src/assets/img/icon/topRight .png create mode 100755 src/components/PlateNavigation.vue diff --git a/.gitignore b/.gitignore new file mode 100755 index 0000000..de96f3a --- /dev/null +++ b/.gitignore @@ -0,0 +1,7 @@ +# Logs +logs +*.log +node_modules +.DS_Store +dist +*.local diff --git a/src/App.vue b/src/App.vue index 8d8d733..f85241b 100755 --- a/src/App.vue +++ b/src/App.vue @@ -1,23 +1,24 @@ diff --git a/src/assets/css/normalize.css b/src/assets/css/normalize.css index 4e8f438..a1b982c 100755 --- a/src/assets/css/normalize.css +++ b/src/assets/css/normalize.css @@ -1,7 +1,7 @@ *{ padding: 0; margin: 0; - color: #555; + /* color: #555; */ font-family: '微软雅黑'; font-weight: 400; } diff --git a/src/assets/css/public.scss b/src/assets/css/public.scss index f7c74d7..d696d60 100755 --- a/src/assets/css/public.scss +++ b/src/assets/css/public.scss @@ -38,16 +38,21 @@ box-shadow: 0 0 0.16rem rgba(0, 0, 0, 0.1); position: relative; + .path-slash { + color: #D7D7D7; + font-size: .32rem; + } + div { color: #7F7F7F; max-width: 2.5rem; - &::before { - content: "/"; - width: 0.2rem; - padding: 0 0.07rem; - color: #7F7F7F; - } + // &::before { + // content: "/"; + // width: 0.2rem; + // padding: 0 0.07rem; + // color: #7F7F7F; + // } &:last-child { max-width: 50%; @@ -55,9 +60,9 @@ font-weight: bold; } - &:first-child::before { - content: ""; - } + // &:first-child::before { + // content: ""; + // } } &::after { @@ -124,7 +129,7 @@ section { font-size: 0.3rem; color: #7F7F7F; max-height: 1rem; - line-height: 0.53rem; + line-height: .52rem; } // 回复可见 @@ -134,6 +139,8 @@ section { padding: 0.28rem; text-align: center; margin-top: 0.25rem; + font-size: .32rem; + color: #aaa; } } @@ -164,10 +171,11 @@ section { display: flex; flex-direction: row; align-items: center; - padding-left: 0.25rem; + // padding-left: 0.25rem; &:last-child { - margin-left: 0.133333rem; + // margin-left: 0.133333rem; + margin-left: .4rem; } div { @@ -190,66 +198,30 @@ section { // 精华 .rightTop { - width: 2rem; - height: 2rem; position: absolute; top: 0; right: 0; - &:before { - content: ""; - display: block; - border-radius: 0.8rem 0.8rem 0 0; - width: 0.24rem; - height: 0.053333rem; - position: absolute; - top: -0.053333rem; - right: 0.98rem; - background: #7474ff; - } - - &:after { - content: ""; - display: block; - border-radius: 0 0.11rem 0.11rem 0; - width: 0.053333rem; - height: 0.24rem; - position: absolute; - right: -0.053333rem; - top: 0.98rem; - background: #7474ff; - } - - div { - overflow: hidden; - width: 2rem; - height: 2rem; - position: absolute; - top: -0.09rem; - right: -0.09rem; + .rightTop-img { + width: 1.28rem; + height: 1.28rem; + margin-top: -.1rem; + margin-right: -.1rem; } // 丝带 span { - display: inline-block; - text-align: center; - width: 2.5rem; - height: 0.45rem; - line-height: 0.45rem; - font-size: 0.3rem; - color: #fff; position: absolute; - top: 0.25rem; - right: -0.8rem; - z-index: 2; - overflow: hidden; + top: 0; + left: 0; transform: rotate(45deg); - -ms-transform: rotate(45deg); - -moz-transform: rotate(45deg); - -webkit-transform: rotate(45deg); - -o-transform: rotate(45deg); - box-shadow: 0 0 0.09rem rgba(151, 151, 255, 0.5); - background-image: linear-gradient(to bottom right, #7474ff, rgba(190, 190, 255, 1)); + transform-origin: bottom; + margin-top: 0.01rem; + margin-left: 0.25rem; + width: 0.9rem; + font-size: 0.3rem; + text-align: center; + color: #fff; } } } diff --git a/src/assets/img/icon/search-cross.png b/src/assets/img/icon/search-cross.png new file mode 100755 index 0000000000000000000000000000000000000000..696d019f537e7b5950de20be761cbdc08d6bfa66 GIT binary patch literal 2077 zcmV+&2;%pNP)Px#L}ge>W=%~1DgXcg2mk?xX#fNO00031000^Q000001E2u_0{{R30RRC20H6W@ z1ONa40RR91K%fHv1ONa40RR91KmY&$07g+lumAuDheF@Yc^MAQcrh_TeD_(3$7^Z|@MXe`oLrIbQjh}DQKR9eMgs1H8yp;DuWMPt+l zQ-g_-m|#o;ini5|XnY_k{jwj_-ywIBy}Prsv%B}w+t^7avomwfnREU#bLQjDoik@P z%p&l=Mj>tlztL?-fHsLxs}*!i5V5Dk>@_r$d*t1F&=F&TI4X^2(;BrdDKSWi7$T z#l-80xh{i8$@daZL)!ywH}S-lEn9|MbScfI1%USU_R_Jjv2_^m1llemMr~&d-fxg| zko0Iez=*0C`glW2OUp8pZ6H2QZH|{BR>=kA?q_tg)z#Jg6-$zXIVAuzH#gsylatei z+{cJ1k?GLU{W(IxTY&LODn>*sWji}Nb9#Gw>riGpN?mejZf(<;|C4r~2ZUpB+K3E5 zYisK@497z>eqS5~;_?E*K}KI?O-+rAjL;zx0K0bWx{HQCrM0U=x0oJ=AI8VW*EBXZ z{vB3)XaF$&UW`9VLsy1vEY0+?gg$_S{54EFp#a#ud-rOD%bd#()5v9{J(r!Gy|T8p zw%@kRY+FKl{tkNnL+CTrcrj%Ge(7u3eA(J%1wdO{+X9R~j__hz!P7;Dj*HlN9+4Hw zMu$KEnwpxjCnhEiAS_cHo{e4i^!4>M*$@T-P*_;F4MF8L!ZM7e0iU%pNGGEcWNUi^ zPNfGSML~ixwEpLkl9JmiD=WwS^fQhCjDK?m8!t959T*sR&d+!$_XU9Ab1U_anwSlB z{WzoLxw*MlLDONNGgVFCcsC$t9#Kw}a$F7_E?&I24L?@k$LKzjJLww87^jGn*zx_x ze91_V5gB^V4_~zs?oPD;K(wA{ zwT?OkqIiYdcvUYTpvW64?~}@~U*|Sn(Qe(k^($n&r1G{YG8fB6PDif=0OuzFgbvL4 zGbSbs*kk}fj9-uOohBLR_KT_BP^Y!Y0|0YvK1$wV5ae6MiR@M1%0z_^2v)}9%nH#> zrc>wuxcBRrJODtniWtTDiTo-6l$#-A5D*|xK0!G=W6z86gf95*Gz#~xTq0X~ceM_H zVGN!URRfbGLL;p02CJ&52m0Iw+QXt-c97pCzeR75#!{u z_#SZ6Bms~>UwR-_!ML|KHIe|K-9!_i?t+^q2>_|YQ}(-wBId1jcqZAhk6@$JY@!KS zC%+ve1rGo;cshw9TE?p9#o+~s=Wx_Or^MP%s5Y?ejQUoo2LLMM4lquzKG=+oj(%aY zZRYH-ITauv!(*EV0Je+WF|4;5_KtPFjJ9Ok9N5DGLd@wfQBY9uo!d4K0E2^r-$FF* zCbZ0N^t;SZ{0ZYfBVVq{NUaV~G992jKFdzZU6&w~j|j`nLeH+P-wIxK&Aor>F>CN z*ktDdTo?QPhZS+cc)7_bQ)L#Z$1yTJYLWe#1+Rw$zCE78M1k+smt2j*_#1Que$0mQ z5qP%);#pF0Tv4yF4#0ba_zPE00`AH&~QGcn1prIgD9>b8gKE^DrQGeNGk=^8d(pN5 z<0{}5!kgela#&(XDRtLnLY@xl=7H4eFt0|fMu0MoUw+TBwyz-XIae#1X-vD=!9Ezq zc+oW!0KxzWeN2bD`IJ**ri6VA`?XBf;jjvYngUMYiI?I#m<~HA4-KSKR*Y}?55cqS z^FN3xBQgN0L3WEW8r~)@Rb`hcJtphC%~EI5CpG{gyrZKdkJngLI3allWc^Ilq?lhF zJ${P1MtWU)zW3wvD^CdkN;tp2&&5AHLtYLpo*yC=U4#^Dr^M&%VQbq32-<^91i6tP zLIk$OX;S`Eunt0bnGpqy3HVMT<8#tOe&>1WVuh5B06$ISWd^UuR?>@$p^^6o^NA(I zc|@5-%omme}MGl=jWf$-QiI`8)gxhMPL?zlp*jRbI^c=Q{g3I00000NkvXX Hu0mjfK8UV2 literal 0 HcmV?d00001 diff --git a/src/assets/img/icon/topRight .png b/src/assets/img/icon/topRight .png new file mode 100755 index 0000000000000000000000000000000000000000..cd3d821ae1032693dd15b4bc52a84f9057abefb1 GIT binary patch literal 8017 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 AjQ{`u literal 0 HcmV?d00001 diff --git a/src/components/HeaderNav.vue b/src/components/HeaderNav.vue index 7f24a0c..efa9df4 100755 --- a/src/components/HeaderNav.vue +++ b/src/components/HeaderNav.vue @@ -10,10 +10,9 @@
-
- - 搜索 -
+ + +
@@ -60,6 +59,7 @@
+
@@ -69,7 +69,7 @@ -
+
@@ -133,6 +133,8 @@ @@ -231,22 +237,6 @@ export default { } .right { - .head-search { - width: 2.4rem; - height: .8rem; - border-radius: 2.56rem; - background-color: rgba(235, 235, 235, 1); - color: #AAAAAA; - font-size: .3467rem; - - .head-search-icon { - width: .4rem; - height: .4rem; - margin-right: .14rem; - } - - margin-right: .4rem; - } .head-more { position: relative; @@ -468,6 +458,175 @@ export default { } } +// 折叠弹窗 +.collapse-box { + display: none; + position: absolute; + right: 0; + top: 1.19rem; + width: 750px; + margin: 0 auto; + min-height: 100%; + background-color: rgba(0, 0, 0, 0.7); + z-index: 8; + + &.collapse-show { + display: block; + } + + .collapse-container { + background-color: #fff; + width: 7.6rem; + height: 100%; + position: absolute; + right: 0; + top: 0; + display: flex; + flex-direction: column; + } + + .collapse-my { + margin: 0.9rem 0; + display: flex; + flex-direction: row; + justify-content: space-between; + align-items: center; + padding: 0 0.7rem 0 0.8rem; + + .my-left { + width: 3.5rem; + display: flex; + align-items: center; + } + + .my-right { + width: 2.5rem; + position: relative; + display: flex; + justify-content: end; + } + + // 头像 + .collapse-my-img { + width: 1.28rem; + height: 1.28rem; + border-radius: 0.67rem; + margin: 0 0.3rem 0 0; + } + + .collapse-my-name { + font-size: 0.36rem; + color: #333; + } + + .my-img { + width: 1.28rem; + height: 1.28rem; + } + + .right-msg-img { + width: 0.44rem; + height: 0.44rem; + background-size: contain; + background-image: url("../assets/img/icon/email.png"); + } + + .right-msg-num { + display: flex; + justify-content: center; + width: 0.3rem; + height: 0.3rem; + line-height: 0.3rem; + border-radius: 0.2rem; + background-color: #fd3f5d; + color: #fff; + font-size: 0.254rem; + position: absolute; + top: -0.15rem; + right: -0.2rem; + z-index: 1; + } + + // 未登录按钮 + .loginBtn { + width: 2.24rem; + height: 0.8rem; + line-height: 0.8rem; + border-radius: 3.12rem; + background-color: rgba(98, 177, 255, 1); + color: #fff; + font-size: 0.34rem; + text-align: center; + } + } + + // 折叠弹窗列表 + .collapse-list { + margin-left: 0.8rem; + border-top: 0.013333rem solid #eee; + border-bottom: 0.013333rem solid #eee; + display: flex; + padding: 0.3rem 0; + flex-direction: column; + + span { + height: 1.44rem; + line-height: 1.44rem; + border-radius: 0.22rem; + padding: 0 0.8rem; + font-size: 0.36rem; + margin: 0.1rem 0.8rem 0.1rem 0; + } + + .listActive { + background-color: rgba(80, 227, 194, 1); + font-weight: bolder; + } + } + + // 折叠弹窗发布帖子 + .collapse-publish { + margin: 0.9rem 0; + display: flex; + justify-content: center; + align-items: center; + flex-direction: row; + + span { + color: #000; + font-size: 0.4rem; + } + + // 发布帖子图片 + .collapse-publish-img { + width: 0.48rem; + height: 0.48rem; + border-radius: 0.24rem; + background-color: #fddf6d; + display: flex; + justify-content: center; + align-items: center; + margin-right: 0.2rem; + } + + .icon-add { + width: 0.24rem; + height: 0.24rem; + } + } + + .collapse-close { + display: flex; + justify-content: center; + padding: 0.5rem 0; + + .icon-close { + width: 0.32rem; + height: 0.32rem; + } + } +} + header { display: flex; @@ -512,173 +671,6 @@ header { right: -0.2rem; } - // 折叠弹窗 - .collapse-box { - display: none; - position: absolute; - right: 0; - top: 1.19rem; - width: 750px; - margin: 0 auto; - min-height: 100%; - background-color: rgba(0, 0, 0, 0.7); - z-index: 8; - &.collapse-show { - display: block; - } - - .collapse-container { - background-color: #fff; - width: 7.6rem; - height: 100%; - position: absolute; - right: 0; - top: 0; - display: flex; - flex-direction: column; - } - - .collapse-my { - margin: 0.9rem 0; - display: flex; - flex-direction: row; - justify-content: space-between; - align-items: center; - padding: 0 0.7rem 0 0.8rem; - - .my-left { - width: 3.5rem; - display: flex; - align-items: center; - } - - .my-right { - width: 2.5rem; - position: relative; - display: flex; - justify-content: end; - } - - // 头像 - .collapse-my-img { - width: 1.28rem; - height: 1.28rem; - border-radius: 0.67rem; - margin: 0 0.3rem 0 0; - } - - .collapse-my-name { - font-size: 0.36rem; - color: #333; - } - - .my-img { - width: 1.28rem; - height: 1.28rem; - } - - .right-msg-img { - width: 0.44rem; - height: 0.44rem; - background-size: contain; - background-image: url("../assets/img/icon/email.png"); - } - - .right-msg-num { - display: flex; - justify-content: center; - width: 0.3rem; - height: 0.3rem; - line-height: 0.3rem; - border-radius: 0.2rem; - background-color: #fd3f5d; - color: #fff; - font-size: 0.254rem; - position: absolute; - top: -0.15rem; - right: -0.2rem; - z-index: 1; - } - - // 未登录按钮 - .loginBtn { - width: 2.24rem; - height: 0.8rem; - line-height: 0.8rem; - border-radius: 3.12rem; - background-color: rgba(98, 177, 255, 1); - color: #fff; - font-size: 0.34rem; - text-align: center; - } - } - - // 折叠弹窗列表 - .collapse-list { - margin-left: 0.8rem; - border-top: 0.013333rem solid #eee; - border-bottom: 0.013333rem solid #eee; - display: flex; - padding: 0.3rem 0; - flex-direction: column; - - span { - height: 1.44rem; - line-height: 1.44rem; - border-radius: 0.22rem; - padding: 0 0.8rem; - font-size: 0.36rem; - margin: 0.1rem 0.8rem 0.1rem 0; - } - - .listActive { - background-color: rgba(80, 227, 194, 1); - font-weight: bolder; - } - } - - // 折叠弹窗发布帖子 - .collapse-publish { - margin: 0.9rem 0; - display: flex; - justify-content: center; - align-items: center; - flex-direction: row; - - span { - color: #000; - font-size: 0.4rem; - } - - // 发布帖子图片 - .collapse-publish-img { - width: 0.48rem; - height: 0.48rem; - border-radius: 0.24rem; - background-color: #fddf6d; - display: flex; - justify-content: center; - align-items: center; - margin-right: 0.2rem; - } - - .icon-add { - width: 0.24rem; - height: 0.24rem; - } - } - - .collapse-close { - display: flex; - justify-content: center; - padding: 0.5rem 0; - - .icon-close { - width: 0.32rem; - height: 0.32rem; - } - } - } } diff --git a/src/components/PlateNavigation.vue b/src/components/PlateNavigation.vue new file mode 100755 index 0000000..2c182a7 --- /dev/null +++ b/src/components/PlateNavigation.vue @@ -0,0 +1,32 @@ + + + + + + \ No newline at end of file diff --git a/src/components/SearchBox.vue b/src/components/SearchBox.vue index 5d56f6e..c13709b 100755 --- a/src/components/SearchBox.vue +++ b/src/components/SearchBox.vue @@ -1,23 +1,24 @@ \ No newline at end of file diff --git a/src/components/SvgIcon.vue b/src/components/SvgIcon.vue index 0e9c253..087c1e5 100755 --- a/src/components/SvgIcon.vue +++ b/src/components/SvgIcon.vue @@ -1,41 +1,44 @@ diff --git a/src/views/collect/Collect.vue b/src/views/collect/Collect.vue index 3798df4..cb66022 100755 --- a/src/views/collect/Collect.vue +++ b/src/views/collect/Collect.vue @@ -3,28 +3,22 @@
- 未收藏 + 未收藏
收藏你感兴趣的版块，迅速浏览相应的帖子
-
+ + +
马上收藏
-
+ +
-
+
{{ item.label }}
@@ -33,28 +27,18 @@ 设置
-
+
设置收藏版块
共收藏 5 个版块
-
- - 添加 - -
+ + 添加 +
-
+
香港澳门台湾留学申请
@@ -65,11 +49,7 @@
-
-
论坛
-
论坛
-
论坛
-
+
@@ -89,10 +69,7 @@
- +
匿名用户
@@ -108,9 +85,8 @@
-
- 精华 -
+ + 精华
@@ -126,10 +102,7 @@
- +
匿名用户
@@ -145,9 +118,8 @@
-
- 精华 -
+ + 精华
@@ -155,16 +127,17 @@
-
+
@@ -56,6 +53,7 @@ nav { -webkit-user-select: none; -moz-user-focus: none; -moz-user-select: none; + color: #555; &.router-link-exact-active { color: #000; @@ -64,6 +62,7 @@ nav { } } } + // 发帖按钮 .publish { background-color: rgba(253, 223, 109, 1); diff --git a/src/views/recommend/Recommend.vue b/src/views/recommend/Recommend.vue index 777c570..92fe7a7 100755 --- a/src/views/recommend/Recommend.vue +++ b/src/views/recommend/Recommend.vue @@ -2,14 +2,16 @@
-
{{item.label}}
+
{{ item.label }}
-
+ +
@@ -19,7 +21,8 @@
23fall 美国llm 求定位
-
背景：生于80年代中期，英语基础不好，备考托福3个月，刚好100分。2018年8月开始读LLM. 读书期间Point Bar6666666666666666666666
+
背景：生于80年代中期，英语基础不好，备考托福3个月，刚好100分。2018年8月开始读LLM. 读书期间Point + Bar6666666666666666666666
@@ -32,16 +35,15 @@
1552
- +
12
-
- 精华 -
+ + 精华
@@ -77,45 +79,45 @@
- - + +
- \ No newline at end of file + \ No newline at end of file