diff --git a/.trae/documents/plan_20260213_061302.md b/.trae/documents/plan_20260213_061302.md
new file mode 100644
index 0000000..94f9a9f
--- /dev/null
+++ b/.trae/documents/plan_20260213_061302.md
@@ -0,0 +1,13 @@
+I will optimize the layout for `ContactSection.js` and fix the responsive issues, including the "bottom text" visibility and mobile layout.
+
+### Plan:
+1. **Modify `src/App.css` to fix layout and scrolling issues:**
+ * **Enable Scrolling:** Update the `.section` class to include `overflow-y: auto` and `overflow-x: hidden`. This is critical for mobile devices where content height often exceeds the viewport, ensuring the bottom text (footer) in `ContactSection` is accessible.
+ * **Optimize Mobile Layout for ContactSection:**
+ * Adjust `.contact-section` margins and paddings for mobile screens (`max-width: 768px`) to reduce wasted space and ensure content fits better.
+ * Tweaking `.contact-footer` spacing.
+ * **Verify/Fix HeroSection Video Layout:**
+ * Ensure the container for the video (`.hero-right`) has appropriate sizing on mobile so the video (`stay.mp4`) displays correctly within its container, addressing the user's concern about the "responsive layout" of that element.
+
+2. **Verify the changes:**
+ * I will verify the CSS changes by checking the code structure and ensuring the styles logically solve the overflow and spacing issues.
diff --git a/public/index.html b/public/index.html
index 1c0da8c..ed8de0e 100644
--- a/public/index.html
+++ b/public/index.html
@@ -5,7 +5,9 @@
- Radiant AI - 创新科技，引领未来
+
+
+ 量迹AI科技
diff --git a/public/logo.svg b/public/logo.svg
new file mode 100644
index 0000000..25f8a5d
--- /dev/null
+++ b/public/logo.svg
@@ -0,0 +1,35 @@
+
+
\ No newline at end of file
diff --git a/src/App.css b/src/App.css
index 539b8b0..77797be 100644
--- a/src/App.css
+++ b/src/App.css
@@ -104,10 +104,14 @@ body, html {
height: 100%;
display: flex;
flex-direction: column;
- justify-content: center;
+ justify-content: flex-start;
align-items: center;
padding: 2rem;
+ padding-top: 6rem;
transform-style: preserve-3d;
+ overflow-y: auto;
+ overflow-x: hidden;
+ -webkit-overflow-scrolling: touch;
}
.section-title {
@@ -1650,36 +1654,37 @@ body, html {
.contact-section {
width: 100%;
max-width: 1400px;
- margin-top: 8rem;
+ margin-top: auto;
+ margin-bottom: auto;
}
.contact-header {
text-align: center;
- margin-bottom: 4rem;
+ margin-bottom: 2rem;
}
.contact-header h2 {
- font-size: 2.5rem;
- margin-bottom: 1rem;
+ font-size: 2.2rem;
+ margin-bottom: 0.5rem;
color: var(--text-primary);
}
.contact-header p {
- font-size: 1.2rem;
+ font-size: 1rem;
color: var(--text-secondary);
}
.contact-container {
display: grid;
grid-template-columns: 1fr 1fr;
- gap: 3rem;
+ gap: 2rem;
}
.contact-methods {
display: flex;
flex-direction: column;
- gap: 1.5rem;
- margin-bottom: 3rem;
+ gap: 1rem;
+ margin-bottom: 2rem;
}
.contact-method {
@@ -1687,11 +1692,11 @@ body, html {
backdrop-filter: blur(20px);
border: 1px solid rgba(255, 255, 255, 0.1);
border-radius: var(--border-radius);
- padding: 2rem;
+ padding: 1.5rem;
transition: var(--transition-smooth);
display: flex;
align-items: center;
- gap: 1.5rem;
+ gap: 1.2rem;
}
.contact-method:hover {
@@ -1726,30 +1731,31 @@ body, html {
backdrop-filter: blur(20px);
border: 1px solid rgba(255, 255, 255, 0.1);
border-radius: var(--border-radius);
- padding: 2rem;
+ padding: 1.5rem;
}
.contact-social h4 {
color: var(--text-primary);
- margin-bottom: 1rem;
+ margin-bottom: 0.8rem;
}
.social-links {
display: flex;
- gap: 1rem;
+ gap: 0.8rem;
}
.social-link {
background: var(--gradient-primary);
color: white;
- padding: 0.8rem 1.2rem;
- border-radius: 15px;
+ padding: 0.6rem 1rem;
+ border-radius: 12px;
cursor: pointer;
font-weight: 500;
transition: var(--transition-smooth);
text-align: center;
- min-width: 80px;
+ min-width: 70px;
box-shadow: var(--shadow-soft);
+ font-size: 0.9rem;
}
.social-link:hover {
@@ -1762,12 +1768,12 @@ body, html {
backdrop-filter: blur(20px);
border: 1px solid rgba(255, 255, 255, 0.1);
border-radius: var(--border-radius);
- padding: 3rem;
+ padding: 2rem;
box-shadow: var(--shadow-soft);
}
.form-group {
- margin-bottom: 1.5rem;
+ margin-bottom: 1.2rem;
}
.form-group label {
@@ -2107,9 +2113,18 @@ body, html {
}
.contact-section {
- margin-top: 5rem;
- padding: 0 1.5rem;
+ margin-top: 2rem;
+ margin-bottom: 0;
+ padding: 0 1rem;
+ padding-bottom: 4rem; /* Ensure footer has space */
}
+
+ .contact-footer {
+ margin-top: 2rem;
+ padding-top: 1.5rem;
+ padding-bottom: 2rem;
+ }
+
.contact-header h2 {
font-size: 2rem;
diff --git a/src/App.js b/src/App.js
index ca90fae..ea2ff13 100644
--- a/src/App.js
+++ b/src/App.js
@@ -39,6 +39,7 @@ const App = () => {
// 同步 ref 值
useEffect(() => {
+ document.title = "量迹AI科技";
isScrollingRef.current = isScrolling;
currentSectionRef.current = currentSection;
}, [isScrolling, currentSection]);
diff --git a/src/asset/logo.svg b/src/asset/logo.svg
new file mode 100644
index 0000000..25f8a5d
--- /dev/null
+++ b/src/asset/logo.svg
@@ -0,0 +1,35 @@
+
+
\ No newline at end of file
diff --git a/src/components/ContactSection.js b/src/components/ContactSection.js
index 46c65da..9996c26 100644
--- a/src/components/ContactSection.js
+++ b/src/components/ContactSection.js
@@ -159,7 +159,7 @@ const ContactSection = ({ isActive }) => {
animate={isActive ? { opacity: 1 } : {}}
transition={{ duration: 1, delay: 1.2 }}
>
- © 2024 Radiant AI. 创新科技，引领未来。
+ © 2024 量迹AI. 创新科技，引领未来。
滇ICP备2025071546号-1