Skip to content

Commit

Permalink
fix
Browse files Browse the repository at this point in the history
  • Loading branch information
Zichun627 committed Jul 8, 2024
1 parent 93fc872 commit 3b825b9
Show file tree
Hide file tree
Showing 16 changed files with 351 additions and 106 deletions.
24 changes: 1 addition & 23 deletions src/components/common/Header/navbar.ts
Original file line number Diff line number Diff line change
Expand Up @@ -45,7 +45,7 @@ export default [
route: "/blog/",
},
{
label: "插件市场",
label: "AI插件",
translations: {
en: "PLUGIN",
},
Expand All @@ -54,28 +54,6 @@ export default [
route: "/plugin/",
activePath: ["/plugin"],
},
{
label: "学习",
translations: {
en: "LEARN",
},
trigger: "hover",
slot: LearnMenu,
position: "absolute",
relativePosition: 'page',
activePath: ["/learn"],
},
{
label: "解决方案",
translations: {
en: "SOLUTIONS",
},
trigger: "hover",
slot: SolutionsMenu,
position: "absolute",
relativePosition: 'page',
activePath: ["solutions"],
},
{
label: "控制台样例",
translations: {
Expand Down
108 changes: 108 additions & 0 deletions src/components/home/AiStructure.astro
Original file line number Diff line number Diff line change
@@ -0,0 +1,108 @@
---
import { useTranslations } from "@i18n/util";
import { Headline } from "@serverless-cd/goat-ui";
const t = useTranslations(Astro);
---

<span class="ai-structure-wrapper">
<ai-structure
class="ai-structure block bg-neutral py-10 flex flex-col justify-center items-center"
>
<Headline
classes={{ subtitle: "text-sm" }}
tagline={t("home.website.edge.about")}
title={t("home.website.edge.title")}
titleTheme="error"
taglineTheme="info"
subtitle={t("home.website.edge.subtitle")}
subtitleTheme="success"
/>

<img
class="w-[90%] mt-10"
alt={t("home.website.edge.title")}
src="https://img.alicdn.com/imgextra/i2/O1CN01a3TQwu1hUI8C4HYDb_!!6000000004280-2-tps-2669-1462.png"
/>
</ai-structure>
</span>

<style is:global>
.ai-structure-wrapper {
.primary-fill {
fill: theme("colors.primary");
}
,
.top-title,
.bottom-card {
width: 85.125rem;
}
.bottom-card .item {
display: flex;
flex-direction: column;
justify-content: space-between;
flex: 0 0 25%;
}

/* 小于50rem 小于 800px */
@media (max-width: 50rem) {
.ai-structure {
padding: 1.5rem;
}
.top-title,
.bottom-card {
width: 100%;
}
.top-title {
margin-top: 2.5rem;
margin-bottom: 2.5rem;
}
.top-title .title {
font-size: 1.125rem; /* 18px */
line-height: 1.75rem; /* 28px */
}
.bottom-card .item {
flex: 0 0 100%;
border-left: none;
padding: 1.25rem 0;
border-bottom: 1px solid theme("colors.success");
}
.bottom-card .item .transfrom-header {
display: flex;
}
.transfrom-header div:last-child {
margin-left: 1rem;
}
}

/* 大于50rem 小于 72rem 800px < width < 1152 */
@media (min-width: 50rem) and (max-width: 86rem) {
.ai-structure {
padding: 2.5rem;
}
.top-title,
.bottom-card {
width: 100%;
}
.bottom-card .item {
flex: 0 0 50%;
border-left: none;
padding-bottom: 1.25rem;
}
.bottom-card .item:first-child {
border-right: 1px solid theme("colors.success");
border-bottom: 1px solid theme("colors.success");
}
.bottom-card .item:nth-child(2) {
border-bottom: 1px solid theme("colors.success");
}
.bottom-card .item:nth-child(3) {
border-right: 1px solid theme("colors.success");
padding-top: 1.25rem;
}
.bottom-card .item:last-child {
padding-top: 1.25rem;
}
}
}
</style>
19 changes: 11 additions & 8 deletions src/components/home/ChooseReason.astro
Original file line number Diff line number Diff line change
Expand Up @@ -2,7 +2,7 @@
import { useTranslations } from "@i18n/util";
import { Headline } from "@serverless-cd/goat-ui";
import { CHOOSE_REASON_LIST } from "@/constant";
import { Adaptive, Easy, TimeTested, Variety } from "../icon";
import { Adaptive, Easy, TimeTested, Variety, Standard } from "../icon";
const t = useTranslations(Astro);
---
Expand All @@ -12,10 +12,13 @@ const t = useTranslations(Astro);
class="choose-reason block bg-neutral py-10 flex flex-col justify-center items-center"
>
<Headline
classes={{subtitle: "text-sm"}}
tagline={t("home.website.edge.about")}
title={t("home.website.edge.title")}
titleTheme="neutral"
titleTheme="error"
taglineTheme="info"
subtitle={t("home.website.edge.subtitle")}
subtitleTheme="success"
/>

<div class="bottom-card flex flex-wrap">
Expand All @@ -25,17 +28,17 @@ const t = useTranslations(Astro);
return (
<div class="item px-5 border-success/[0.5] border-l">
<div class="transfrom-header block">
<div class="w-12 h-12 bg-muted rounded-md flex justify-center items-center mb-5">
<div class="w-12 h-12 bg-warning border-link rounded-md flex justify-center items-center mb-5">
{(() => {
switch (svgKey) {
case "adaptive":
return <Adaptive classes="fill-primary" />;
case "easy":
return <Easy classes="fill-primary" />;
return <Adaptive classes="fill-link" />;
case "standard":
return <Standard classes="fill-link" />;
case "timeTested":
return <TimeTested classes="fill-primary" />;
return <TimeTested classes="fill-link" />;
case "variety":
return <Variety classes="fill-primary" />;
return <Variety classes="fill-link" />;
default:
return null;
}
Expand Down
42 changes: 23 additions & 19 deletions src/components/home/HomeIntroduce.astro
Original file line number Diff line number Diff line change
Expand Up @@ -13,46 +13,50 @@ const ifzh = isChinese(Astro);
const { stargazers_count=0, forks_count=0 }:StarAndForkT = await sendFetch("https://api.github.com/repos/alibaba/spring-cloud-alibaba");
---

<div class="home-introduce-wrapper">
<div class="home-introduce-wrapper h-[65vh] relative">
<video autoplay muted loop class="video-background">
<source src="https://cloud.video.taobao.com/vod/play/V1dONkhFTFY4Rkk2dWh2TkRKRXg/TGpXT3hHcFlsdlM0OEJOSWJEcXlMRzZQZWw1SnpKVVVCTlh4OVFON0V5UUVMUDduY1RJak82VE1sdXdHTjNOaHc9PQ" type="video/mp4">
</video>
<home-introduce
class="introduce flex flex-col justify-center items-center bg-neutral/[0.8]"
class="introduce flex flex-col justify-center items-center bg-transparent h-full relative z-10"
>
<div
class="top-section flex flex-col justify-center items-center relative "
>

<div class="flex flex-col justify-center items-center h-[75%]">
<div
class="introduce_about mt-[155px] mb-[42px] text-[14px] leading-4 rounded-[18px] py-2 px-4"
>
<span> ABOUT US </span>
</div>
<div
class=`title leading-[96px] text-base-100 font-medium mb-[22px] ${ifzh ? 'text-[72px]' : 'text-[76px]'}`
class=`title leading-[96px] text-base-100 font-medium ${ifzh ? 'text-[72px]' : 'text-[76px]'}`
>
Higress: <span class="ai-description">AI原生</span>的API网关
</div>
<div class="text-[20px] leading-5 text-link mb-[119px]">
<div class="text-[20px] leading-5 text-link ">
An AI-Native API Gateway
</div>
</div>

<div class="flex h-[15%] ">
<StarAndForkV2 client:load SITE={SITE} stargazers_count={stargazers_count} forks_count={forks_count} />
</div>
<div class="w-[85.125rem] flex justify-end items-center mb-[60px]">
<div class="text-success text-xs">Release Note of V2.3.0 | V1.4.6</div>
<div class="w-[85.125rem] flex justify-end items-center h-[10%]">
<div class="text-success text-xs">Release Note of V1.4.6</div>
</div>
</home-introduce>

<!-- <ProductDisplayCard /> -->
</div>

<style is:global>
.home-introduce-wrapper {
.video-background{
position: absolute;
top:0;
left:0;
width: 100%;
height: 100%;
z-index: 1;
object-fit: cover;
}
a {
text-decoration: inherit;
color: theme("colors.warning");
}
.introduce {
z-index: -2;
}
/* min-height: calc(100vh - 4rem); */

.top-section {
width: 85.125rem;
Expand Down
108 changes: 108 additions & 0 deletions src/components/home/OpenEcoIntegration.astro
Original file line number Diff line number Diff line change
@@ -0,0 +1,108 @@
---
import { useTranslations } from "@i18n/util";
import { Headline } from "@serverless-cd/goat-ui";
const t = useTranslations(Astro);
---

<span class="open-ecosystem-wrapper">
<open-ecosystem
class="open-ecosystem block bg-neutral py-10 flex flex-col justify-center items-center"
>
<Headline
classes={{ subtitle: "text-sm" }}
tagline={t("home.website.edge.about")}
title={t("home.open.ecosystem.title")}
titleTheme="error"
taglineTheme="info"
subtitle={t("home.open.ecosystem.subtitle")}
subtitleTheme="success"
/>

<img
class="w-[90%] mt-10"
alt={t("home.open.ecosystem.title")}
src="https://img.alicdn.com/imgextra/i3/O1CN01fP1req1hWa70Cp4EG_!!6000000004285-2-tps-2728-1405.png"
/>
</open-ecosystem>
</span>

<style is:global>
.open-ecosystem-wrapper {
.primary-fill {
fill: theme("colors.primary");
}
,
.top-title,
.bottom-card {
width: 85.125rem;
}
.bottom-card .item {
display: flex;
flex-direction: column;
justify-content: space-between;
flex: 0 0 25%;
}

/* 小于50rem 小于 800px */
@media (max-width: 50rem) {
.open-ecosystem {
padding: 1.5rem;
}
.top-title,
.bottom-card {
width: 100%;
}
.top-title {
margin-top: 2.5rem;
margin-bottom: 2.5rem;
}
.top-title .title {
font-size: 1.125rem; /* 18px */
line-height: 1.75rem; /* 28px */
}
.bottom-card .item {
flex: 0 0 100%;
border-left: none;
padding: 1.25rem 0;
border-bottom: 1px solid theme("colors.success");
}
.bottom-card .item .transfrom-header {
display: flex;
}
.transfrom-header div:last-child {
margin-left: 1rem;
}
}

/* 大于50rem 小于 72rem 800px < width < 1152 */
@media (min-width: 50rem) and (max-width: 86rem) {
.open-ecosystem {
padding: 2.5rem;
}
.top-title,
.bottom-card {
width: 100%;
}
.bottom-card .item {
flex: 0 0 50%;
border-left: none;
padding-bottom: 1.25rem;
}
.bottom-card .item:first-child {
border-right: 1px solid theme("colors.success");
border-bottom: 1px solid theme("colors.success");
}
.bottom-card .item:nth-child(2) {
border-bottom: 1px solid theme("colors.success");
}
.bottom-card .item:nth-child(3) {
border-right: 1px solid theme("colors.success");
padding-top: 1.25rem;
}
.bottom-card .item:last-child {
padding-top: 1.25rem;
}
}
}
</style>
2 changes: 1 addition & 1 deletion src/components/home/StarAndForkV2/index.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -30,7 +30,7 @@ const StarAndForkV2 = (props: StarAndForkT) => {
},[]);

return (
<star-and-fork class="shortcut flex">
<star-and-fork class="shortcut flex justify-center">
<Button
size="large"
class="rounded-3xl text-neutral"
Expand Down
4 changes: 2 additions & 2 deletions src/components/home/UseCompanies.astro
Original file line number Diff line number Diff line change
Expand Up @@ -21,11 +21,11 @@ const companiesLogosTop = [
];
---

<span class="use-companies-wrapper">
<span class="use-companies-wrapper h-[30vh]">
<use-companies
class="use-companies flex flex-col items-center bg-neutral py-10"
>
<div class="top-title flex flex-col items-center mb-4 mt-16">
<div class="top-title flex flex-col items-center mb-4">
<span class="text-warning text-xs w-full max-w-[63.5rem]"
>{t("home.use.companies.about")}</span
>
Expand Down
Loading

0 comments on commit 3b825b9

Please sign in to comment.