diff --git a/app/components/news/body/FireNews/fhjt.tsx b/app/components/news/body/FireNews/fhjt.tsx
index 943221a..6d380ec 100644
--- a/app/components/news/body/FireNews/fhjt.tsx
+++ b/app/components/news/body/FireNews/fhjt.tsx
@@ -4,7 +4,7 @@ import {FireNewsList} from "./FireNewsList";
 
 export function FhjtPage() {
     return(
-    <div className=" w-full overflow-hidden flex justify-center h-200 mb-10">
+    <div className=" w-full overflow-hidden flex justify-center h-148 mb-10">
         <div className="relative">
 			{/* 轮播背景图 */}
 			<div className="w-200 absolute"  style={{clipPath: 'polygon(0 0, calc(100% - 150px)-0.9%, calc(100% - 30px) 100%, 0 100%)',}}>
diff --git a/app/components/news/body/FireNews/fhrx.tsx b/app/components/news/body/FireNews/fhrx.tsx
index 6192610..2834797 100644
--- a/app/components/news/body/FireNews/fhrx.tsx
+++ b/app/components/news/body/FireNews/fhrx.tsx
@@ -4,7 +4,7 @@ import {FireNewsList} from "./FireNewsList";
 
 export function FhrxPage() {
     return(
-    <div className=" w-full overflow-hidden flex justify-center h-200 mb-10">
+    <div className=" w-full overflow-hidden flex justify-center h-148 mb-10">
         <div className="relative">
 			{/* 轮播背景图 */}
 			<div className="w-200 absolute"  style={{clipPath: 'polygon(0 0, calc(100% - 150px)-0.9%, calc(100% - 30px) 100%, 0 100%)',}}>
diff --git a/app/components/news/body/FireNews/fhws.tsx b/app/components/news/body/FireNews/fhws.tsx
index 7c04f18..a3f0213 100644
--- a/app/components/news/body/FireNews/fhws.tsx
+++ b/app/components/news/body/FireNews/fhws.tsx
@@ -4,7 +4,7 @@ import {FireNewsList} from "./FireNewsList";
 
 export function FhwsPage() {
     return(
-    <div className=" w-full overflow-hidden flex justify-center h-200 mb-10">
+    <div className=" w-full overflow-hidden flex justify-center h-148 mb-10">
         <div className="w-120 h-full bg-white relative" >
 			{/* 标题部分 */}
 			<div className="relative pt-6 pl-8">
diff --git a/app/components/news/body/FireNews/fhyw.tsx b/app/components/news/body/FireNews/fhyw.tsx
index 45d7877..7244e31 100644
--- a/app/components/news/body/FireNews/fhyw.tsx
+++ b/app/components/news/body/FireNews/fhyw.tsx
@@ -1,17 +1,16 @@
 import { CarouselDemo } from "@/components/Carousel";
 import {FireNewsList} from "./FireNewsList";
 
-
 export function FhywPage() {
     return(
-    <div className="relative w-full max-w-4xl mx-auto overflow-hidden aspect-square">
-        {/* 轮播背景图 */}
-        <div className="absolute inset-0 z-0">
+    <div className="relative w-350 h-225 mx-auto overflow-hidden bg-sky-700">
+        {/* 轮播背景图 - 确保有明确尺寸 */}
+        <div className="absolute top-0 left-0 w-full h-200">
             <CarouselDemo />
         </div>
         
         {/* 固定的烽火要闻 */}
-        <div className="absolute top-0 right-0 w-1/3 h-full p-1">
+        <div className="absolute top-0 right-0 w-1/3 h-200 p-1">
             <FireNewsList />
         </div>
     </div>
diff --git a/app/components/news/body/GrassrootsDynamics.tsx b/app/components/news/body/GrassrootsDynamics.tsx
index 3c69570..79c5d45 100644
--- a/app/components/news/body/GrassrootsDynamics.tsx
+++ b/app/components/news/body/GrassrootsDynamics.tsx
@@ -1,21 +1,24 @@
 import React from 'react';
-import List from '@/components/list/List';
+import List from '@/components/news/list/List';
+
+
 
 export default function GrassrootsDynamics() {
   return (
-    <div className="flex  rounded-2xl  mx-auto w-4/5 h-140 mt-10 p-10">
+    <div className="flex  rounded-2xl  mx-auto w-4/5 h-140  pt-20 mb-20 ">
       <div className="w-2/5 p-6 flex flex-col items-center justify-center relative">
-        <div >
+        <div className="w-140  ">
           <img
             src="/images/carousel-1.jpg"
             alt="基层动态"
-            className="w-full h-full "
+
           />
         </div>
       </div>
 
       {/* 右边列表 */}
-      <div className="w-3/5 p-6 flex flex-col bg-[#0e93df] text-white">
+      <div className="w-3/5 p-6 flex flex-col bg-[#0e93df]  rounded-2xl h-130
+      ">
         <List />
       </div>
     </div>
diff --git a/app/components/news/header/TopNav.tsx b/app/components/news/header/TopNav.tsx
index b40a7ad..8eaf5ed 100644
--- a/app/components/news/header/TopNav.tsx
+++ b/app/components/news/header/TopNav.tsx
@@ -1,6 +1,6 @@
 import { Search } from 'lucide-react';
-import React, { useState, useEffect } from 'react';
-
+import React, { useState,useEffect} from 'react';
+import { Button } from '@/ui/button';
 interface MenuItem {
   label: string;
   key: string;
@@ -29,15 +29,7 @@ export function TopNav({
   const [internalActiveKey, setInternalActiveKey] = useState('home');
   const currentActiveKey = externalActiveKey !== undefined ? externalActiveKey : internalActiveKey;
   const [searchKeyword, setSearchKeyword] = useState('');
-  const [activeIndex, setActiveIndex] = useState(0);
-  const [prevIndex, setPrevIndex] = useState(0);
-
-  // 监听激活项变化，更新索引和动画方向
-  useEffect(() => {
-    const currentIndex = menuItems.findIndex(item => item.key === currentActiveKey);
-    setPrevIndex(activeIndex);
-    setActiveIndex(currentIndex);
-  }, [currentActiveKey, menuItems, activeIndex]);
+ 
 
   const handleSearchSubmit = (e: React.FormEvent) => {
     e.preventDefault();
@@ -52,61 +44,53 @@ export function TopNav({
   };
 
   return (
-    <div className="h-20 flex items-center justify-center px-8 bg-white">
+    // 将组件宽度调整为1514px，并保持居中
+    <div className="h-20 w-[1514px] mx-auto flex items-center px-8 bg-white border-t-16 border-b-16 border-[#1f79bf]">
       {/* 搜索框与导航菜单组合 */}
-      <div className="flex items-center space-x-4">
+      <div className="flex items-center justify-start w-full gap-5">
         {/* 搜索框 */}
-        <form onSubmit={handleSearchSubmit} className="relative">
-          <div className="relative">
-            <input
-              type="text"
-              value={searchKeyword}
-              onChange={(e) => setSearchKeyword(e.target.value)}
-              placeholder="搜索..."
-              className="pl-10 pr-4 py-2 text-sm border border-gray-300 focus:outline-none focus:ring-2 focus:ring-blue-500 focus:border-transparent w-64 transition-all duration-200 hover:shadow-sm"
-            />
-            <span className="absolute left-3 top-1/2 transform -translate-y-1/2 text-gray-400">
-              <Search className="w-5 h-5" />
-            </span>
-          </div>
-        </form>
+        
+        <div className="relative overflow-hidden bg-gray-100 ">
+          <Button variant="default" className="absolute rounded-none right-0 top-1/2 transform -translate-y-1/2 bg-[#1f79bf] hover:bg-[#1a68a0] text-white border-0 "
+                 onClick={handleSearchSubmit}
+                 
+                 >
+            <Search className="w-5 h-5" />
+          </Button>
 
-        {/* 导航菜单 */}
-        <ul className="flex space-x-8 relative">
-          {/* 滑动背景层 */}
-          <div 
-            className="absolute inset-y-0 z-0 transition-all duration-500 ease-out"
-            style={{
-              left: `${activeIndex * (100 / menuItems.length)}%`,
-              width: `${100 / menuItems.length}%`,
-              clipPath: 'polygon(0% 0%, 80% 0%, 100% 100%, 20% 100%)', // 向左倾斜的平行四边形
-              background: 'linear-gradient(135deg, #3b82f6 0%, #1d4ed8 100%)',
-              transform: `translateX(${(prevIndex - activeIndex) * 100}%)`,
-            }}
-          />
-          
-          {menuItems.map((item, index) => {
+          <input type="text" 
+                 placeholder='请输入关键词'
+                 value={searchKeyword}
+                 onChange={(e) => setSearchKeyword(e.target.value)}
+                className="pl-5 pr-4 py-2 text-sm h-full border border-gray-300 focus:outline-none focus:ring-2 focus:ring-blue-500 focus:border-transparent w-64 transition-all duration-200 hover:shadow-sm" />
+        </div>
+ 
+         
+          {/* 导航菜单 */}
+        <ul className="flex space-x-20 relative">
+          {menuItems.map((item) => {
             const isActive = currentActiveKey === item.key;
             return (
-              <li 
-                key={item.key} 
-                className="relative z-10"
-                style={{ width: `${100 / menuItems.length}%` }}
-              >
+              <li key={item.key} className="relative">
                 <button
                   onClick={() => handleItemClick(item)}
-                  className={`w-full h-full px-4 py-2 text-2xl transition-all duration-300 ${
-                    isActive
-                      ? 'text-white' // 激活状态文字颜色
-                      : 'text-gray-600 hover:text-black cursor-pointer' // 非激活状态样式
+                  className={`px-4 py-2 text-2xl font-extralight transition-all duration-500 relative z-10 ${
+                    isActive ? 'text-white' : 'text-gray-600 hover:font-bold'
                   }`}
                 >
-                  {item.label}
+                  {/* 激活状态背景层 */}
+                  {isActive && (
+                    <span className="absolute inset-0 bg-gradient-to-br from-blue-500 to-blue-700 transform skew-x-12  rounded-none z-0"></span>
+                  )}
+                  <span className="relative z-20">{item.label}</span>
                 </button>
               </li>
             );
           })}
         </ul>
+
+
+
       </div>
     </div>
   );
diff --git a/app/components/list/List.tsx b/app/components/news/list/List.tsx
similarity index 89%
rename from app/components/list/List.tsx
rename to app/components/news/list/List.tsx
index ae0b0ff..b830a2f 100644
--- a/app/components/list/List.tsx
+++ b/app/components/news/list/List.tsx
@@ -19,11 +19,11 @@ const NewsItem: React.FC<NewsProps> = ({ title = '', time = '', url = '' }) => {
         {/* 标题部分：左侧 */}
         <div className="flex items-center">
           <div className="w-2 h-2 bg-white rounded-full mr-2"></div>
-          <h3 className="text-lg font-semibold text-white hover:text-blue-600">{title}</h3>
+          <h3 className="text-xl font-semibold text-white hover:text-blue-600">{title}</h3>
         </div>
 
         {/* 时间部分：右侧 */}
-        <p className="text-sm text-white hover:text-blue-600 text-right">{time}</p>
+        <p className="text-xl text-white hover:text-blue-600 text-right">{time}</p>
       </div>
     </div>
   );
diff --git a/app/components/list/NewsData.tsx b/app/components/news/list/NewsData.tsx
similarity index 100%
rename from app/components/list/NewsData.tsx
rename to app/components/news/list/NewsData.tsx
diff --git a/app/components/list/NewsList.tsx b/app/components/news/list/NewsList.tsx
similarity index 85%
rename from app/components/list/NewsList.tsx
rename to app/components/news/list/NewsList.tsx
index e219af9..12a9606 100644
--- a/app/components/list/NewsList.tsx
+++ b/app/components/news/list/NewsList.tsx
@@ -28,18 +28,18 @@ const NewsList: React.FC = () => {
   const educationNews = mockNewsData.filter((news) => news.type === "教育");
 
   return (
-    <div className="bg-gray-50 p-8 rounded-2xl shadow-xl w-4/5 mx-auto">
+    <div className=" p-8 rounded-2xl  w-4/5 mx-auto">
       {/* 使用 Flexbox 将两个列表放在一行 */}
       <div className="flex gap-8">
         {/* 科技新闻 */}
         <div className="flex-1 bg-white rounded-lg shadow-md">
           {/* 标题栏：独立于列表之外 */}
           <div className="flex items-center justify-between mb-6">
-            <div className="bg-blue-500 text-white px-6 py-3 font-bold text-4xl">
+            <div className="bg-[#1c6cab] text-white px-6 py-3 font-bold text-4xl">
               科技新闻
             </div>
-            <button className="text-base text-blue-300 hover:text-blue-400 transition duration-200 pl-6 pr-6">
-              [查看更多]
+            <button className="text-base text-blue-200 hover:text-blue-400 transition duration-200 pl-6 pr-6">
+              【查看更多】
             </button>
           </div>
 
@@ -60,11 +60,11 @@ const NewsList: React.FC = () => {
         <div className="flex-1 bg-white rounded-lg shadow-md">
           {/* 标题栏：独立于列表之外 */}
           <div className="flex items-center justify-between mb-6">
-            <div className="bg-blue-500 text-white px-6 py-3 font-bold text-4xl">
+            <div className="bg-[#1c6cab] text-white px-6 py-3 font-bold text-4xl">
               教育新闻
             </div>
-            <button className="text-base text-blue-300 hover:text-blue-400 transition duration-200 pl-6 pr-6">
-              [查看更多]
+            <button className="text-base text-blue-200 hover:text-blue-400 transition duration-200 pl-6 pr-6">
+           【查看更多】
             </button>
           </div>
 
diff --git a/app/routes/news.tsx b/app/routes/news.tsx
index 6daf3fb..58fc702 100755
--- a/app/routes/news.tsx
+++ b/app/routes/news.tsx
@@ -4,7 +4,7 @@ import Integrated from "@/components/news/body/Integrated";
 import CultureBgPage from "@/components/news/body/Culturebg";
 import {Header} from "@/components/news/header/Header";
 import {TopNav} from "@/components/news/header/TopNav";
-import NewsList from "@/components/list/NewsList";
+import NewsList from "@/components/news/list/NewsList";
 import ImageGridSection from "@/components/news/body/ImageGridSection";
 import GrassrootsDynamics from "@/components/news/body/GrassrootsDynamics";
 import { FhywPage } from "@/components/news/body/FireNews/fhyw";