diff --git a/pages/index.page.tsx b/pages/index.page.tsx index 95fb51ddd..165bf47e3 100644 --- a/pages/index.page.tsx +++ b/pages/index.page.tsx @@ -1,3 +1,4 @@ +/* eslint-disable linebreak-style */ import React, { useEffect, useState } from 'react'; import { getLayout } from '../components/SiteLayout'; import { DocSearch } from '@docsearch/react'; @@ -14,6 +15,8 @@ import { } from '../lib/calendarUtils'; import { Headline4 } from '~/components/Headlines'; import { GetStaticProps } from 'next'; +import { Button } from '~/components/ui/button'; +import { Card, CardContent, CardTitle } from '~/components/ui/card'; /* eslint-disable */ import ical from 'node-ical'; @@ -23,7 +26,8 @@ import { useTheme } from 'next-themes'; const algoliaAppId: string = process.env.NEXT_PUBLIC_ALGOLIA_APP_ID as string; const algoliaApiKey: string = process.env.NEXT_PUBLIC_ALGOLIA_API_KEY as string; -/* eslint-enable */ + + export const getStaticProps: GetStaticProps = async () => { const files = fs.readdirSync(PATH); const blogPosts = files @@ -171,18 +175,18 @@ const Home = (props: any) => {
- - Getting started - - Getting started + +
@@ -251,49 +255,57 @@ const Home = (props: any) => { {/* Feature 4 section*/}
-
-

- Streamline testing and validation -

-

- Simplify your validation logic to reduce your code’s complexity - and save time on development. Define constraints for your data - structures to catch and prevent errors, inconsistencies, and - invalid data. -

-
-
-

- Exchange data seamlessly -

-

- Establish a common language for data exchange, no matter the - scale or complexity of your project. Define precise validation - rules for your data structures to create shared understanding - and increase interoperability across different systems and - platforms. -

-
-
-

- Document your data -

-

- Create a clear, standardized representation of your data to - improve understanding and collaboration among developers, - stakeholders, and collaborators. -

-
-
-

- Vibrant tooling ecosystem -

-

- Adopt JSON Schema with an expansive range of community-driven - tools, libraries, and frameworks across many programming - languages. -

-
+ + + + Streamline testing and validation + +

+ Simplify your validation logic to reduce your code's + complexity and save time on development. Define constraints + for your data structures to catch and prevent errors, + inconsistencies, and invalid data. +

+ + + + + + Exchange data seamlessly + +

+ Establish a common language for data exchange, no matter the + scale or complexity of your project. Define precise validation + rules for your data structures to create shared understanding + and increase interoperability across different systems and + platforms. +

+ + + + + + Document your data + +

+ Create a clear, standardized representation of your data to + improve understanding and collaboration among developers, + stakeholders, and collaborators. +

+ + + + + + Vibrant tooling ecosystem + +

+ Adopt JSON Schema with an expansive range of community-driven + tools, libraries, and frameworks across many programming + languages. +

+ +
@@ -302,13 +314,14 @@ const Home = (props: any) => {

Start learning JSON Schema

- - Read the docs - + + Read the docs + + @@ -336,13 +349,14 @@ const Home = (props: any) => { Generators, Linters, and other JSON Schema Utilities made by this amazing Community.

- - Explore - + + Explore + + @@ -362,206 +376,257 @@ const Home = (props: any) => { build new connections.

-
-
- -

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

- {isClient && ( - <> - slack-json-schema - - )} + {/* Community Section - Improved Layout */} +
+
+ {/* Slack Card - First Column with Community Meetings Below */} +
+ + +
+ {isClient && ( + slack + )} + + Join the JSON Schema Slack Workspace! + +
+ + + {isClient && ( +
+ slack-json-schema +
+ )} - {/*

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} -

-
- -
+

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

+ + + + + -
- {(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 - -
-
-
- + {/* Community Meetings & Events - Now Below Slack */} + + + + Community Meetings & Events + + +

+ We hold monthly Office Hours and Open Community Working + Meetings. Office Hours are every first Tuesday of the month + and by appointment. Open Community Working Meetings are + every third Monday of the month at 12:00 PT. +

+ +
+ -
- - Read more{' '} - -
-
-
-
-

- JSON Schema Community Meetings & Events -

-

- We hold monthly Office Hours and Open Community Working - Meetings. Office Hours are every first Tuesday of the month - and by appointment. Open Community Working Meetings are every - third Monday of the month at 12:00 PT. -

- + + +
- - Office Hours - + {/* Blog Card */} + + + + + The JSON Schema Blog + + + {isClient && ( +
+ blog +
+ )} + +

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

+ +
+ +
+ + {/* Author Info */} +
+
+ {(blogPosts[0].frontmatter.authors || []).slice(0, 3).map( + (author: any, index: number) => ( +
+ ), + )} +
+
+

+ {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 +

+
+
+ + + + + + + {/* Upcoming Events - Calendar Section - Now Third Column */} +
+
+ + Upcoming Events +
-
-
-
- Upcoming events -
-
    - {props.datesInfo.map((event: any, index: any) => ( + +
    + {props.datesInfo.length > 0 ? ( +
      + {props.datesInfo.slice(0, 5).map((event: any, index: any) => (
    • -
      -

      +

      +
      {event.day} -

      -
      -

      {event.title}

      -

      - {event.time} ({event.timezone}) +

      +
      +

      + {event.title} +

      +

      + {event.time} ({event.timezone})

      • ))}
    -
    + ) : ( +
    +
    + + + +
    +

    + No upcoming events scheduled +

    +
    + )}
- - View Calendar - + + View Full Calendar + +
@@ -574,13 +639,17 @@ const Home = (props: any) => {

Start contributing to JSON Schema

- - Contribute - + + Contribute + +