Initial import

This commit is contained in:
Flatlogic Bot 2026-03-05 15:32:41 +00:00
commit abe261aa1f
18 changed files with 4689 additions and 0 deletions

View File

@ -0,0 +1,3 @@
{
"template": "bolt-vite-react-ts"
}

View File

@ -0,0 +1,5 @@
For all designs I ask you to make, have them be beautiful, not cookie cutter. Make webpages that are fully featured and worthy for production.
By default, this template supports JSX syntax with Tailwind CSS classes, React hooks, and Lucide React for icons. Do not install other packages for UI themes, icons, etc unless absolutely necessary or I request them.
Use icons from lucide-react for logos.

23
bolt-gaming-geek-main/.gitignore vendored Normal file
View File

@ -0,0 +1,23 @@
logs
*.log
npm-debug.log*
yarn-debug.log*
yarn-error.log*
pnpm-debug.log*
lerna-debug.log*
node_modules
dist
dist-ssr
*.local
.vscode/*
!.vscode/extensions.json
.idea
.DS_Store
*.suo
*.ntvs*
*.njsproj
*.sln
*.sw?
.env

View File

@ -0,0 +1 @@
bolt-gaming-geek

View File

@ -0,0 +1,28 @@
import js from '@eslint/js';
import globals from 'globals';
import reactHooks from 'eslint-plugin-react-hooks';
import reactRefresh from 'eslint-plugin-react-refresh';
import tseslint from 'typescript-eslint';
export default tseslint.config(
{ ignores: ['dist'] },
{
extends: [js.configs.recommended, ...tseslint.configs.recommended],
files: ['**/*.{ts,tsx}'],
languageOptions: {
ecmaVersion: 2020,
globals: globals.browser,
},
plugins: {
'react-hooks': reactHooks,
'react-refresh': reactRefresh,
},
rules: {
...reactHooks.configs.recommended.rules,
'react-refresh/only-export-components': [
'warn',
{ allowConstantExport: true },
],
},
}
);

View File

@ -0,0 +1,17 @@
<!doctype html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<link rel="icon" type="image/svg+xml" href="/vite.svg" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title data-default>NEXUS - Gaming & Geek Culture Hub</title>
<meta name="description" content="Join the ultimate hub for gamers, streamers, and geek culture enthusiasts. Get exclusive reviews, breaking news, and connect with 500K+ players." />
<meta property="og:image" content="https://bolt.new/static/og_default.png" />
<meta name="twitter:card" content="summary_large_image" />
<meta name="twitter:image" content="https://bolt.new/static/og_default.png" />
</head>
<body>
<div id="root"></div>
<script type="module" src="/src/main.tsx"></script>
</body>
</html>

4175
bolt-gaming-geek-main/package-lock.json generated Normal file

File diff suppressed because it is too large Load Diff

View File

@ -0,0 +1,35 @@
{
"name": "vite-react-typescript-starter",
"private": true,
"version": "0.0.0",
"type": "module",
"scripts": {
"dev": "vite",
"build": "vite build",
"lint": "eslint .",
"preview": "vite preview",
"typecheck": "tsc --noEmit -p tsconfig.app.json"
},
"dependencies": {
"@supabase/supabase-js": "^2.57.4",
"lucide-react": "^0.344.0",
"react": "^18.3.1",
"react-dom": "^18.3.1"
},
"devDependencies": {
"@eslint/js": "^9.9.1",
"@types/react": "^18.3.5",
"@types/react-dom": "^18.3.0",
"@vitejs/plugin-react": "^4.3.1",
"autoprefixer": "^10.4.18",
"eslint": "^9.9.1",
"eslint-plugin-react-hooks": "^5.1.0-rc.0",
"eslint-plugin-react-refresh": "^0.4.11",
"globals": "^15.9.0",
"postcss": "^8.4.35",
"tailwindcss": "^3.4.1",
"typescript": "^5.5.3",
"typescript-eslint": "^8.3.0",
"vite": "^5.4.2"
}
}

View File

@ -0,0 +1,6 @@
export default {
plugins: {
tailwindcss: {},
autoprefixer: {},
},
};

View File

@ -0,0 +1,311 @@
import { useState } from 'react';
import {
Menu, X, Gamepad2, Trophy, Newspaper, Users,
Youtube, Twitter, Twitch, MessageSquare, Mail,
ChevronRight, Star, TrendingUp, Zap
} from 'lucide-react';
function App() {
const [isMenuOpen, setIsMenuOpen] = useState(false);
const [email, setEmail] = useState('');
const handleNewsletterSubmit = (e: React.FormEvent) => {
e.preventDefault();
console.log('Newsletter signup:', email);
setEmail('');
alert('Thanks for subscribing! 🎮');
};
return (
<div className="min-h-screen bg-gradient-to-b from-gray-900 via-black to-gray-900 text-white">
{/* Navigation */}
<nav className="fixed top-0 w-full bg-black/80 backdrop-blur-md z-50 border-b border-cyan-500/20">
<div className="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
<div className="flex items-center justify-between h-16">
<div className="flex items-center space-x-2">
<Zap className="w-8 h-8 text-cyan-400" />
<span className="text-2xl font-bold bg-gradient-to-r from-cyan-400 to-blue-500 bg-clip-text text-transparent">
NEXUS
</span>
</div>
{/* Desktop Navigation */}
<div className="hidden md:flex items-center space-x-8">
<a href="#games" className="hover:text-cyan-400 transition-colors flex items-center space-x-1">
<Gamepad2 className="w-4 h-4" />
<span>Games</span>
</a>
<a href="#reviews" className="hover:text-cyan-400 transition-colors flex items-center space-x-1">
<Trophy className="w-4 h-4" />
<span>Reviews</span>
</a>
<a href="#news" className="hover:text-cyan-400 transition-colors flex items-center space-x-1">
<Newspaper className="w-4 h-4" />
<span>News</span>
</a>
<a href="#community" className="hover:text-cyan-400 transition-colors flex items-center space-x-1">
<Users className="w-4 h-4" />
<span>Community</span>
</a>
<button className="bg-gradient-to-r from-cyan-500 to-blue-500 hover:from-cyan-600 hover:to-blue-600 px-6 py-2 rounded-full font-semibold transition-all transform hover:scale-105">
Join Now
</button>
</div>
{/* Mobile menu button */}
<button
className="md:hidden"
onClick={() => setIsMenuOpen(!isMenuOpen)}
>
{isMenuOpen ? <X className="w-6 h-6" /> : <Menu className="w-6 h-6" />}
</button>
</div>
</div>
{/* Mobile Navigation */}
{isMenuOpen && (
<div className="md:hidden bg-black border-t border-cyan-500/20">
<div className="px-4 pt-2 pb-4 space-y-3">
<a href="#games" className="block py-2 hover:text-cyan-400 transition-colors">Games</a>
<a href="#reviews" className="block py-2 hover:text-cyan-400 transition-colors">Reviews</a>
<a href="#news" className="block py-2 hover:text-cyan-400 transition-colors">News</a>
<a href="#community" className="block py-2 hover:text-cyan-400 transition-colors">Community</a>
<button className="w-full bg-gradient-to-r from-cyan-500 to-blue-500 px-6 py-2 rounded-full font-semibold">
Join Now
</button>
</div>
</div>
)}
</nav>
{/* Hero Section */}
<section className="relative pt-32 pb-20 px-4 overflow-hidden">
<div className="absolute inset-0 bg-gradient-to-r from-cyan-500/10 to-blue-500/10 blur-3xl"></div>
<div className="max-w-7xl mx-auto relative z-10">
<div className="text-center space-y-8">
<div className="inline-block px-4 py-2 bg-cyan-500/10 border border-cyan-500/30 rounded-full text-cyan-400 text-sm font-semibold mb-4">
<span className="inline-block w-2 h-2 bg-cyan-400 rounded-full mr-2 animate-pulse"></span>
LIVE NOW: Breaking Gaming News
</div>
<h1 className="text-5xl md:text-7xl font-bold leading-tight">
<span className="bg-gradient-to-r from-cyan-400 via-blue-500 to-cyan-400 bg-clip-text text-transparent animate-gradient">
Level Up Your
</span>
<br />
<span className="text-white">Gaming Experience</span>
</h1>
<p className="text-xl md:text-2xl text-gray-400 max-w-3xl mx-auto">
Join the ultimate hub for gamers, streamers, and geek culture enthusiasts.
Get exclusive reviews, breaking news, and connect with a community of 500K+ players.
</p>
<div className="flex flex-col sm:flex-row items-center justify-center gap-4">
<button className="group bg-gradient-to-r from-cyan-500 to-blue-500 hover:from-cyan-600 hover:to-blue-600 px-8 py-4 rounded-full font-bold text-lg transition-all transform hover:scale-105 flex items-center space-x-2">
<span>Explore Content</span>
<ChevronRight className="w-5 h-5 group-hover:translate-x-1 transition-transform" />
</button>
<button className="px-8 py-4 rounded-full font-bold text-lg border-2 border-cyan-500 hover:bg-cyan-500/10 transition-all flex items-center space-x-2">
<Youtube className="w-5 h-5" />
<span>Watch Streams</span>
</button>
</div>
</div>
</div>
</section>
{/* Featured Content Grid */}
<section id="games" className="py-20 px-4">
<div className="max-w-7xl mx-auto">
<div className="flex items-center justify-between mb-12">
<h2 className="text-4xl font-bold">
<span className="text-cyan-400">Featured</span> Games
</h2>
<button className="text-cyan-400 hover:text-cyan-300 flex items-center space-x-1">
<span>View All</span>
<ChevronRight className="w-4 h-4" />
</button>
</div>
<div className="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-6">
{[
{ title: "Cyberpunk Warriors", genre: "RPG", rating: 9.2, trending: true },
{ title: "Galactic Frontiers", genre: "Strategy", rating: 8.8, trending: true },
{ title: "Shadow Realm", genre: "Action", rating: 9.5, trending: false },
].map((game, index) => (
<div key={index} className="group relative bg-gradient-to-br from-gray-800 to-gray-900 rounded-2xl overflow-hidden border border-cyan-500/20 hover:border-cyan-500/50 transition-all transform hover:scale-105">
<div className="aspect-video bg-gradient-to-br from-cyan-500/20 to-blue-500/20 flex items-center justify-center">
<Gamepad2 className="w-16 h-16 text-cyan-400 opacity-50" />
</div>
{game.trending && (
<div className="absolute top-4 right-4 bg-gradient-to-r from-cyan-500 to-blue-500 px-3 py-1 rounded-full text-xs font-bold flex items-center space-x-1">
<TrendingUp className="w-3 h-3" />
<span>TRENDING</span>
</div>
)}
<div className="p-6">
<div className="flex items-center justify-between mb-2">
<span className="text-xs text-cyan-400 font-semibold">{game.genre}</span>
<div className="flex items-center space-x-1">
<Star className="w-4 h-4 text-yellow-400 fill-yellow-400" />
<span className="text-sm font-bold">{game.rating}</span>
</div>
</div>
<h3 className="text-xl font-bold mb-2">{game.title}</h3>
<button className="w-full bg-cyan-500/10 hover:bg-cyan-500/20 text-cyan-400 py-2 rounded-lg font-semibold transition-colors">
Read Review
</button>
</div>
</div>
))}
</div>
</div>
</section>
{/* Latest Reviews Section */}
<section id="reviews" className="py-20 px-4 bg-black/50">
<div className="max-w-7xl mx-auto">
<h2 className="text-4xl font-bold mb-12 text-center">
<span className="text-cyan-400">Expert</span> Reviews
</h2>
<div className="grid grid-cols-1 md:grid-cols-2 gap-8">
{[
{ title: "The Future of VR Gaming is Here", category: "VR Tech", score: 9 },
{ title: "Top 10 Indie Games You Can't Miss", category: "Indie", score: 8.5 },
].map((review, index) => (
<div key={index} className="bg-gradient-to-r from-gray-800 to-gray-900 rounded-2xl p-8 border border-cyan-500/20 hover:border-cyan-500/50 transition-all">
<div className="flex items-start justify-between mb-4">
<span className="text-xs text-cyan-400 font-semibold uppercase">{review.category}</span>
<div className="bg-gradient-to-r from-cyan-500 to-blue-500 px-3 py-1 rounded-full text-sm font-bold">
{review.score}/10
</div>
</div>
<h3 className="text-2xl font-bold mb-4">{review.title}</h3>
<p className="text-gray-400 mb-6">
Dive deep into our comprehensive analysis and expert opinions on the latest trends in gaming.
</p>
<button className="text-cyan-400 hover:text-cyan-300 flex items-center space-x-2 font-semibold">
<span>Read Full Review</span>
<ChevronRight className="w-4 h-4" />
</button>
</div>
))}
</div>
</div>
</section>
{/* News Section */}
<section id="news" className="py-20 px-4">
<div className="max-w-7xl mx-auto">
<h2 className="text-4xl font-bold mb-12 text-center">
<span className="text-cyan-400">Breaking</span> News
</h2>
<div className="space-y-4">
{[
"Major Tournament Announces $5M Prize Pool",
"New Console Generation: What to Expect",
"Exclusive Interview with Top Game Developer",
].map((headline, index) => (
<div key={index} className="bg-gradient-to-r from-gray-800 to-gray-900 rounded-xl p-6 border border-cyan-500/20 hover:border-cyan-500/50 transition-all cursor-pointer group">
<div className="flex items-center justify-between">
<div className="flex items-center space-x-4">
<Newspaper className="w-6 h-6 text-cyan-400" />
<span className="text-lg font-semibold group-hover:text-cyan-400 transition-colors">{headline}</span>
</div>
<ChevronRight className="w-5 h-5 text-gray-500 group-hover:text-cyan-400 group-hover:translate-x-1 transition-all" />
</div>
</div>
))}
</div>
</div>
</section>
{/* Community Section */}
<section id="community" className="py-20 px-4 bg-black/50">
<div className="max-w-7xl mx-auto text-center">
<h2 className="text-4xl font-bold mb-6">
<span className="text-cyan-400">Join Our</span> Community
</h2>
<p className="text-xl text-gray-400 mb-12 max-w-2xl mx-auto">
Connect with 500,000+ gamers, share your gameplay, and participate in exclusive events.
</p>
<div className="grid grid-cols-2 md:grid-cols-4 gap-8 mb-12">
{[
{ icon: Users, label: "500K+ Members", value: "Active Community" },
{ icon: MessageSquare, label: "24/7 Discussion", value: "Live Forums" },
{ icon: Trophy, label: "Weekly Events", value: "Win Prizes" },
{ icon: Youtube, label: "Daily Streams", value: "Watch Live" },
].map((stat, index) => (
<div key={index} className="bg-gradient-to-br from-gray-800 to-gray-900 rounded-xl p-6 border border-cyan-500/20">
<stat.icon className="w-8 h-8 text-cyan-400 mx-auto mb-3" />
<div className="text-2xl font-bold mb-1">{stat.label}</div>
<div className="text-sm text-gray-400">{stat.value}</div>
</div>
))}
</div>
</div>
</section>
{/* Newsletter Section */}
<section className="py-20 px-4">
<div className="max-w-4xl mx-auto">
<div className="bg-gradient-to-r from-cyan-500/10 to-blue-500/10 rounded-2xl p-12 border border-cyan-500/30 text-center">
<Mail className="w-12 h-12 text-cyan-400 mx-auto mb-6" />
<h2 className="text-3xl font-bold mb-4">
Never Miss an <span className="text-cyan-400">Update</span>
</h2>
<p className="text-gray-400 mb-8">
Get the latest gaming news, exclusive reviews, and special offers delivered straight to your inbox.
</p>
<form onSubmit={handleNewsletterSubmit} className="flex flex-col sm:flex-row gap-4 max-w-md mx-auto">
<input
type="email"
value={email}
onChange={(e) => setEmail(e.target.value)}
placeholder="Enter your email"
required
className="flex-1 px-6 py-4 rounded-full bg-gray-900 border border-cyan-500/30 focus:border-cyan-500 focus:outline-none"
/>
<button
type="submit"
className="bg-gradient-to-r from-cyan-500 to-blue-500 hover:from-cyan-600 hover:to-blue-600 px-8 py-4 rounded-full font-bold transition-all transform hover:scale-105"
>
Subscribe
</button>
</form>
</div>
</div>
</section>
{/* Footer */}
<footer className="bg-black border-t border-cyan-500/20 py-12 px-4">
<div className="max-w-7xl mx-auto">
<div className="flex flex-col md:flex-row items-center justify-between space-y-6 md:space-y-0">
<div className="flex items-center space-x-2">
<Zap className="w-8 h-8 text-cyan-400" />
<span className="text-2xl font-bold bg-gradient-to-r from-cyan-400 to-blue-500 bg-clip-text text-transparent">
NEXUS
</span>
</div>
<div className="flex space-x-6">
<a href="#" className="hover:text-cyan-400 transition-colors">
<Twitter className="w-6 h-6" />
</a>
<a href="#" className="hover:text-cyan-400 transition-colors">
<Youtube className="w-6 h-6" />
</a>
<a href="#" className="hover:text-cyan-400 transition-colors">
<Twitch className="w-6 h-6" />
</a>
<a href="#" className="hover:text-cyan-400 transition-colors">
<MessageSquare className="w-6 h-6" />
</a>
</div>
<div className="text-gray-400 text-sm">
© 2024 NEXUS. All rights reserved.
</div>
</div>
</div>
</footer>
</div>
);
}
export default App;

View File

@ -0,0 +1,3 @@
@tailwind base;
@tailwind components;
@tailwind utilities;

View File

@ -0,0 +1,10 @@
import { StrictMode } from 'react';
import { createRoot } from 'react-dom/client';
import App from './App.tsx';
import './index.css';
createRoot(document.getElementById('root')!).render(
<StrictMode>
<App />
</StrictMode>
);

View File

@ -0,0 +1 @@
/// <reference types="vite/client" />

View File

@ -0,0 +1,8 @@
/** @type {import('tailwindcss').Config} */
export default {
content: ['./index.html', './src/**/*.{js,ts,jsx,tsx}'],
theme: {
extend: {},
},
plugins: [],
};

View File

@ -0,0 +1,24 @@
{
"compilerOptions": {
"target": "ES2020",
"useDefineForClassFields": true,
"lib": ["ES2020", "DOM", "DOM.Iterable"],
"module": "ESNext",
"skipLibCheck": true,
/* Bundler mode */
"moduleResolution": "bundler",
"allowImportingTsExtensions": true,
"isolatedModules": true,
"moduleDetection": "force",
"noEmit": true,
"jsx": "react-jsx",
/* Linting */
"strict": true,
"noUnusedLocals": true,
"noUnusedParameters": true,
"noFallthroughCasesInSwitch": true
},
"include": ["src"]
}

View File

@ -0,0 +1,7 @@
{
"files": [],
"references": [
{ "path": "./tsconfig.app.json" },
{ "path": "./tsconfig.node.json" }
]
}

View File

@ -0,0 +1,22 @@
{
"compilerOptions": {
"target": "ES2022",
"lib": ["ES2023"],
"module": "ESNext",
"skipLibCheck": true,
/* Bundler mode */
"moduleResolution": "bundler",
"allowImportingTsExtensions": true,
"isolatedModules": true,
"moduleDetection": "force",
"noEmit": true,
/* Linting */
"strict": true,
"noUnusedLocals": true,
"noUnusedParameters": true,
"noFallthroughCasesInSwitch": true
},
"include": ["vite.config.ts"]
}

View File

@ -0,0 +1,10 @@
import { defineConfig } from 'vite';
import react from '@vitejs/plugin-react';
// https://vitejs.dev/config/
export default defineConfig({
plugins: [react()],
optimizeDeps: {
exclude: ['lucide-react'],
},
});