From 947ff37a8e2c954c2942d41665d0912f83ed1c03 Mon Sep 17 00:00:00 2001 From: maskedsyntax Date: Mon, 25 Aug 2025 23:47:48 +0530 Subject: [PATCH 1/2] chore: ignore backup (.bak) files --- .gitignore | 3 +++ 1 file changed, 3 insertions(+) diff --git a/.gitignore b/.gitignore index c6bba59..183df97 100644 --- a/.gitignore +++ b/.gitignore @@ -128,3 +128,6 @@ dist .yarn/build-state.yml .yarn/install-state.gz .pnp.* + +# backup files +*.bak From 910aa288565fa07b1f924ea8eaccfea6de5db262 Mon Sep 17 00:00:00 2001 From: maskedsyntax Date: Mon, 25 Aug 2025 23:48:54 +0530 Subject: [PATCH 2/2] feat(ui): add routing and responsiveness --- css/styles.css | 133 +++++++++++++++++++- index.html | 313 ++++++++++++++++++++++++++++++++++-------------- js/main.js | 154 +++++++++++++++++------- pages/home.html | 45 +++++++ 4 files changed, 506 insertions(+), 139 deletions(-) create mode 100644 pages/home.html diff --git a/css/styles.css b/css/styles.css index c6c1b4a..5718742 100644 --- a/css/styles.css +++ b/css/styles.css @@ -1,4 +1,4 @@ -@import url('https://fonts.googleapis.com/css2?family=Space+Mono:ital,wght@0,400;0,700;1,400;1,700&display=swap'); +/* @import url('https://fonts.googleapis.com/css2?family=Space+Mono:ital,wght@0,400;0,700;1,400;1,700&display=swap'); .space-mono-regular { font-family: "Space Mono", monospace; @@ -49,7 +49,6 @@ body { .github-btn { background: linear-gradient(135deg, #689d6a, #427b58); - /* border: 1px solid #427b58; */ transition: all 0.3s ease; } @@ -104,4 +103,134 @@ body { .social-icon:hover { color: #10b981; transform: translateY(-2px); +} */ + +@import url('https://fonts.googleapis.com/css2?family=Space+Mono:ital,wght@0,400;0,700;1,400;1,700&display=swap'); + +.space-mono-regular { + font-family: "Space Mono", monospace; + font-weight: 400; + font-style: normal; +} + +.space-mono-bold { + font-family: "Space Mono", monospace; + font-weight: 700; + font-style: normal; +} + +.space-mono-regular-italic { + font-family: "Space Mono", monospace; + font-weight: 400; + font-style: italic; +} + +.space-mono-bold-italic { + font-family: "Space Mono", monospace; + font-weight: 700; + font-style: italic; +} + +body { + font-family: 'Space Mono', monospace; + background: #0a0a0a; /* Note: This overrides the Tailwind body bg; consider removing if conflicting */ +} + +.leaf-icon { + width: 24px; + height: 24px; + background: linear-gradient(135deg, #10b981, #059669); + clip-path: polygon(50% 0%, 100% 38%, 82% 100%, 18% 100%, 0% 38%); +} + +.nav-item { + position: relative; + transition: all 0.3s ease; +} + +.nav-item:hover { + text-decoration: underline; + text-decoration-thickness: 1px; +} + +.github-btn { + background: linear-gradient(135deg, #689d6a, #427b58); + transition: all 0.3s ease; +} + +.mission-btn { + border: 1px solid #374151; + transition: all 0.3s ease; + backdrop-filter: blur(10px); +} + +.mission-btn:hover { + border-color: #10b981; + background: rgba(16, 185, 129, 0.1); +} + +.hero-text { + background: linear-gradient(135deg, #ffffff, #d1d5db); + -webkit-background-clip: text; + -webkit-text-fill-color: transparent; + background-clip: text; +} + +.mission-section { + background: rgba(17, 24, 39, 0.5); + backdrop-filter: blur(10px); + border: 1px solid #374151; +} + +@keyframes typing { + from { width: 0 } + to { width: 100% } +} + +@keyframes blink-caret { + from, to { border-color: transparent } + 50% { border-color: #10b981; } +} + +.fade-in { + animation: fadeIn 1s ease-in; +} + +@keyframes fadeIn { + from { opacity: 0; transform: translateY(20px); } + to { opacity: 1; transform: translateY(0); } +} + +.social-icon { + transition: all 0.3s ease; +} + +.social-icon:hover { + color: #10b981; + transform: translateY(-2px); +} + +/* Custom Media Queries for Mobile Menu (beyond Tailwind) */ +@media (max-width: 639px) { + #nav-links { + transition: all 0.3s ease-in-out; + } +} + +/* Custom Media Queries for Mobile Menu */ +@media (max-width: 639px) { + #nav-links { + transition: opacity 0.3s ease-in-out, transform 0.3s ease-in-out; + opacity: 0; + transform: translateY(-10px); + } + #nav-links:not(.hidden) { + opacity: 1; + transform: translateY(0); + } +} + +/* Ensure nav height is accounted for in positioning */ +nav { + min-height: 64px; /* Matches approximate nav height with padding */ } \ No newline at end of file diff --git a/index.html b/index.html index 148bb65..3f54bfa 100644 --- a/index.html +++ b/index.html @@ -1,112 +1,243 @@ - + - - - - CacheVector - Advancing ML Libraries - - - - - + + + + CacheVector - Advancing ML Libraries + + + + + - - - - - - + + + + + - - - - - -
- +
- -
- -
+ +
+
+
-

+

CacheVector

- -

- Advancing machine learning libraries, mathematical research, - and developer tools through open-source innovation + +

+ Advancing machine learning libraries, mathematical + research, and developer tools through open-source + innovation

- -
- - - + +
+ + + github.com/cachevector - - + + -
- -
+
- -
-
- - -
-
- CacheVector Logo -
-
-

© 2025 CacheVector

-

All rights reserved

+ +
+ +
+ +
+
+ CacheVector Logo + +
+
+

© 2025 CacheVector

+

All rights reserved

+
-
- - -
-
- - - + + +
+
+ + + +
+
Backed by Growvth
-
Backed by Growvth
-
-
- - \ No newline at end of file +
+ + diff --git a/js/main.js b/js/main.js index 97df927..027e7b8 100644 --- a/js/main.js +++ b/js/main.js @@ -1,48 +1,110 @@ -// Add some interactive animations -document.addEventListener('DOMContentLoaded', function() { - - // Intercept nav clicks - const navLinks = document.querySelectorAll('a.nav-item'); - - function setActiveNav(target) { - navLinks.forEach(link => { - if (link.getAttribute('href') === target) { - link.classList.add('active'); - } else { - link.classList.remove('active'); - } - }); - } - - navLinks.forEach(link => { - link.addEventListener('click', async (e) => { - e.preventDefault(); - const target = link.getAttribute('href'); - - if (target === '#Home') { - window.location.href = "index.html"; - } - else if (target === '#Mission') { - const res = await fetch('pages/mission.html'); - const html = await res.text(); - document.querySelector('#content').innerHTML = html; - window.history.pushState({ page: 'mission' }, "Mission", "#Mission"); - } - else if (target === '#Projects') { - const res = await fetch('pages/projects.html'); - const html = await res.text(); - document.querySelector('#content').innerHTML = html; - window.history.pushState({ page: 'projects' }, "Projects", "#Projects"); - } - else if (target === '#Blogs') { - const res = await fetch('pages/blogs.html'); - const html = await res.text(); - document.querySelector('#content').innerHTML = html; - window.history.pushState({ page: 'blogs' }, "Blogs", "#Blogs"); - } - - setActiveNav(target); // highlight correct nav link - }); +// Add interactive animations and hamburger menu toggle +document.addEventListener("DOMContentLoaded", function () { + // Intercept nav clicks + const navLinks = document.querySelectorAll("a.nav-item"); + const menuToggle = document.getElementById("menu-toggle"); + const navLinksContainer = document.getElementById("nav-links"); + + // Mobile menu toggle + if (menuToggle && navLinksContainer) { + menuToggle.addEventListener("click", () => { + // Toggle visibility with a single class + navLinksContainer.classList.toggle("hidden"); + // Ensure flex and vertical stacking are applied when visible + if (!navLinksContainer.classList.contains("hidden")) { + navLinksContainer.classList.add( + "flex", + "flex-col", + "space-y-4", + "absolute", + "left-0", + "bg-[#f9f5d7]", + "dark:bg-[#1d2021]", + "w-full", + "p-4", + ); + // Remove 'top-full' as it's now handled by HTML class 'top-16' + } else { + // Remove styling classes when hidden to reset state + navLinksContainer.classList.remove( + "flex", + "flex-col", + "space-y-4", + "absolute", + "left-0", + "bg-[#f9f5d7]", + "dark:bg-[#1d2021]", + "w-full", + "p-4", + ); + } + }); + } else { + console.error("Menu toggle or nav links container not found in DOM"); + } + + function setActiveNav(target) { + navLinks.forEach((link) => { + if (link.getAttribute("href") === target) { + link.classList.add("active"); + } else { + link.classList.remove("active"); + } + }); + } + + navLinks.forEach((link) => { + link.addEventListener("click", async (e) => { + e.preventDefault(); + const target = link.getAttribute("href"); + + let defaultContent = document.querySelector("#content").innerHTML; + let contentHTML; + if (target === "/") { + // contentHTML = defaultContent; + const res = await fetch("pages/home.html"); + contentHTML = await res.text(); + window.history.pushState({ page: "home" }, "Home", "/"); + } else if (target === "/Mission") { + const res = await fetch("pages/mission.html"); + contentHTML = await res.text(); + window.history.pushState({ page: "mission" }, "Mission", "/mission"); + } else if (target === "/Projects") { + const res = await fetch("pages/projects.html"); + contentHTML = await res.text(); + window.history.pushState({ page: "projects" }, "Projects", "/projects"); + } else if (target === "/Blogs") { + const res = await fetch("pages/blogs.html"); + contentHTML = await res.text(); + window.history.pushState({ page: "blogs" }, "Blogs", "/blogs"); + } + + if (contentHTML) { + document.querySelector("#content").innerHTML = contentHTML; + } + + setActiveNav(target); // Highlight correct nav link + + // Close mobile menu after link click + if ( + navLinksContainer && + !navLinksContainer.classList.contains("hidden") + ) { + navLinksContainer.classList.add("hidden"); + navLinksContainer.classList.remove( + "flex", + "flex-col", + "space-y-4", + "absolute", + "left-0", + "bg-[#f9f5d7]", + "dark:bg-[#1d2021]", + "w-full", + "p-4", + ); + } }); + }); +}); -}); \ No newline at end of file +// ------------------------------------------------------------------------------ diff --git a/pages/home.html b/pages/home.html new file mode 100644 index 0000000..3bd9eb7 --- /dev/null +++ b/pages/home.html @@ -0,0 +1,45 @@ + +
+

+ CacheVector +

+ +

+ Advancing machine learning libraries, mathematical research, and + developer tools through open-source innovation +

+ +
+ + + + + github.com/cachevector + + + + +
+