1
This commit is contained in:
@@ -8,7 +8,7 @@
|
||||
@media (max-width: @mobile-breakpoint) {
|
||||
// 页面横幅移动端适配
|
||||
.page-banner {
|
||||
padding: 60px 0 40px !important;
|
||||
padding: 48px 0 28px !important;
|
||||
}
|
||||
|
||||
.banner-title {
|
||||
@@ -46,7 +46,7 @@
|
||||
.contact-grid,
|
||||
.tech-grid {
|
||||
grid-template-columns: 1fr !important;
|
||||
gap: 20px !important;
|
||||
gap: 16px !important;
|
||||
}
|
||||
|
||||
// 卡片移动端适配
|
||||
@@ -57,13 +57,13 @@
|
||||
.team-member,
|
||||
.contact-card,
|
||||
.tech-layer {
|
||||
padding: 25px 20px !important;
|
||||
margin-bottom: 20px !important;
|
||||
padding: 20px 16px !important;
|
||||
margin-bottom: 14px !important;
|
||||
}
|
||||
|
||||
// 内容区域移动端适配
|
||||
.content-section {
|
||||
margin-bottom: 40px !important;
|
||||
margin-bottom: 28px !important;
|
||||
}
|
||||
|
||||
.section-text {
|
||||
@@ -97,7 +97,7 @@
|
||||
padding-left: 20px !important;
|
||||
|
||||
.timeline-item {
|
||||
margin-bottom: 30px !important;
|
||||
margin-bottom: 22px !important;
|
||||
padding-left: 20px !important;
|
||||
|
||||
.timeline-date {
|
||||
@@ -119,16 +119,16 @@
|
||||
|
||||
// 统计数字移动端适配
|
||||
.stats-section {
|
||||
padding: 40px 0 !important;
|
||||
padding: 28px 0 !important;
|
||||
|
||||
.stats-grid {
|
||||
grid-template-columns: repeat(2, 1fr) !important;
|
||||
gap: 20px !important;
|
||||
gap: 16px !important;
|
||||
}
|
||||
|
||||
.stat-item {
|
||||
text-align: center !important;
|
||||
padding: 20px 15px !important;
|
||||
padding: 16px 12px !important;
|
||||
|
||||
.stat-number {
|
||||
font-size: 2rem !important;
|
||||
@@ -145,7 +145,7 @@
|
||||
.team-section {
|
||||
.team-grid {
|
||||
grid-template-columns: 1fr !important;
|
||||
gap: 25px !important;
|
||||
gap: 18px !important;
|
||||
}
|
||||
|
||||
.team-member {
|
||||
@@ -178,7 +178,7 @@
|
||||
.contact-section {
|
||||
.contact-grid {
|
||||
grid-template-columns: 1fr !important;
|
||||
gap: 25px !important;
|
||||
gap: 18px !important;
|
||||
}
|
||||
|
||||
.contact-info {
|
||||
@@ -226,8 +226,8 @@
|
||||
// 解决方案移动端适配
|
||||
.solutions-section {
|
||||
.solution-item {
|
||||
margin-bottom: 30px !important;
|
||||
padding: 20px !important;
|
||||
margin-bottom: 20px !important;
|
||||
padding: 16px !important;
|
||||
|
||||
.solution-icon {
|
||||
font-size: 2.5rem !important;
|
||||
@@ -252,8 +252,8 @@
|
||||
// 优势特点移动端适配
|
||||
.advantages-section {
|
||||
.advantage-item {
|
||||
margin-bottom: 25px !important;
|
||||
padding: 20px !important;
|
||||
margin-bottom: 18px !important;
|
||||
padding: 16px !important;
|
||||
text-align: center !important;
|
||||
|
||||
.advantage-icon {
|
||||
@@ -276,8 +276,8 @@
|
||||
// 服务领域移动端适配
|
||||
.areas-section {
|
||||
.area-item {
|
||||
margin-bottom: 25px !important;
|
||||
padding: 20px !important;
|
||||
margin-bottom: 18px !important;
|
||||
padding: 16px !important;
|
||||
text-align: center !important;
|
||||
|
||||
.area-icon {
|
||||
@@ -296,7 +296,7 @@
|
||||
}
|
||||
|
||||
.area-features {
|
||||
margin-top: 15px !important;
|
||||
margin-top: 12px !important;
|
||||
text-align: left !important;
|
||||
}
|
||||
}
|
||||
@@ -367,7 +367,7 @@
|
||||
|
||||
.form-actions {
|
||||
text-align: center !important;
|
||||
margin-top: 30px !important;
|
||||
margin-top: 22px !important;
|
||||
|
||||
.btn {
|
||||
margin: 0 5px 10px !important;
|
||||
@@ -436,7 +436,7 @@
|
||||
justify-content: center !important;
|
||||
flex-wrap: wrap !important;
|
||||
gap: 5px !important;
|
||||
margin: 30px 0 !important;
|
||||
margin: 18px 0 !important;
|
||||
|
||||
.page-item {
|
||||
.page-link {
|
||||
@@ -484,7 +484,7 @@
|
||||
// 警告框移动端适配
|
||||
.alert {
|
||||
padding: 15px !important;
|
||||
margin: 20px 0 !important;
|
||||
margin: 14px 0 !important;
|
||||
border-radius: 4px !important;
|
||||
font-size: 0.95rem !important;
|
||||
|
||||
@@ -682,16 +682,31 @@
|
||||
}
|
||||
}
|
||||
|
||||
// 页脚移动端适配
|
||||
// 解决方案子页共用(facilityManagement、appDelivery 等 .solution-page 结构)
|
||||
.solution-page {
|
||||
.hero {
|
||||
padding: 118px 0 52px !important;
|
||||
}
|
||||
|
||||
.section {
|
||||
padding: 48px 0 !important;
|
||||
}
|
||||
|
||||
h2 {
|
||||
margin-bottom: 18px !important;
|
||||
}
|
||||
}
|
||||
|
||||
// 页脚移动端适配(块间距略紧,避免与组件内边距叠得过高)
|
||||
.footer {
|
||||
padding: 40px 0 20px !important;
|
||||
padding: 28px 0 16px !important;
|
||||
text-align: center !important;
|
||||
|
||||
.footer-content {
|
||||
margin-bottom: 30px !important;
|
||||
margin-bottom: 18px !important;
|
||||
|
||||
.footer-section {
|
||||
margin-bottom: 25px !important;
|
||||
margin-bottom: 14px !important;
|
||||
|
||||
.footer-title {
|
||||
font-size: 1.1rem !important;
|
||||
@@ -721,7 +736,7 @@
|
||||
|
||||
.footer-bottom {
|
||||
border-top: 1px solid #eee !important;
|
||||
padding-top: 20px !important;
|
||||
padding-top: 14px !important;
|
||||
font-size: 0.85rem !important;
|
||||
color: #999 !important;
|
||||
}
|
||||
|
||||
@@ -206,7 +206,7 @@
|
||||
/* 响应式布局调整 */
|
||||
@media (max-width: @breakpoint-lg) {
|
||||
.contentPage {
|
||||
padding-top: @spacing-xxl;
|
||||
padding-top: @spacing-xl;
|
||||
}
|
||||
|
||||
.contentTableLeft,
|
||||
@@ -222,7 +222,7 @@
|
||||
|
||||
@media (max-width: @breakpoint-md) {
|
||||
.contentPage {
|
||||
padding-top: @spacing-xl;
|
||||
padding-top: @spacing-lg;
|
||||
}
|
||||
|
||||
.contentTableLeft {
|
||||
@@ -232,7 +232,7 @@
|
||||
|
||||
@media (max-width: @breakpoint-sm) {
|
||||
.contentPage {
|
||||
padding-top: @spacing-lg;
|
||||
padding-top: @spacing-md;
|
||||
}
|
||||
|
||||
.contentTableLeft {
|
||||
|
||||
@@ -66,7 +66,7 @@
|
||||
}
|
||||
|
||||
.menuContent {
|
||||
padding: 80px 20px 20px;
|
||||
padding: 64px 20px 20px;
|
||||
color: #0f172a;
|
||||
|
||||
ul {
|
||||
@@ -128,8 +128,8 @@
|
||||
}
|
||||
|
||||
.goBack {
|
||||
margin-top: 30px;
|
||||
padding-top: 20px;
|
||||
margin-top: 18px;
|
||||
padding-top: 14px;
|
||||
border-top: 1px solid #e2e8f0;
|
||||
text-align: center;
|
||||
|
||||
@@ -160,19 +160,19 @@
|
||||
min-height: 400px;
|
||||
|
||||
.banner-content {
|
||||
padding: 40px 20px;
|
||||
padding: 28px 16px;
|
||||
text-align: center;
|
||||
|
||||
.banner-title {
|
||||
font-size: 2.5rem;
|
||||
line-height: 1.2;
|
||||
margin-bottom: 20px;
|
||||
margin-bottom: 14px;
|
||||
}
|
||||
|
||||
.banner-subtitle {
|
||||
font-size: 1.2rem;
|
||||
line-height: 1.4;
|
||||
margin-bottom: 30px;
|
||||
margin-bottom: 20px;
|
||||
}
|
||||
|
||||
.banner-button {
|
||||
@@ -188,18 +188,18 @@
|
||||
}
|
||||
|
||||
.section {
|
||||
padding: 40px 0;
|
||||
padding: 28px 0;
|
||||
|
||||
.section-title {
|
||||
font-size: 2rem;
|
||||
line-height: 1.3;
|
||||
margin-bottom: 20px;
|
||||
margin-bottom: 14px;
|
||||
}
|
||||
|
||||
.section-subtitle {
|
||||
font-size: 1.1rem;
|
||||
line-height: 1.5;
|
||||
margin-bottom: 30px;
|
||||
margin-bottom: 20px;
|
||||
}
|
||||
}
|
||||
|
||||
@@ -211,7 +211,7 @@
|
||||
.team-grid,
|
||||
.contact-grid {
|
||||
grid-template-columns: 1fr;
|
||||
gap: 20px;
|
||||
gap: 16px;
|
||||
}
|
||||
|
||||
// 移动端卡片适配
|
||||
@@ -221,12 +221,12 @@
|
||||
.service-card,
|
||||
.team-card,
|
||||
.contact-card {
|
||||
padding: 20px;
|
||||
margin-bottom: 20px;
|
||||
padding: 16px;
|
||||
margin-bottom: 14px;
|
||||
|
||||
.card-title {
|
||||
font-size: 1.3rem;
|
||||
margin-bottom: 15px;
|
||||
margin-bottom: 12px;
|
||||
}
|
||||
|
||||
.card-content {
|
||||
@@ -254,7 +254,7 @@
|
||||
|
||||
// 移动端表单适配
|
||||
.form-group {
|
||||
margin-bottom: 20px;
|
||||
margin-bottom: 16px;
|
||||
|
||||
label {
|
||||
display: block;
|
||||
@@ -399,7 +399,7 @@
|
||||
}
|
||||
|
||||
.section {
|
||||
padding: 30px 0;
|
||||
padding: 24px 0;
|
||||
|
||||
.section-title {
|
||||
font-size: 1.8rem;
|
||||
@@ -544,7 +544,7 @@
|
||||
@media (orientation: landscape) and (max-height: 500px) {
|
||||
.headerMobileMenu {
|
||||
.menuContent {
|
||||
padding: 60px 20px 20px;
|
||||
padding: 52px 20px 20px;
|
||||
}
|
||||
|
||||
.closeMenu {
|
||||
|
||||
@@ -367,12 +367,13 @@ export default {
|
||||
/* 响应式设计 */
|
||||
@media (max-width: 768px) {
|
||||
.footer-content {
|
||||
padding: 40px 0 0 0;
|
||||
padding: 28px 0 0 0;
|
||||
}
|
||||
|
||||
.footer-main {
|
||||
grid-template-columns: 1fr;
|
||||
gap: 30px;
|
||||
gap: 20px;
|
||||
margin-bottom: 28px;
|
||||
justify-items: center;
|
||||
text-align: center;
|
||||
}
|
||||
@@ -381,6 +382,34 @@ export default {
|
||||
width: min(520px, 100%);
|
||||
}
|
||||
|
||||
.footer-section h4 {
|
||||
margin-bottom: 12px;
|
||||
}
|
||||
|
||||
.footer-logo .logo {
|
||||
margin-bottom: 10px;
|
||||
}
|
||||
|
||||
.footer-logo h3 {
|
||||
margin-bottom: 8px;
|
||||
}
|
||||
|
||||
.footer-cta {
|
||||
margin-top: 14px;
|
||||
}
|
||||
|
||||
.footer-links li {
|
||||
margin-bottom: 8px;
|
||||
}
|
||||
|
||||
.contact-info {
|
||||
gap: 10px;
|
||||
}
|
||||
|
||||
.footer-address {
|
||||
margin-top: 12px;
|
||||
}
|
||||
|
||||
.footer-section h4::after {
|
||||
left: 50%;
|
||||
transform: translateX(-50%);
|
||||
@@ -409,9 +438,14 @@ export default {
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.footer-bottom {
|
||||
padding: 14px 0;
|
||||
}
|
||||
|
||||
.footer-bottom-content {
|
||||
flex-direction: column;
|
||||
text-align: center;
|
||||
gap: 12px;
|
||||
}
|
||||
|
||||
.back-to-top {
|
||||
|
||||
@@ -319,11 +319,11 @@ export default {
|
||||
|
||||
@media (max-width: 768px) {
|
||||
.about-us-page {
|
||||
padding-top: 72px;
|
||||
padding-top: 56px;
|
||||
}
|
||||
|
||||
.page-hero {
|
||||
padding: 72px 0 58px;
|
||||
padding: 56px 0 44px;
|
||||
}
|
||||
|
||||
.page-hero h1 {
|
||||
@@ -335,7 +335,7 @@ export default {
|
||||
}
|
||||
|
||||
.section {
|
||||
padding: 68px 0;
|
||||
padding: 48px 0;
|
||||
}
|
||||
|
||||
.section-title {
|
||||
|
||||
@@ -1209,6 +1209,7 @@ export default {
|
||||
}
|
||||
|
||||
.contact-item {
|
||||
display: flex;
|
||||
align-items: flex-start;
|
||||
gap: 18px;
|
||||
padding: 28px;
|
||||
@@ -1351,7 +1352,7 @@ export default {
|
||||
.cases-section,
|
||||
.clients-section,
|
||||
.contact-section {
|
||||
padding: 64px 0;
|
||||
padding: 48px 0;
|
||||
}
|
||||
|
||||
.section-title {
|
||||
@@ -1367,5 +1368,37 @@ export default {
|
||||
.clients-grid {
|
||||
grid-template-columns: 1fr;
|
||||
}
|
||||
|
||||
.intro-header {
|
||||
margin-bottom: 28px;
|
||||
}
|
||||
|
||||
.intro-content,
|
||||
.advantages-grid,
|
||||
.areas-grid,
|
||||
.capability-grid,
|
||||
.contact-info {
|
||||
margin-top: 28px;
|
||||
gap: 20px;
|
||||
}
|
||||
|
||||
.contact-entry-grid {
|
||||
gap: 20px;
|
||||
margin-top: 28px;
|
||||
}
|
||||
|
||||
.pageBoxes,
|
||||
.cases-grid {
|
||||
gap: 20px;
|
||||
margin-top: 28px;
|
||||
}
|
||||
|
||||
.clients-grid {
|
||||
margin-top: 28px;
|
||||
}
|
||||
|
||||
.contact-item {
|
||||
padding: 20px;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
||||
@@ -153,4 +153,18 @@ export default {
|
||||
font-size: 16px;
|
||||
line-height: 1.8;
|
||||
}
|
||||
|
||||
@media (max-width: 768px) {
|
||||
.legal-hero {
|
||||
padding: 112px 0 48px;
|
||||
}
|
||||
|
||||
.legal-content {
|
||||
padding: 48px 0;
|
||||
}
|
||||
|
||||
.legal-section {
|
||||
padding: 20px 0;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
||||
@@ -270,4 +270,23 @@ export default {
|
||||
grid-template-columns: 1fr;
|
||||
}
|
||||
}
|
||||
|
||||
@media (max-width: 768px) {
|
||||
.main-content {
|
||||
padding: 52px 0;
|
||||
}
|
||||
|
||||
.section-title {
|
||||
margin-bottom: 22px;
|
||||
font-size: 28px;
|
||||
}
|
||||
|
||||
.service-card {
|
||||
padding: 20px;
|
||||
}
|
||||
|
||||
.feature-item {
|
||||
padding: 18px;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
||||
Reference in New Issue
Block a user