You are viewing a plain text version of this content. The canonical link for it is here.
Posted to commits@devlake.apache.org by yu...@apache.org on 2022/09/28 15:43:11 UTC

[incubator-devlake-website] branch main updated: fixed Header and Use-cases section

This is an automated email from the ASF dual-hosted git repository.

yumeng pushed a commit to branch main
in repository https://gitbox.apache.org/repos/asf/incubator-devlake-website.git


The following commit(s) were added to refs/heads/main by this push:
     new 968d5fc44 fixed Header and Use-cases section
968d5fc44 is described below

commit 968d5fc449be18d20703712653f812834aeba87f
Author: Joshua Poddoku <jo...@Joshuas-MacBook-Pro.local>
AuthorDate: Wed Sep 28 21:06:09 2022 +0530

    fixed Header and Use-cases section
---
 src/components/Sections/Components.tsx     |  3 ++-
 src/components/Sections/HomepageHeader.tsx |  4 ++--
 src/components/Sections/JoinCommunity.tsx  |  2 +-
 src/components/Sections/UseCases.tsx       | 19 +++++++++++++------
 4 files changed, 18 insertions(+), 10 deletions(-)

diff --git a/src/components/Sections/Components.tsx b/src/components/Sections/Components.tsx
index 2bcad7516..10c8076a5 100644
--- a/src/components/Sections/Components.tsx
+++ b/src/components/Sections/Components.tsx
@@ -23,8 +23,9 @@ export const TextDescription = ({ children }: { children: React.ReactNode }) =>
   </div>
 
 export const TextLink = ({ link, children }: { link: string, children: React.ReactNode }) =>
-  <a className="text-label16 text-secondary-500 flex items-center mt-[16px]
+  <a className="text-label16 text-secondary-500 flex items-center mt-[16px] mb-[8px]
     sm:justify-center hover:text-secondary-500"
+    target="_blank"
     href={link}>{children}
     <ArrowRight width={20} height={20} />
   </a>
diff --git a/src/components/Sections/HomepageHeader.tsx b/src/components/Sections/HomepageHeader.tsx
index 670838be4..4c0ce5d19 100644
--- a/src/components/Sections/HomepageHeader.tsx
+++ b/src/components/Sections/HomepageHeader.tsx
@@ -26,7 +26,7 @@ export function HomepageHeader() {
       >
         <div className=" z-10
           flex flex-col flex-nowrap
-          justify-start w-[590px]
+          justify-start w-[670px]
           sm:flex-wrap sm:w-auto
           sm:text-center mobile:justify-center
         " >
@@ -38,7 +38,7 @@ export function HomepageHeader() {
             sm:font-semibold sm:text-center
             mb-[32px] sm:mb-3"
           >
-            Debug Your Engineering Process{' '}
+            Debug Engineering Process{' '}
             <br className="sm:hidden mobile:block" />
             Demystify Dev Data
           </div>
diff --git a/src/components/Sections/JoinCommunity.tsx b/src/components/Sections/JoinCommunity.tsx
index 49baaddad..2245e1b62 100644
--- a/src/components/Sections/JoinCommunity.tsx
+++ b/src/components/Sections/JoinCommunity.tsx
@@ -7,7 +7,7 @@ import { InlineLink } from "./Components";
 export function JoinCommunity() {
   return (<div className="flex justify-between sm:flex-col-reverse
     my-[72px] rounded-[20px] bg-primary-200 px-6 py-[36px] font-inter
-    sm:w-[87vw] sm:my-6 sm:p-4 mobile:my-4 mobile:p-3">
+    sm:w-[87vw] sm:my-6 sm:p-4 mobile:my-10 mobile:p-3">
     <div className="w-[600px] pr-3 sm:pr-[0] sm:w-auto">
       <div className="text-heading1 mb-3 text-primary-800 font-semibold
         sm:text-heading2">Join the Community</div>
diff --git a/src/components/Sections/UseCases.tsx b/src/components/Sections/UseCases.tsx
index 9b1128f57..be687530a 100644
--- a/src/components/Sections/UseCases.tsx
+++ b/src/components/Sections/UseCases.tsx
@@ -6,28 +6,31 @@ import UC1 from '@site/static/img/Homepage/UC1.png';
 import UC2 from '@site/static/img/Homepage/UC2.png';
 import UC3 from '@site/static/img/Homepage/UC3.png';
 import UC4 from '@site/static/img/Homepage/UC4.png';
+import * as C from "./Components";
 
-function UCCard({ lead, title, desc, children }: {
+function UCCard({ lead, title, desc, demoURL, children }: {
   lead: string,
   title: string,
   desc: string,
+  demoURL: string,
   children: React.ReactNode,
 }) {
   return (<div className='use-case-card relative shadow-card overflow-hidden
-    xl:w-[30vw] h-[468px] max-w-[650px] rounded-[16px]
-    sm:w-[62vw] sm:h-[336px] sm:mx-auto
-    mobile:w-auto mobile:h-[392px]'>
-    <div className="flex items-center h-[228px] justify-center
+    xl:w-[30vw] h-[496px] max-w-[650px] rounded-[16px]
+    sm:w-[62vw] sm:h-[360px] sm:mx-auto
+    mobile:w-auto mobile:h-[420px]'>
+    <div className="flex items-center h-[232px] justify-center
       sm:h-[182px]">
       {children}
     </div>
-    <div className="bg-white px-4 py-2 h-[240px] sm:h-[152px] sm:p-2 mobile:h-[208px]">
+    <div className="bg-white px-4 py-2 h-[264px] sm:h-[152px] sm:p-2 mobile:h-[240px]">
       <div className="font-inter text-neutral-300 text-label18 font-medium mb-2 pr-1
         sm:text-label16 sm:font-normal sm:mb-[4px]">{lead}</div>
       <div className="font-inter text-primary-800 text-heading2 font-semibold mb-2 pr-1
         sm:text-[20px] sm:leading-[28px] sm:mb-[4px] sm:pr-[0]">{title}</div>
       <div className="font-inter text-neutral-500 text-label18 font-normal pr-1
         sm:text-label16 sm:pr-[0]">{desc}</div>
+       <C.TextLink link={demoURL}>See it Live</C.TextLink>
     </div>
   </div>)
 }
@@ -55,6 +58,7 @@ export function UseCases() {
             lead="Open Source Maintainers"
             title="Fuel Community Growth with Analysis"
             desc="Grow your community strategically with insights on how developers participate, contribute, and collaborate."
+            demoURL="https://devlake.apache.org/docs/LiveDemo/WeeklyCommunityRetro"
           >
             <UCIcon src={UC1} />
           </UCCard>
@@ -62,6 +66,7 @@ export function UseCases() {
             lead="Product Managers"
             title="Dev Workflow Improvement"
             desc="Align sprint planning with high-level goals and ensure the development progress is on track."
+            demoURL="https://devlake.apache.org/docs/LiveDemo/GitHubBasic"
           >
             <UCIcon src={UC2} />
           </UCCard>
@@ -69,6 +74,7 @@ export function UseCases() {
             lead="Engineering Leads"
             title="Implement DORA Fast"
             desc="Implement DORA metrics in minutes to enable and manage delivery processes your developers and users will love."
+            demoURL="https://devlake.apache.org/docs/LiveDemo/WeeklyBugRetro"
           >
             <UCIcon src={UC3} />
           </UCCard>
@@ -76,6 +82,7 @@ export function UseCases() {
             lead="Data Engineers"
             title="The Foundation to Build What You Want"
             desc="Integrate user-defined data sources with DevLake and easily implement customized metrics and dashboards without reinventing the wheel."
+            demoURL="https://devlake.apache.org/docs/DataModels/DevLakeDomainLayerSchema"
           >
             <UCIcon src={UC4} />
           </UCCard>