Skip to content

Commit 3341ce3

Browse files
committed
Homepage updated
1 parent 7adf8f6 commit 3341ce3

18 files changed

Lines changed: 6917 additions & 0 deletions

.gitignore

Lines changed: 41 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,41 @@
1+
# See https://help.github.com/articles/ignoring-files/ for more about ignoring files.
2+
3+
# dependencies
4+
/node_modules
5+
/.pnp
6+
.pnp.*
7+
.yarn/*
8+
!.yarn/patches
9+
!.yarn/plugins
10+
!.yarn/releases
11+
!.yarn/versions
12+
13+
# testing
14+
/coverage
15+
16+
# next.js
17+
/.next/
18+
/out/
19+
20+
# production
21+
/build
22+
23+
# misc
24+
.DS_Store
25+
*.pem
26+
27+
# debug
28+
npm-debug.log*
29+
yarn-debug.log*
30+
yarn-error.log*
31+
.pnpm-debug.log*
32+
33+
# env files (can opt-in for committing if needed)
34+
.env*
35+
36+
# vercel
37+
.vercel
38+
39+
# typescript
40+
*.tsbuildinfo
41+
next-env.d.ts

README.md

Lines changed: 36 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,36 @@
1+
This is a [Next.js](https://nextjs.org) project bootstrapped with [`create-next-app`](https://nextjs.org/docs/app/api-reference/cli/create-next-app).
2+
3+
## Getting Started
4+
5+
First, run the development server:
6+
7+
```bash
8+
npm run dev
9+
# or
10+
yarn dev
11+
# or
12+
pnpm dev
13+
# or
14+
bun dev
15+
```
16+
17+
Open [http://localhost:3000](http://localhost:3000) with your browser to see the result.
18+
19+
You can start editing the page by modifying `app/page.tsx`. The page auto-updates as you edit the file.
20+
21+
This project uses [`next/font`](https://nextjs.org/docs/app/building-your-application/optimizing/fonts) to automatically optimize and load [Geist](https://vercel.com/font), a new font family for Vercel.
22+
23+
## Learn More
24+
25+
To learn more about Next.js, take a look at the following resources:
26+
27+
- [Next.js Documentation](https://nextjs.org/docs) - learn about Next.js features and API.
28+
- [Learn Next.js](https://nextjs.org/learn) - an interactive Next.js tutorial.
29+
30+
You can check out [the Next.js GitHub repository](https://github.com/vercel/next.js) - your feedback and contributions are welcome!
31+
32+
## Deploy on Vercel
33+
34+
The easiest way to deploy your Next.js app is to use the [Vercel Platform](https://vercel.com/new?utm_medium=default-template&filter=next.js&utm_source=create-next-app&utm_campaign=create-next-app-readme) from the creators of Next.js.
35+
36+
Check out our [Next.js deployment documentation](https://nextjs.org/docs/app/building-your-application/deploying) for more details.

app/favicon.ico

25.3 KB
Binary file not shown.

app/globals.css

Lines changed: 26 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,26 @@
1+
@import "tailwindcss";
2+
3+
:root {
4+
--background: #ffffff;
5+
--foreground: #171717;
6+
}
7+
8+
@theme inline {
9+
--color-background: var(--background);
10+
--color-foreground: var(--foreground);
11+
--font-sans: var(--font-geist-sans);
12+
--font-mono: var(--font-geist-mono);
13+
}
14+
15+
@media (prefers-color-scheme: dark) {
16+
:root {
17+
--background: #0a0a0a;
18+
--foreground: #ededed;
19+
}
20+
}
21+
22+
body {
23+
background: var(--background);
24+
color: var(--foreground);
25+
font-family: Arial, Helvetica, sans-serif;
26+
}

app/layout.tsx

Lines changed: 34 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,34 @@
1+
import type { Metadata } from "next";
2+
import { Geist, Geist_Mono } from "next/font/google";
3+
import "./globals.css";
4+
5+
const geistSans = Geist({
6+
variable: "--font-geist-sans",
7+
subsets: ["latin"],
8+
});
9+
10+
const geistMono = Geist_Mono({
11+
variable: "--font-geist-mono",
12+
subsets: ["latin"],
13+
});
14+
15+
export const metadata: Metadata = {
16+
title: "CodeFXR",
17+
description: "Unleash your terminal!",
18+
};
19+
20+
export default function RootLayout({
21+
children,
22+
}: Readonly<{
23+
children: React.ReactNode;
24+
}>) {
25+
return (
26+
<html lang="en">
27+
<body
28+
className={`${geistSans.variable} ${geistMono.variable} antialiased`}
29+
>
30+
{children}
31+
</body>
32+
</html>
33+
);
34+
}

app/page.tsx

Lines changed: 126 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,126 @@
1+
import Image from "next/image";
2+
import Link from "next/link";
3+
import { ArrowRight, Terminal, Share2, Layers } from "lucide-react";
4+
5+
export default function Home() {
6+
return (
7+
<main className="min-h-screen bg-slate-950 text-white selection:bg-green-500 selection:text-slate-900">
8+
9+
{/* --- Navigation --- */}
10+
<nav className="flex items-center justify-between px-6 py-6 max-w-7xl mx-auto">
11+
<div className="flex items-center gap-2">
12+
{/* Ensure you have a logo.png in your 'public' folder */}
13+
<div className="relative w-8 h-8">
14+
<Image
15+
src="/logo.png"
16+
alt="CodeFXR Logo"
17+
fill
18+
className="object-contain"
19+
/>
20+
</div>
21+
<span className="text-xl font-bold tracking-tight">CodeFXR</span>
22+
</div>
23+
<div className="hidden md:flex gap-6 text-sm font-medium text-slate-400">
24+
<Link href="#products" className="hover:text-green-400 transition-colors">Products</Link>
25+
<Link href="#about" className="hover:text-blue-400 transition-colors">About</Link>
26+
<Link href="#contact" className="hover:text-white transition-colors">Contact</Link>
27+
</div>
28+
</nav>
29+
30+
{/* --- Hero Section --- */}
31+
<section className="flex flex-col items-center justify-center text-center px-6 pt-20 pb-32 max-w-5xl mx-auto">
32+
33+
{/* Animated Badge */}
34+
<div className="mb-6 px-3 py-1 rounded-full border border-slate-800 bg-slate-900/50 backdrop-blur-sm">
35+
<span className="text-xs font-medium text-transparent bg-clip-text bg-gradient-to-r from-blue-400 to-green-400">
36+
Unleash your terminal!
37+
</span>
38+
</div>
39+
40+
{/* Main Title with Gradient */}
41+
<h1 className="text-5xl md:text-7xl font-extrabold tracking-tight mb-6">
42+
The Foundation for <br />
43+
<span className="text-transparent bg-clip-text bg-gradient-to-r from-blue-600 via-teal-400 to-green-400">
44+
Terminal User Interface
45+
</span>
46+
</h1>
47+
48+
<p className="text-lg text-slate-400 max-w-2xl mb-10 leading-relaxed">
49+
CodeFXR provides the essential suite of applications for ease of use of native tools.
50+
</p>
51+
52+
<div className="flex gap-4">
53+
<button className="px-8 py-3 rounded-lg font-bold bg-white text-slate-950 hover:bg-green-400 transition-all duration-300">
54+
Get Started
55+
</button>
56+
<button className="px-8 py-3 rounded-lg font-bold border border-slate-700 hover:border-blue-500 text-white hover:bg-slate-900 transition-all duration-300">
57+
View Documentation
58+
</button>
59+
</div>
60+
</section>
61+
62+
{/* --- Products Section --- */}
63+
<section id="products" className="px-6 py-20 bg-slate-900/50 border-t border-slate-800">
64+
<div className="max-w-7xl mx-auto">
65+
<h2 className="text-3xl font-bold mb-12 text-center">App Suite</h2>
66+
67+
<div className="grid md:grid-cols-3 gap-8">
68+
{/* Product 1: CLI-Studio */}
69+
<ProductCard
70+
icon={<Terminal className="w-8 h-8 text-blue-400" />}
71+
title="CLI▶Studio"
72+
description="User interface for image, video and audio manipulation."
73+
color="blue"
74+
/>
75+
76+
{/* Product 2: Synapxis */}
77+
<ProductCard
78+
icon={<Share2 className="w-8 h-8 text-teal-400" />}
79+
title="Synapxis"
80+
description="Graph view user interface with jrnl integration."
81+
color="teal"
82+
/>
83+
84+
{/* Product 3: LXM */}
85+
<ProductCard
86+
icon={<Layers className="w-8 h-8 text-green-400" />}
87+
title="LXM"
88+
description="Linux manual pages user interface, search and command builder."
89+
color="green"
90+
/>
91+
</div>
92+
</div>
93+
</section>
94+
95+
{/* --- Footer --- */}
96+
<footer className="py-8 text-center text-slate-600 text-sm border-t border-slate-900">
97+
<p>&copy; {new Date().getFullYear()} CodeFXR. All rights reserved.</p>
98+
</footer>
99+
</main>
100+
);
101+
}
102+
103+
// Simple Component for the Product Cards to keep code clean
104+
function ProductCard({ icon, title, description, color }: any) {
105+
// We dynamically set the border hover color based on props
106+
const hoverColor = {
107+
blue: "group-hover:border-blue-500/50",
108+
teal: "group-hover:border-teal-500/50",
109+
green: "group-hover:border-green-500/50",
110+
}[color as "blue" | "teal" | "green"] || "group-hover:border-white";
111+
112+
return (
113+
<div className={`group p-8 rounded-2xl bg-slate-950 border border-slate-800 ${hoverColor} transition-all duration-300 hover:shadow-2xl hover:-translate-y-1`}>
114+
<div className="mb-4 p-3 bg-slate-900/50 rounded-lg inline-block">
115+
{icon}
116+
</div>
117+
<h3 className="text-xl font-bold mb-2 flex items-center gap-2">
118+
{title}
119+
<ArrowRight className="w-4 h-4 opacity-0 group-hover:opacity-100 group-hover:translate-x-1 transition-all" />
120+
</h3>
121+
<p className="text-slate-400 leading-relaxed">
122+
{description}
123+
</p>
124+
</div>
125+
);
126+
}

eslint.config.mjs

Lines changed: 18 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,18 @@
1+
import { defineConfig, globalIgnores } from "eslint/config";
2+
import nextVitals from "eslint-config-next/core-web-vitals";
3+
import nextTs from "eslint-config-next/typescript";
4+
5+
const eslintConfig = defineConfig([
6+
...nextVitals,
7+
...nextTs,
8+
// Override default ignores of eslint-config-next.
9+
globalIgnores([
10+
// Default ignores of eslint-config-next:
11+
".next/**",
12+
"out/**",
13+
"build/**",
14+
"next-env.d.ts",
15+
]),
16+
]);
17+
18+
export default eslintConfig;

next.config.ts

Lines changed: 7 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,7 @@
1+
import type { NextConfig } from "next";
2+
3+
const nextConfig: NextConfig = {
4+
output: "export",
5+
};
6+
7+
export default nextConfig;

0 commit comments

Comments
 (0)