Merge branch 'main' of http://113.45.67.59:3003/qiuchenfan/news

app/components/Carousel.tsx

@@ -31,7 +31,7 @@ const imageUrls = [
 export interface CarouselDemoProps {
   // 分页指示器位置：'left' 表示左下角，'right' 表示右下角，默认为 'right'
   paginationPosition?: 'left' | 'right';
-  
+
   // 分页指示器样式：'dot' 为圆形小点，'bar' 为横向小条，默认为 'dot'
   paginationStyle?: 'dot' | 'bar';
 }
@@ -73,7 +73,7 @@ export function CarouselDemo({
   return (
     // 外层容器：相对定位，占满父容器宽高
     <div className="relative w-full h-full">
-      
+
       {/* 轮播主容器 */}
       <Carousel
         opts={{
@@ -125,9 +125,8 @@ export function CarouselDemo({
 
       {/* 分页指示器容器：绝对定位在底部 */}
       <div
-        className={`absolute bottom-4 ${
+        className={`absolute bottom-4 ${paginationPosition === 'left' ? 'left-4' : 'right-4' // 根据 prop 控制左右位置
-          paginationPosition === 'left' ? 'left-4' : 'right-4' // 根据 prop 控制左右位置
+          } flex gap-2 z-10`} // 水平排列，间距 0.5rem，置于轮播图上方
-        } flex gap-2 z-10`} // 水平排列，间距 0.5rem，置于轮播图上方
       >
         {/* 动态生成指示器按钮 */}
         {Array.from({ length: count }).map((_, index) => (
@@ -138,12 +137,11 @@ export function CarouselDemo({
               // 根据 paginationStyle 决定形状
               paginationStyle === 'dot'
                 ? 'h-2 w-2 rounded-full'   // 圆形：宽高相等 + 全圆角
-                : 'h-2 w-8 rounded'         // 块状：宽 2rem，高 0.5rem，带圆角
+                : 'h-1 w-6 rounded'         // 块状
-            } ${
+              } ${index === current
-              index === current 
                 ? 'bg-white'       // 当前项为纯白色
                 : 'bg-white/50'    // 非当前项为半透明白色
-            }`}
+              }`}
             aria-label={`Go to slide ${index + 1}`} // 无障碍支持
           />
         ))}

app/components/news/body/ImageGridSection.tsx

@@ -45,7 +45,7 @@ const LearnPage = () => {
                         </div>
 
                         {/* 下三图 */}
-                        {[3, 4, 5].map((i) => (
+                        {[3, 4, 6].map((i) => (
                             <div key={i} className=" shadow-sm overflow-hidden">
                                 <img
                                     src={`/images/carousel-${i}.jpg`}
@@ -59,7 +59,7 @@ const LearnPage = () => {
             
 
                 {/* 右侧新闻列表 */}
-                <div className="lg:w-2/5 bg-white border border-gray-200 rounded-lg shadow-sm p-4 flex items-center">
+                <div className="lg:w-2/5 bg-white border border-gray-200  shadow-sm p-8 flex items-center">
                     <ul className="space-y-8 w-full">
                         {newsList.map((item, index) => (
                             <li
@@ -76,7 +76,7 @@ const LearnPage = () => {
             <div className="w-[1590px] h-[285px]    flex relative mb-10">
 				<div className="w-[750px] h-[188px] left-0 mt-25 absolute" style={{ backgroundColor: '#DEDEDC' }}>
 					<div
-						className="w-[140px] h-[220px]  absolute left-4 bottom-2 bg-cover bg-center "
+						className="w-[140px] h-[220px]  absolute left-4 bottom-3 bg-cover bg-center "
 						style={{ backgroundImage: "url('/public/images/book1.png')"}}
 					></div>
 					{/* 左边容器内容 */}
@@ -89,10 +89,10 @@ const LearnPage = () => {
 					</div>
 				</div>
 				<div className="w-[750px] h-[188px] mt-25 right-0 absolute" style={{ backgroundColor: '#DEDEDC' }}>
-					<img src="/public/images/book2.png"
+					<div
-						className="w-[200px] h-[240px] absolute left-0 bottom-0 bg-cover bg-center "
+						className="w-[150px] h-[240px]  absolute left-5 bottom-0 bg-cover bg-center "
-						alt="book"
+						style={{ backgroundImage: "url('/public/images/book2.png')"}}
-					></img>
+					></div>
 					{/* 右边容器内容 */}
 					<div className="absolute left-[200px] top-1/2 transform -translate-y-1/2 w-[520px] ">
 						<p className="text-[#005d93] text-[32px] font-bold text-center leading-tight mr-25">习近平著作选读</p>