From 4a1dbac02f520120150bb0a1864f1f38d1a3c384 Mon Sep 17 00:00:00 2001 From: toom1996 Date: Wed, 16 Jul 2025 19:20:11 +0800 Subject: [PATCH] update --- src/assets/css/bootstrap.css | 91 +--------- src/assets/css/theme-style.css | 9 +- src/assets/css1/style.css | 250 +--------------------------- src/components/Breadcrumb.astro | 29 ++++ src/components/Pagination.astro | 117 +++++++++++++ src/layouts/Layout.astro | 48 ++++-- src/pages/news.astro | 167 +++++++++++++++---- src/pages/news/[...slug].astro | 16 +- src/pages/news/page/[...page].astro | 5 + utils/rpc.ts | 7 +- 10 files changed, 341 insertions(+), 398 deletions(-) create mode 100644 src/components/Breadcrumb.astro create mode 100644 src/components/Pagination.astro create mode 100644 src/pages/news/page/[...page].astro diff --git a/src/assets/css/bootstrap.css b/src/assets/css/bootstrap.css index d85e15f..4a1ecde 100644 --- a/src/assets/css/bootstrap.css +++ b/src/assets/css/bootstrap.css @@ -395,76 +395,7 @@ h6 .small, line-height: 1; color: #999; } -h1, -.h1, -h2, -.h2, -h3, -.h3 { - margin-top: 20px; - margin-bottom: 10px; -} -h1 small, -.h1 small, -h2 small, -.h2 small, -h3 small, -.h3 small, -h1 .small, -.h1 .small, -h2 .small, -.h2 .small, -h3 .small, -.h3 .small { - font-size: 65%; -} -h4, -.h4, -h5, -.h5, -h6, -.h6 { - margin-top: 10px; - margin-bottom: 10px; -} -h4 small, -.h4 small, -h5 small, -.h5 small, -h6 small, -.h6 small, -h4 .small, -.h4 .small, -h5 .small, -.h5 .small, -h6 .small, -.h6 .small { - font-size: 75%; -} -h1, -.h1 { - font-size: 36px; -} -h2, -.h2 { - font-size: 30px; -} -h3, -.h3 { - font-size: 24px; -} -h4, -.h4 { - font-size: 18px; -} -h5, -.h5 { - font-size: 14px; -} -h6, -.h6 { - font-size: 12px; -} + p { margin: 0 0 10px; } @@ -4114,28 +4045,10 @@ select[multiple].input-group-sm > .input-group-btn > .btn { .navbar-inverse .navbar-link:hover { color: #fff; } -.breadcrumb { - padding: 8px 15px; - margin-bottom: 20px; - list-style: none; - background-color: #f5f5f5; - border-radius: 4px; -} -.breadcrumb > li { - display: inline-block; -} -.breadcrumb > li + li:before { - padding: 0 5px; - color: #ccc; - content: "/\00a0"; -} -.breadcrumb > .active { - color: #999; -} + .pagination { display: inline-block; padding-left: 0; - margin: 20px 0; border-radius: 4px; } .pagination > li { diff --git a/src/assets/css/theme-style.css b/src/assets/css/theme-style.css index ec770ef..934dfce 100644 --- a/src/assets/css/theme-style.css +++ b/src/assets/css/theme-style.css @@ -7,6 +7,7 @@ main { width: 100%; box-sizing: border-box; /* background: var(--background-light); */ + background-color: #f5f5f5; } @media only screen and (max-width: 767.98px) { @@ -18,7 +19,7 @@ main { html, body{ font-family: 'Microsoft YaHei,SimSun,Arial,SimHei'; font-size: 100%; - background-color: #FFF; + background-color: #fff; } body a{ transition:0.5s all; @@ -83,11 +84,11 @@ body a{ .top-nav:after { clear: both; } -nav { +/* nav { position: relative; float: right; list-style:none; -} +} */ nav ul { padding: 0; float: right; @@ -988,7 +989,7 @@ span.default_line { /*-----start-contact----*/ .contact{ background:url(/images/contact-bg.jpg) no-repeat 0px 2px; - padding: 3em 0 4em; + padding: 3em 0 1em; background-size: 100% 100%; } .contact-head h3{ diff --git a/src/assets/css1/style.css b/src/assets/css1/style.css index 637b1f7..0c4a47f 100644 --- a/src/assets/css1/style.css +++ b/src/assets/css1/style.css @@ -63,15 +63,6 @@ body { font-family: -apple-system, Helvetica Neue, Arial, PingFang SC, lucida grande, lucida sans unicode, lucida, helvetica, Hiragino Sans GB, Microsoft YaHei, WenQuanYi Micro Hei, sans-serif; } -body p { - font-size: 18px; - line-height: 1.6; - font-weight: 500; - color: #737b80; - font-family: var(--primary-font); - margin: 0; -} - p, ul, ol { @@ -1883,98 +1874,13 @@ section { } /*Take Website Url Section Strat Here*/ -/*Our Latest Media Section Start Here*/ -.post-inner { - -webkit-box-shadow: 0px 0px 8px 2px rgba(0, 0, 0, 0.09); - -moz-box-shadow: 0px 0px 8px 2px rgba(0, 0, 0, 0.09); - box-shadow: 0px 0px 8px 2px rgba(0, 0, 0, 0.09); - border-radius: 30px; - -webkit-border-radius: 30px; - -moz-border-radius: 30px; - background: #fff; - margin-top: 30px; - overflow: hidden; -} -.post-inner .entry-media { - position: relative; -} -.post-inner .entry-media .post-cat { - position: absolute; - z-index: 1; - top: 30px; - left: 30px; -} -.post-inner .post-cat a { - border-radius: 5px; - -webkit-border-radius: 5px; - -moz-border-radius: 5px; - text-transform: uppercase; - font-size: 12px; - font-weight: 600; - letter-spacing: 1px; - line-height: 1; - display: inline-block; - color: #fff; - background: linear-gradient(145deg,#0160e7 0%,#a644b5 100%); - padding: 8px 10px; - margin-right: 6px; -} -.post-inner .post-cat a:hover { - background: #fff; - color: #fe4c1c; - box-shadow: 8px 8px 30px 0px rgba(42, 67, 113, 0.15); - -webkit-box-shadow: 8px 8px 30px 0px rgba(42, 67, 113, 0.15); - -moz-box-shadow: 8px 8px 30px 0px rgba(42, 67, 113, 0.15); -} .entry-media a { display: block; } .inner-post { - padding: 30px; -} -.post-inner .entry-meta { - text-transform: capitalize; - font-weight: 500; - font-size: 14px; - margin-bottom: 15px; -} -.post-inner .entry-meta > span { - margin-right: 10px; - display: inline-block; -} -.post-inner .entry-meta > span i { - margin-right: 4px; - -webkit-transition: all 0.3s linear; - -moz-transition: all 0.3s linear; - -o-transition: all 0.3s linear; - -ms-transition: all 0.3s linear; - transition: all 0.3s linear; -} -.post-inner .entry-meta > span a { - font-size: 15px; - font-weight: 600; - color: #a5b7d2; -} -.post-inner .entry-meta > span a:hover { - color: #2b3a66; -} -.post-inner .entry-meta > span a:hover i { - color: #fe4c1c; -} -.entry-title { - font-size: 24px; - font-weight: 700; - margin-bottom: 15px; - display: block; - /* -webkit-line-clamp: 2; */ - -webkit-box-orient: vertical; - -webkit-line-clamp: 2; - overflow: hidden; - /* text-overflow: ellipsis; */ - display: -webkit-box; - -webkit-box-orient: vertical; - -webkit-line-clamp: 2; + padding: 1rem; } + .entry-title:hover { color: #0160e7; } @@ -2161,130 +2067,6 @@ section { } /*Work Section STARTS Here*/ -/*Latest Case Studies Section Start Here*/ -.product-box { - position: relative; - display: block; - overflow: hidden; -} -.product-box .portfolio-info { - width: 270px; - position: absolute; - bottom: 20px; - right: -270px; - z-index: 4; - opacity: 0; - transition: all 0.35s ease; - -webkit-transition: all 0.35s ease; - -moz-transition: all 0.35s ease; - -o-transition: all 0.35s ease; - -ms-transition: all 0.35s ease; -} -.product-box .portfolio-info .portfolio-info-inner { - text-align: left; - padding: 30px 30px 10px 30px; - box-sizing: border-box; - background-color: #0039e4; - background-image: -moz-linear-gradient(145deg,#0160e7 0%,#a644b5 100%); - background-image: -webkit-linear-gradient(145deg,#0160e7 0%,#a644b5 100%); - background-image: linear-gradient(145deg,#0160e7 0%,#a644b5 100%); - border-top-left-radius: 15px; - border-top-right-radius: 0px; - border-bottom-right-radius: 0px; - border-bottom-left-radius: 15px; - -webkit-border-top-left-radius: 15px; - -webkit-border-top-right-radius: 0px; - -webkit-border-bottom-right-radius: 0px; - -webkit-border-bottom-left-radius: 15px; - -moz-border-radius-topleft: 15px; - -moz-border-radius-topright: 0px; - -moz-border-radius-bottomright: 0px; - -moz-border-radius-bottomleft: 15px; - box-shadow: 12px 12px 30px 0px rgba(0, 57, 228, 0.3); - -webkit-box-shadow: 12px 12px 30px 0px rgba(0, 57, 228, 0.3); - -moz-box-shadow: 12px 12px 30px 0px rgba(0, 57, 228, 0.3); -} -.product-box .portfolio-info .portfolio-info-inner h5 a:hover, .product-box .portfolio-info .portfolio-info-inner .portfolio-cates a:hover { - opacity: 0.8; -} -.product-box .portfolio-info h5 { - color: #fff; - font-size: 20px; - font-weight: 500; - margin-bottom: 10px; - line-height: 1; -} -.product-box .portfolio-info h5 a { - color: #fff; -} -.product-box .portfolio-info .portfolio-cates { - color: #fe4c1c; - font-weight: 700; - font-size: 13px; - text-transform: uppercase; - letter-spacing: 0.5px; - margin-bottom: 20px; -} -.product-box .portfolio-info .portfolio-cates a { - color: #fe4c1c; -} -.product-box .portfolio-info .portfolio-cates span { - display: inline-block; - margin-left: 2px; - margin-right: 2px; -} -.product-box .portfolio-info .portfolio-cates span:last-child { - display: none; -} -.product-box:hover .portfolio-info { - right: 0px !important; - opacity: 1; -} -.product-box .product-thumbnail { - overflow: hidden; - border-radius: 30px; - -webkit-border-radius: 30px; - -moz-border-radius: 30px; -} -.product-box img { - width: 100%; - height: auto; - display: block; - -webkit-transition: all 0.3s linear; - -moz-transition: all 0.3s linear; - -o-transition: all 0.3s linear; - -ms-transition: all 0.3s linear; - transition: all 0.3s linear; -} -.product-box:hover img { - -webkit-transform: scale(1.05); - -moz-transform: scale(1.05); - -ms-transform: scale(1.05); - -o-transform: scale(1.05); - transform: scale(1.05); -} -#product .owl-nav { - display: flex; - align-items: center; - justify-content: center; - margin-top: 30px; -} -#product .owl-nav button { - width: 50px; - height: 50px; - font-size: 26px; - display: flex; - align-items: center; - justify-content: center; - color: #2b3a66; - border-radius: 25px; - background-color: #f2f8ff; - margin: 0 5px; -} -#product .owl-nav button:hover { - background-color: #0160e7; - color: #fff; -} /*Latest Case Studies Section End Here*/ /* Home 3 Client Counter Section Start Here*/ .home_3_counter { @@ -2959,7 +2741,7 @@ p.columns_text { } .blog-page .post-inner { margin-top: 0; - margin-bottom: 30px; + margin-bottom: 1rem; } .author-widget_wrapper { padding: 30px 26px; @@ -3769,30 +3551,4 @@ opacity: 0.9 !important color: #000 !important; } -.inner-post p{ -color: #2b3a66; -} - -.inner-post p a{ -color: #0160e7; -} - -.inner-post p a:hover{ -color: #0160e7; -text-decoration: underline; -} - -.inner-post h2{ -padding-top: 20px; -} - -.inner-post img{ - text-align: center !important; - margin: 30px auto; - display: block; - max-width: 100%; - height: auto !important; - border-radius: 10px; -} - diff --git a/src/components/Breadcrumb.astro b/src/components/Breadcrumb.astro new file mode 100644 index 0000000..acd2728 --- /dev/null +++ b/src/components/Breadcrumb.astro @@ -0,0 +1,29 @@ +--- +const {data} = Astro.props; +--- + + + \ No newline at end of file diff --git a/src/components/Pagination.astro b/src/components/Pagination.astro new file mode 100644 index 0000000..ea043de --- /dev/null +++ b/src/components/Pagination.astro @@ -0,0 +1,117 @@ +--- +// 通用分页组件 +export interface Props { + currentPage: number; + totalPages: number; + baseUrl?: string; // 基础链接,拼接?page=xxx + pageParam?: string; // 分页参数名,默认'page' +} +const { currentPage = 1, totalPages = 1, baseUrl = '', pageParam = 'page' } = Astro.props; + +function getPageUrl(page: number) { +// if (!baseUrl) return `?${pageParam}=${page}`; + // 若baseUrl已带?,则拼接&,否则? + return baseUrl + `${page}`; +} + +const showPages = []; +if (totalPages <= 7) { + for (let i = 1; i <= totalPages; i++) showPages.push(i); +} else { + if (currentPage <= 4) { + showPages.push(1, 2, 3, 4, 5, '...', totalPages); + } else if (currentPage >= totalPages - 3) { + showPages.push(1, '...', totalPages - 4, totalPages - 3, totalPages - 2, totalPages - 1, totalPages); + } else { + showPages.push(1, '...', currentPage - 1, currentPage, currentPage + 1, '...', totalPages); + } +} + +--- + + + \ No newline at end of file diff --git a/src/layouts/Layout.astro b/src/layouts/Layout.astro index cecac2d..b40dd56 100644 --- a/src/layouts/Layout.astro +++ b/src/layouts/Layout.astro @@ -31,7 +31,7 @@ const config = getConfig(Astro)
@@ -107,7 +114,7 @@ const config = getConfig(Astro) $().UItoTop({ easingType: 'easeOutQuart' }); }); - +
@@ -149,26 +156,31 @@ const config = getConfig(Astro) width: 100%; height: 100%; } + + .contact-grids { + a { + color:white; + } + + ul { + display: flex; + list-style-type: none; + padding: 0; + } + + ul>li>a { + color:white; + padding:0.5rem; + } + } + \ No newline at end of file diff --git a/src/pages/news/[...slug].astro b/src/pages/news/[...slug].astro index 92b973a..2ec79d6 100644 --- a/src/pages/news/[...slug].astro +++ b/src/pages/news/[...slug].astro @@ -2,6 +2,7 @@ import Layout from "../../layouts/Layout.astro"; import { getConfig } from '../../../utils/config' import { newsDetail } from "../../../utils/rpc"; +import Breadcrumb from "../../components/Breadcrumb.astro"; const { slug } = Astro.params; const config = getConfig(Astro) const requestUrl = Astro.request.url; @@ -30,6 +31,7 @@ if (!data || code !== 0) {
+

{data.title}

@@ -85,7 +87,10 @@ if (!data || code !== 0) { height: auto; } - article h1, .h1, h2, .h2, h3, .h3, h4, p { + + article { + + h1, .h1, h2, .h2, h3, .h3, h4, p { font: 14px Helvetica Neue, Helvetica, PingFang SC, Tahoma, Arial, sans-serif; /* text-indent: unset !important; */ margin: 15px; @@ -93,8 +98,6 @@ if (!data || code !== 0) { /* margin-bottom: unset; */ } - article { - h1 { display: block; font-size: 2em; @@ -167,6 +170,7 @@ if (!data || code !== 0) { display: grid; flex-direction: row; grid-template-columns: 4fr 1.5fr; + gap: 1rem; } @media (max-width: 1024px) { @@ -179,9 +183,10 @@ if (!data || code !== 0) { .news-container { display: flex; flex-direction: column; + background: #fff; + border: 1px solid #eee; } - .top-icon { margin-bottom: 1rem; margin-top: 1rem; @@ -264,8 +269,6 @@ if (!data || code !== 0) { max-width: 1200px; /* margin: -2rem auto 0; */ padding: 0 1.5rem 3rem; - display: grid; - grid-template-columns: 3fr 1fr; /* gap: 2.5rem; */ position: relative; @@ -323,6 +326,7 @@ if (!data || code !== 0) { /* position: sticky; */ top: 2rem; height: fit-content; + background-color: #ffffff; } .related-news ul { diff --git a/src/pages/news/page/[...page].astro b/src/pages/news/page/[...page].astro new file mode 100644 index 0000000..6584c72 --- /dev/null +++ b/src/pages/news/page/[...page].astro @@ -0,0 +1,5 @@ +--- +import News from '../../news.astro' +const {page = 1} = Astro.params; +--- + \ No newline at end of file diff --git a/utils/rpc.ts b/utils/rpc.ts index 0f690bb..5d8aa5e 100644 --- a/utils/rpc.ts +++ b/utils/rpc.ts @@ -31,11 +31,12 @@ export interface InewsIndex { created_at: string updated_at: string } -export async function newsIndex(websiteId:number = 0):Promise>{ - console.log(websiteId) +export async function newsIndex(websiteId:number = 0, limit:number = 10, page:number = 1):Promise>{ const client = getRpcClient() const result = await client.call('news/index', { - id:websiteId + id:websiteId, + limit: limit, + page: page }) return result