From a904d37314f1a4ad468bfa5533b5f877ae5713f8 Mon Sep 17 00:00:00 2001 From: yiqiu Date: Fri, 26 Dec 2025 15:41:00 +0800 Subject: [PATCH] =?UTF-8?q?=E4=BC=98=E5=8C=961?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- css/index.css | 322 +------------------------------------------------- 1 file changed, 1 insertion(+), 321 deletions(-) diff --git a/css/index.css b/css/index.css index 45bab20..376f86d 100644 --- a/css/index.css +++ b/css/index.css @@ -14,332 +14,12 @@ min-height: 100vh; } -/* 强制提升 header 和导航菜单的层级 */ -#index header, -#index #header { - z-index: 99999 !important; - position: relative; - transition: background 0.3s ease !important; -} - -#index #header { - position: sticky !important; -} - -#index #header:hover, -#index header:hover { - background: rgba(15, 23, 42, 0.6) !important; -} - -/* 首页 section-content 统一左右边距为 20px */ +/* 首页 section-content 统一左右边距 */ #index .section-content { padding-left: var(--container-padding-x); padding-right: var(--container-padding-x); } -/* 首页导航栏：使用统一的容器系统 */ -#index .nav-header { - max-width: var(--container-max-width); - margin: 0 auto; - padding: 0 var(--container-padding-x); - display: flex; - align-items: stretch; - height: 70px; -} - -#index .nav-header .nav-left { - display: flex; - align-items: center; - flex: 1; -} - -#index .nav-right { - display: flex; - align-items: stretch; - height: 100%; -} - -#index .nav-right>a { - display: flex; - align-items: center; -} - -/* 纯文字链接样式 */ -#index .nav-right .nav-text-link { - color: #CBD5E1; - font-size: 14px; - font-weight: 400; - padding: 0 16px; - display: flex; - align-items: center; - transition: all 0.3s ease; - cursor: pointer; - text-decoration: none; -} - -#index .nav-right .nav-text-link:hover { - color: #38BDF8; -} - -/* 分隔符样式 */ -#index .nav-right .nav-divider { - color: rgba(148, 163, 184, 0.3); - display: flex; - align-items: center; - font-size: 14px; - user-select: none; -} - -/* nav-shadow 样式和 hover 效果 */ -#index .nav-shadow { - background: rgba(15, 23, 42, 0.8) !important; - backdrop-filter: blur(20px); - border-bottom: 1px solid rgba(148, 163, 184, 0.15); - box-shadow: 0 4px 24px rgba(15, 23, 42, 0.4); - transition: background 0.3s ease !important; -} - -#index .nav-shadow:hover { - background: rgba(15, 23, 42, 0.95) !important; -} - -/* 首页导航文字颜色 */ -#index .nav-menu .nav-item { - color: #E5E7EB; - border-bottom-color: transparent; -} - -#index .nav-menu .nav-item:hover { - color: #38BDF8; - border-bottom-color: #38BDF8; -} - -#index .nav-right .control { - color: #E5E7EB; -} - -#index .nav-right .control:hover { - color: #38BDF8; -} - -/* ============================================ - 登录注册区域 - 撑满高度设计 - ============================================ */ - -/* 登录注册容器 */ -#index .no-login { - display: flex !important; - align-items: stretch !important; - height: 100% !important; - gap: 0 !important; - margin: 0 !important; - padding: 0 !important; - flex-direction: row !important; - visibility: visible !important; -} - -/* 注册按钮 - 渐变背景样式，撑满高度 */ -#index .no-login .btn.btn-normal#registBtn { - display: flex !important; - align-items: center !important; - justify-content: center !important; - gap: 8px !important; - padding: 0 36px !important; - font-size: 16px !important; - font-weight: 600 !important; - color: #ffffff !important; - background: linear-gradient(135deg, #38BDF8 0%, #6366F1 100%) !important; - border: none !important; - border-left: 1px solid rgba(148, 163, 184, 0.15) !important; - border-radius: 0 !important; - cursor: pointer !important; - transition: all 0.3s ease !important; - position: relative !important; - overflow: hidden !important; - margin: 0 !important; - min-width: 120px !important; - flex-shrink: 0 !important; - box-shadow: none !important; - height: 100% !important; - box-sizing: border-box !important; -} - -/* 注册按钮文字 - 确保始终在最上层 */ -#index .no-login .btn.btn-normal#registBtn .regist-text { - position: relative; - z-index: 3; - display: inline-flex; - align-items: center; -} - -/* 注册按钮图标 */ -#index .no-login .btn.btn-normal#registBtn::before { - content: ''; - display: block; - width: 16px; - height: 16px; - background-image: url('/web/BlackFruit-web/assets/img/header/zhuce.png'); - background-size: contain; - background-repeat: no-repeat; - background-position: center; - position: relative; - z-index: 3; - flex-shrink: 0; -} - -/* 注册按钮悬停效果背景层 */ -#index .no-login .btn.btn-normal#registBtn::after { - content: ''; - position: absolute; - top: 0; - left: 0; - right: 0; - bottom: 0; - background: linear-gradient(135deg, #6366F1 0%, #38BDF8 100%); - opacity: 0; - transition: opacity 0.3s ease; - pointer-events: none; - z-index: 1; -} - -#index .no-login .btn.btn-normal#registBtn:hover { - box-shadow: 0 4px 16px rgba(56, 189, 248, 0.4) !important; -} - -#index .no-login .btn.btn-normal#registBtn:hover::after { - opacity: 1; -} - -#index .no-login .btn.btn-normal#registBtn:hover::after { - opacity: 1; -} - -/* 注册按钮图标 - 默认隐藏 (桌面端) */ -.regist-icon { - width: 16px; - height: 16px; - margin-right: 4px; - display: none; -} - -/* ============================================ - 移动端导航优化 - ============================================ */ -/* 移动端响应式优化 */ -@media (max-width: 768px) { - - /* 调整导航栏高度 */ - #index .nav-header { - height: 56px; - padding: 0 0 0 16px !important; - display: flex !important; - align-items: center !important; - /* Force vertical centering */ - justify-content: space-between; - } - - /* Ensure Right Container handles children alignment */ - #index .nav-right { - display: flex; - align-items: center; - height: 100%; - /* Fill header height */ - margin: 0; - } - - /* 隐藏桌面端导航菜单 */ - #index .nav-menu { - display: none !important; - } - - /* 隐藏桌面端的文档、控制台链接 */ - #index .nav-desktop-link { - display: none !important; - } - - /* Logo 缩小 - 但比之前稍微大一点 */ - #index .nav-icon img { - max-height: 48px; - /* Increased from 32px to 48px */ - width: auto; - object-fit: contain; - } - - /* 调整移动端注册按钮样式 - 长方形无圆角，撑满导航栏高度 */ - #index .no-login .btn.btn-normal#registBtn { - padding: 0 25px !important; - font-size: 15px !important; - min-width: auto !important; - border-radius: 0 !important; - border-left: none !important; - height: 100% !important; - /* Ensure it fills parent height */ - max-height: 56px; - /* Match header height */ - margin-right: 0 !important; - display: flex; - align-items: center; - justify-content: center; - margin-top: 0 !important; - /* Remove any potential vertical margin */ - gap: 2px !important; - } - - /* 移动端注册按钮图标显示 */ - #index .no-login .btn.btn-normal#registBtn .regist-icon { - display: block; - margin-right: 0 !important; - } - - /* 移动端注册按钮图标隐藏 - 旧样式移除 */ - #index .no-login .btn.btn-normal#registBtn::before { - display: none; - } - - /* 移动端登录按钮（如果需要显示） */ - #index .no-login .nav-text-link#loginBtn { - padding: 0 12px !important; - font-size: 14px !important; - } - - /* 确保汉堡菜单按钮显示 - 无背景，只显示白色横线 */ - #index .mobile-menu-toggle { - display: flex !important; - background: transparent !important; - border: none !important; - align-self: center; - /* Ensure it centers itself */ - margin-top: 0; - } -} - -/* 首页下拉菜单优化 - 确保高层级 */ -#index .nav-cont { - background: rgba(15, 23, 42, 0.95); - backdrop-filter: blur(20px); - border-bottom: 1px solid rgba(148, 163, 184, 0.15); - z-index: 99998 !important; - position: absolute !important; -} - -#index .nav-item-box { - background: rgba(30, 41, 59, 0.8); - border: 1px solid rgba(148, 163, 184, 0.15); -} - -#index .nav-item-box:hover { - background: rgba(30, 41, 59, 1); - border-color: rgba(56, 189, 248, 0.3); -} - -#index .nav-item-box .title { - color: #E5E7EB; -} - -#index .nav-item-box .desc { - color: rgba(148, 163, 184, 0.8); -} - /* ============================================ Banner 区域 ============================================ */