This commit is contained in:
张成
2026-04-29 10:13:09 +08:00
parent 9f9cb8d7aa
commit 9ae71507c8
10 changed files with 61 additions and 94 deletions

View File

@@ -24,7 +24,6 @@
"ic_1.png": "ic-1.png", "ic_1.png": "ic-1.png",
"ic_2.png": "ic-2.png", "ic_2.png": "ic-2.png",
"ic_3.png": "ic-3.png", "ic_3.png": "ic-3.png",
"logo_b.svg": "logo-b.svg",
"logo.png":"logo.png", "logo.png":"logo.png",
"logo_icon.png": "logo-icon.png", "logo_icon.png": "logo-icon.png",
"solution_ai_integration.svg": "solution-ai-integration.svg", "solution_ai_integration.svg": "solution-ai-integration.svg",

View File

@@ -19,10 +19,7 @@
- **网格系统**:自动从多列调整为单列 - **网格系统**:自动从多列调整为单列
- **容器适配**:边距和间距自动调整 - **容器适配**:边距和间距自动调整
### 3. 触摸设备优化
- **触摸友好尺寸**按钮最小高度44px
- **触摸友好间距**:菜单项间距优化
- **触摸反馈**:移动端禁用悬停效果
### 4. 性能优化 ### 4. 性能优化
- **移动端动画简化**:减少复杂动画 - **移动端动画简化**:减少复杂动画

View File

@@ -3,12 +3,12 @@
/* 为固定头部预留统一顶部空间 */ /* 为固定头部预留统一顶部空间 */
body { body {
padding-top: 120px; padding-top: 65px;
} }
@media (max-width: 768px) { @media (max-width: 768px) {
body { body {
padding-top: 100px; padding-top: 65px;
} }
} }

View File

@@ -71,12 +71,11 @@
line-height: 1.6 !important; line-height: 1.6 !important;
} }
// 图标移动端适配 // 图标移动端适配(不包含页脚 .contact-icon页脚为行内小图标全局大会破坏与文字对齐
.icon, .icon,
.service-icon, .service-icon,
.advantage-icon, .advantage-icon,
.area-icon, .area-icon {
.contact-icon {
font-size: 2.5rem !important; font-size: 2.5rem !important;
margin-bottom: 15px !important; margin-bottom: 15px !important;
} }
@@ -308,7 +307,6 @@
.button { .button {
padding: 12px 24px !important; padding: 12px 24px !important;
font-size: 16px !important; font-size: 16px !important;
min-height: 44px !important; // 触摸友好尺寸
width: 100% !important; // 移动端全宽按钮 width: 100% !important; // 移动端全宽按钮
&.btn-large { &.btn-large {
@@ -347,7 +345,6 @@
font-size: 16px !important; // 防止iOS缩放 font-size: 16px !important; // 防止iOS缩放
border: 1px solid #ddd !important; border: 1px solid #ddd !important;
border-radius: 4px !important; border-radius: 4px !important;
min-height: 44px !important; // 触摸友好尺寸
&:focus { &:focus {
outline: none !important; outline: none !important;

View File

@@ -76,9 +76,9 @@
} }
li { li {
margin: 15px 0; margin: 12px 0;
border-bottom: 1px solid #e2e8f0; border-bottom: none;
padding-bottom: 15px; padding-bottom: 0;
} }
a { a {
@@ -97,12 +97,11 @@
.subMenu { .subMenu {
margin-left: 20px; margin-left: 20px;
margin-top: 10px; margin-top: 6px;
li { li {
border-bottom: none; margin: 2px 0;
margin: 10px 0; padding-bottom: 0;
padding-bottom: 5px;
a { a {
font-size: 16px; font-size: 16px;
@@ -241,7 +240,6 @@
.button { .button {
padding: 12px 24px; padding: 12px 24px;
font-size: 16px; font-size: 16px;
min-height: 44px; // 触摸友好尺寸
&.btn-large { &.btn-large {
padding: 15px 30px; padding: 15px 30px;
@@ -272,7 +270,6 @@
font-size: 16px; // 防止iOS缩放 font-size: 16px; // 防止iOS缩放
border: 1px solid #ddd; border: 1px solid #ddd;
border-radius: 4px; border-radius: 4px;
min-height: 44px; // 触摸友好尺寸
&:focus { &:focus {
outline: none; outline: none;
@@ -514,15 +511,18 @@
} }
} }
// 触摸设备优化菜单项 // 触摸设备:仅一级菜单链接保持 44px子菜单单独收紧避免子项也被撑高
.menuContent { .headerMobileMenu .menuContent {
li { > ul > li > a {
a { padding: 15px 0;
padding: 15px 0; // 增加触摸区域 display: flex;
min-height: 44px; // 触摸友好尺寸 align-items: center;
display: flex; }
align-items: center;
} .subMenu li a {
padding: 6px 0;
min-height: auto;
display: block;
} }
} }
} }

View File

@@ -1,44 +0,0 @@
<svg width="448.3" height="309.7"
viewBox="0 0 249.99999999999997 172.70410043836824" class="looka-1j8o68f">
<defs id="SvgjsDefs9244"></defs>
<g id="SvgjsG9245" featurekey="JQyOZB-0"
transform="matrix(0.3,0,0,0.3,73.6,-1.4)"
fill="#fafafa">
<g xmlns="http://www.w3.org/2000/svg">
<g>
<defs>
<rect id="b" x="8.5" y="8.5"
transform="matrix(0.7,-0.7,0.7,0.7,-62.1,146.4)" width="283"
height="283"></rect>
</defs>
<clipPath id="a">
<use transform="matrix(1,0,0,1,0,0)" xmlns:xlink="http://www.w3.org/1999/xlink" xlink:href="#b" style=""
overflow="visible"></use>
</clipPath>
<g style="clip-path: url(#a)"
>
<path
d="M 67.2 155.9 l -59.3 -1 c -2.3 0 -4 1.9 -3.9 4 c 1.4 22.6 7.8 43.7 18.3 62.4 c 1 1.7 3 2.5 4.8 1.7 l 57.5 -24.6 c 3.7 -1.6 8.1 -1.3 11.5 1.1 c 4.4 3.2 5.8 9.2 3.6 13.9 l -26.7 57 c -0.8 1.7 -0.2 3.9 1.5 4.9 c 18.3 11 39.2 18.2 61.7 20.4 c 2.2 0.2 4.1 -1.5 4.2 -3.8 l 1 -59.3 C 142 190.9 108.9 156.6 67.2 155.9 z"></path>
<path
d="M 144.1 67.2 l 1 -59.3 c 0 -2.3 -1.9 -4 -4 -3.9 c -22.6 1.4 -43.7 7.8 -62.4 18.3 c -1.7 1 -2.5 3 -1.7 4.8 l 24.6 57.5 c 1.6 3.7 1.3 8.1 -1.1 11.5 c -3.2 4.4 -9.1 5.8 -13.9 3.6 L 29.7 72.9 c -1.7 -0.8 -3.9 -0.2 -4.9 1.5 c -11 18.3 -18.2 39.2 -20.4 61.7 c -0.2 2.2 1.5 4.1 3.8 4.2 l 59.3 1 C 109.1 142 143.4 108.9 144.1 67.2 z"></path>
<path
d="M 232.8 144.1 l 59.3 1 c 2.3 0 4 -1.9 3.9 -4 c -1.4 -22.6 -7.8 -43.7 -18.3 -62.4 c -1 -1.7 -3 -2.5 -4.8 -1.7 l -57.5 24.6 c -3.7 1.6 -8.1 1.3 -11.5 -1.1 c -4.4 -3.2 -5.8 -9.1 -3.6 -13.9 L 227 29.8 c 0.8 -1.7 0.2 -3.9 -1.5 -4.9 c -18.2 -11.1 -39.2 -18.3 -61.7 -20.4 c -2.2 -0.2 -4.1 1.5 -4.2 3.8 l -1 59.3 C 158 109.1 191.1 143.4 232.8 144.1 z"></path>
<path
d="M 198.2 215.1 c -2.1 -4.9 -0.6 -10.7 4.1 -13.8 c 3.4 -2.4 7.8 -2.5 11.5 -0.7 l 56.6 26.5 c 1.7 0.8 3.9 0.2 4.9 -1.5 c 11 -18.3 18.2 -39.2 20.3 -61.7 c 0.2 -2.2 -1.5 -4.1 -3.8 -4.2 l -59.3 -1 c -41.7 -0.7 -76 32.4 -76.7 74.1 l -1 59.3 c 0 2.3 1.9 4 4 3.9 c 22.6 -1.4 43.7 -7.8 62.4 -18.3 c 1.7 -1 2.5 -3 1.7 -4.8 L 198.2 215.1 z"></path>
</g>
</g>
</g>
</g>
<g id="SvgjsG9243" featurekey="SbCDzn-3"
transform="matrix(-4.3,0,0,-4.3,44.1,206.1)"
fill="#fafafa">
<path
d="M 1.1 7.8 l 9.1 0 l 0 2.8 l -6.1 0 l 0 2 l 4.9 0 l 0 2.8 l -4.9 0 l 0 1.9 l 6.1 0 l 0 2.8 l -9.1 0 l 0 -12.2 z"></path>
</g>
<g id="SvgjsG9246" featurekey="SbCDzn-0"
transform="matrix(4.3,0,0,4.3,-4.9,86.6)"
fill="#fafafa">
<path
d="M 11.9 7.8 l 3 0 l 0 12.2 l -3 0 l 0 -12.2 z M 20.2 13.3 l 0 6.7 l -3 0 l 0 -12.2 l 3 0 l 3.8 6.8 l 3.8 -6.8 l 3 0 l 0 12.2 l -3 0 l 0 -6.7 l -2.3 4 l -3 0 z M 45.9 7.8 l 2.9 0 l -2.3 12.2 l -4.4 0 l -1.6 -7.1 l -1.7 7.1 l -4.7 0 l -2 -12.2 l 3.1 0 l 1.4 9.2 l 1.8 -7.1 l 4.3 0 l 1.7 7.1 z M 50.1 7.8 l 9.1 0 l 0 2.8 l -6.1 0 l 0 2 l 4.9 0 l 0 2.8 l -4.9 0 l 0 1.9 l 6.1 0 l 0 2.8 l -9.1 0 l 0 -12.2 z"></path>
</g>
</svg>

Before

Width:  |  Height:  |  Size: 3.3 KiB

BIN
src/assets/img/logo_2.png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 244 KiB

View File

@@ -221,8 +221,7 @@ export default {
margin-bottom: 12px; margin-bottom: 12px;
} }
.footer-links a, .footer-links a {
.contact-item a {
color: #475569; color: #475569;
text-decoration: none; text-decoration: none;
transition: color 0.25s ease; transition: color 0.25s ease;
@@ -230,6 +229,16 @@ export default {
position: relative; 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, .footer-links a:hover,
.contact-item a:hover { .contact-item a:hover {
color: #1d4ed8; color: #1d4ed8;
@@ -251,8 +260,12 @@ export default {
} }
.contact-icon { .contact-icon {
display: inline-flex;
align-items: center;
justify-content: center;
width: 20px; width: 20px;
height: 20px; height: 20px;
line-height: 0;
text-align: center; text-align: center;
color: #64748b; color: #64748b;
flex-shrink: 0; flex-shrink: 0;
@@ -387,7 +400,7 @@ export default {
.contact-item { .contact-item {
justify-content: center; justify-content: center;
text-align: center; text-align: center;
flex-wrap: wrap; flex-wrap: nowrap;
} }
.footer-logo { .footer-logo {

View File

@@ -124,8 +124,8 @@ export default {
computed: { computed: {
image_paths() { image_paths() {
return { return {
logo: img('logo.png'), logo: img('logo_2.png'),
mobile_logo: img('logo.png'), mobile_logo: img('logo_2.png'),
hamburger: img('svg/ic-hamburger.svg'), hamburger: img('svg/ic-hamburger.svg'),
arrow_back: img('svg/ic-arrow-back.svg') arrow_back: img('svg/ic-arrow-back.svg')
} }
@@ -239,7 +239,7 @@ export default {
/* 主要导航区域 - 覆盖旧样式 */ /* 主要导航区域 - 覆盖旧样式 */
.bottom { .bottom {
padding: 15px 0; padding: 5px 0;
/* 覆盖旧表格布局 */ /* 覆盖旧表格布局 */
display: block; display: block;
height: auto; height: auto;
@@ -261,11 +261,11 @@ export default {
.logoCell { .logoCell {
flex-shrink: 0; flex-shrink: 0;
margin: 0 32px 0 0; margin: 0px;
} }
.logoCell .logo { .logoCell .logo {
height: 50px; height: 30px;
transition: transform 0.3s ease; transition: transform 0.3s ease;
} }
@@ -398,7 +398,7 @@ export default {
} }
.mobile .logo { .mobile .logo {
height: 40px; height: 30px;
} }
.mobileIconsCell { .mobileIconsCell {
@@ -458,7 +458,7 @@ export default {
background: white; background: white;
width: 80%; width: 80%;
height: 100%; height: 100%;
padding: 20px; padding: 14px 16px;
overflow-y: auto; overflow-y: auto;
} }
@@ -468,13 +468,13 @@ export default {
} }
.menuContent li { .menuContent li {
margin: 15px 0; margin: 2px 0;
} }
.menuContent a, .menuContent a,
.menuContent .menu-label { .menuContent .menu-label {
display: block; display: block;
padding: 15px; padding: 10px 12px;
color: #2c3e50; color: #2c3e50;
text-decoration: none; text-decoration: none;
font-weight: 500; font-weight: 500;
@@ -489,14 +489,19 @@ export default {
} }
.subMenu { .subMenu {
margin-left: 20px; margin-left: 0;
border-left: 2px solid #e9ecef; padding-left: 12px;
padding-left: 15px; margin-top: 4px;
margin-bottom: 4px;
}
.subMenu li {
margin: 0;
} }
.goBack { .goBack {
margin-top: 30px; margin-top: 16px;
padding-top: 20px; padding-top: 12px;
border-top: 1px solid #e9ecef; border-top: 1px solid #e9ecef;
} }
@@ -505,7 +510,7 @@ export default {
align-items: center; align-items: center;
gap: 10px; gap: 10px;
width: 100%; width: 100%;
padding: 15px; padding: 10px 12px;
border: 0; border: 0;
background: transparent; background: transparent;
color: #6c757d; color: #6c757d;
@@ -577,7 +582,7 @@ export default {
} }
.logoCell .logo { .logoCell .logo {
height: 45px; height:30px;
} }
} }

View File

@@ -539,7 +539,7 @@ export default {
display: inline-flex; display: inline-flex;
align-items: center; align-items: center;
justify-content: center; justify-content: center;
min-height: 44px; min-height: 44px;
padding: 0 20px; padding: 0 20px;
border: 0; border: 0;
border-radius: 4px; border-radius: 4px;