Skip to content

Commit abc4dd0

Browse files
Yashwanth1906Yashwanth1906
authored
Merge branch 'json-schema-org:main' into Scroll-NavBar-Fix
2 parents 88b51fa + 1ac0817 commit abc4dd0

File tree

2 files changed

+77
-50
lines changed

2 files changed

+77
-50
lines changed

‎pages/blog/index.page.tsx

Lines changed: 13 additions & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -204,7 +204,9 @@ export default function StaticMarkdownPage({
204204
width={800}
205205
height={450}
206206
className='object-cover w-full h-full opacity-70 blur-[5px]'
207-
alt='hero image example'
207+
alt={recentBlog[0].frontmatter.title}
208+
priority
209+
quality={75}
208210
/>
209211
<div className='absolute text-white w-full h-full mt-custom ml-14'>
210212
{/* Display all categories (joined by comma) */}
@@ -298,7 +300,7 @@ export default function StaticMarkdownPage({
298300

299301
{/* Blog Posts Grid */}
300302
<div className='grid grid-cols-1 sm:grid-cols-2 lg:grid-cols-4 xl:grid-cols-5 gap-6 grid-flow-row mb-20 bg-white dark:bg-slate-800 mx-auto p-4'>
301-
{sortedFilteredPosts.map((blogPost: any) => {
303+
{sortedFilteredPosts.map((blogPost: any, idx: number) => {
302304
const { frontmatter, content } = blogPost;
303305
const date = new Date(frontmatter.date);
304306
const postTimeToRead = Math.ceil(readingTime(content).minutes);
@@ -310,12 +312,15 @@ export default function StaticMarkdownPage({
310312
href={`/blog/posts/${blogPost.slug}`}
311313
className='inline-flex flex-col flex-1 w-full'
312314
>
313-
<div className='h-max-[200px] w-full object-cover'>
314-
<div
315-
className='bg-slate-50 h-[160px] w-full self-stretch mr-3 bg-cover bg-center'
316-
style={{
317-
backgroundImage: `url(${frontmatter.cover})`,
318-
}}
315+
<div className='relative h-[160px] w-full'>
316+
<Image
317+
src={frontmatter.cover}
318+
alt={frontmatter.title}
319+
fill
320+
className='object-cover'
321+
loading={idx < 10 ? 'eager' : 'lazy'}
322+
priority={idx < 10}
323+
quality={75}
319324
/>
320325
</div>
321326
<div className='p-4 flex flex-col flex-1 justify-between'>

‎pages/docs/index.page.tsx

Lines changed: 64 additions & 42 deletions
Original file line numberDiff line numberDiff line change
@@ -6,13 +6,75 @@ import { SectionContext } from '~/context';
66
import Card from '~/components/Card';
77
import { DocsHelp } from '~/components/DocsHelp';
88

9+
const cardsData = [
10+
{
11+
icon: '/icons/eye.svg',
12+
title: 'Introduction',
13+
body: 'Discover JSON Schema: its purpose and role in data validation.',
14+
headerSize: 'medium',
15+
bodyTextSize: 'small',
16+
link: '/overview/what-is-jsonschema',
17+
},
18+
{
19+
icon: '/icons/compass.svg',
20+
title: 'Get started',
21+
body: 'New to JSON Schema? Learn the basics of schema design.',
22+
headerSize: 'medium',
23+
bodyTextSize: 'small',
24+
link: '/learn',
25+
},
26+
{
27+
icon: '/icons/grad-cap.svg',
28+
title: 'Guides',
29+
body: 'Master advanced skills such as validation with our hands-on guides.',
30+
headerSize: 'medium',
31+
bodyTextSize: 'small',
32+
link: '/learn/guides',
33+
},
34+
{
35+
icon: '/icons/book.svg',
36+
title: 'Reference',
37+
body: 'Dive deeper into JSON Schema keywords with our clear explanations and usage examples.',
38+
headerSize: 'medium',
39+
bodyTextSize: 'small',
40+
link: '/understanding-json-schema',
41+
},
42+
{
43+
icon: '/icons/clipboard.svg',
44+
title: 'Specification',
45+
body: 'Understand the evolution of JSON Schema through its different versions',
46+
headerSize: 'medium',
47+
bodyTextSize: 'small',
48+
link: '/specification',
49+
},
50+
];
51+
952
export default function Welcome() {
1053
const newTitle = 'Welcome';
1154
const fileRenderType = 'tsx';
55+
const renderCards = () => (
56+
<div className='grid grid-cols-1 md:grid-cols-2 gap-6 mt-8'>
57+
{cardsData.map((card) => (
58+
<Card
59+
key={card.title}
60+
icon={card.icon}
61+
title={card.title}
62+
body={card.body}
63+
headerSize='medium'
64+
bodyTextSize='small'
65+
link={card.link}
66+
/>
67+
))}
68+
</div>
69+
);
1270
return (
1371
<SectionContext.Provider value='docs'>
1472
<Head>
1573
<title>{newTitle}</title>
74+
<meta
75+
name='description'
76+
content='JSON Schema - a declarative language for validating JSON documents'
77+
/>
1678
</Head>
1779
<Headline1>{newTitle}</Headline1>
1880
<p>
@@ -23,50 +85,10 @@ export default function Welcome() {
2385
Our documentation will guide you through the basics and beyond of
2486
defining and validating JSON data.
2587
<br />
88+
<br />
2689
<span className='font-bold text-[1.3rem]'>Explore the docs</span>
2790
</p>
28-
<div className='w-full lg:w-full grid grid-cols-1 sm:grid-cols-2 gap-6 my-[10px] mx-auto mt-8'>
29-
<Card
30-
icon='/icons/eye.svg'
31-
title='Introduction'
32-
body='Discover JSON Schema: its purpose and role in data validation.'
33-
headerSize='medium'
34-
bodyTextSize='small'
35-
link='/overview/what-is-jsonschema'
36-
/>
37-
<Card
38-
icon='/icons/compass.svg'
39-
title='Get started'
40-
body='New to JSON Schema? Learn the basics of schema design.'
41-
headerSize='medium'
42-
bodyTextSize='small'
43-
link='/learn'
44-
/>
45-
<Card
46-
icon='/icons/grad-cap.svg'
47-
title='Guides'
48-
body='Master advanced skills such as validation with our hands-on guides.'
49-
headerSize='medium'
50-
bodyTextSize='small'
51-
link='/learn/guides'
52-
/>
53-
<Card
54-
icon='/icons/book.svg'
55-
title='Reference'
56-
body='Dive deeper into JSON Schema keywords with our clear explanations and usage examples.'
57-
headerSize='medium'
58-
bodyTextSize='small'
59-
link='/understanding-json-schema'
60-
/>
61-
<Card
62-
icon='/icons/clipboard.svg'
63-
title='Specification'
64-
body='Understand the evolution of JSON Schema through its different versions'
65-
headerSize='medium'
66-
bodyTextSize='small'
67-
link='/specification'
68-
/>
69-
</div>
91+
{renderCards()}
7092
<DocsHelp fileRenderType={fileRenderType} />
7193
</SectionContext.Provider>
7294
);

0 commit comments

Comments
 (0)