Skip to content

Commit bc52728

Browse files
mike7sevenmike7seven
committed
initial branch commit
1 parent f4f3810 commit bc52728

File tree

1 file changed

+121
-1
lines changed

1 file changed

+121
-1
lines changed

‎index.html

Lines changed: 121 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1 +1,121 @@
1-
I invent & build technology that matters with a focus on turning novel ideas into real world impact. Here I explore the possibilities & challenges of innovation, share insights from building new technology, and examine where tech is taking us next. I love building elegant solutions to complex problems.
1+
<!DOCTYPE html>
2+
<html lang="en" class="dark">
3+
<head>
4+
<meta charset="UTF-8">
5+
<meta name="viewport" content="width=device-width, initial-scale=1.0">
6+
<title>Mike Seven - Developer & Creator</title>
7+
<script src="https://cdn.tailwindcss.com"></script>
8+
<script>
9+
tailwind.config = {
10+
darkMode: 'class',
11+
theme: {
12+
extend: {
13+
colors: {
14+
claude: {
15+
dark: '#0E1116',
16+
accent: '#4D68C2',
17+
border: '#1E242C'
18+
}
19+
}
20+
}
21+
}
22+
}
23+
</script>
24+
</head>
25+
<body class="bg-claude-dark text-gray-200 min-h-screen">
26+
<nav class="border-b border-claude-border">
27+
<div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
28+
<div class="flex justify-between h-16">
29+
<div class="flex items-center">
30+
<span class="text-2xl font-bold text-claude-accent">MS</span>
31+
</div>
32+
<div class="flex items-center space-x-4">
33+
<a href="#projects" class="hover:text-claude-accent transition-colors">Projects</a>
34+
<a href="#about" class="hover:text-claude-accent transition-colors">About</a>
35+
<a href="#contact" class="hover:text-claude-accent transition-colors">Contact</a>
36+
</div>
37+
</div>
38+
</div>
39+
</nav>
40+
<main>
41+
<!-- Hero Section -->
42+
<div class="relative overflow-hidden">
43+
<div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8 py-24">
44+
<div class="text-center">
45+
<h1 class="text-5xl font-bold mb-6 text-claude-accent">
46+
Mike Seven
47+
</h1>
48+
<p class="text-xl text-gray-400 mb-8">
49+
Developer, Creator, Problem Solver
50+
</p>
51+
<div class="flex justify-center space-x-4">
52+
<a href="#projects" class="bg-claude-accent hover:bg-claude-accent/90 text-white px-6 py-3 rounded-lg transition-colors">
53+
View Projects
54+
</a>
55+
<a href="#contact" class="border border-claude-accent text-claude-accent hover:bg-claude-accent/10 px-6 py-3 rounded-lg transition-colors">
56+
Get in Touch
57+
</a>
58+
</div>
59+
</div>
60+
</div>
61+
</div>
62+
<!-- Projects Section -->
63+
<section id="projects" class="py-20 bg-[#161920]">
64+
<div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
65+
<h2 class="text-3xl font-bold mb-12 text-center">Featured Projects</h2>
66+
<div class="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-8">
67+
<!-- Project Card -->
68+
<div class="bg-claude-dark border border-claude-border rounded-lg overflow-hidden hover:border-claude-accent transition-colors">
69+
<div class="p-6">
70+
<h3 class="text-xl font-semibold mb-2">Project Name</h3>
71+
<p class="text-gray-400 mb-4">Project description goes here. Brief overview of what it does.</p>
72+
<div class="flex space-x-2">
73+
<span class="px-2 py-1 bg-claude-accent/20 text-claude-accent rounded text-sm">React</span>
74+
<span class="px-2 py-1 bg-claude-accent/20 text-claude-accent rounded text-sm">Node.js</span>
75+
</div>
76+
</div>
77+
</div>
78+
</div>
79+
</div>
80+
</section>
81+
<!-- About Section -->
82+
<section id="about" class="py-20">
83+
<div class="max-w-3xl mx-auto px-4 sm:px-6 lg:px-8 text-center">
84+
<h2 class="text-3xl font-bold mb-8">About Me</h2>
85+
<p class="text-gray-400 mb-6">
86+
A passionate developer with expertise in modern web technologies.
87+
I love building elegant solutions to complex problems.
88+
</p>
89+
<div class="flex justify-center space-x-4">
90+
<a href="https://github.com/mike7seven" target="_blank" class="text-gray-400 hover:text-claude-accent">
91+
GitHub
92+
</a>
93+
<a href="#" class="text-gray-400 hover:text-claude-accent">
94+
LinkedIn
95+
</a>
96+
<a href="#" class="text-gray-400 hover:text-claude-accent">
97+
Twitter
98+
</a>
99+
</div>
100+
</div>
101+
</section>
102+
<!-- Contact Section -->
103+
<section id="contact" class="py-20 bg-[#161920]">
104+
<div class="max-w-3xl mx-auto px-4 sm:px-6 lg:px-8 text-center">
105+
<h2 class="text-3xl font-bold mb-8">Get in Touch</h2>
106+
<p class="text-gray-400 mb-8">
107+
Interested in working together? Let's connect.
108+
</p>
109+
<a href="mailto:[email protected]" class="bg-claude-accent hover:bg-claude-accent/90 text-white px-8 py-3 rounded-lg inline-block transition-colors">
110+
Send Email
111+
</a>
112+
</div>
113+
</section>
114+
</main>
115+
<footer class="border-t border-claude-border py-8">
116+
<div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8 text-center text-gray-400">
117+
<p>&copy; 2025 Mike Seven. All rights reserved.</p>
118+
</div>
119+
</footer>
120+
</body>
121+
</html>

0 commit comments

Comments
 (0)