diff --git a/docs/image-rename-map.json b/docs/image-rename-map.json index 9def7fa..8dd54c4 100644 --- a/docs/image-rename-map.json +++ b/docs/image-rename-map.json @@ -24,7 +24,6 @@ "ic_1.png": "ic-1.png", "ic_2.png": "ic-2.png", "ic_3.png": "ic-3.png", - "logo_b.svg": "logo-b.svg", "logo.png":"logo.png", "logo_icon.png": "logo-icon.png", "solution_ai_integration.svg": "solution-ai-integration.svg", diff --git a/docs/移动端适配指南.md b/docs/移动端适配指南.md index 235e235..1c2afb4 100644 --- a/docs/移动端适配指南.md +++ b/docs/移动端适配指南.md @@ -19,10 +19,7 @@ - **网格系统**:自动从多列调整为单列 - **容器适配**:边距和间距自动调整 -### 3. 触摸设备优化 -- **触摸友好尺寸**:按钮最小高度44px -- **触摸友好间距**:菜单项间距优化 -- **触摸反馈**:移动端禁用悬停效果 + ### 4. 性能优化 - **移动端动画简化**:减少复杂动画 diff --git a/src/assets/css/common.less b/src/assets/css/common.less index b7ac880..454c603 100644 --- a/src/assets/css/common.less +++ b/src/assets/css/common.less @@ -3,12 +3,12 @@ /* 为固定头部预留统一顶部空间 */ body { - padding-top: 120px; + padding-top: 65px; } @media (max-width: 768px) { body { - padding-top: 100px; + padding-top: 65px; } } diff --git a/src/assets/css/common_mobile.less b/src/assets/css/common_mobile.less index fbf62f1..0b3bfed 100644 --- a/src/assets/css/common_mobile.less +++ b/src/assets/css/common_mobile.less @@ -71,12 +71,11 @@ line-height: 1.6 !important; } - // 图标移动端适配 + // 图标移动端适配(不包含页脚 .contact-icon:页脚为行内小图标,全局大会破坏与文字对齐) .icon, .service-icon, .advantage-icon, - .area-icon, - .contact-icon { + .area-icon { font-size: 2.5rem !important; margin-bottom: 15px !important; } @@ -308,7 +307,6 @@ .button { padding: 12px 24px !important; font-size: 16px !important; - min-height: 44px !important; // 触摸友好尺寸 width: 100% !important; // 移动端全宽按钮 &.btn-large { @@ -347,7 +345,6 @@ font-size: 16px !important; // 防止iOS缩放 border: 1px solid #ddd !important; border-radius: 4px !important; - min-height: 44px !important; // 触摸友好尺寸 &:focus { outline: none !important; diff --git a/src/assets/css/mobile_responsive.less b/src/assets/css/mobile_responsive.less index 699f20e..7b6fc25 100644 --- a/src/assets/css/mobile_responsive.less +++ b/src/assets/css/mobile_responsive.less @@ -76,9 +76,9 @@ } li { - margin: 15px 0; - border-bottom: 1px solid #e2e8f0; - padding-bottom: 15px; + margin: 12px 0; + border-bottom: none; + padding-bottom: 0; } a { @@ -97,12 +97,11 @@ .subMenu { margin-left: 20px; - margin-top: 10px; + margin-top: 6px; li { - border-bottom: none; - margin: 10px 0; - padding-bottom: 5px; + margin: 2px 0; + padding-bottom: 0; a { font-size: 16px; @@ -241,7 +240,6 @@ .button { padding: 12px 24px; font-size: 16px; - min-height: 44px; // 触摸友好尺寸 &.btn-large { padding: 15px 30px; @@ -272,7 +270,6 @@ font-size: 16px; // 防止iOS缩放 border: 1px solid #ddd; border-radius: 4px; - min-height: 44px; // 触摸友好尺寸 &:focus { outline: none; @@ -514,15 +511,18 @@ } } - // 触摸设备优化菜单项 - .menuContent { - li { - a { - padding: 15px 0; // 增加触摸区域 - min-height: 44px; // 触摸友好尺寸 - display: flex; - align-items: center; - } + // 触摸设备:仅一级菜单链接保持 44px;子菜单单独收紧,避免子项也被撑高 + .headerMobileMenu .menuContent { + > ul > li > a { + padding: 15px 0; + display: flex; + align-items: center; + } + + .subMenu li a { + padding: 6px 0; + min-height: auto; + display: block; } } } diff --git a/src/assets/img/logo-b.svg b/src/assets/img/logo-b.svg deleted file mode 100644 index 107a172..0000000 --- a/src/assets/img/logo-b.svg +++ /dev/null @@ -1,44 +0,0 @@ - - - - - - - - - - - - - - - - - - - - - - - - - - - diff --git a/src/assets/img/logo_2.png b/src/assets/img/logo_2.png new file mode 100644 index 0000000..ff49e19 Binary files /dev/null and b/src/assets/img/logo_2.png differ diff --git a/src/components/ifooter.vue b/src/components/ifooter.vue index 264c371..7dfdd2e 100644 --- a/src/components/ifooter.vue +++ b/src/components/ifooter.vue @@ -221,8 +221,7 @@ export default { margin-bottom: 12px; } -.footer-links a, -.contact-item a { +.footer-links a { color: #475569; text-decoration: none; transition: color 0.25s ease; @@ -230,6 +229,16 @@ export default { position: relative; } +.contact-item a { + color: #475569; + text-decoration: none; + transition: color 0.25s ease; + position: relative; + display: inline-flex; + align-items: center; + line-height: 1.35; +} + .footer-links a:hover, .contact-item a:hover { color: #1d4ed8; @@ -251,8 +260,12 @@ export default { } .contact-icon { + display: inline-flex; + align-items: center; + justify-content: center; width: 20px; height: 20px; + line-height: 0; text-align: center; color: #64748b; flex-shrink: 0; @@ -387,7 +400,7 @@ export default { .contact-item { justify-content: center; text-align: center; - flex-wrap: wrap; + flex-wrap: nowrap; } .footer-logo { diff --git a/src/components/ihead.vue b/src/components/ihead.vue index 286f76d..c4a14d9 100644 --- a/src/components/ihead.vue +++ b/src/components/ihead.vue @@ -124,8 +124,8 @@ export default { computed: { image_paths() { return { - logo: img('logo.png'), - mobile_logo: img('logo.png'), + logo: img('logo_2.png'), + mobile_logo: img('logo_2.png'), hamburger: img('svg/ic-hamburger.svg'), arrow_back: img('svg/ic-arrow-back.svg') } @@ -239,7 +239,7 @@ export default { /* 主要导航区域 - 覆盖旧样式 */ .bottom { - padding: 15px 0; + padding: 5px 0; /* 覆盖旧表格布局 */ display: block; height: auto; @@ -261,11 +261,11 @@ export default { .logoCell { flex-shrink: 0; - margin: 0 32px 0 0; + margin: 0px; } .logoCell .logo { - height: 50px; + height: 30px; transition: transform 0.3s ease; } @@ -398,7 +398,7 @@ export default { } .mobile .logo { - height: 40px; + height: 30px; } .mobileIconsCell { @@ -458,7 +458,7 @@ export default { background: white; width: 80%; height: 100%; - padding: 20px; + padding: 14px 16px; overflow-y: auto; } @@ -468,13 +468,13 @@ export default { } .menuContent li { - margin: 15px 0; + margin: 2px 0; } .menuContent a, .menuContent .menu-label { display: block; - padding: 15px; + padding: 10px 12px; color: #2c3e50; text-decoration: none; font-weight: 500; @@ -489,14 +489,19 @@ export default { } .subMenu { - margin-left: 20px; - border-left: 2px solid #e9ecef; - padding-left: 15px; + margin-left: 0; + padding-left: 12px; + margin-top: 4px; + margin-bottom: 4px; +} + +.subMenu li { + margin: 0; } .goBack { - margin-top: 30px; - padding-top: 20px; + margin-top: 16px; + padding-top: 12px; border-top: 1px solid #e9ecef; } @@ -505,7 +510,7 @@ export default { align-items: center; gap: 10px; width: 100%; - padding: 15px; + padding: 10px 12px; border: 0; background: transparent; color: #6c757d; @@ -577,7 +582,7 @@ export default { } .logoCell .logo { - height: 45px; + height:30px; } } diff --git a/src/views/index.vue b/src/views/index.vue index ebbaeaa..e2d664b 100644 --- a/src/views/index.vue +++ b/src/views/index.vue @@ -539,7 +539,7 @@ export default { display: inline-flex; align-items: center; justify-content: center; - min-height: 44px; + min-height: 44px; padding: 0 20px; border: 0; border-radius: 4px;