diff --git a/app/pages/index.vue b/app/pages/index.vue index deda80a..8348015 100644 --- a/app/pages/index.vue +++ b/app/pages/index.vue @@ -4,39 +4,44 @@
-
- - 中心赴南宁宁宁区调研 -
“经桂通”平台推广应用培训会在南宁召开
-
2026-03-09
-
-
+ + 自治区信息中心赴南宁邕宁区(县)调研县域数字经济发展情况 + -
- - 中心赴南宁市邕宁区(县)调研县域数字经济发展情况 - - - 调研现场 - -
- -
-
-
-
+ 广告位 决策咨询
@@ -126,7 +131,7 @@
- 单位企业广告 + 单位企业广告
@@ -197,7 +202,9 @@ usePageSeo({ description: '广西决策咨询网首页' }) -const promoBannerImage = '/images/%E6%88%AA%E5%B1%8F2026-04-28%2021.38.43.png' +const adImage = '/images/ad.png' +const ad1Image = '/images/ad1.png' +const promoBannerImage = '/images/jczx.png' const subnavStripImage = '/images/%E5%9B%BE%E5%B1%82%2050.png' const expertSectionTitleImage = '/images/zjzx.png' const expertSectionBgImage = '/images/zjzxBg.png' @@ -217,11 +224,33 @@ type Group = { type?: 'logos' } -const heroNews = [ - { id: 3, title: '数字广西建设“十五五”规划编制工作座谈会在南宁召开' }, - { id: 4, title: '广西发布县域数字经济试点“成绩单”,桂北七城重点突破' }, - { id: 5, title: '中国一东盟人工智能创新合作加快构建' }, - { id: 6, title: '“桂链”平台入选国家数据局数据基础设施试点典型案例' } +type HeroNewsItem = { + id: number + title: string + summary: string +} + +const heroNews: HeroNewsItem[] = [ + { + id: 3, + title: '数字广西发展“十五五”规划编制工作座谈会在南宁召开', + summary: '会议认为,“十五五”时期是广西数字化发展全面深化、跨越提升的关键阶段,科学编制规划是贯彻落实数字广西建设的重要抓手。' + }, + { + id: 4, + title: '广西发布县域数字经济“成绩单”,超七成县市区实现突破', + summary: '产业发展指数同比提升 9.6%,共有 64 个县(市、区)实现指数增长,县域数字产业活力与支撑能力持续增强。' + }, + { + id: 5, + title: '中国—东盟人工智能指数体系加快构建', + summary: '围绕人工智能产业高质量发展,持续完善面向区域合作的评价指标体系与应用场景,为开放合作提供数据支撑。' + }, + { + id: 6, + title: '“桂链”平台入选国家数据局数据基础设施建设典型案例', + summary: '案例立足“桂链”平台总体架构,聚焦区块链与数据基础设施协同建设,形成了可复制、可推广的经验做法。' + } ] const createItems = (prefix: string, startId: number): TextItem[] => ([ @@ -320,15 +349,33 @@ const actionLinks = [ } .headline-grid { - display: grid; - grid-template-columns: 220px 1.45fr 1fr; - gap: 16px; - align-items: start; margin-bottom: 28px; } +.headline-content { + display: grid; + grid-template-columns: minmax(0, 1.35fr) minmax(0, 1fr); + gap: 34px; + align-items: start; +} + +.headline-main-title { + display: flex; + align-items: center; + justify-content: center; + min-height: 132px; + margin-bottom: 36px; + padding: 18px 24px 26px; + border-bottom: 1px solid #ececec; + color: #2236c6; + font-size: clamp(28px, 3.2vw, 42px); + font-weight: 500; + line-height: 1.35; + letter-spacing: 1px; + text-align: center; +} + .headline-left, -.headline-center, .headline-right, .article-panel, .experts-section { @@ -341,80 +388,90 @@ const actionLinks = [ background: #fff; } -.headline-image-card img, -.feature-image-wrap img { +.headline-image-card img { width: 100%; display: block; object-fit: cover; -} - -.headline-image-card img { - height: 254px; + height: 430px; } .headline-image-title { - margin-top: 12px; + margin-top: 20px; color: #2d2d2d; - font-size: 14px; + font-size: 18px; font-weight: 700; - line-height: 1.7; - padding: 0 10px; + line-height: 1.45; + padding: 0 6px; } .headline-image-date { - margin-top: 8px; - color: #999; - font-size: 12px; - padding: 0 10px 10px; -} - -.headline-center { - padding: 14px; -} - -.feature-title { - display: block; - margin-bottom: 12px; - color: #1b58a3; - font-size: 34px; - font-weight: 700; - line-height: 1.4; -} - -.feature-image-wrap img { - height: 356px; + margin-top: 14px; + color: #8e8e8e; + font-size: 14px; + font-weight: 500; + padding: 0 6px 10px; } .headline-right { - padding: 12px 14px; + padding-top: 2px; } .subnav-strip { display: flex; - flex-wrap: wrap; - gap: 6px; - margin-bottom: 14px; - padding: 8px 10px; + align-items: center; + gap: 18px; + margin-bottom: 22px; + padding: 10px 22px; background-position: center; background-repeat: no-repeat; background-size: 100% 100%; color: #fff; - font-size: 12px; - min-height: 35px; + font-size: 14px; + line-height: 1; + min-height: 50px; + white-space: nowrap; +} + +.subnav-strip .active { + padding: 12px 18px; + background: rgba(255, 255, 255, 0.24); + clip-path: polygon(0 0, 92% 0, 100% 50%, 92% 100%, 0 100%); + font-weight: 700; +} + +.subnav-strip-more { + margin-left: auto; + font-weight: 600; } .news-links { display: flex; flex-direction: column; - gap: 14px; + gap: 0; } -.news-links a { - color: #1f2d3d; +.news-link-card { + padding: 18px 8px 20px; + border-bottom: 1px solid #e9e9e9; +} + +.news-link-card h3 { + margin: 0 0 16px; + color: #3777c4; + font-size: 18px; + font-weight: 700; + line-height: 1.45; +} + +.news-link-card p { + margin: 0; + color: #454545; font-size: 14px; - line-height: 1.7; - border-bottom: 1px dashed #dfdfdf; - padding-bottom: 12px; + line-height: 1.95; + display: -webkit-box; + overflow: hidden; + -webkit-line-clamp: 2; + -webkit-box-orient: vertical; } .ad-banner { @@ -473,6 +530,10 @@ const actionLinks = [ .image-heading { margin-bottom: 22px; + display: flex; + align-items: center; + justify-content: center; + flex-direction: column; } .section-heading-title { @@ -788,14 +849,13 @@ const actionLinks = [ } @media (max-width: 1100px) { - .headline-grid, + .headline-content, .article-columns.two, .experts-grid, .action-grid { grid-template-columns: 1fr; } - .headline-center, .headline-right, .headline-left, .experts-section { @@ -803,8 +863,25 @@ const actionLinks = [ padding-right: 0; } - .feature-title { - font-size: 26px; + .headline-main-title { + min-height: 108px; + margin-bottom: 24px; + font-size: 30px; + } + + .headline-image-card img { + height: 380px; + } + + .headline-image-title, + .news-link-card h3 { + font-size: 18px; + } + + .headline-image-date, + .news-link-card p, + .subnav-strip { + font-size: 14px; } .logo-list-wrap { @@ -817,11 +894,10 @@ const actionLinks = [ width: min(100%, calc(100% - 24px)); } - .headline-grid { - gap: 12px; + .headline-content { + gap: 18px; } - .headline-center, .headline-right, .headline-left, .article-panel, @@ -829,20 +905,43 @@ const actionLinks = [ padding: 0; } - .headline-center { - padding: 12px; + .headline-main-title { + min-height: auto; + margin-bottom: 18px; + padding: 10px 6px 18px; + font-size: 24px; + line-height: 1.45; } - .headline-right { - padding: 12px; + .headline-image-card img { + height: 250px; } - .feature-title { - font-size: 22px; + .headline-image-title, + .news-link-card h3 { + font-size: 20px; } - .feature-image-wrap img { - height: 240px; + .headline-image-date, + .news-link-card p { + font-size: 14px; + } + + .subnav-strip { + gap: 10px; + margin-bottom: 12px; + padding: 12px 14px; + font-size: 13px; + min-height: 52px; + overflow-x: auto; + } + + .subnav-strip .active { + padding: 10px 12px; + } + + .news-link-card { + padding: 14px 0 16px; } .section-heading { diff --git a/public/images/ad.png b/public/images/ad.png new file mode 100644 index 0000000..48e5eb6 Binary files /dev/null and b/public/images/ad.png differ diff --git a/public/images/ad1.png b/public/images/ad1.png new file mode 100644 index 0000000..663d28e Binary files /dev/null and b/public/images/ad1.png differ diff --git a/public/images/jczx.png b/public/images/jczx.png new file mode 100644 index 0000000..5ceac83 Binary files /dev/null and b/public/images/jczx.png differ diff --git a/public/images/截屏2026-04-28 21.38.43.png b/public/images/截屏2026-04-28 21.38.43.png deleted file mode 100644 index 8a3728b..0000000 Binary files a/public/images/截屏2026-04-28 21.38.43.png and /dev/null differ