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

feat: 优化响应式布局并添加签到组件

Browse Source 
refactor: 重构CSS和LESS文件以支持响应式设计
fix: 修复图片上传和编辑器解析问题
style: 调整搜索框和日历组件的样式
docs: 更新HTML模板中的广告和操作链接
This commit is contained in:
DESKTOP-RQ919RC\Pc
2025-12-04 19:15:08 +08:00
parent e4f97dafb8
commit 40d83d5374
10 changed files with 775 additions and 237 deletions
Download Patch File Download Diff File Expand all files Collapse all files

211
css/public.css
View File

@@ -1777,11 +1777,6 @@ body {
display: none;
padding: 5px;
}
@media screen and (max-width: 480px) {
.head-top .head-more {
display: flex;
}
}
.hot-tag {
background-color: #ffffff;
border: 1px solid #e9eef2;
@@ -1970,6 +1965,7 @@ td {
}
.head-pop.head-pop-show {
left: 0;
display: block !important;
}
.head-pop.head-pop-show .head-more-pop {
animation: slide-in-left 0.5s ease-out forwards;
@@ -2097,3 +2093,208 @@ td {
margin: 0 auto;
box-sizing: content-box;
}
@media (max-width: 1200px) {
.head-pop .head-more-pop {
width: 80vw;
}
.head-pop .head-more-pop .head-more-userinfo {
margin-left: 20px;
padding-right: 20px;
}
.head-pop .head-more-pop .tab-list {
padding-right: 20px;
margin-left: 20px;
}
.head-pop .head-more-pop .tab-list .tab-item {
height: 50px;
padding-left: 20px;
font-size: 14px;
}
.head-pop .head-more-pop .head-more-post {
margin: 40px 0 90px;
}
.head-pop .head-more-pop .cross-icon {
left: calc(50% + 40px);
}
}
@media (max-width: 768px) {
.head-pop .head-more-pop {
width: 100vw;
height: 100vh;
}
.head-pop .head-more-pop .head-more-userinfo {
margin-left: 16px;
padding-right: 16px;
}
.head-pop .head-more-pop .head-more-userinfo .head-more-right {
width: auto;
height: auto;
}
.head-pop .head-more-pop .tab-list {
padding-right: 16px;
margin-left: 16px;
}
.head-pop .head-more-pop .tab-list .tab-item {
height: 46px;
padding-left: 16px;
font-size: 13px;
}
.head-pop .head-more-pop .head-more-post {
margin: 36px 0 80px;
font-size: 16px;
}
.head-pop .head-more-pop .head-more-post .head-more-post-icon {
width: 18px;
height: 18px;
margin-right: 6px;
}
.head-pop .head-more-pop .cross-icon {
left: 50%;
transform: translateX(-50%);
bottom: 15px;
}
}
@media (max-width: 480px) {
.head-pop .head-more-pop .head-more-userinfo {
margin-left: 12px;
padding-right: 12px;
}
.head-pop .head-more-pop .head-more-userinfo .head-more-left .head-more-userinfo-avatar {
width: 36px;
height: 36px;
margin-right: 8px;
}
.head-pop .head-more-pop .head-more-userinfo .head-more-left .head-more-userinfo-username {
font-size: 12px;
}
.head-pop .head-more-pop .head-more-userinfo .head-more-right .information-box {
width: 14px;
height: 14px;
}
.head-pop .head-more-pop .head-more-userinfo .head-more-right .information-box .information-icon {
width: 14px;
height: 14px;
}
.head-pop .head-more-pop .head-more-userinfo .head-more-right .loginBtn {
width: 72px;
height: 28px;
font-size: 12px;
}
.head-pop .head-more-pop .tab-list {
padding-right: 12px;
margin-left: 12px;
}
.head-pop .head-more-pop .tab-list .tab-item {
height: 42px;
padding-left: 14px;
font-size: 12px;
}
.head-pop .head-more-pop .head-more-post {
margin: 24px 0 60px;
font-size: 14px;
}
.head-pop .head-more-pop .head-more-post .head-more-post-icon {
width: 16px;
height: 16px;
margin-right: 6px;
}
.head-pop .head-more-pop .head-more-post .head-more-post-icon .head-more-post-img {
width: 8px;
height: 8px;
}
.head-pop .head-more-pop .cross-icon {
width: 10px;
height: 10px;
padding: 12px;
bottom: 12px;
left: 50%;
transform: translateX(-50%);
}
}
@media screen and (max-width: 1200px) {
header.page-header {
min-width: auto !important;
}
header.page-header .box {
width: 100vw;
}
.head-top.flexacenter {
max-width: 1200px !important;
width: initial !important;
margin: 20px 10px 30px !important;
}
.head-top.flexacenter .input-box {
margin-right: 10px;
}
.index-footer {
min-width: inherit !important;
}
}
@media screen and (max-width: 768px) {
header.page-header {
display: none !important;
}
.head-top .head-more {
display: flex;
}
.index-footer {
display: none !important;
}
.head-top .post-list {
display: none !important;
}
#search .search-box {
width: auto !important;
margin: 0 10px 20px;
height: 40px !important;
}
#search .classify {
margin-left: 10px;
margin-right: 10px;
}
#search .matter .matter-content {
margin: 0 10px;
}
#search .matter .sidebar-box {
display: none;
}
#search .matter .search-box {
margin-left: 10px;
margin-right: 10px;
}
.item-box {
padding: 18px 10px 0;
}
.item-box .comment .text {
width: calc(100vw - 122px);
}
.item-box .bottom .bottom-item:not(:last-child) {
margin-right: 30px;
}
}
@media screen and (max-width: 500px) {
#search .classify .item {
min-width: inherit;
font-size: 13px;
height: 28px;
line-height: 28px;
border-radius: 8px;
}
}
@media screen and (max-width: 480px) {
.head-top.flexacenter {
margin-bottom: 10px !important;
}
.item-box .bottom {
height: 55px;
justify-content: space-between;
}
.item-box .bottom .bottom-item:not(:last-child) {
margin-right: 0;
}
}
@media screen and (max-width: 450px) {
#search .classify .item {
padding: 0 5px;
}
}