Skip to content

Commit 161414f

Browse files
mrepol742mrepol742
committed
feat: update font family to Lato and add structured data for organization and website
1 parent 04476b4 commit 161414f

File tree

3 files changed

+172
-138
lines changed

3 files changed

+172
-138
lines changed

‎src/app/globals.css‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -22,5 +22,5 @@
2222
body {
2323
background: var(--background);
2424
color: var(--foreground);
25-
font-family: Arial, Helvetica, sans-serif;
25+
font-family: var(--font-lato-sans), sans-serif;
2626
}

‎src/app/layout.tsx‎

Lines changed: 6 additions & 9 deletions
Original file line numberDiff line numberDiff line change
@@ -1,18 +1,15 @@
11
import type { Metadata } from "next";
2-
import { Geist, Geist_Mono } from "next/font/google";
2+
import { Lato } from "next/font/google";
33
import "./globals.css";
44
import Nav from "./components/Nav";
55
import Footer from "./components/Footer";
66
import Head from "next/head";
77
import NextTopLoader from "nextjs-toploader";
88

9-
const geistSans = Geist({
10-
variable: "--font-geist-sans",
11-
subsets: ["latin"],
12-
});
13-
14-
const geistMono = Geist_Mono({
15-
variable: "--font-geist-mono",
9+
const latoSans = Lato({
10+
variable: "--font-lato-sans",
11+
weight: ["400", "700"],
12+
display: "swap",
1613
subsets: ["latin"],
1714
});
1815

@@ -94,7 +91,7 @@ export default function RootLayout({
9491
<meta name="hostname" content="hallofcodes.github.io" />
9592
</Head>
9693
<body
97-
className={`${geistSans.variable} ${geistMono.variable} antialiased`}
94+
className={`${latoSans.variable} antialiased`}
9895
>
9996
<Nav />
10097
<NextTopLoader showSpinner={false} color="#FF6600" />

‎src/app/page.tsx‎

Lines changed: 165 additions & 128 deletions
Original file line numberDiff line numberDiff line change
@@ -38,143 +38,180 @@ const timeline = [
3838
];
3939

4040
export default function Home() {
41+
const organization = {
42+
"@context": "https://schema.org",
43+
"@type": "Organization",
44+
name: "Hall of Codes",
45+
url: "https://hallofcodes.github.io",
46+
logo: "https://hallofcodes.github.io/hoc-icon.png",
47+
sameAs: [
48+
"https://www.facebook.com/hallofcodes",
49+
"https://github.com/hallofcodes",
50+
],
51+
};
52+
53+
const webSite = {
54+
"@context": "https://schema.org",
55+
"@type": "WebSite",
56+
name: "Hall of Codes",
57+
url: "https://hallofcodes.github.io",
58+
description:
59+
"Hall of Codes is a community of developers who are passionate about coding and technology.",
60+
};
61+
4162
return (
42-
<main className="bg-white dark:bg-gray-900">
43-
<div className="mx-auto w-full max-w-screen-xl p-4 py-6 lg:py-8">
44-
<a
45-
href="https://github.com/hallofcodes"
46-
className="inline-flex justify-between items-center py-1 px-1 pe-4 mb-7 text-sm text-blue-700 bg-blue-100 rounded-full dark:bg-blue-900 dark:text-blue-300 hover:bg-blue-200 dark:hover:bg-blue-800"
47-
>
48-
<span className="text-xs bg-blue-600 rounded-full text-white px-4 py-1.5 me-3">
49-
Hello
50-
</span>
51-
<span className="text-sm font-medium">Follow us on GitHub</span>
52-
<svg
53-
className="w-2.5 h-2.5 ms-2 rtl:rotate-180"
54-
aria-hidden="true"
55-
xmlns="http://www.w3.org/2000/svg"
56-
fill="none"
57-
viewBox="0 0 6 10"
58-
>
59-
<path
60-
stroke="currentColor"
61-
strokeLinecap="round"
62-
strokeLinejoin="round"
63-
strokeWidth="2"
64-
d="m1 9 4-4-4-4"
65-
/>
66-
</svg>
67-
</a>
68-
<h1 className="mb-4 text-3xl font-extrabold text-gray-900 dark:text-white md:text-5xl lg:text-6xl">
69-
<span className="text-transparent bg-clip-text bg-gradient-to-r from-indigo-500 via-purple-500 to-pink-500">
70-
Mergin Programmers
71-
</span>
72-
&nbsp; Beyond Conflicts.
73-
</h1>
74-
<p className="my-4 text-lg text-gray-500">
75-
We revolutionizes development by fostering cohesion among teams,
76-
transcending conflicts to drive collective innovation. Harnessing the
77-
synergy of diverse talents, we pave the way for seamless
78-
collaboration, ensuring projects thrive in an environment of unity and
79-
progress.
80-
</p>
81-
<p className="mb-4 text-lg font-normal text-gray-500 dark:text-gray-400">
82-
Join us in revolutionizing the landscape of programming, where
83-
conflicts dissolve, and collaboration flourishes. Experience the
84-
synergy of innovation and unity with Hall of Codes.
85-
</p>
86-
<Link
87-
href="https://github.com/hallofcodes/join"
88-
className="inline-flex items-center text-lg text-blue-600 dark:text-blue-500 hover:underline"
89-
>
90-
Invite me
91-
<svg
92-
className="w-3.5 h-3.5 ms-2 rtl:rotate-180"
93-
aria-hidden="true"
94-
xmlns="http://www.w3.org/2000/svg"
95-
fill="none"
96-
viewBox="0 0 14 10"
97-
>
98-
<path
99-
stroke="currentColor"
100-
strokeLinecap="round"
101-
strokeLinejoin="round"
102-
strokeWidth="2"
103-
d="M1 5h12m0 0L9 1m4 4L9 9"
104-
/>
105-
</svg>
106-
</Link>
107-
</div>
63+
<>
64+
<script
65+
type="application/ld+json"
66+
dangerouslySetInnerHTML={{
67+
__html: JSON.stringify(organization),
68+
}}
69+
/>
70+
71+
<script
72+
type="application/ld+json"
73+
dangerouslySetInnerHTML={{
74+
__html: JSON.stringify(webSite),
75+
}}
76+
/>
10877

109-
<div className="mx-auto w-full max-w-screen-xl p-4 py-6 lg:py-8">
110-
<div className="mx-auto max-w-screen-xl my-auto text-center lg:py-16">
111-
<h1 className="mb-4 text-4xl font-extrabold tracking-tight leading-none text-gray-900 md:text-5xl lg:text-6xl dark:text-white">
112-
Why Hall of Codes?
78+
<main className="bg-white dark:bg-gray-900">
79+
<div className="mx-auto w-full max-w-screen-xl p-4 py-6 lg:py-8">
80+
<a
81+
href="https://github.com/hallofcodes"
82+
className="inline-flex justify-between items-center py-1 px-1 pe-4 mb-7 text-sm text-blue-700 bg-blue-100 rounded-full dark:bg-blue-900 dark:text-blue-300 hover:bg-blue-200 dark:hover:bg-blue-800"
83+
>
84+
<span className="text-xs bg-blue-600 rounded-full text-white px-4 py-1.5 me-3">
85+
Hello
86+
</span>
87+
<span className="text-sm font-medium">Follow us on GitHub</span>
88+
<svg
89+
className="w-2.5 h-2.5 ms-2 rtl:rotate-180"
90+
aria-hidden="true"
91+
xmlns="http://www.w3.org/2000/svg"
92+
fill="none"
93+
viewBox="0 0 6 10"
94+
>
95+
<path
96+
stroke="currentColor"
97+
strokeLinecap="round"
98+
strokeLinejoin="round"
99+
strokeWidth="2"
100+
d="m1 9 4-4-4-4"
101+
/>
102+
</svg>
103+
</a>
104+
<h1 className="mb-4 text-3xl font-extrabold text-gray-900 dark:text-white md:text-5xl lg:text-6xl">
105+
<span className="text-transparent bg-clip-text bg-gradient-to-r from-indigo-500 via-purple-500 to-pink-500">
106+
Mergin Programmers
107+
</span>
108+
&nbsp; Beyond Conflicts.
113109
</h1>
114-
<p className="mb-8 text-lg font-normal text-gray-500 lg:text-xl sm:px-16 lg:px-48 dark:text-gray-400">
115-
Be part of a vibrant community where innovation thrives and
116-
collaboration is key. With access to cutting-edge projects and a
117-
supportive network, you&apos;ll accelerate your growth and make a
118-
real impact in the world of technology.
110+
<p className="my-4 text-lg text-gray-500">
111+
We revolutionizes development by fostering cohesion among teams,
112+
transcending conflicts to drive collective innovation. Harnessing
113+
the synergy of diverse talents, we pave the way for seamless
114+
collaboration, ensuring projects thrive in an environment of unity
115+
and progress.
116+
</p>
117+
<p className="mb-4 text-lg font-normal text-gray-500 dark:text-gray-400">
118+
Join us in revolutionizing the landscape of programming, where
119+
conflicts dissolve, and collaboration flourishes. Experience the
120+
synergy of innovation and unity with Hall of Codes.
119121
</p>
120-
<div className="flex flex-col space-y-4 sm:flex-row sm:justify-center sm:space-y-0">
121-
<Link
122-
href="https://github.com/hallofcodes/join"
123-
className="inline-flex justify-center items-center py-3 px-5 text-base font-medium text-center text-white rounded-lg bg-blue-700 hover:bg-blue-800 focus:ring-4 focus:ring-blue-300 dark:focus:ring-blue-900"
122+
<Link
123+
href="https://github.com/hallofcodes/join"
124+
className="inline-flex items-center text-lg text-blue-600 dark:text-blue-500 hover:underline"
125+
>
126+
Invite me
127+
<svg
128+
className="w-3.5 h-3.5 ms-2 rtl:rotate-180"
129+
aria-hidden="true"
130+
xmlns="http://www.w3.org/2000/svg"
131+
fill="none"
132+
viewBox="0 0 14 10"
124133
>
125-
Get started
126-
<svg
127-
className="w-3.5 h-3.5 ms-2 rtl:rotate-180"
128-
aria-hidden="true"
129-
xmlns="http://www.w3.org/2000/svg"
130-
fill="none"
131-
viewBox="0 0 14 10"
134+
<path
135+
stroke="currentColor"
136+
strokeLinecap="round"
137+
strokeLinejoin="round"
138+
strokeWidth="2"
139+
d="M1 5h12m0 0L9 1m4 4L9 9"
140+
/>
141+
</svg>
142+
</Link>
143+
</div>
144+
145+
<div className="mx-auto w-full max-w-screen-xl p-4 py-6 lg:py-8">
146+
<div className="mx-auto max-w-screen-xl my-auto text-center lg:py-16">
147+
<h1 className="mb-4 text-4xl font-extrabold tracking-tight leading-none text-gray-900 md:text-5xl lg:text-6xl dark:text-white">
148+
Why Hall of Codes?
149+
</h1>
150+
<p className="mb-8 text-lg font-normal text-gray-500 lg:text-xl sm:px-16 lg:px-48 dark:text-gray-400">
151+
Be part of a vibrant community where innovation thrives and
152+
collaboration is key. With access to cutting-edge projects and a
153+
supportive network, you&apos;ll accelerate your growth and make a
154+
real impact in the world of technology.
155+
</p>
156+
<div className="flex flex-col space-y-4 sm:flex-row sm:justify-center sm:space-y-0">
157+
<Link
158+
href="https://github.com/hallofcodes/join"
159+
className="inline-flex justify-center items-center py-3 px-5 text-base font-medium text-center text-white rounded-lg bg-blue-700 hover:bg-blue-800 focus:ring-4 focus:ring-blue-300 dark:focus:ring-blue-900"
132160
>
133-
<path
134-
stroke="currentColor"
135-
strokeLinecap="round"
136-
strokeLinejoin="round"
137-
strokeWidth="2"
138-
d="M1 5h12m0 0L9 1m4 4L9 9"
139-
/>
140-
</svg>
141-
</Link>
161+
Get started
162+
<svg
163+
className="w-3.5 h-3.5 ms-2 rtl:rotate-180"
164+
aria-hidden="true"
165+
xmlns="http://www.w3.org/2000/svg"
166+
fill="none"
167+
viewBox="0 0 14 10"
168+
>
169+
<path
170+
stroke="currentColor"
171+
strokeLinecap="round"
172+
strokeLinejoin="round"
173+
strokeWidth="2"
174+
d="M1 5h12m0 0L9 1m4 4L9 9"
175+
/>
176+
</svg>
177+
</Link>
178+
</div>
142179
</div>
143-
</div>
144180

145-
<div className="mt-10">
146-
<h2 className="mb-4 text-4xl font-extrabold leading-none tracking-tight text-gray-900 md:text-3xl lg:text-4xl dark:text-white">
147-
Timeline
148-
</h2>
181+
<div className="mt-10">
182+
<h2 className="mb-4 text-4xl font-extrabold leading-none tracking-tight text-gray-900 md:text-3xl lg:text-4xl dark:text-white">
183+
Timeline
184+
</h2>
149185

150-
<ol className="relative border-s border-gray-200 dark:border-gray-700">
151-
{timeline.map((item, index) => (
152-
<li key={index} className="mb-10 ml-6">
153-
<span className="absolute flex items-center justify-center w-6 h-6 bg-blue-100 rounded-full -left-3 ring-8 ring-white dark:ring-gray-900 dark:bg-blue-900">
154-
<svg
155-
className="w-3 h-3 text-blue-800 dark:text-blue-300"
156-
aria-hidden="true"
157-
xmlns="http://www.w3.org/2000/svg"
158-
fill="currentColor"
159-
viewBox="0 0 20 20"
160-
>
161-
<path d="M10 2a8 8 0 100 16A8 8 0 0010 2zm1.707 11.293a1 1 0 01-1.414 0L9 12.414l-.293.293a1 1 0 01-1.414-1.414l2-2a1 1 0 011.414 0l2 2a1 1 0 010 1.414zM10 7a1.5 1.5 0 110-3 1.5 1.5 0 010 3z" />
162-
</svg>
163-
</span>
164-
<h3 className="text-lg font-semibold text-gray-900 dark:text-white">
165-
{item.heading}
166-
</h3>
167-
<time className="block mb-2 text-sm font-normal leading-none text-gray-400 dark:text-gray-500">
168-
{item.date}
169-
</time>
170-
<p className="mb-4 text-base font-normal text-gray-500 dark:text-gray-400">
171-
{item.description}
172-
</p>
173-
</li>
174-
))}
175-
</ol>
186+
<ol className="relative border-s border-gray-200 dark:border-gray-700">
187+
{timeline.map((item, index) => (
188+
<li key={index} className="mb-10 ml-6">
189+
<span className="absolute flex items-center justify-center w-6 h-6 bg-blue-100 rounded-full -left-3 ring-8 ring-white dark:ring-gray-900 dark:bg-blue-900">
190+
<svg
191+
className="w-3 h-3 text-blue-800 dark:text-blue-300"
192+
aria-hidden="true"
193+
xmlns="http://www.w3.org/2000/svg"
194+
fill="currentColor"
195+
viewBox="0 0 20 20"
196+
>
197+
<path d="M10 2a8 8 0 100 16A8 8 0 0010 2zm1.707 11.293a1 1 0 01-1.414 0L9 12.414l-.293.293a1 1 0 01-1.414-1.414l2-2a1 1 0 011.414 0l2 2a1 1 0 010 1.414zM10 7a1.5 1.5 0 110-3 1.5 1.5 0 010 3z" />
198+
</svg>
199+
</span>
200+
<h3 className="text-lg font-semibold text-gray-900 dark:text-white">
201+
{item.heading}
202+
</h3>
203+
<time className="block mb-2 text-sm font-normal leading-none text-gray-400 dark:text-gray-500">
204+
{item.date}
205+
</time>
206+
<p className="mb-4 text-base font-normal text-gray-500 dark:text-gray-400">
207+
{item.description}
208+
</p>
209+
</li>
210+
))}
211+
</ol>
212+
</div>
176213
</div>
177-
</div>
178-
</main>
214+
</main>
215+
</>
179216
);
180217
}

0 commit comments

Comments
 (0)