Skip to content

Commit 21977fb

Browse files
RikthepixelRikthepixel
committed
Add goals and why another git client to frontpage with dots
1 parent fb2f190 commit 21977fb

File tree

4 files changed

+38
-37
lines changed

4 files changed

+38
-37
lines changed

‎src/components/navigation/Footer.tsx‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -5,7 +5,7 @@ import Logo from "@/assets/images/brand/logo-200x200.webp";
55
const Footer = () => {
66
return (
77
<footer className="flex items-center justify-center text-primary-contrast">
8-
<div className="flex flex-col w-full gap-4 p-8 max-w-7xl rounded-t-md bg-primary">
8+
<div className="flex flex-col w-full gap-4 p-8 border-2 max-w-7xl rounded-t-md bg-primary bg-dots from-primary-light border-primary-light">
99
<div className="flex flex-col items-center gap-2 p-2 rounded-md bg-white/20 sm:flex-row">
1010
<div className="flex items-center gap-2">
1111
<img

‎src/pages/about.tsx‎

Lines changed: 0 additions & 25 deletions
Original file line numberDiff line numberDiff line change
@@ -12,31 +12,6 @@ const AboutPage: Page = ({ initialLoad, reduceMotion }) => {
1212
</Head>
1313
<main aria-labelledby="about" className="flex flex-col flex-1 w-full gap-8 pb-8 max-w-7xl">
1414
<h1 id="about" className="text-4xl font-bold text-center lg:text-6xl text-secondary">About</h1>
15-
<section aria-labelledby="our-goal" className="flex flex-col gap-8">
16-
<h2
17-
id="our-goal"
18-
className="text-2xl text-center lg:text-3xl text-primary"
19-
>
20-
Our Goal
21-
</h2>
22-
<p className="lg:text-lg">
23-
Our main goal with Commit Rocket is to drive innovation and provide a modern and fast alternative to existing Git clients.
24-
We want to improve the user experience for developers by creating an open-source and cross-platform tool that is both feature-rich and beginner-friendly.
25-
</p>
26-
</section>
27-
<section aria-labelledby="why-another-git-client" className="flex flex-col gap-8">
28-
<h2
29-
id="why-another-git-client"
30-
className="text-2xl text-center lg:text-3xl text-primary"
31-
>
32-
Why another Git client?
33-
</h2>
34-
<p className="lg:text-lg">
35-
At Commit Rocket, we believe that the current generation of Git clients is outdated and slow.
36-
We want to change that by providing a sleek and fast client that meets the needs of today's developers.
37-
Our commitment to open-source development and cross-platform compatibility sets us apart from other clients in the market.
38-
</p>
39-
</section>
4015
<section aria-labelledby="our-team" className="flex flex-col gap-8 my-8">
4116
<h2
4217
id="our-team"

‎src/pages/index.tsx‎

Lines changed: 25 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -30,10 +30,9 @@ const FrontPage: Page = ({ }) => {
3030
<Head>
3131
<title>Commit Rocket</title>
3232
</Head>
33-
<main aria-labelledby="hero-title" className="flex flex-col flex-1 w-full gap-4 pb-8">
34-
<section aria-label="hero" className="flex flex-col-reverse items-center h-fit min-h-0 max-w-7xl xl:flex-row xl:min-h-[30rem] xl:h-[75dvh] xl:h-[75vh] mx-auto">
33+
<main aria-labelledby="hero-title" className="flex flex-col flex-1 w-full gap-4 pb-8 max-w-7xl">
34+
<section aria-label="hero" className="flex flex-col-reverse items-center h-fit min-h-0 xl:flex-row xl:min-h-[30rem] xl:h-[75dvh] xl:h-[75vh] mx-auto">
3535
<div className="relative flex flex-col items-center justify-center h-full col-span-3 gap-8 text-center xl:w-3/5">
36-
{/* <div className="absolute w-full h-full opacity-20 aspect-square bg-gradient-radial from-primary to-transparent -z-10" aria-hidden /> */}
3736
<h1
3837
id="hero-title"
3938
className="text-3xl font-bold lg:text-6xl text-primary"
@@ -43,14 +42,13 @@ const FrontPage: Page = ({ }) => {
4342
<p className="text-lg lg:text-xl lg:max-w-xl">
4443
Experience Git in a modern and fast way with Commit Rocket, the open-source, lightweight and cross-platform Git client.
4544
</p>
46-
<LinkButton href="/#try-it-yourself" color="secondary" className="px-5 py-3 text-xl">
45+
<LinkButton href="#try-it-yourself" color="secondary" className="px-5 py-3 text-xl" scroll={false}>
4746
Try it Yourself
4847
</LinkButton>
4948
</div>
5049
<div className="relative overflow-hidden flex items-center justify-center w-full min-h-[20rem] max-h-[40dvh] max-h-[40vh] xl:min-h-0 xl:h-full xl:max-h-full xl:w-2/5" style={{ aspectRatio: `${LogoPicture.width} / ${LogoPicture.height}` }}>
51-
{/* <div className="absolute w-full h-full opacity-20 aspect-square bg-gradient-radial from-primary to-transparent" aria-hidden /> */}
5250
<motion.img
53-
className="absolute max-w-full max-h-full object-contain aspect-auto w-full rotate-[10deg] text-[0px]"
51+
className="absolute max-w-full max-h-full object-contain aspect-auto w-full rotate-[10deg] text-[0px] select-none"
5452
loading="eager"
5553
variants={logoAnim}
5654
alt="Commit Rocket"
@@ -60,9 +58,29 @@ const FrontPage: Page = ({ }) => {
6058
/>
6159
</div>
6260
</section>
61+
<div className="flex flex-row gap-12 py-16 mx-auto text-center">
62+
<section
63+
aria-labelledby="our-goal"
64+
className="flex flex-col flex-1 gap-4 p-4 bg-center border-2 rounded-lg image-dots bg-primary text-primary-contrast border-primary-light from-primary-light"
65+
>
66+
<h2 id="our-goal" className="text-2xl font-semibold">
67+
Our Goal
68+
</h2>
69+
Our main goal with Commit Rocket is to drive innovation and provide a modern and fast alternative to existing Git clients. We want to improve the user experience for developers by creating an open-source and cross-platform tool that is both feature-rich and beginner-friendly.
70+
</section>
71+
<section
72+
aria-labelledby="why-another-git-client"
73+
className="flex flex-col flex-1 gap-4 p-4 bg-center border-2 rounded-lg image-dots bg-primary text-primary-contrast border-primary-light from-primary-light"
74+
>
75+
<h2 id="why-another-git-client" className="text-2xl font-semibold">
76+
Why another Git client?
77+
</h2>
78+
At Commit Rocket, we believe that the current generation of Git clients is outdated and slow. We want to change that by providing a sleek and fast client that meets the needs of today's developers. Our commitment to open-source development and cross-platform compatibility sets us apart from other clients in the market.
79+
</section>
80+
</div>
6381
<section
6482
aria-labelledby="mission"
65-
className="flex flex-col gap-12 py-16 mx-auto text-center max-w-7xl"
83+
className="flex flex-col gap-12 py-16 mx-auto text-center"
6684
>
6785
<h2
6886
id="mission"

‎tailwind.config.js‎

Lines changed: 12 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -10,13 +10,13 @@ module.exports = {
1010
theme: {
1111
extend: {
1212
backgroundImage: {
13-
'gradient-radial': 'radial-gradient(circle closest-side, var(--tw-gradient-stops))',
13+
"gradient-radial": 'radial-gradient(circle closest-side, var(--tw-gradient-stops))'
1414
},
1515
colors: {
1616
primary: {
1717
DEFAULT: "#f2600c",
18-
light: "#FF792E",
19-
dark: "#DB5103",
18+
light: "#FF8D4C",
19+
dark: "#bf4701",
2020
contrast: "#FFF"
2121
},
2222
secondary: {
@@ -33,9 +33,17 @@ module.exports = {
3333
},
3434
},
3535
plugins: [
36-
plugin(({ addVariant }) => {
36+
plugin(({ addVariant, addComponents }) => {
3737
addVariant("is", ":is(&)");
3838
addVariant("where", ":where(&)");
39+
addComponents({
40+
".image-dots": {
41+
"background-image": "radial-gradient(var(--tw-gradient-from), transparent 1.5px, transparent 1.5px)",
42+
"background-size": "1.1rem 1.1rem",
43+
"background-position": "50% 50%"
44+
}
45+
});
46+
3947
})
4048
],
4149
};

0 commit comments

Comments
 (0)