Skip to content

Commit 83944d1

Browse files
committed
feat: first draft
1 parent ec5e381 commit 83944d1

6 files changed

Lines changed: 378 additions & 0 deletions

File tree

css/styles.css

Lines changed: 117 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,117 @@
1+
@import url('https://fonts.googleapis.com/css2?family=Space+Mono:ital,wght@0,400;0,700;1,400;1,700&display=swap');
2+
3+
.space-mono-regular {
4+
font-family: "Space Mono", monospace;
5+
font-weight: 400;
6+
font-style: normal;
7+
}
8+
9+
.space-mono-bold {
10+
font-family: "Space Mono", monospace;
11+
font-weight: 700;
12+
font-style: normal;
13+
}
14+
15+
.space-mono-regular-italic {
16+
font-family: "Space Mono", monospace;
17+
font-weight: 400;
18+
font-style: italic;
19+
}
20+
21+
.space-mono-bold-italic {
22+
font-family: "Space Mono", monospace;
23+
font-weight: 700;
24+
font-style: italic;
25+
}
26+
27+
28+
body {
29+
font-family: 'Space Mono', monospace;
30+
background: #0a0a0a;
31+
}
32+
33+
.leaf-icon {
34+
width: 24px;
35+
height: 24px;
36+
background: linear-gradient(135deg, #10b981, #059669);
37+
clip-path: polygon(50% 0%, 100% 38%, 82% 100%, 18% 100%, 0% 38%);
38+
}
39+
40+
.nav-item {
41+
position: relative;
42+
transition: all 0.3s ease;
43+
}
44+
45+
.nav-item:hover {
46+
color: #10b981;
47+
}
48+
49+
.github-btn {
50+
background: linear-gradient(135deg, #10b981, #059669);
51+
border: 1px solid #10b981;
52+
transition: all 0.3s ease;
53+
}
54+
55+
.github-btn:hover {
56+
background: transparent;
57+
color: #10b981;
58+
}
59+
60+
.mission-btn {
61+
border: 1px solid #374151;
62+
transition: all 0.3s ease;
63+
backdrop-filter: blur(10px);
64+
}
65+
66+
.mission-btn:hover {
67+
border-color: #10b981;
68+
background: rgba(16, 185, 129, 0.1);
69+
}
70+
71+
.hero-text {
72+
background: linear-gradient(135deg, #ffffff, #d1d5db);
73+
-webkit-background-clip: text;
74+
-webkit-text-fill-color: transparent;
75+
background-clip: text;
76+
}
77+
78+
.mission-section {
79+
background: rgba(17, 24, 39, 0.5);
80+
backdrop-filter: blur(10px);
81+
border: 1px solid #374151;
82+
}
83+
84+
/* .typewriter {
85+
overflow: hidden;
86+
border-right: 2px solid #10b981;
87+
white-space: nowrap;
88+
animation: typing 3.5s steps(40, end), blink-caret 0.75s step-end infinite;
89+
} */
90+
91+
@keyframes typing {
92+
from { width: 0 }
93+
to { width: 100% }
94+
}
95+
96+
@keyframes blink-caret {
97+
from, to { border-color: transparent }
98+
50% { border-color: #10b981; }
99+
}
100+
101+
.fade-in {
102+
animation: fadeIn 1s ease-in;
103+
}
104+
105+
@keyframes fadeIn {
106+
from { opacity: 0; transform: translateY(20px); }
107+
to { opacity: 1; transform: translateY(0); }
108+
}
109+
110+
.social-icon {
111+
transition: all 0.3s ease;
112+
}
113+
114+
.social-icon:hover {
115+
color: #10b981;
116+
transform: translateY(-2px);
117+
}

index.html

Lines changed: 106 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,106 @@
1+
<!DOCTYPE html>
2+
<html lang="en">
3+
<head>
4+
<meta charset="UTF-8">
5+
<meta name="viewport" content="width=device-width, initial-scale=1.0">
6+
<title>CacheVector - Advancing ML Libraries</title>
7+
<script src="https://cdn.tailwindcss.com"></script>
8+
<script src="js/main.js"></script>
9+
<link rel="stylesheet" href="css/styles.css">
10+
</head>
11+
<body class="bg-black text-white flex flex-col min-h-screen">
12+
<!-- Navigation -->
13+
<div class="w-full flex justify-center">
14+
<nav class="w-3/5 flex items-center justify-between p-6">
15+
<!-- <div class="flex items-center space-x-2"> -->
16+
<div class="leaf-icon"></div>
17+
<!-- </div> -->
18+
19+
<div class="flex items-center space-x-8">
20+
<a href="#Home" class="nav-item text-gray-300 hover:text-green-500 space-mono-bold">[#Home]</a>
21+
<a href="#Mission" class="nav-item text-gray-300 hover:text-green-500 space-mono-bold">[#Mission]</a>
22+
<a href="#Projects" class="nav-item text-gray-300 hover:text-green-500 space-mono-bold">[#Projects]</a>
23+
<a href="#Blogs" class="nav-item text-gray-300 hover:text-green-500 space-mono-bold">[#Blogs]</a>
24+
</div>
25+
<!-- <button class="github-btn px-4 py-2 rounded-md text-white font-medium">Github</button> -->
26+
<button class="text-gray-400 hover:text-white">
27+
<svg class="w-5 h-5" fill="currentColor" viewBox="0 0 20 20">
28+
<path fill-rule="evenodd" d="M10 2a1 1 0 011 1v1a1 1 0 11-2 0V3a1 1 0 011-1zm4 8a4 4 0 11-8 0 4 4 0 018 0zm-.464 4.95l.707.707a1 1 0 001.414-1.414l-.707-.707a1 1 0 00-1.414 1.414zm2.12-10.607a1 1 0 010 1.414l-.706.707a1 1 0 11-1.414-1.414l.707-.707a1 1 0 011.414 0zM17 11a1 1 0 100-2h-1a1 1 0 100 2h1zm-7 4a1 1 0 011 1v1a1 1 0 11-2 0v-1a1 1 0 011-1zM5.05 6.464A1 1 0 106.465 5.05l-.708-.707a1 1 0 00-1.414 1.414l.707.707zm1.414 8.486l-.707.707a1 1 0 01-1.414-1.414l.707-.707a1 1 0 011.414 1.414zM4 11a1 1 0 100-2H3a1 1 0 000 2h1z" clip-rule="evenodd" />
29+
</svg>
30+
</button>
31+
</nav>
32+
</div>
33+
34+
<!-- Hero Section -->
35+
<div id="content-wrapper" class="w-full flex-1 flex justify-center items-center">
36+
<!-- <div class="w-full flex justify-center"> -->
37+
<main id="content" class="w-3/5 px-6 py-20 text-center">
38+
<h1 class="hero-text text-6xl md:text-8xl font-bold mb-8">
39+
CacheVector
40+
</h1>
41+
42+
<p class="text-gray-400 text-lg md:text-xl max-w-3xl mx-auto mb-12 ">
43+
Advancing machine learning libraries, mathematical research,<br>
44+
and developer tools through open-source innovation
45+
</p>
46+
47+
<div class="flex flex-col items-center justify-center space-y-4 ">
48+
<a href="https://github.com/cachevector" class="github-btn px-6 py-3 rounded-md font-medium flex items-center space-x-2">
49+
<svg class="w-5 h-5" fill="currentColor" viewBox="0 0 20 20">
50+
<path fill-rule="evenodd" d="M10 0C4.477 0 0 4.484 0 10.017c0 4.425 2.865 8.18 6.839 9.504.5.092.682-.217.682-.483 0-.237-.008-.868-.013-1.703-2.782.605-3.369-1.343-3.369-1.343-.454-1.158-1.11-1.466-1.11-1.466-.908-.62.069-.608.069-.608 1.003.07 1.531 1.032 1.531 1.032.892 1.53 2.341 1.088 2.91.832.092-.647.35-1.088.636-1.338-2.22-.253-4.555-1.113-4.555-4.951 0-1.093.39-1.988 1.029-2.688-.103-.253-.446-1.272.098-2.65 0 0 .84-.27 2.75 1.026A9.564 9.564 0 0110 4.844c.85.004 1.705.115 2.504.337 1.909-1.296 2.747-1.027 2.747-1.027.546 1.379.203 2.398.1 2.651.64.7 1.028 1.595 1.028 2.688 0 3.848-2.339 4.695-4.566 4.942.359.31.678.921.678 1.856 0 1.338-.012 2.419-.012 2.747 0 .268.18.58.688.482A10.019 10.019 0 0020 10.017C20 4.484 15.522 0 10 0z" clip-rule="evenodd" />
51+
</svg>
52+
<span>github.com/cachevector</span>
53+
<svg class="w-4 h-4" fill="none" stroke="currentColor" viewBox="0 0 24 24">
54+
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M10 6H6a2 2 0 00-2 2v10a2 2 0 002 2h10a2 2 0 002-2v-4M14 4h6m0 0v6m0-6L10 14" />
55+
</svg>
56+
</a>
57+
58+
<!-- <button class="mission-btn px-6 py-3 rounded-md font-medium flex items-center space-x-2" onclick="scrollToMission()">
59+
<svg class="w-5 h-5" fill="none" stroke="currentColor" viewBox="0 0 24 24">
60+
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M10 20l4-16m4 4l4 4-4 4M6 16l-4-4 4-4" />
61+
</svg>
62+
<span>Our Mission</span>
63+
<svg class="w-4 h-4" fill="currentColor" viewBox="0 0 20 20">
64+
<path fill-rule="evenodd" d="M18 10a8 8 0 11-16 0 8 8 0 0116 0zm-7-4a1 1 0 11-2 0 1 1 0 012 0zM9 9a1 1 0 000 2v3a1 1 0 001 1h1a1 1 0 100-2v-3a1 1 0 00-1-1H9z" clip-rule="evenodd" />
65+
</svg>
66+
</button> -->
67+
</div>
68+
</main>
69+
<!-- </div> -->
70+
</div>
71+
72+
<!-- Footer -->
73+
<footer class="w-3/5 container mx-auto px-6 py-8 border-t border-gray-800">
74+
<div class="flex items-center justify-between">
75+
<div class="flex items-center space-x-2 text-gray-400">
76+
<div class="leaf-icon w-6 h-6"></div>
77+
<div>
78+
<p>© 2025 CacheVector</p>
79+
<p class="text-sm">All rights reserved</p>
80+
</div>
81+
</div>
82+
83+
<div class="flex items-center space-x-4">
84+
<span class="text-gray-400 text-sm">Backed by Growvth</span>
85+
<div class="flex space-x-4">
86+
<a href="#" class="social-icon text-gray-400">
87+
<svg class="w-5 h-5" fill="currentColor" viewBox="0 0 20 20">
88+
<path fill-rule="evenodd" d="M10 0C4.477 0 0 4.484 0 10.017c0 4.425 2.865 8.18 6.839 9.504.5.092.682-.217.682-.483 0-.237-.008-.868-.013-1.703-2.782.605-3.369-1.343-3.369-1.343-.454-1.158-1.11-1.466-1.11-1.466-.908-.62.069-.608.069-.608 1.003.07 1.531 1.032 1.531 1.032.892 1.53 2.341 1.088 2.91.832.092-.647.35-1.088.636-1.338-2.22-.253-4.555-1.113-4.555-4.951 0-1.093.39-1.988 1.029-2.688-.103-.253-.446-1.272.098-2.65 0 0 .84-.27 2.75 1.026A9.564 9.564 0 0110 4.844c.85.004 1.705.115 2.504.337 1.909-1.296 2.747-1.027 2.747-1.027.546 1.379.203 2.398.1 2.651.64.7 1.028 1.595 1.028 2.688 0 3.848-2.339 4.695-4.566 4.942.359.31.678.921.678 1.856 0 1.338-.012 2.419-.012 2.747 0 .268.18.58.688.482A10.019 10.019 0 0020 10.017C20 4.484 15.522 0 10 0z" clip-rule="evenodd" />
89+
</svg>
90+
</a>
91+
<a href="#" class="social-icon text-gray-400">
92+
<svg class="w-5 h-5" fill="currentColor" viewBox="0 0 20 20">
93+
<path d="M6.29 18.251c7.547 0 11.675-6.253 11.675-11.675 0-.178 0-.355-.012-.53A8.348 8.348 0 0020 3.92a8.19 8.19 0 01-2.357.646 4.118 4.118 0 001.804-2.27 8.224 8.224 0 01-2.605.996 4.107 4.107 0 00-6.993 3.743 11.65 11.65 0 01-8.457-4.287 4.106 4.106 0 001.27 5.477A4.073 4.073 0 01.8 7.713v.052a4.105 4.105 0 003.292 4.022 4.095 4.095 0 01-1.853.07 4.108 4.108 0 003.834 2.85A8.233 8.233 0 010 16.407a11.616 11.616 0 006.29 1.84" />
94+
</svg>
95+
</a>
96+
<a href="#" class="social-icon text-gray-400">
97+
<svg class="w-5 h-5" fill="currentColor" viewBox="0 0 20 20">
98+
<path fill-rule="evenodd" d="M18 13V5a2 2 0 00-2-2H4a2 2 0 00-2 2v8a2 2 0 002 2h3l3 3 3-3h3a2 2 0 002-2zM5 7a1 1 0 011-1h8a1 1 0 110 2H6a1 1 0 01-1-1zm1 3a1 1 0 100 2h3a1 1 0 100-2H6z" clip-rule="evenodd" />
99+
</svg>
100+
</a>
101+
</div>
102+
</div>
103+
</div>
104+
</footer>
105+
</body>
106+
</html>

js/main.js

Lines changed: 119 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,119 @@
1+
function scrollToMission() {
2+
document.getElementById('mission').scrollIntoView({
3+
behavior: 'smooth'
4+
});
5+
}
6+
7+
// Add some interactive animations
8+
document.addEventListener('DOMContentLoaded', function() {
9+
// Animate elements on scroll
10+
// const observerOptions = {
11+
// threshold: 0.1,
12+
// rootMargin: '0px 0px -50px 0px'
13+
// };
14+
15+
// const observer = new IntersectionObserver((entries) => {
16+
// entries.forEach(entry => {
17+
// if (entry.isIntersecting) {
18+
// entry.target.classList.add('fade-in');
19+
// }
20+
// });
21+
// }, observerOptions);
22+
23+
// Observe mission section paragraphs
24+
// const missionParagraphs = document.querySelectorAll('#mission p');
25+
// missionParagraphs.forEach((p, index) => {
26+
// p.style.animationDelay = `${index * 0.2}s`;
27+
// observer.observe(p);
28+
// });
29+
30+
// Add hover effect to navigation items
31+
// const navItems = document.querySelectorAll('.nav-item');
32+
/*
33+
navItems.forEach(item => {
34+
item.addEventListener('mouseenter', () => {
35+
item.style.transform = 'translateY(-2px)';
36+
});
37+
item.addEventListener('mouseleave', () => {
38+
item.style.transform = 'translateY(0)';
39+
});
40+
});
41+
*/
42+
43+
// Add click ripple effect to buttons
44+
// const buttons = document.querySelectorAll('button, .github-btn');
45+
// buttons.forEach(button => {
46+
// button.addEventListener('click', function(e) {
47+
// const ripple = document.createElement('span');
48+
// const rect = this.getBoundingClientRect();
49+
// const size = Math.max(rect.width, rect.height);
50+
// const x = e.clientX - rect.left - size / 2;
51+
// const y = e.clientY - rect.top - size / 2;
52+
53+
// ripple.style.cssText = `
54+
// position: absolute;
55+
// width: ${size}px;
56+
// height: ${size}px;
57+
// left: ${x}px;
58+
// top: ${y}px;
59+
// background: rgba(16, 185, 129, 0.3);
60+
// border-radius: 50%;
61+
// transform: scale(0);
62+
// animation: ripple 0.6s ease-out;
63+
// pointer-events: none;
64+
// `;
65+
66+
// this.style.position = 'relative';
67+
// this.style.overflow = 'hidden';
68+
// this.appendChild(ripple);
69+
70+
// setTimeout(() => {
71+
// ripple.remove();
72+
// }, 600);
73+
// });
74+
// });
75+
76+
// Intercept nav clicks
77+
document.querySelectorAll('a.nav-item').forEach(link => {
78+
link.addEventListener('click', async (e) => {
79+
e.preventDefault();
80+
81+
const target = link.getAttribute('href');
82+
83+
if (target === '#Home') {
84+
// Reload homepage hero (you could refactor into home.html too)
85+
window.location.href = "index.html";
86+
}
87+
else if (target === '#Mission') {
88+
const res = await fetch('pages/mission.html');
89+
const html = await res.text();
90+
document.querySelector('#content').innerHTML = html;
91+
window.history.pushState({ page: 'mission' }, "Mission", "#mission");
92+
}
93+
else if (target === '#Projects') {
94+
const res = await fetch('pages/projects.html');
95+
const html = await res.text();
96+
document.querySelector('#content').innerHTML = html;
97+
window.history.pushState({ page: 'projects' }, "Projects", "#project");
98+
}
99+
else if (target === '#Blogs') {
100+
const res = await fetch('pages/blogs.html');
101+
const html = await res.text();
102+
document.querySelector('#content').innerHTML = html;
103+
window.history.pushState({ page: 'blogs' }, "Blogs", "#blog");
104+
}
105+
});
106+
});
107+
});
108+
109+
// Add ripple animation
110+
// const style = document.createElement('style');
111+
// style.textContent = `
112+
// @keyframes ripple {
113+
// to {
114+
// transform: scale(2);
115+
// opacity: 0;
116+
// }
117+
// }
118+
// `;
119+
// document.head.appendChild(style);

pages/blogs.html

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1 @@
1+
<h2>Blogs Page</h2>

pages/mission.html

Lines changed: 34 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,34 @@
1+
<section id="mission" class="container mx-auto px-6 py-16">
2+
<div class="mission-section rounded-lg p-8 max-w-4xl mx-auto">
3+
<h2 class="text-3xl font-bold text-green-500 mb-8 flex items-center">
4+
<span class="text-gray-400 mr-2"></span>
5+
Our Mission
6+
</h2>
7+
8+
<div class="space-y-6 text-gray-300 leading-relaxed">
9+
<p class="text-lg">
10+
at cachevector, we're building the future one function at a time.
11+
</p>
12+
13+
<p>
14+
not with buzzwords or bondwagons, but with actual math, machine learning, and code that ships. we're obsessed with pushing the boundaries of what's possible - whether that's crafting new ai libraries, exploring math research that most people scroll past, or building tools that make devs go "finally."
15+
</p>
16+
17+
<p>
18+
we believe real innovation doesn't come from million-dollar marketing decks. it comes from open-source repos, sleepless nights, and a refusal to settle for "good enough." cachevector is where deep learning meets deep thinking - and then gets turned into something useful, fast.
19+
</p>
20+
21+
<p>
22+
we don't just tinker. we publish, package, and push to prod. from lightweight utils to heavy-duty research, if it's solving a real problem, we're in. and if it helps devs, researchers, or the next generation of builders do more with less friction - that's exactly our kind of project.
23+
</p>
24+
25+
<p class="text-green-400 font-semibold">
26+
follow the work. star the ideas. we're not trying to be loud - we're trying to be useful.
27+
</p>
28+
29+
<p class="text-green-500 font-mono">
30+
cachevector: where math meets momentum.
31+
</p>
32+
</div>
33+
</div>
34+
</section>

pages/projects.html

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1 @@
1+
<h2>Projects Page</h2>

0 commit comments

Comments
 (0)