From 5e1e902ea0468090ca0dc2e69ce761257d196e4e Mon Sep 17 00:00:00 2001 From: cbum-dev Date: Wed, 22 Jan 2025 23:04:58 +0530 Subject: [PATCH 1/6] Style changes in homepage --- pages/index.page.tsx | 500 ++++++++++++++----------------------------- 1 file changed, 156 insertions(+), 344 deletions(-) diff --git a/pages/index.page.tsx b/pages/index.page.tsx index 53b6d31c0..0f2f395c2 100644 --- a/pages/index.page.tsx +++ b/pages/index.page.tsx @@ -6,13 +6,10 @@ import matter from 'gray-matter'; const PATH = 'pages/blog/posts'; import readingTime from 'reading-time'; import Link from 'next/link'; -import TextTruncate from 'react-text-truncate'; -import Image from 'next/image'; import { fetchRemoteICalFile, printEventsForNextWeeks, } from '../lib/calendarUtils'; -import { Headline4 } from '~/components/Headlines'; import { GetStaticProps } from 'next'; /* eslint-disable */ @@ -107,16 +104,9 @@ const Home = (props: any) => { const [common_room_logo, setCommon_room_logo] = useState(''); const [slack_logo, setSlack_logo] = useState(''); const [ccopter_logo, setCCopter_logo] = useState(''); - const [isClient, setIsClient] = useState(false); const [octue_logo, setOctue_logo] = useState(''); const [apideck_logo, setApideck_logo] = useState(''); - const [rxdb_logo, setRxdb_logo] = useState(''); - const [wda_logo, setWDA_logo] = useState(''); - useEffect(() => { - // Ensure the component is only rendered client-side - setIsClient(true); - }, []); useEffect(() => { if (resolvedTheme === 'dark') { setAsyncapi_logo('/img/logos/dark-mode/asyncapi_white.svg'); @@ -133,8 +123,6 @@ const Home = (props: any) => { setCCopter_logo('/img/logos/sponsors/copycopter-white.png'); setOctue_logo('/img/logos/sponsors/octue-white.svg'); setApideck_logo('/img/logos/sponsors/apideck-white.svg'); - setRxdb_logo('/img/logos/sponsors/rxdb.svg'); - setWDA_logo('/img/logos/sponsors/wda-dark.svg'); } else { setAsyncapi_logo('/img/logos/sponsors/asyncapi-logo-dark.svg'); setAirbnb_logo('/img/logos/sponsors/airbnb-logo.png'); @@ -150,8 +138,6 @@ const Home = (props: any) => { setCCopter_logo('/img/logos/sponsors/copycopter.png'); setOctue_logo('/img/logos/sponsors/octue-black.svg'); setApideck_logo('/img/logos/sponsors/apideck.svg'); - setRxdb_logo('/img/logos/sponsors/rxdb.svg'); - setWDA_logo('/img/logos/sponsors/wda.svg'); } }, [resolvedTheme]); return ( @@ -189,38 +175,22 @@ const Home = (props: any) => {

Used by

- {isClient && ( - <> - zapier - microsoft - postman - github - - )} + + + +

@@ -309,17 +279,10 @@ const Home = (props: any) => { {/* SidebySide section*/}

- {isClient && ( - <> - community - - )} +

Explore the JSON Schema Ecosystem @@ -353,148 +316,123 @@ const Home = (props: any) => { build new connections.

-
-
+
+
-

- Join the JSON Schema Slack Workspace! - {isClient && ( - <> - slack - - )} -

- {isClient && ( - <> - slack-json-schema +

+ Join the JSON Schema Slack Workspace! + - - )} - - {/*

Event

*/} -

- Join our Slack to ask questions, get feedback on your - projects, and connect with +5000 practitioners and experts. -

+ + +
-
{/* BlogPost Data */} -
+
-

- The JSON Schema Blog -

- {isClient && ( - <> - blog - - )} -

- {' '} - {blogPosts[0].frontmatter.title} -

-
- +

+ Latest blog post +

+ -
+

+ {' '} + {blogPosts[0].frontmatter.title} +

+
+ {(blogPosts[0].frontmatter.authors || []).map( + (author: any, index: number) => { + return ( +
+ ); + }, + )} +
+

+ {blogPosts[0].frontmatter.authors.length > 2 ? ( + <> + {blogPosts[0].frontmatter.authors + .slice(0, 2) + .map((author: any, index: number) => ( + + {author.name} + {index === 0 && ' & '} + + ))} + {'...'} + + ) : ( + blogPosts[0].frontmatter.authors.map( + (author: any) => ( + {author.name} + ), + ) + )} +

-
- {(blogPosts[0].frontmatter.authors || []).map( - (author: any, index: number) => { - return ( -
- ); - }, - )} -
-

- {blogPosts[0].frontmatter.authors.length > 2 ? ( - <> - {blogPosts[0].frontmatter.authors - .slice(0, 2) - .map((author: any, index: number) => ( - - {author.name} - {index === 0 && ' & '} - - ))} - {'...'} - - ) : ( - blogPosts[0].frontmatter.authors.map((author: any) => ( - {author.name} - )) - )} -

- -
- - {blogPosts[0].frontmatter.date} · {timeToRead}{' '} - min read - +
+ + {blogPosts[0].frontmatter.date} · {timeToRead}{' '} + min read + +
+
+ Explore our blogs. Their, you'll get latest information about + our blogs, articles, announcements. Let's get upto date with the + recent activities in the organization. +
- Read more{' '} + Read all blogs{' '}
-
-

+
+

JSON Schema Community Meetings & Events

@@ -504,29 +442,49 @@ const Home = (props: any) => { third Monday of the month at 12:00 PT.

-
+
- Upcoming events +

+ Upcoming events +

From 48edc8fa2b0a80136180134482ea5cdbdd59297b Mon Sep 17 00:00:00 2001 From: cbum-dev Date: Sat, 25 Jan 2025 15:52:22 +0530 Subject: [PATCH 2/6] fixes dark theme issues --- pages/index.page.tsx | 18 +++++++++--------- 1 file changed, 9 insertions(+), 9 deletions(-) diff --git a/pages/index.page.tsx b/pages/index.page.tsx index 0f2f395c2..fc061f0db 100644 --- a/pages/index.page.tsx +++ b/pages/index.page.tsx @@ -317,9 +317,9 @@ const Home = (props: any) => {

-
+
-
+

Join the JSON Schema Slack Workspace! {

{/* BlogPost Data */} -
+
-
+

Latest blog post

@@ -431,7 +431,7 @@ const Home = (props: any) => {
-
+

JSON Schema Community Meetings & Events

@@ -454,7 +454,7 @@ const Home = (props: any) => {
-
+

Upcoming events @@ -464,7 +464,7 @@ const Home = (props: any) => { {props.datesInfo.map((event: any, index: any) => (
  • -
    +

    {new Date( @@ -479,12 +479,12 @@ const Home = (props: any) => { .toUpperCase()}

    -

    +

    {String(event.day).padStart(2, '0')}{' '}

    -
    +

    {event.title}

    From 5dbeb3a27de06ce6a8fbb6fe0409cadea203f1ce Mon Sep 17 00:00:00 2001 From: cbum-dev Date: Sat, 1 Feb 2025 00:00:44 +0530 Subject: [PATCH 3/6] resolved merge conflict --- pages/index.page.tsx | 6 ++++++ 1 file changed, 6 insertions(+) diff --git a/pages/index.page.tsx b/pages/index.page.tsx index 0a0db2719..3ce20f7b7 100644 --- a/pages/index.page.tsx +++ b/pages/index.page.tsx @@ -106,6 +106,8 @@ const Home = (props: any) => { const [ccopter_logo, setCCopter_logo] = useState(''); const [octue_logo, setOctue_logo] = useState(''); const [apideck_logo, setApideck_logo] = useState(''); + const [rxdb_logo, setRxdb_logo] = useState(''); + const [wda_logo, setWDA_logo] = useState(''); useEffect(() => { if (resolvedTheme === 'dark') { @@ -123,6 +125,8 @@ const Home = (props: any) => { setCCopter_logo('/img/logos/sponsors/copycopter-white.png'); setOctue_logo('/img/logos/sponsors/octue-white.svg'); setApideck_logo('/img/logos/sponsors/apideck-white.svg'); + setRxdb_logo('/img/logos/sponsors/rxdb.svg'); + setWDA_logo('/img/logos/sponsors/wda-dark.svg'); } else { setAsyncapi_logo('/img/logos/sponsors/asyncapi-logo-dark.svg'); setAirbnb_logo('/img/logos/sponsors/airbnb-logo.png'); @@ -138,6 +142,8 @@ const Home = (props: any) => { setCCopter_logo('/img/logos/sponsors/copycopter.png'); setOctue_logo('/img/logos/sponsors/octue-black.svg'); setApideck_logo('/img/logos/sponsors/apideck.svg'); + setRxdb_logo('/img/logos/sponsors/rxdb.svg'); + setWDA_logo('/img/logos/sponsors/wda.svg'); } }, [resolvedTheme]); return ( From 405d93959dca62b2e391d1d8d39850a0a917836d Mon Sep 17 00:00:00 2001 From: cbum-dev Date: Thu, 6 Mar 2025 21:57:21 +0530 Subject: [PATCH 4/6] Added Image --- components/AmbassadorsList.tsx | 5 +- pages/index.page.tsx | 315 ++++++++++++++++++++----- pages/overview/pro-help/index.page.tsx | 9 +- 3 files changed, 265 insertions(+), 64 deletions(-) diff --git a/components/AmbassadorsList.tsx b/components/AmbassadorsList.tsx index 0328f4772..628114b27 100644 --- a/components/AmbassadorsList.tsx +++ b/components/AmbassadorsList.tsx @@ -1,4 +1,5 @@ import React from 'react'; +import Image from 'next/image'; interface AmbassadorsLink { title: string; @@ -21,7 +22,9 @@ const AmbassadorList = ({ ambassadorList }: AmbassadorsListProps) => { className='flex flex-col items-center text-center p-5 bg-white dark:bg-gray-800 rounded-lg shadow-lg transform transition hover:scale-105' data-testid='Ambassadors-list' > - {link.title} { const [common_room_logo, setCommon_room_logo] = useState(''); const [slack_logo, setSlack_logo] = useState(''); const [ccopter_logo, setCCopter_logo] = useState(''); + const [isClient, setIsClient] = useState(false); const [octue_logo, setOctue_logo] = useState(''); const [apideck_logo, setApideck_logo] = useState(''); const [rxdb_logo, setRxdb_logo] = useState(''); const [wda_logo, setWDA_logo] = useState(''); + useEffect(() => { + // Ensure the component is only rendered client-side + setIsClient(true); + }, []); useEffect(() => { if (resolvedTheme === 'dark') { setAsyncapi_logo('/img/logos/dark-mode/asyncapi_white.svg'); @@ -181,22 +189,38 @@ const Home = (props: any) => {

    Used by

    - - - - + {isClient && ( + <> + zapier + microsoft + postman + github + + )}

    @@ -285,10 +309,17 @@ const Home = (props: any) => { {/* SidebySide section*/}

    - + {isClient && ( + <> + community + + )}

    Explore the JSON Schema Ecosystem @@ -328,17 +359,32 @@ const Home = (props: any) => {

    Join the JSON Schema Slack Workspace! - + {isClient && ( + <> + slack + + )}

    - + {isClient && ( + <> + slack-json-schema + + )}
    + {/*

    Event

    */}

    Join our Slack to ask questions, get feedback on your projects, @@ -350,10 +396,17 @@ const Home = (props: any) => { href='https://json-schema.org/slack' className='flex items-center ' > - + {isClient && ( + <> + slack + + )} Join Slack @@ -365,10 +418,17 @@ const Home = (props: any) => {

    Latest blog post

    - + {isClient && ( + <> + blog + + )}

    {' '} {blogPosts[0].frontmatter.title} @@ -426,10 +486,9 @@ const Home = (props: any) => { our blogs, articles, announcements. Let's get upto date with the recent activities in the organization.

    -
    Read all blogs{' '} @@ -464,7 +523,7 @@ const Home = (props: any) => {

    Upcoming events -

    +

    • {' '}
    {' '} diff --git a/pages/overview/pro-help/index.page.tsx b/pages/overview/pro-help/index.page.tsx index 5978c6a56..65f8913cf 100644 --- a/pages/overview/pro-help/index.page.tsx +++ b/pages/overview/pro-help/index.page.tsx @@ -7,6 +7,7 @@ import { SectionContext } from '~/context'; import { DocsHelp } from '~/components/DocsHelp'; import NextPrevButton from '~/components/NavigationButtons'; import StyledMarkdown from '~/components/StyledMarkdown'; +import Image from 'next/image'; interface ContractorLink { title: string; @@ -105,7 +106,9 @@ export default function ProHelp({ contractorData }: ProHelpPageProps) {
    {/* Image */}
    - {`${contractor.name}'s
    - {`${contractor.name}'s Date: Thu, 6 Mar 2025 22:03:41 +0530 Subject: [PATCH 5/6] fixes lint issues --- pages/index.page.tsx | 4 +--- 1 file changed, 1 insertion(+), 3 deletions(-) diff --git a/pages/index.page.tsx b/pages/index.page.tsx index 68ec45851..d42f347d8 100644 --- a/pages/index.page.tsx +++ b/pages/index.page.tsx @@ -6,13 +6,11 @@ import matter from 'gray-matter'; const PATH = 'pages/blog/posts'; import readingTime from 'reading-time'; import Link from 'next/link'; -import TextTruncate from 'react-text-truncate'; import Image from 'next/image'; import { fetchRemoteICalFile, printEventsForNextWeeks, } from '../lib/calendarUtils'; -import { Headline4 } from '~/components/Headlines'; import { GetStaticProps } from 'next'; /* eslint-disable */ @@ -488,7 +486,7 @@ const Home = (props: any) => {
    Read all blogs{' '} From 1cbeaedc20fbe9f3e31c64af031df79390600ad0 Mon Sep 17 00:00:00 2001 From: Priyanshu Kumar <110410015+cbum-dev@users.noreply.github.com> Date: Tue, 11 Mar 2025 10:44:09 -0400 Subject: [PATCH 6/6] changed padding. --- pages/index.page.tsx | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/pages/index.page.tsx b/pages/index.page.tsx index d42f347d8..a8a0eae0b 100644 --- a/pages/index.page.tsx +++ b/pages/index.page.tsx @@ -431,13 +431,13 @@ const Home = (props: any) => { {' '} {blogPosts[0].frontmatter.title} -
    +
    {(blogPosts[0].frontmatter.authors || []).map( (author: any, index: number) => { return (