update

pingcap · Sep 5, 2024 · 5a54a29 · 5a54a29
1 parent cac4323
commit 5a54a29
Show file tree

Hide file tree

Showing 3 changed files with 28 additions and 8 deletions.
diff --git a/web/src/pages/explore/_components/ExploreGlobalAds.tsx b/web/src/pages/explore/_components/ExploreGlobalAds.tsx
@@ -23,7 +23,7 @@ export default function ExploreGlobalAds () {
 
   useEffect(() => {
     setAnchorEl(document.body);
-    if (hasClosed || /^\/(?:explore|blog)\/?$/.test(location.pathname) || location.pathname.startsWith('/blog/chat2query-tutorials')) {
+    if (hasClosed || /^\/(?:explore|blog|github-campaign)\/?$/.test(location.pathname) || location.pathname.startsWith('/blog/chat2query-tutorials')) {
       return;
     }
     safeSetTimeout(() => {

diff --git a/web/src/pages/github-campaign/_components/Heading.tsx b/web/src/pages/github-campaign/_components/Heading.tsx
@@ -48,31 +48,51 @@ export const HeadingRight = styled(Grid)`
 
 export const HeadingTitlePrefix = styled('span')`
   font-weight: 600;
-  line-height: 54px;
+  line-height: 1;
   color: white;
 `;
 
 export const HeadingTitle = styled('h1')`
-  font-size: 54px;
-  line-height: 65.35px;
+  font-size: 36px;
+  line-height: 1.25;
   font-weight: 900;
-  text-align: right;
+  text-align: center;
   color: #FFE895;
+  ${({ theme }) => ({
+    [theme.breakpoints.up('md')]: css`
+      font-size: 54px;
+      text-align: right;
+    `,
+  })}
 `;
 
 export const HeadingDescription = styled('p')`
   color: #7C7C7C;
   font-size: 16px;
   line-height: 24px;
-  text-align: right;
+  text-align: left;
   margin-bottom: 0;
+
+  ${({ theme }) => ({
+    [theme.breakpoints.up('md')]: css`
+      text-align: right;
+    `,
+  })}
 `;
 
 export const HeadingLogos = styled('div')`
   display: flex;
   align-items: center;
   gap: 12px;
   margin-bottom: 24px;
+  width: 100%;
+  justify-content: center;
+
+  ${({ theme }) => ({
+    [theme.breakpoints.up('md')]: css`
+      justify-content: start;
+    `,
+  })}
 `;
 
 export const HeadingPrompt = styled('div')`
@@ -81,7 +101,7 @@ export const HeadingPrompt = styled('div')`
   margin-top: 24px;
   ${({ theme }) => ({
     [theme.breakpoints.up('md')]: css`
-      margin-top: 0;
+      margin-top: 80px;
     `,
   })}
 `;

diff --git a/web/src/pages/github-campaign/_sections/1-how-it-works.tsx b/web/src/pages/github-campaign/_sections/1-how-it-works.tsx
@@ -7,7 +7,7 @@ export function HowItWorks () {
   const isLarge = useMediaQuery<Theme>(theme => theme.breakpoints.up('md'));
 
   return (
-    <ThisSection initial={isLarge ? 'initial' : 'hover'} animate={isLarge ? 'initial' : 'hover'} whileHover="hover">
+    <ThisSection initial={isLarge ? 'initial' : 'hover'} animate={isLarge ? 'initial' : 'hover'} whileInView="hover" viewport={{ amount: 'all', once: true }}>
       <ThisSectionContent>
         <SectionTitle>
           How it Works