新增朋友圈作者筛选;新增前台登入登出;深度优化

This commit is contained in:
anian
2026-03-15 18:05:44 +08:00
parent b387ea885c
commit e716097e07
19 changed files with 2632 additions and 1633 deletions
+302 -12
View File
@@ -1,36 +1,326 @@
/* 瞬间标签与评论间距 */
.moment_tag_gap {
margin-right: 10px;
margin-right: 10px;
}
/* 灯箱视频格式 */
.fancybox-slide--video .fancybox-content {
width: auto !important;
height: auto !important;
background: transparent;
width: auto !important;
height: auto !important;
background: transparent;
}
.fancybox-slide--video video.fancybox-video {
width: auto !important;
height: auto !important;
max-height: 75dvh !important;
max-width: 75dvw !important;
object-fit: contain;
width: auto !important;
height: auto !important;
max-height: 75dvh !important;
max-width: 75dvw !important;
object-fit: contain;
}
/* 片刻视频容器鼠标样式 */
.fancybox.mo_img {
cursor: zoom-in;
}
/* 图库视频图标hover放大 */
.video-fancybox .play-icon {
transition: all 0.4s ease !important;
display: inline-flex;
display: inline-flex;
align-items: center;
justify-content: center;
width: 40px;
height: 40px;
width: 40px;
height: 40px;
}
.video-fancybox:hover .play-icon {
transform: scale(1.3) !important;
opacity: 1;
}
/* 目录左边距:贴紧左侧边栏 */
.listree-box {
margin-left: 0;
}
@media (min-width: 960px) and (max-width: 1359.98px) {
.listree-box {
margin-left: calc((100vw - 860px) / 2 + 284px);
}
}
@media (min-width: 1360px) {
.listree-box {
margin-left: calc((100vw - 1400px) / 2 + 291px);
}
}
/* 登录容器 */
.custom-login-modal {
position: fixed;
inset: 0;
background: rgba(0, 0, 0, 0.55);
display: flex;
align-items: center;
justify-content: center;
z-index: 1999;
opacity: 0;
visibility: hidden;
transition: all .25s ease;
}
.custom-login-modal.show {
opacity: 1;
visibility: visible;
}
.login-modern-card {
width: 250px;
background: #ffffff;
padding: 30px 25px;
border-radius: 14px;
position: relative;
overflow: hidden;
box-shadow: 0 10px 40px rgba(0, 0, 0, 0.08);
}
.login-modern-card::before {
position: absolute;
content: "";
width: 360px;
height: 360px;
background: #e6f9ee;
transform: rotate(45deg);
left: -230px;
bottom: 20px;
border-radius: 40px;
z-index: 0;
}
.login-modern-form {
display: flex;
flex-direction: column;
position: relative;
z-index: 2;
}
.login-modern-title {
text-align: center;
font-size: 1.3rem;
font-weight: 600;
color: #1f2937;
margin-bottom: 15px;
}
.login-modern-input-wrapper {
width: 100%;
position: relative;
display: flex;
align-items: center;
margin-bottom: 20px;
}
.login-modern-icon {
position: absolute;
left: 2px;
font-size: 18px;
color: #6b7280;
}
.custom-login-modal input.login-modern-input {
width: 100%;
height: 38px;
padding-left: 30px;
font-size: 0.9rem;
color: #1f2937;
background: transparent !important;
border: none !important;
border-radius: 0 !important;
outline: none !important;
box-shadow: none !important;
border-bottom: 2px solid #cbd5e1 !important;
transition: border-color .2s;
}
.custom-login-modal input.login-modern-input::placeholder {
color: #94a3b8;
}
.custom-login-modal input.login-modern-input:focus {
border-bottom: 2px solid #22c55e !important;
}
.login-modern-submit {
width: 100%;
height: 35px;
border: none;
border-radius: 6px;
background: #22c55e;
color: white;
font-size: 0.9rem;
letter-spacing: .5px;
cursor: pointer;
transition: background .2s;
display: flex;
align-items: center;
justify-content: center;
padding: 0 !important;
}
.login-modern-submit:hover {
background: #16a34a;
}
.login-modern-submit:disabled {
background: #a7d7bd;
cursor: not-allowed;
color: #f0fdf4;
}
.login-modern-submit:disabled:hover {
background: #a7d7bd;
}
.close-modal-btn {
position: absolute;
right: 5px;
top: 5px;
border: none;
background: transparent;
font-size: 22px;
color: #9ca3af;
cursor: pointer;
z-index: 3;
}
/* 退出登录 */
.pixar-notice-wrapper {
display: none;
position: fixed;
inset: 0;
z-index: 1999;
justify-content: center;
align-items: center;
background: rgba(0, 0, 0, 0.35);
font-family: "Arial Rounded MT Bold", "Helvetica Rounded", Arial, sans-serif;
}
.pixar-notice-card {
--pixar-ui-blue: #5c99e2;
--pixar-ui-green: #61c470;
--pixar-ui-green-shadow: #45a253;
--pixar-ui-red: #e65e5e;
--pixar-ui-red-shadow: #c14242;
--pixar-ui-cream: #f5f1e8;
--pixar-ui-dark: #4d4c4a;
--pixar-ui-green-border: #2e7d32;
--pixar-ui-red-border: #8f2d2d;
--pixar-button-depth: 0.15em;
width: 19em;
max-width: 300px;
background: var(--pixar-ui-cream);
border-radius: 1.5em;
padding: 1.2em;
border: 0.2em solid var(--pixar-ui-dark);
box-shadow: 0.6em 0.6em 0 var(--pixar-ui-dark);
display: flex;
flex-direction: column;
transition: transform .2s cubic-bezier(.34, 1.56, .64, 1),
box-shadow .2s cubic-bezier(.34, 1.56, .64, 1);
}
.pixar-notice-card:hover {
transform: translateY(-.5em) rotate(-2deg);
box-shadow: .8em .8em 0 var(--pixar-ui-dark);
}
.pixar-notice-header {
display: flex;
align-items: center;
margin-bottom: 1em;
}
.pixar-notice-avatar {
width: 3.5em;
height: 3.5em;
border-radius: 50%;
background: linear-gradient(45deg, #f9a86d, #f48a58);
border: .2em solid var(--pixar-ui-dark);
box-shadow: .2em .2em 0 var(--pixar-ui-dark);
transition: transform .3s ease;
}
.pixar-notice-card:hover .pixar-notice-avatar {
transform: scale(1.05) rotate(5deg);
}
.pixar-notice-username {
margin-left: .8em;
font-size: 1.2em;
font-weight: 700;
color: var(--pixar-ui-dark);
}
.pixar-notice-image-area {
background: #d8d2c6;
border-radius: 1em;
padding: .8em;
border: .2em solid var(--pixar-ui-dark);
box-shadow: inset .2em .2em 0 #b3ac9f;
}
.pixar-notice-caption {
margin: 10px 5px !important;
font-size: .9em;
line-height: 1.4;
color: var(--pixar-ui-dark);
font-weight: 600;
}
.pixar-notice-actions {
display: flex;
justify-content: space-around;
margin-top: 1.5em;
}
.pixar-notice-btn {
border: .2em solid var(--pixar-ui-dark);
border-radius: 1em;
padding: .5em .8em;
font-size: 1.6em;
cursor: pointer;
background: var(--pixar-ui-green);
box-shadow:
0 var(--pixar-button-depth) 0 var(--pixar-ui-green-shadow),
0 .4em 0 var(--pixar-ui-dark);
transition: transform .1s ease,
box-shadow .1s ease;
}
.pixar-notice-btn:active {
transform: translateY(var(--pixar-button-depth));
box-shadow:
0 0 0 var(--pixar-ui-green-shadow),
0 var(--pixar-button-depth) 0 var(--pixar-ui-dark);
}
.pixar-notice-btn-close {
background: var(--pixar-ui-red);
box-shadow:
0 var(--pixar-button-depth) 0 var(--pixar-ui-red-shadow),
0 .4em 0 var(--pixar-ui-dark);
}
.pixar-notice-btn-close:active {
box-shadow:
0 0 0 var(--pixar-ui-red-shadow),
0 var(--pixar-button-depth) 0 var(--pixar-ui-dark);
}
.pixar-notice-btn-confirm:hover {
border-color: var(--pixar-ui-green-border) !important;
}
.pixar-notice-btn-close:hover {
border-color: var(--pixar-ui-red-border) !important;
}
File diff suppressed because it is too large Load Diff
+133 -83
View File
@@ -3,61 +3,67 @@
* 合并了原 1440px 和 1920px 的通用样式,并应用了你指定的 mod_third 布局
*/
@media only screen and (min-width: 1366px) {
/* --- 你提供的统一布局样式 --- */
body.mod_third .main_wrap,
body.mod_third .go_top_box {
max-width: 1400px;
}
/* 导航和侧边栏宽度分配 */
body.mod_third .left_nav {
width: 21%;
}
body.mod_third .main_sidebar {
width: 21%;
}
body.mod_third .page_main {
width: 58%; /* 主内容区 */
}
/* --- 你提供的统一布局样式 --- */
body.mod_third .main_wrap,
body.mod_third .go_top_box {
max-width: 1400px;
}
/* 底部导航栏和背景音乐盒定位 */
body.mod_third .footer_nav {
max-width: 1108px;
}
body.mod_third .bgm_box {
margin-left: -75px;
}
/* 导航和侧边栏宽度分配 */
body.mod_third .left_nav {
width: 21%;
}
/* --- 桌面端通用的基础样式合并 (源自原1440/1920) --- */
.footer_top, .footer_text {
font-size: 12px;
}
body.mod_third .main_sidebar {
width: 21%;
}
.land_content {
max-width: 1080px;
height: 607px;
}
body.mod_third .page_main {
width: 58%;
/* 主内容区 */
}
.land_right {
padding: 40px;
padding-top: 60px;
}
/* 底部导航栏和背景音乐盒定位 */
body.mod_third .footer_nav {
max-width: 1108px;
}
.land_logo {
margin-bottom: 30px;
}
body.mod_third .bgm_box {
margin-left: -75px;
}
.land_right .title {
font-size: 32px;
}
/* --- 桌面端通用的基础样式合并 (源自原1440/1920) --- */
.footer_top,
.footer_text {
font-size: 12px;
}
.land_right .land_des {
font-size: 14px;
}
.land_content {
max-width: 1080px;
height: 607px;
}
.land_right .footer {
padding: 0 40px;
}
.land_right {
padding: 40px;
padding-top: 60px;
}
.land_logo {
margin-bottom: 30px;
}
.land_right .title {
font-size: 32px;
}
.land_right .land_des {
font-size: 14px;
}
.land_right .footer {
padding: 0 40px;
}
}
/**
@@ -91,11 +97,14 @@
padding: 0 40px;
}
.land_nav a span , .land_nav a i {
.land_nav a span,
.land_nav a i {
font-size: 14px;
}
body.mod_third .main_wrap , body.mod_third .go_top_box , body.mod_third .footer_nav {
body.mod_third .main_wrap,
body.mod_third .go_top_box,
body.mod_third .footer_nav {
max-width: 860px;
}
@@ -103,7 +112,7 @@
display: none;
}
body.mod_third #top_third{
body.mod_third #top_third {
display: flex;
}
@@ -118,7 +127,7 @@
body.mod_third .top_bar {
border-top-right-radius: 12px;
}
}
}
/**
* 平板端及以下 (<= 1200px)
@@ -201,17 +210,21 @@
margin: 0;
}
.land_right .beian , .land_right .copyright {
.land_right .beian,
.land_right .copyright {
color: #293563;
}
}
}
/**
* 小屏平板 (<= 960px)
* 保持原样
*/
@media only screen and (max-width:960px) {
.main_wrap , .top_bar , .footer_nav {
.main_wrap,
.top_bar,
.footer_nav {
max-width: 720px;
}
@@ -219,7 +232,8 @@
margin-top: 0;
}
.lbc .page_main , .lbc .footer_nav_box .right {
.lbc .page_main,
.lbc .footer_nav_box .right {
width: 100%;
}
@@ -237,7 +251,9 @@
display: none;
}
body.mod_third .main_wrap, body.mod_third .go_top_box, body.mod_third .footer_nav {
body.mod_third .main_wrap,
body.mod_third .go_top_box,
body.mod_third .footer_nav {
max-width: 720px;
}
@@ -249,7 +265,7 @@
display: none;
}
body.mod_third_s #top_third{
body.mod_third_s #top_third {
display: block;
}
@@ -260,17 +276,19 @@
.top_menu_box {
border-radius: 8px;
}
}
}
/**
* 手机端 (<= 540px)
* 保持原样
*/
@media only screen and (max-width:540px) {
body.mod_third_s #top_third,body.mod_third #top_third{
body.mod_third_s #top_third,
body.mod_third #top_third {
display: flex;
}
.top_right {
margin-right: 15px;
justify-content: flex-end;
@@ -282,11 +300,15 @@
height: 54px;
}
.moment_cat_nav, .posts_cat_nav, .photos_cat_nav {
.moment_cat_nav,
.posts_cat_nav,
.photos_cat_nav,
.friends_cat_nav {
padding: 15px;
}
#post_item,#photos_item {
#post_item,
#photos_item {
padding: 0 15px;
}
@@ -305,7 +327,8 @@
margin-right: 12px;
}
.normal_content .entry-content p, .normal_card_content .entry-content p {
.normal_content .entry-content p,
.normal_card_content .entry-content p {
display: none;
}
@@ -337,7 +360,9 @@
padding-bottom: 100px;
}
.single_wrap .comments-area, .page_content .comments-area , .single_content .comments-area {
.single_wrap .comments-area,
.page_content .comments-area,
.single_content .comments-area {
padding: 15px;
}
@@ -351,7 +376,8 @@
padding-left: 50px;
}
.comments-area ul.comment-list li .profile , .comments-area ul.comment-list li .profile a {
.comments-area ul.comment-list li .profile,
.comments-area ul.comment-list li .profile a {
width: 35px;
height: 35px;
}
@@ -360,12 +386,15 @@
width: calc(83px*3);
}
.t_media_item , a.up_img_btn{
.t_media_item,
a.up_img_btn {
width: 80px;
height: 80px;
}
.single_content, .page_content, .page_wrap {
.single_content,
.page_content,
.page_wrap {
padding: 0 15px;
padding-bottom: 100px;
}
@@ -378,7 +407,12 @@
bottom: 18%;
}
.blog_list_inner , .single_content, .page_content, .page_wrap , .normal_list_inner , .single_wrap {
.blog_list_inner,
.single_content,
.page_content,
.page_wrap,
.normal_list_inner,
.single_wrap {
border-radius: 12px;
position: relative;
z-index: 199;
@@ -388,13 +422,14 @@
.top_left {
margin-left: 8px;
}
.top_left .top_logo {
display: block;
margin-left: 0;
}
.top_bar , .dark .top_bar {
.top_bar,
.dark .top_bar {
height: 64px;
width: 100% !important;
border-radius: 0;
@@ -434,7 +469,8 @@
height: 240px;
}
.top_bar.uk-sticky-fixed.uk-active , .dark .top_bar.uk-sticky-fixed.uk-active {
.top_bar.uk-sticky-fixed.uk-active,
.dark .top_bar.uk-sticky-fixed.uk-active {
background: transparent;
backdrop-filter: none;
-webkit-backdrop-filter: none;
@@ -452,7 +488,11 @@
background: rgb(27 29 48 / 80%);
}
.top_tool i , .dark .top_tool i , .dark .mobile_active .top_tool i , .t_dark a i , .dark .t_dark a i {
.top_tool i,
.dark .top_tool i,
.dark .mobile_active .top_tool i,
.t_dark a i,
.dark .t_dark a i {
color: #fff;
}
@@ -460,7 +500,7 @@
color: #000000;
}
.top_tool input.s_input:focus ~ [class*=ri-] {
.top_tool input.s_input:focus~[class*=ri-] {
color: #4f4f4f;
}
@@ -539,7 +579,8 @@
margin: 0;
}
.land_right .beian , .land_right .copyright {
.land_right .beian,
.land_right .copyright {
color: #293563;
}
@@ -601,7 +642,8 @@
display: none;
}
a.bg_music , .dark a.bg_music {
a.bg_music,
.dark a.bg_music {
background: transparent;
width: auto;
height: auto;
@@ -612,7 +654,12 @@
color: #fff;
}
.player_mod .tool , a.m_prev , a.m_next , .timer , a.m_volume , .player_hand {
.player_mod .tool,
a.m_prev,
a.m_next,
.timer,
a.m_volume,
.player_hand {
display: none;
}
@@ -691,25 +738,28 @@
}
body.mod_third_s .footer_nav_box .right {
width:100%;
width: 100%;
}
/* 手机端文章目录调整 */
h3.listree-titles {
font-size: 0.8rem;
padding: 9px 0;
margin: 0;
display: flex;
align-items: center;
justify-content: center;
padding: 9px 0;
margin: 0;
display: flex;
align-items: center;
justify-content: center;
}
#listree-ol li a {
font-size: 0.8rem;
}
#listree-ol {
margin: 10px 0 15px -10px;
padding-right: 15px;
}
#listree-ol li {
line-height: 1.2;
margin-top: 6px;
@@ -721,9 +771,9 @@
.footer_menu a.playing-music i,
.footer_menu a.playing-music .title {
color: #4CAF50;
}
}
}