This is an automated email from the ASF dual-hosted git repository. yumeng pushed a commit to branch revert-199-overhaul/new-vi in repository https://gitbox.apache.org/repos/asf/incubator-devlake-website.git
commit 3057f612b6f8cdba9bec66f603297fa4127dceaf Author: Yumeng Wang <[email protected]> AuthorDate: Wed Sep 14 18:39:24 2022 +0800 Revert "fix: mobile adapt header" This reverts commit 249986fc7a371422c2187729926fa5979d727b8f. --- src/components/Sections/Components.tsx | 4 +-- src/components/Sections/HomepageHeader.tsx | 57 ++++++++++-------------------- src/components/Sections/JoinCommunity.tsx | 8 ++--- src/components/Sections/UseCases.tsx | 1 - src/components/Sections/WhyDevlake.tsx | 8 ++--- 5 files changed, 26 insertions(+), 52 deletions(-) diff --git a/src/components/Sections/Components.tsx b/src/components/Sections/Components.tsx index 3f3f23aa0..ab2689d03 100644 --- a/src/components/Sections/Components.tsx +++ b/src/components/Sections/Components.tsx @@ -29,7 +29,6 @@ export const TextSection = ({ children }: { children: React.ReactNode }) => <div className=" text-start w-[448px] - mobile:w-auto "> {children} </div> @@ -44,7 +43,6 @@ export const SvgImg = ({ svg: Svg }: { svg: React.ComponentType<React.SVGProps<S </div> export const SectionImg = ({ src }: { src: string }) => <img src={src} alt="" className=" w-[384px] h-[288px] - mobile:w-[160px] mobile:h-[124px] " /> export const InlineLink = ({ link, children }: { link: string, children: React.ReactNode }) => @@ -53,7 +51,7 @@ export const InlineLink = ({ link, children }: { link: string, children: React.R </a> export const BreakLine = () => <div className=" - h-[2px] bg-neutral-100 mx-[140px] mobile:hidden + h-[2px] bg-neutral-100 mx-[140px] " /> export const Sup = ({ children, title }: { children: React.ReactNode, title: string }) => diff --git a/src/components/Sections/HomepageHeader.tsx b/src/components/Sections/HomepageHeader.tsx index a24fc2c5f..90f78767e 100644 --- a/src/components/Sections/HomepageHeader.tsx +++ b/src/components/Sections/HomepageHeader.tsx @@ -9,66 +9,47 @@ export function HomepageHeader() { <header className="relative pt-[64px] pb-[90px] px-[80px] - mobile:pt-5 mobile:px-[32px] mobile:pb-[0px] - flex mobile:flex-col - justify-between items-center - mobile:bg-primary-100" + flex + justify-between items-center" > <HeaderBgSvg className=' absolute top-[0px] left-[0px] mobile:hidden' /> - <div className=" z-10 + <div + className=" z-10 flex flex-col flex-nowrap justify-start w-[590px] - mobile:flex-wrap mobile:w-auto - mobile:text-center mobile:justify-center - " > - <div className="hidden mobile:block - text-primary text-center - font-bold font-inter - text-heading2 - mb-[16px]"> - Apache DevLake (Incubating) - </div> + " + > <div className="text-primary font-bold font-inter text-heading0 - mobile:text-label16 mobile:leading-[20px] - mobile:font-normal mobile:text-center - mb-[32px] mobile:mb-3" + mb-[32px]" > - Debug Your Software{' '} - <br className="mobile:hidden" /> + Debug Your Software + <br /> Engineering Process </div> - <Link - className="hidden primary-button mobile:flex w-[160px] h-5 p-[0px] - whitespace-nowrap mx-auto rounded-[5px] mb-4" - to="https://devlake.apache.org/docs/GettingStarted"; + <div + className="text-primary-800 + text-label24 font-inter font-normal + mb-[48px] + " > - Getting Started - </Link> - <HeaderSvg className="hidden mobile:block - w-[240px] h-[240px] mx-auto mb-5" /> - <div className="text-primary-800 - text-label24 font-inter font-normal mb-[48px] - mobile:text-heading3 mobile:font-semibold - mobile:text-primary-500 - "> - <span className="hidden mobile:inline">I</span> - <span className="mobile:hidden">Apache DevLake (Incubating) i</span>ngests, analyzes, and visualizes the fragmented data from DevOps tools to distill insights for engineering excellence. + Apache DevLake (Incubating) ingests, analyzes, and visualizes the fragmented data from DevOps tools to distill insights for engineering excellence. </div> <Link - className="primary-button mobile:hidden" + className="primary-button" to="https://devlake.apache.org/docs/GettingStarted"; > Getting Started </Link> </div> <HeaderSvg className=" - w-auto h-auto z-10 mobile:hidden - "/> + w-auto h-auto z-10 + " + /> </header> ); } \ No newline at end of file diff --git a/src/components/Sections/JoinCommunity.tsx b/src/components/Sections/JoinCommunity.tsx index b95807887..40b91f004 100644 --- a/src/components/Sections/JoinCommunity.tsx +++ b/src/components/Sections/JoinCommunity.tsx @@ -5,11 +5,9 @@ import Join from "@site/static/img/Homepage/Join.png"; import { InlineLink } from "./Components"; export function JoinCommunity() { - return (<div className="flex justify-between mobile:flex-col-reverse - my-[72px] mx-[140px] rounded-[20px] bg-primary-200 px-6 py-[36px] font-inter - mobile:m-[0px] mobile:rounded-none mobile:p-[0px]"> - <div className="w-[600px] pr-3 - mobile:w-auto"> + return (<div className="flex justify-between + my-[72px] mx-[140px] rounded-[20px] bg-primary-200 px-6 py-[36px] font-inter"> + <div className="w-[600px] pr-3"> <div className="text-heading1 mb-3 text-primary-800 font-semibold">Join the Community</div> <div className="text-label18 mb-4 text-neutral-500">Join our community to stay up to date on the latest news, ask and answer questions, make contributions, and connect with fellow community members!</div> <div className="text-label16 space-y-[8px] flex flex-col"> diff --git a/src/components/Sections/UseCases.tsx b/src/components/Sections/UseCases.tsx index 01f9f0b22..030d275ff 100644 --- a/src/components/Sections/UseCases.tsx +++ b/src/components/Sections/UseCases.tsx @@ -14,7 +14,6 @@ function UCCard({ lead, title, desc, children }: { }) { return (<div className='use-case-card relative shadow-card overflow-hidden w-[460px] h-[468px] rounded-[16px] - mobile:w-auto '> <div className="flex items-center h-[228px] justify-center"> {children} diff --git a/src/components/Sections/WhyDevlake.tsx b/src/components/Sections/WhyDevlake.tsx index 9ff3013b9..ff71a1814 100644 --- a/src/components/Sections/WhyDevlake.tsx +++ b/src/components/Sections/WhyDevlake.tsx @@ -16,8 +16,7 @@ import SupA from "@site/static/img/Homepage/sup-A-feishu.png"; function Feature({ children }: { children: React.ReactNode }) { return ( - <div className="flex w-full justify-between items-center - mobile:flex-col"> + <div className="flex w-full justify-between items-center"> {children} </div> ); @@ -26,7 +25,7 @@ function Feature({ children }: { children: React.ReactNode }) { function Supports() { return ( <div className=" flex flex-col items-center - mt-[48px] mb-[72px] mobile:hidden + mt-[48px] mb-[72px] "> <C.H3Title>Supported Data Sources</C.H3Title> <div className="grid grid-cols-5 gap-x-[24px] gap-y-[16px]"> @@ -52,8 +51,7 @@ function Supports() { export function WhyDevlake() { return (<section className="flex flex-col flex-nowrap py-5 items-stretch"> <span - className="section-title text-center - mobile:text-heading2 mobile:leading-[32px]" + className="section-title text-center" > Why Apache DevLake (Incubating) </span>
