Skip to content

Fixed Responsiveness of nav #94

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Merged
Pranav00076 merged 2 commits into from
Jul 29, 2026
Merged

Fixed Responsiveness of nav #94

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
2 commits
Select commit Hold shift + click to select a range
22d5de9
Fixed Responsiveness of nav
Pranav00076 Jul 29, 2026
d7f9ba7
Merge branch 'main' into feat/ui-glassmorphism
Pranav00076 Jul 29, 2026
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
44 changes: 39 additions & 5 deletions .gitignore
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,10 +1,44 @@
docs/
# Dependencies
node_modules/
.pnpm-store/

# Build and distribution output
dist/
dist-ssr/

# Environment files and secrets
.env
.env.*
!.env.example
*.env
env.json
public/env-public.json

.vercel
node_modules/
dist/
# IDEs, Editors & OS files
.DS_Store
public/env-public.json
.DS_Store?
._*
.Spotlight-V100
.Trashes
ehthumbs.db
Thumbs.db
.vscode/*
!.vscode/settings.json
!.vscode/tasks.json
!.vscode/launch.json
!.vscode/extensions.json
*.suo
*.ntvs*
*.njsproj
*.sln
*.sw?

# Deployment & Vercel
.vercel/

# Logs & Temporary files
*.log
npm-debug.log*
yarn-debug.log*
yarn-error.log*
pnpm-debug.log*
8 changes: 4 additions & 4 deletions achievements.html
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -52,10 +52,10 @@
}</script><script async src="https://pagead2.googlesyndication.com/pagead/js/adsbygoogle.js?client=ca-pub-8663425706426895" crossorigin="anonymous"></script></head><body class="bg-background text-on-surface antialiased flex flex-col min-h-screen relative grid-bg overflow-x-hidden">

<nav class="bg-[#050505]/80 backdrop-blur-md dark:bg-[#050505]/80 docked full-width top-0 border-b border-surface-variant/30 z-50 fixed w-full transition-all">
<div class="flex justify-between items-center w-full px-4 sm:px-gutter h-16 max-w-container-max mx-auto">
<div class="flex items-center gap-2 h-full">
<img src="./public/LogoOmnikon.jpeg" alt="Omnikon Logo" class="h-9 w-9 sm:h-10 sm:w-10 mr-1.5 object-cover rounded-md">
<span class="text-headline-md font-headline-md font-bold text-on-surface dark:text-on-surface text-lg sm:text-xl">Omnikon</span>
<div class="flex justify-between items-center w-full px-3 sm:px-gutter h-16 max-w-container-max mx-auto overflow-hidden">
<div class="flex items-center gap-1.5 sm:gap-2 h-full shrink-0">
<img src="./public/LogoOmnikon.jpeg" alt="Omnikon Logo" class="h-8 w-8 sm:h-10 sm:w-10 mr-1 sm:mr-1.5 object-cover rounded-md">
<span class="text-headline-md font-headline-md font-bold text-on-surface dark:text-on-surface text-base sm:text-xl">Omnikon</span>
</div>
<div id="desktop-nav" class="hidden md:flex items-center gap-8"><a class="text-on-surface-variant hover:text-on-surface font-label-mono text-label-mono text-xs" href="index.html">Home</a>
<a class="text-on-surface-variant hover:text-on-surface font-label-mono text-label-mono text-xs" href="javascript:void(0)" onclick="window.openHackathonWindow();">🏆 Hackathon</a>
Expand Down
34 changes: 25 additions & 9 deletions assets/common-styles.css
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,5 +1,16 @@
/* Common Styles Extracted from Inline HTML Blocks */

*, *::before, *::after {
box-sizing: border-box;
}

html, body {
width: 100%;
max-width: 100vw;
overflow-x: hidden;
position: relative;
}

html {
scroll-behavior: smooth;
}
Expand Down Expand Up @@ -293,19 +304,24 @@ body.grid-bg {

@media (max-width: 640px) {
#chatbot-toggle {
bottom: calc(24px + env(safe-area-inset-bottom, 0px)) !important;
bottom: calc(20px + env(safe-area-inset-bottom, 0px)) !important;
right: 16px !important;
z-index: 9999 !important;
width: 48px !important;
height: 48px !important;
display: flex !important;
align-items: center !important;
justify-content: center !important;
}
#chatbot-modal {
right: 12px;
left: 12px;
bottom: calc(85px + env(safe-area-inset-bottom, 0px));
width: auto;
max-width: none;
height: 75vh;
max-height: 500px;
z-index: 10000;
right: 12px !important;
left: 12px !important;
bottom: calc(76px + env(safe-area-inset-bottom, 0px)) !important;
width: auto !important;
max-width: calc(100vw - 24px) !important;
height: 70vh !important;
max-height: 500px !important;
z-index: 10000 !important;
}
}

6 changes: 4 additions & 2 deletions assets/hero-animation.css
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -40,14 +40,16 @@
#omnikon-hero-text {
font-family: 'Inter', system-ui, sans-serif;
font-weight: 900;
font-size: clamp(3rem, 12vw, 10rem);
font-size: clamp(1.8rem, 8.5vw, 10rem);
letter-spacing: -0.04em;
text-transform: uppercase;
display: flex;
gap: 4px;
gap: 2px;
z-index: 3;
position: relative;
transform: scaleY(1.1); /* Compressed, bold look */
max-width: 100%;
overflow: hidden;
}

.omnikon-letter {
Expand Down
12 changes: 6 additions & 6 deletions auth.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -151,7 +151,7 @@
if (!authWidget) {
authWidget = document.createElement('div');
authWidget.id = 'auth-widget';
authWidget.className = 'flex items-center gap-4 mr-4';
authWidget.className = 'flex items-center gap-1.5 sm:gap-4 mr-1.5 sm:mr-4 shrink-0';
mobileToggle.parentNode.insertBefore(authWidget, mobileToggle);
}

Expand Down Expand Up @@ -193,9 +193,9 @@

const avatarUrl = user.photoURL || './public/LogoOmnikon.jpeg';
authWidget.innerHTML = `
<div class="flex items-center gap-3">
<img class="w-8 h-8 rounded-full border border-primary object-cover" src="${avatarUrl}" alt="Profile">
<button id="auth-logout-btn" class="text-on-surface-variant hover:text-primary transition-colors text-[10px] sm:text-xs font-label-mono tracking-wider cursor-pointer">
<div class="flex items-center gap-1.5 sm:gap-3">
<img class="w-7 h-7 sm:w-8 sm:h-8 rounded-full border border-primary object-cover shrink-0" src="${avatarUrl}" alt="Profile">
<button id="auth-logout-btn" class="text-on-surface-variant hover:text-primary transition-colors text-[9px] sm:text-xs font-label-mono tracking-wider cursor-pointer whitespace-nowrap">
[ LOGOUT ]
</button>
</div>
Expand All @@ -211,8 +211,8 @@
}

authWidget.innerHTML = `
<button id="auth-login-trigger" class="flex items-center gap-2 px-3 py-1.5 border border-primary hover:bg-primary/10 transition-all font-label-mono text-[10px] sm:text-xs text-primary tracking-widest cursor-pointer">
<span class="material-symbols-outlined text-[14px]">login</span>
<button id="auth-login-trigger" class="flex items-center gap-1 sm:gap-2 px-2 sm:px-3 py-1 sm:py-1.5 border border-primary hover:bg-primary/10 transition-all font-label-mono text-[9px] sm:text-xs text-primary tracking-widest cursor-pointer whitespace-nowrap">
<span class="material-symbols-outlined text-[13px] sm:text-[14px]">login</span>
LOGIN
</button>
`;
Expand Down
8 changes: 4 additions & 4 deletions dist/404err.html
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -66,9 +66,9 @@
"item": "https://omnikonhub.com/404err.html"
}
]
}</script> <script type="module" crossorigin src="/assets/err404-D0Gt_GMe.js"></script>
<link rel="modulepreload" crossorigin href="/assets/particles-BuAcJJ_a.js">
<link rel="stylesheet" crossorigin href="/assets/particles-DMmTAcEu.css">
}</script><script async src="https://pagead2.googlesyndication.com/pagead/js/adsbygoogle.js?client=ca-pub-8663425706426895" crossorigin="anonymous"></script> <script type="module" crossorigin src="/assets/err404-B_NkW460.js"></script>
<link rel="modulepreload" crossorigin href="/assets/particles-CBDe3tZi.js">
<link rel="stylesheet" crossorigin href="/assets/particles-BSNTVfzG.css">
</head><body class="bg-background text-on-background min-h-screen flex items-center justify-center relative overflow-hidden crt-flicker grid-bg">


Expand All @@ -95,7 +95,7 @@
<div class="p-8 md:p-12 flex flex-col items-start w-full">

<div class="relative inline-block mb-8 w-full border-l-2 border-primary pl-4">
<h1 class="font-display-lg text-display-lg text-primary tracking-tighter uppercase m-0 leading-none" data-text="ERROR 404">
<h1 class="font-display-lg text-3xl sm:text-4xl lg:text-display-lg text-primary tracking-tighter uppercase m-0 leading-none" data-text="ERROR 404">
ERR_404
</h1>
<p class="font-code-sm text-code-sm text-on-surface-variant mt-2 uppercase tracking-widest">
Expand Down
52 changes: 26 additions & 26 deletions dist/blogs.html
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -84,9 +84,9 @@
"@type": "Blog",
"name": "Developer Blog | Omnikon"
}
]</script> <script type="module" crossorigin src="/assets/blogs-D0Gt_GMe.js"></script>
<link rel="modulepreload" crossorigin href="/assets/particles-BuAcJJ_a.js">
<link rel="stylesheet" crossorigin href="/assets/particles-DMmTAcEu.css">
]</script><script async src="https://pagead2.googlesyndication.com/pagead/js/adsbygoogle.js?client=ca-pub-8663425706426895" crossorigin="anonymous"></script> <script type="module" crossorigin src="/assets/blogs-B_NkW460.js"></script>
<link rel="modulepreload" crossorigin href="/assets/particles-CBDe3tZi.js">
<link rel="stylesheet" crossorigin href="/assets/particles-BSNTVfzG.css">
</head><body class="text-on-surface antialiased min-h-screen flex flex-col selection:bg-primary selection:text-background grid-bg">


Expand Down Expand Up @@ -132,7 +132,7 @@
<div class="h-2 w-2 rounded-full bg-primary animate-pulse-glow"></div>
<span class="text-primary font-code-sm text-code-sm uppercase tracking-widest opacity-80">SYS.BLOG.INIT</span>
</div>
<h1 class="text-display-lg font-display-lg text-on-surface font-bold terminal-cursor">Blogs &amp; Articles</h1>
<h1 class="text-3xl sm:text-4xl lg:text-display-lg font-display-lg text-on-surface font-bold terminal-cursor">Blogs &amp; Articles</h1>
<p class="font-body-base text-body-base text-on-surface-variant max-w-2xl">
Insights, tutorials, project updates, and developer stories from the Omnikon community.
</p>
Expand Down Expand Up @@ -315,37 +315,37 @@ <h3 class="text-headline-md font-bold text-on-surface mb-2">No Articles Listed</
</div>


<footer class="bg-background dark:bg-background border-t border-surface-variant relative z-10 py-12 mt-auto">
<div class="max-w-container-max mx-auto px-gutter grid grid-cols-1 md:grid-cols-4 gap-8">
<footer class="bg-background dark:bg-background border-t border-surface-variant relative z-10 py-6 sm:py-8 md:py-12 mt-auto">
<div class="max-w-container-max mx-auto px-4 sm:px-gutter grid grid-cols-2 md:grid-cols-4 gap-6 sm:gap-8">
<div>
<h3 class="text-xl font-bold mb-4">Omnikon</h3>
<p class="text-on-surface-variant">Open Source Community for Developers.</p>
<h3 class="text-lg sm:text-xl font-bold mb-2 sm:mb-4">Omnikon</h3>
<p class="text-on-surface-variant text-xs sm:text-sm">Open Source Community for Developers.</p>
</div>
<div>
<h3 class="font-bold mb-4">Pages</h3>
<ul class="space-y-2">
<li><a href="index.html">Home</a></li>
<li><a href="javascript:void(0)" onclick="window.openHackathonWindow()">Hackathon</a></li>
<li><a href="projects.html">Projects</a></li>
<li><a href="blogs.html">Blog</a></li>
<h3 class="font-bold text-sm sm:text-base mb-2 sm:mb-4">Pages</h3>
<ul class="space-y-1.5 sm:space-y-2 text-xs sm:text-sm">
<li><a href="index.html" class="hover:text-primary transition-colors">Home</a></li>
<li><a href="javascript:void(0)" onclick="window.openHackathonWindow()" class="hover:text-primary transition-colors">Hackathon</a></li>
<li><a href="projects.html" class="hover:text-primary transition-colors">Projects</a></li>
<li><a href="blogs.html" class="hover:text-primary transition-colors">Blog</a></li>
</ul>
</div>
<div>
<h3 class="font-bold mb-4">Community</h3>
<ul class="space-y-2">
<li><a href="members.html">Members</a></li>
<li><a href="achievements.html">Community</a></li>
<li><a href="docs.html">Docs</a></li>
<li><a href="about.html">About</a></li>
<li><a href="contact.html">Contact</a></li>
<h3 class="font-bold text-sm sm:text-base mb-2 sm:mb-4">Community</h3>
<ul class="space-y-1.5 sm:space-y-2 text-xs sm:text-sm">
<li><a href="members.html" class="hover:text-primary transition-colors">Members</a></li>
<li><a href="achievements.html" class="hover:text-primary transition-colors">Community</a></li>
<li><a href="docs.html" class="hover:text-primary transition-colors">Docs</a></li>
<li><a href="about.html" class="hover:text-primary transition-colors">About</a></li>
<li><a href="contact.html" class="hover:text-primary transition-colors">Contact</a></li>
</ul>
</div>
<div>
<h3 class="font-bold mb-4">Socials</h3>
<ul class="space-y-2">
<li><a href="https://github.com/Omnikon-Org" target="_blank">GitHub</a></li>
<li><a href="https://discord.gg/yWtjK2Tb8T" target="_blank">Discord</a></li>
<li><a href="#" target="_blank">LinkedIn</a></li>
<h3 class="font-bold text-sm sm:text-base mb-2 sm:mb-4">Socials</h3>
<ul class="space-y-1.5 sm:space-y-2 text-xs sm:text-sm">
<li><a href="https://github.com/Omnikon-Org" target="_blank" class="hover:text-primary transition-colors">GitHub</a></li>
<li><a href="https://discord.gg/yWtjK2Tb8T" target="_blank" class="hover:text-primary transition-colors">Discord</a></li>
<li><a href="#" target="_blank" class="hover:text-primary transition-colors">LinkedIn</a></li>
</ul>
</div>
</div>
Expand Down
52 changes: 26 additions & 26 deletions dist/codeOfConduct.html
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -68,9 +68,9 @@
"item": "https://omnikonhub.com/codeOfConduct.html"
}
]
}</script> <script type="module" crossorigin src="/assets/codeOfConduct-D0Gt_GMe.js"></script>
<link rel="modulepreload" crossorigin href="/assets/particles-BuAcJJ_a.js">
<link rel="stylesheet" crossorigin href="/assets/particles-DMmTAcEu.css">
}</script><script async src="https://pagead2.googlesyndication.com/pagead/js/adsbygoogle.js?client=ca-pub-8663425706426895" crossorigin="anonymous"></script> <script type="module" crossorigin src="/assets/codeOfConduct-B_NkW460.js"></script>
<link rel="modulepreload" crossorigin href="/assets/particles-CBDe3tZi.js">
<link rel="stylesheet" crossorigin href="/assets/particles-BSNTVfzG.css">
</head><body class="text-on-surface antialiased min-h-screen flex flex-col selection:bg-primary selection:text-background grid-bg">


Expand Down Expand Up @@ -115,7 +115,7 @@
<div class="h-2 w-2 rounded-full bg-primary animate-pulse-glow"></div>
<span class="text-primary font-code-sm text-code-sm uppercase tracking-widest opacity-80">SYS.DOC.INIT</span>
</div>
<h1 class="text-display-lg font-display-lg text-on-surface font-bold mb-4 terminal-cursor">Code of Conduct</h1>
<h1 class="text-3xl sm:text-4xl lg:text-display-lg font-display-lg text-on-surface font-bold mb-4 terminal-cursor">Code of Conduct</h1>
<div class="flex flex-wrap gap-4 mt-6">
<span class="inline-flex items-center gap-1.5 px-2.5 py-1 bg-surface-container border border-surface-variant text-on-surface-variant font-code-sm text-code-sm">
<span class="material-symbols-outlined text-[14px]" data-icon="update">update</span>
Expand Down Expand Up @@ -222,37 +222,37 @@ <h2 class="text-headline-md font-headline-md font-bold text-on-surface mb-6 flex
</article>
</main>

<footer class="bg-background dark:bg-background border-t border-surface-variant relative z-10 py-12 mt-auto">
<div class="max-w-container-max mx-auto px-gutter grid grid-cols-1 md:grid-cols-4 gap-8">
<footer class="bg-background dark:bg-background border-t border-surface-variant relative z-10 py-6 sm:py-8 md:py-12 mt-auto">
<div class="max-w-container-max mx-auto px-4 sm:px-gutter grid grid-cols-2 md:grid-cols-4 gap-6 sm:gap-8">
<div>
<h3 class="text-xl font-bold mb-4">Omnikon</h3>
<p class="text-on-surface-variant">Open Source Community for Developers.</p>
<h3 class="text-lg sm:text-xl font-bold mb-2 sm:mb-4">Omnikon</h3>
<p class="text-on-surface-variant text-xs sm:text-sm">Open Source Community for Developers.</p>
</div>
<div>
<h3 class="font-bold mb-4">Pages</h3>
<ul class="space-y-2">
<li><a href="index.html">Home</a></li>
<li><a href="javascript:void(0)" onclick="window.openHackathonWindow()">Hackathon</a></li>
<li><a href="projects.html">Projects</a></li>
<li><a href="blogs.html">Blog</a></li>
<h3 class="font-bold text-sm sm:text-base mb-2 sm:mb-4">Pages</h3>
<ul class="space-y-1.5 sm:space-y-2 text-xs sm:text-sm">
<li><a href="index.html" class="hover:text-primary transition-colors">Home</a></li>
<li><a href="javascript:void(0)" onclick="window.openHackathonWindow()" class="hover:text-primary transition-colors">Hackathon</a></li>
<li><a href="projects.html" class="hover:text-primary transition-colors">Projects</a></li>
<li><a href="blogs.html" class="hover:text-primary transition-colors">Blog</a></li>
</ul>
</div>
<div>
<h3 class="font-bold mb-4">Community</h3>
<ul class="space-y-2">
<li><a href="members.html">Members</a></li>
<li><a href="achievements.html">Community</a></li>
<li><a href="docs.html">Docs</a></li>
<li><a href="about.html">About</a></li>
<li><a href="contact.html">Contact</a></li>
<h3 class="font-bold text-sm sm:text-base mb-2 sm:mb-4">Community</h3>
<ul class="space-y-1.5 sm:space-y-2 text-xs sm:text-sm">
<li><a href="members.html" class="hover:text-primary transition-colors">Members</a></li>
<li><a href="achievements.html" class="hover:text-primary transition-colors">Community</a></li>
<li><a href="docs.html" class="hover:text-primary transition-colors">Docs</a></li>
<li><a href="about.html" class="hover:text-primary transition-colors">About</a></li>
<li><a href="contact.html" class="hover:text-primary transition-colors">Contact</a></li>
</ul>
</div>
<div>
<h3 class="font-bold mb-4">Socials</h3>
<ul class="space-y-2">
<li><a href="https://github.com/Omnikon-Org" target="_blank">GitHub</a></li>
<li><a href="https://discord.gg/yWtjK2Tb8T" target="_blank">Discord</a></li>
<li><a href="#" target="_blank">LinkedIn</a></li>
<h3 class="font-bold text-sm sm:text-base mb-2 sm:mb-4">Socials</h3>
<ul class="space-y-1.5 sm:space-y-2 text-xs sm:text-sm">
<li><a href="https://github.com/Omnikon-Org" target="_blank" class="hover:text-primary transition-colors">GitHub</a></li>
<li><a href="https://discord.gg/yWtjK2Tb8T" target="_blank" class="hover:text-primary transition-colors">Discord</a></li>
<li><a href="#" target="_blank" class="hover:text-primary transition-colors">LinkedIn</a></li>
</ul>
</div>
</div>
Expand Down
Loading
Loading