A1300399510/PC-Light-Forum
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

feat: 添加新图片资源及更新组件样式与功能

Browse Source 
style: 调整CSS样式及优化布局
refactor: 重构组件逻辑及API调用
fix: 修复路径引用及图片加载问题
docs: 更新注释及文档内容
This commit is contained in:
DESKTOP-RQ919RC\Pc
2025-11-05 19:10:43 +08:00
parent 07f4401f67
commit 3365e5ee0a
43 changed files with 782 additions and 365 deletions
Download Patch File Download Diff File Expand all files Collapse all files

2
css/homepage-other.css
View File

@@ -209,6 +209,7 @@
border-radius: 10px;
padding-left: 95px;
padding-right: 40px;
padding-bottom: 50px;
}
#homepage-other .matter .matter-content .list-area .classify {
padding-top: 39px;
@@ -254,7 +255,6 @@
border: 1px solid #e9eef2;
border-radius: 10px;
flex-direction: column;
margin-bottom: 50px;
}
#homepage-other .matter .matter-content .list-area .empty .empty-icon {
width: 80px;

5
css/homepage-other.less
View File

@@ -40,7 +40,7 @@
padding-top: 39px;
padding-bottom: 40px;
margin-right: 20px;
.avatar {
width: 120px;
height: 120px;
@@ -243,6 +243,7 @@
border-radius: 10px;
padding-left: 95px;
padding-right: 40px;
padding-bottom: 50px;
.classify {
padding-top: 39px;
@@ -296,7 +297,7 @@
border: 1px solid rgba(233, 238, 242, 1);
border-radius: 10px;
flex-direction: column;
margin-bottom: 50px;
// margin-bottom: 50px;
.empty-icon {
width: 80px;

12
css/index.css
View File

@@ -15,7 +15,10 @@
#appIndex .header-content-box .header-content-left .adv-list .adv-item:not(:last-child) {
margin-right: 12px;
}
#appIndex .header-content-box .header-content-left .adv-list .adv-item .adv-img {
#appIndex .header-content-box .header-content-left .adv-list .adv-item a {
display: block;
}
#appIndex .header-content-box .header-content-left .adv-list .adv-item img {
width: 468px;
height: 60px;
border-radius: 10px;
@@ -283,13 +286,16 @@
height: 16px;
margin-right: 6px;
}
#appIndex .header-content-box .header-content-right .adv-broadside {
#appIndex .header-content-box .header-content-right .adv {
width: 240px;
height: 140px;
margin-bottom: 10px;
display: block;
}
#appIndex .header-content-box .header-content-right .adv-broadside .adv-broadside-img {
#appIndex .header-content-box .header-content-right .adv a {
display: block;
}
#appIndex .header-content-box .header-content-right .adv img {
width: 240px;
height: 140px;
border-radius: 10px;

12
css/index.less
View File

@@ -18,7 +18,10 @@
&:not(:last-child) {
margin-right: 12px;
}
.adv-img {
a {
display: block;
}
img {
width: 468px;
height: 60px;
border-radius: 10px;
@@ -340,12 +343,15 @@
}
}
.adv-broadside {
.adv {
width: 240px;
height: 140px;
margin-bottom: 10px;
display: block;
.adv-broadside-img {
a {
display: block;
}
img {
width: 240px;
height: 140px;
border-radius: 10px;

106
css/public.css
View File

@@ -86,6 +86,59 @@ body {
font-size: 13px;
color: #aaaaaa;
}
.item-box .item-head .anonymous-box {
background-color: #f2f2f2;
border-radius: 30px;
font-size: 14px;
color: #333;
height: 28px;
padding: 0 10px;
cursor: pointer;
margin-right: 15px;
}
.item-box .item-head .circlePen {
border-radius: 50%;
background-color: #f2f2f2;
margin-right: 10px;
width: 28px;
height: 28px;
cursor: pointer;
}
.item-box .item-head .circlePen .icon {
width: 20px;
height: 20px;
}
.item-box .item-head .isPublicityBox {
width: 120px;
background-color: #fff;
position: absolute;
top: 34px;
left: 0;
border-radius: 8px;
box-shadow: 0px 0px 9px rgba(0, 0, 0, 0.2);
z-index: 89;
}
.item-box .item-head .isPublicityBox .isPublicity-item {
height: 40px;
line-height: 40px;
text-align: center;
padding: 0 10px;
color: #555555;
font-size: 16px;
display: flex;
justify-content: space-between;
align-items: center;
cursor: pointer;
}
.item-box .item-head .isPublicityBox .isPublicity-item:first-child {
border-bottom: 1px dotted #e3e3e3;
}
.item-box .item-head .isPublicityBox .isPublicity-item.green {
color: #26d79f;
}
.item-box .item-head .isPublicityBox .isPublicity-item .isPublicityIcon {
width: 12px;
}
.item-box .item-head .view {
font-size: 12px;
color: #aaaaaa;
@@ -856,7 +909,7 @@ body {
.side-box .box {
width: 272px;
background-color: #ffffff;
border-radius: 8px;
border-radius: 0;
}
.side-box.thread-side-box .box .item {
padding-top: 16px;
@@ -1021,7 +1074,7 @@ body {
margin-right: 10px;
}
.side-box.newest-side-box .box .item .dot.dot-green {
background-image: url(https://app.gter.net/image/gter/forum/assets/forum/dot-green.svg);
background-image: url(/img/dot-green.svg);
background-repeat: no-repeat;
}
.side-box.newest-side-box .box .item .text {
@@ -1056,7 +1109,7 @@ body {
width: 6px;
height: 6px;
margin-right: 10px;
background-image: url(https://app.gter.net/image/gter/forum/assets/forum/dot-blue.svg);
background-image: url(/img/dot-blue.svg);
background-repeat: no-repeat;
}
.side-box.essence-side-box .box .item .text {
@@ -1382,6 +1435,10 @@ body {
padding: 0 15px;
justify-content: space-between;
margin-right: 20px;
transition: all 0.3s;
}
.head-top .input-box.pitch {
border-color: #000;
}
.head-top .input-box .input {
border: none;
@@ -1392,7 +1449,7 @@ body {
.head-top .input-box .icon {
width: 18px;
height: 18px;
margin-left: 15rpx;
margin-left: 15px;
cursor: pointer;
}
.head-top .sign-in {
@@ -1593,3 +1650,44 @@ td {
.templateValue {
display: none;
}
.list-load-box {
width: 100%;
height: 0;
background-color: #ffffff;
border: 0 solid #e9eef2;
border-radius: 10px;
flex-direction: column;
transition: all 0.3s ease-in-out;
overflow: hidden;
}
.list-load-box.show {
height: 100px;
border-width: 1px;
}
.list-load-box.show .list-load-icon {
width: 30px;
height: 30px;
}
.list-load-box.show .list-load-text {
font-size: 14px;
}
.list-load-box .list-load-icon {
width: 0;
height: 0;
animation: loadingRotate 1s linear infinite;
transition: all 0.3s ease-in-out;
}
.list-load-box .list-load-text {
color: #999999;
font-size: 0;
margin-top: 6px;
transition: all 0.3s ease-in-out;
}
@keyframes loadingRotate {
0% {
transform: rotate(0deg);
}
100% {
transform: rotate(360deg);
}
}

126
css/public.less
View File

@@ -102,6 +102,67 @@ body {
color: #aaaaaa;
}
.anonymous-box {
background-color: #f2f2f2;
border-radius: 30px;
font-size: 14px;
color: #333;
height: 28px;
padding: 0 10px;
cursor: pointer;
margin-right: 15px;
}
.circlePen {
border-radius: 50%;
background-color: #f2f2f2;
margin-right: 10px;
width: 28px;
height: 28px;
cursor: pointer;
.icon {
width: 20px;
height: 20px;
}
}
.isPublicityBox {
width: 120px;
background-color: #fff;
position: absolute;
top: 34px;
left: 0;
border-radius: 8px;
box-shadow: 0px 0px 9px rgba(0, 0, 0, 0.2);
z-index: 89;
.isPublicity-item {
height: 40px;
line-height: 40px;
text-align: center;
padding: 0 10px;
color: #555555;
font-size: 16px;
display: flex;
justify-content: space-between;
align-items: center;
cursor: pointer;
&:first-child {
border-bottom: 1px dotted #e3e3e3;
}
&.green {
color: #26d79f;
}
.isPublicityIcon {
width: 12px;
}
}
}
.view {
font-size: 12px;
color: #aaaaaa;
@@ -1021,7 +1082,7 @@ body {
.side-box .box {
width: 272px;
background-color: #ffffff;
border-radius: 8px;
border-radius: 0;
}
.side-box.thread-side-box .box .item {
@@ -1220,7 +1281,7 @@ body {
}
.side-box.newest-side-box .box .item .dot.dot-green {
background-image: url(https://app.gter.net/image/gter/forum/assets/forum/dot-green.svg);
background-image: url(/img/dot-green.svg);
background-repeat: no-repeat;
}
@@ -1263,7 +1324,7 @@ body {
width: 6px;
height: 6px;
margin-right: 10px;
background-image: url(https://app.gter.net/image/gter/forum/assets/forum/dot-blue.svg);
background-image: url(/img/dot-blue.svg);
background-repeat: no-repeat;
}
@@ -1650,6 +1711,11 @@ body {
padding: 0 15px;
justify-content: space-between;
margin-right: 20px;
transition: all 0.3s;
&.pitch {
border-color: #000;
}
.input {
border: none;
@@ -1661,7 +1727,7 @@ body {
.icon {
width: 18px;
height: 18px;
margin-left: 15rpx;
margin-left: 15px;
cursor: pointer;
}
}
@@ -1882,7 +1948,6 @@ td {
height: 8px;
}
.t_r {
-moz-border-radius: 0 8px 0 0;
-webkit-border-radius: 0 8px 0 0;
@@ -1891,4 +1956,53 @@ td {
.templateValue {
display: none;
}
}
.list-load-box {
width: 100%;
height: 0;
background-color: #ffffff;
border: 0 solid #e9eef2;
border-radius: 10px;
flex-direction: column;
transition: all 0.3s ease-in-out;
overflow: hidden;
&.show {
height: 100px;
border-width: 1px;
.list-load-icon {
width: 30px;
height: 30px;
}
.list-load-text {
font-size: 14px;
}
}
.list-load-icon {
width: 0;
height: 0;
animation: loadingRotate 1s linear infinite;
transition: all 0.3s ease-in-out;
}
.list-load-text {
color: #999999;
font-size: 0;
margin-top: 6px;
transition: all 0.3s ease-in-out;
}
}
@keyframes loadingRotate {
0% {
transform: rotate(0deg);
}
100% {
transform: rotate(360deg);
}
}