Skip to content

Commit 31de9ff

Browse files
fezcodefezcode
committed
NEW VERSION: 0.8.2
1 parent 7c3919a commit 31de9ff

File tree

7 files changed

+586
-193
lines changed

7 files changed

+586
-193
lines changed

‎package.json‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
11
{
22
"name": "fezcodex",
3-
"version": "0.8.0",
3+
"version": "0.8.2",
44
"private": true,
55
"homepage": "https://fezcode.com",
66
"dependencies": {

‎src/components/Footer.js‎

Lines changed: 122 additions & 180 deletions
Original file line numberDiff line numberDiff line change
@@ -5,207 +5,149 @@ import {
55
TwitterLogo,
66
GithubLogo,
77
LinkedinLogo,
8-
PaperPlaneRight,
98
Command,
9+
Terminal,
1010
} from '@phosphor-icons/react';
11-
import Fez from './Fez';
1211

1312
const Footer = () => {
13+
const scrollToTop = () => window.scrollTo({ top: 0, behavior: 'smooth' });
14+
1415
return (
15-
<footer className="mt-auto bg-gray-950 border-t border-gray-800/50 relative overflow-hidden">
16-
{/* Subtle Glow */}
17-
<div className="absolute bottom-0 left-1/4 w-96 h-96 bg-primary-500/5 rounded-full blur-[128px] pointer-events-none"></div>
16+
<footer className="bg-[#050505] border-t-2 border-white mt-auto selection:bg-white selection:text-black">
17+
<div className="mx-auto max-w-[1600px] px-6 py-12 md:px-12">
18+
<div className="grid grid-cols-1 lg:grid-cols-12 gap-12 md:gap-16">
1819

19-
<div className="mx-auto max-w-7xl px-6 lg:px-8 py-12 relative z-10">
20-
<div className="grid grid-cols-1 md:grid-cols-3 gap-12 lg:gap-16">
21-
{/* Column 1: Brand & Tech Info */}
22-
<div className="space-y-4">
23-
<Link
24-
to="/"
25-
className="flex items-center gap-2 group"
26-
onClick={() => window.scrollTo({ top: 0, behavior: 'smooth' })}
27-
>
28-
<Fez className="w-8 h-8 text-primary-500 transition-transform group-hover:rotate-12" />
29-
<span className="text-xl font-bold tracking-tight text-white font-arvo">
30-
fez<span className="text-primary-400">codex</span>
31-
</span>
32-
</Link>
33-
<p className="text-sm text-gray-400 leading-relaxed">
34-
A digital garden of code, thoughts, and interactive experiments.
35-
</p>
36-
<div className="pt-4 flex flex-col gap-2 text-xs text-gray-500 font-mono">
37-
<p className="flex items-center gap-2">
38-
<Command size={16} className="text-primary-500" />
39-
<span>
40-
Press{' '}
41-
<kbd className="px-1.5 py-0.5 bg-gray-800 rounded border border-gray-700 text-gray-300">
42-
Alt
43-
</kbd>{' '}
44-
+{' '}
45-
<kbd className="px-1.5 py-0.5 bg-gray-800 rounded border border-gray-700 text-gray-300">
46-
K
47-
</kbd>{' '}
48-
for commands
49-
</span>
50-
</p>
51-
<p>
52-
v{version} {'//'} {new Date().getFullYear()}
53-
</p>
20+
{/* Column 1: Brand & Info */}
21+
<div className="lg:col-span-5 space-y-8">
22+
<div className="flex flex-col gap-4">
23+
<Link to="/" onClick={scrollToTop} className="group inline-block">
24+
<span className="text-5xl md:text-6xl font-black uppercase tracking-tighter text-white">
25+
fez<span className="text-emerald-500">codex</span>
26+
</span>
27+
</Link>
28+
<p className="max-w-md text-gray-400 font-mono text-xs leading-relaxed uppercase tracking-widest">
29+
{'//'} A digital garden of experimental code, architectural thoughts, and creative explorations.
30+
</p>
31+
</div>
32+
33+
<div className="grid grid-cols-1 md:grid-cols-2 gap-6">
34+
<div className="border border-white/10 p-4 bg-white/[0.02]">
35+
<h4 className="font-mono text-[10px] font-bold text-gray-500 uppercase tracking-widest mb-3">Site Info</h4>
36+
<div className="space-y-1 font-mono text-[10px] uppercase tracking-widest">
37+
<div className="flex justify-between">
38+
<span className="text-gray-600">Version:</span>
39+
<span className="text-white">v{version}</span>
40+
</div>
41+
<div className="flex justify-between">
42+
<span className="text-gray-600">Year:</span>
43+
<span className="text-white">{new Date().getFullYear()}</span>
44+
</div>
45+
<div className="flex justify-between text-emerald-500 font-black">
46+
<span>Status:</span>
47+
<span>Live</span>
48+
</div>
49+
</div>
50+
</div>
51+
52+
<div className="border border-white/10 p-4 bg-white/[0.02] flex flex-col justify-center gap-3">
53+
<div className="flex items-center gap-2 text-white">
54+
<Command size={16} className="text-emerald-500" />
55+
<span className="font-mono text-[10px] font-bold uppercase tracking-widest">Quick Menu</span>
56+
</div>
57+
<div className="font-mono text-[10px] text-gray-500 uppercase leading-relaxed">
58+
Press <kbd className="bg-white text-black px-1 font-black">Alt</kbd> + <kbd className="bg-white text-black px-1 font-black">K</kbd> for commands.
59+
</div>
60+
</div>
5461
</div>
5562
</div>
5663

5764
{/* Column 2: Navigation */}
58-
<div>
59-
<h3 className="text-sm font-semibold text-white tracking-wider uppercase font-mono mb-4">
60-
Navigation
61-
</h3>
62-
<ul className="grid grid-cols-2 gap-3 text-sm text-gray-400">
63-
<li>
64-
<Link
65-
to="/"
66-
className="hover:text-primary-400 transition-colors"
67-
onClick={() =>
68-
window.scrollTo({ top: 0, behavior: 'smooth' })
69-
}
70-
>
71-
Home
72-
</Link>
73-
</li>
74-
<li>
75-
<Link
76-
to="/about"
77-
className="hover:text-primary-400 transition-colors"
78-
onClick={() =>
79-
window.scrollTo({ top: 0, behavior: 'smooth' })
80-
}
81-
>
82-
About
83-
</Link>
84-
</li>
85-
<li>
86-
<Link
87-
to="/blog"
88-
className="hover:text-primary-400 transition-colors"
89-
onClick={() =>
90-
window.scrollTo({ top: 0, behavior: 'smooth' })
91-
}
92-
>
93-
Blog
94-
</Link>
95-
</li>
96-
<li>
97-
<Link
98-
to="/projects"
99-
className="hover:text-primary-400 transition-colors"
100-
onClick={() =>
101-
window.scrollTo({ top: 0, behavior: 'smooth' })
102-
}
103-
>
104-
Projects
105-
</Link>
106-
</li>
107-
<li>
108-
<Link
109-
to="/logs"
110-
className="hover:text-primary-400 transition-colors"
111-
onClick={() =>
112-
window.scrollTo({ top: 0, behavior: 'smooth' })
113-
}
114-
>
115-
Logs
116-
</Link>
117-
</li>
118-
<li>
119-
<Link
120-
to="/apps"
121-
className="hover:text-primary-400 transition-colors"
122-
onClick={() =>
123-
window.scrollTo({ top: 0, behavior: 'smooth' })
124-
}
125-
>
126-
Apps
127-
</Link>
128-
</li>
129-
<li>
130-
<Link
131-
to="/timeline"
132-
className="hover:text-primary-400 transition-colors"
133-
onClick={() =>
134-
window.scrollTo({ top: 0, behavior: 'smooth' })
135-
}
136-
>
137-
Timeline
138-
</Link>
139-
</li>
140-
<li>
141-
<Link
142-
to="/rss.xml"
143-
target="_blank"
144-
className="hover:text-primary-400 transition-colors"
145-
>
146-
RSS
147-
</Link>
148-
</li>
149-
</ul>
65+
<div className="lg:col-span-4">
66+
<h3 className="font-mono text-[10px] font-bold text-white uppercase tracking-[0.3em] mb-8 flex items-center gap-3">
67+
<Terminal size={16} className="text-emerald-500" />
68+
Navigation
69+
</h3>
70+
71+
<ul className="grid grid-cols-2 gap-x-6 gap-y-3 font-mono text-[10px] uppercase tracking-widest">
72+
{[
73+
{ label: 'Home', to: '/' },
74+
{ label: 'About', to: '/about' },
75+
{ label: 'Blog', to: '/blog' },
76+
{ label: 'Projects', to: '/projects' },
77+
{ label: 'Logs', to: '/logs' },
78+
{ label: 'Apps', to: '/apps' },
79+
{ label: 'Timeline', to: '/timeline' },
80+
{ label: 'Manuals', to: '/commands' },
81+
].map((item) => (
82+
<li key={item.to}>
83+
<Link
84+
to={item.to}
85+
onClick={scrollToTop}
86+
className="text-gray-500 hover:text-white flex items-center gap-2 transition-colors group"
87+
>
88+
<span className="text-emerald-500 group-hover:translate-x-1 transition-transform">→</span>
89+
{item.label}
90+
</Link>
91+
</li>
92+
))}
93+
<li>
94+
<a href="/rss.xml" target="_blank" className="text-gray-500 hover:text-white flex items-center gap-2">
95+
<span className="text-emerald-500">→</span> RSS Feed
96+
</a>
97+
</li>
98+
</ul>
15099
</div>
151100

152101
{/* Column 3: Connect */}
153-
<div>
154-
<h3 className="text-sm font-semibold text-white tracking-wider uppercase font-mono mb-4">
155-
Connect
156-
</h3>
157-
<div className="flex gap-4 mb-6">
158-
<a
159-
href="https://x.com/fezcoddy"
160-
target="_blank"
161-
rel="noreferrer"
162-
className="text-gray-400 hover:text-white transition-colors hover:bg-gray-800 p-2 rounded-lg"
163-
>
164-
<TwitterLogo size={24} weight="fill" />
165-
</a>
166-
<a
167-
href="https://github.com/fezcode"
168-
target="_blank"
169-
rel="noreferrer"
170-
className="text-gray-400 hover:text-white transition-colors hover:bg-gray-800 p-2 rounded-lg"
171-
>
172-
<GithubLogo size={24} weight="fill" />
173-
</a>
174-
<a
175-
href="https://www.linkedin.com/in/ahmed-samil-bulbul/?locale=en_US"
176-
target="_blank"
177-
rel="noreferrer"
178-
className="text-gray-400 hover:text-white transition-colors hover:bg-gray-800 p-2 rounded-lg"
179-
>
180-
<LinkedinLogo size={24} weight="fill" />
181-
</a>
182-
</div>
102+
<div className="lg:col-span-3">
103+
<h3 className="font-mono text-[10px] font-bold text-white uppercase tracking-[0.3em] mb-8">
104+
Connect
105+
</h3>
183106

184-
{/* Fake Newsletter */}
185-
<div className="relative">
186-
<input
187-
type="text"
188-
disabled
189-
placeholder="Newsletter coming soon..."
190-
className="w-full bg-gray-900/50 border border-gray-800 rounded-lg py-2.5 pl-4 pr-10 text-sm text-gray-500 cursor-not-allowed"
191-
/>
192-
<PaperPlaneRight
193-
size={16}
194-
className="absolute right-3 top-3 text-gray-600"
195-
/>
196-
</div>
107+
<div className="flex gap-3 mb-8">
108+
<SocialIcon href="https://x.com/fezcoddy" icon={TwitterLogo} />
109+
<SocialIcon href="https://github.com/fezcode" icon={GithubLogo} />
110+
<SocialIcon href="https://www.linkedin.com/in/ahmed-samil-bulbul/" icon={LinkedinLogo} />
111+
</div>
112+
113+
<div className="space-y-3 border-t border-white/10 pt-6">
114+
<p className="font-mono text-[9px] font-bold text-gray-600 uppercase tracking-widest">
115+
Newsletter
116+
</p>
117+
<div className="relative">
118+
<input
119+
type="text"
120+
disabled
121+
placeholder="Coming soon..."
122+
className="w-full bg-white text-black font-mono text-[9px] uppercase tracking-widest py-2 px-3 border-none focus:ring-0 placeholder-black/40 disabled:cursor-not-allowed"
123+
/>
124+
</div>
125+
</div>
197126
</div>
127+
198128
</div>
199129

200-
<div className="mt-12 pt-8 border-t border-gray-800/50 text-center md:text-left">
201-
<p className="text-xs text-gray-600">
202-
&copy; {new Date().getFullYear()} fezcode. Built with React,
203-
Tailwind, and caffeine.
204-
</p>
130+
<div className="mt-20 pt-8 border-t border-white/10 flex flex-col md:flex-row justify-between items-center gap-6 font-mono text-[9px] uppercase tracking-[0.2em] text-gray-600">
131+
<p>
132+
&copy; {new Date().getFullYear()} Fezcode // Built with React & Tailwind
133+
</p>
134+
<p className="text-white font-bold">
135+
Thanks for visiting
136+
</p>
205137
</div>
206138
</div>
207139
</footer>
208140
);
209141
};
142+
const SocialIcon = ({ href, icon: Icon }) => (
143+
<a
144+
href={href}
145+
target="_blank"
146+
rel="noreferrer"
147+
className="w-12 h-12 border border-white/10 bg-white/5 flex items-center justify-center text-gray-400 hover:bg-white hover:text-black hover:border-white transition-all group"
148+
>
149+
<Icon size={24} weight="bold" />
150+
</a>
151+
);
210152

211153
export default Footer;

‎src/pages/BlogPostPage.js‎

Lines changed: 6 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -4,6 +4,7 @@ import { useVisualSettings } from '../context/VisualSettingsContext';
44
import DossierBlogPostPage from './DossierBlogPostPage';
55
import DokumentBlogPostPage from './DokumentBlogPostPage';
66
import StandardBlogPostPage from './StandardBlogPostPage';
7+
import OldBlogPostPage from './OldBlogPostPage';
78
import TerminalBlogPostPage from './TerminalBlogPostPage';
89
import TerminalGreenBlogPostPage from './TerminalGreenBlogPostPage';
910

@@ -17,12 +18,16 @@ const BlogPostPage = () => {
1718
// preventing it from running on every render if other local state were to change.
1819
const effectiveViewMode = useMemo(() => {
1920
const themeParam = searchParams.get('theme');
20-
if (themeParam && ['dossier', 'terminal', 'standard', 'dokument', 'terminal-green'].includes(themeParam)) {
21+
if (themeParam && ['dossier', 'terminal', 'standard', 'dokument', 'terminal-green', 'old'].includes(themeParam)) {
2122
return themeParam;
2223
}
2324
return blogPostViewMode;
2425
}, [searchParams, blogPostViewMode]);
2526

27+
if (effectiveViewMode === 'old') {
28+
return <OldBlogPostPage />;
29+
}
30+
2631
if (effectiveViewMode === 'dossier') {
2732
return <DossierBlogPostPage />;
2833
}

‎src/pages/HomePage.js‎

Lines changed: 5 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -31,14 +31,14 @@ const Hero = () => {
3131
<div className="relative pt-32 pb-20 md:pt-48 md:pb-32 overflow-hidden border-b border-white/10">
3232
<div className="absolute top-6 left-6 right-6 flex justify-between items-start font-mono text-[10px] uppercase tracking-[0.2em] text-gray-500 z-20">
3333
<div className="flex flex-col gap-1">
34-
<span>System: Fezcodex_OS</span>
35-
<span>Kernel: v0.6.0-stable</span>
34+
<span>System: Fezcodex</span>
35+
{/*<span>Kernel: v0.6.0-stable</span>*/}
3636
</div>
3737
<div className="text-right">
3838
<span>Local_Time: {time}</span>
3939
<div className="flex items-center gap-2 justify-end mt-1 text-emerald-500">
4040
<span className="h-1.5 w-1.5 rounded-full bg-current animate-pulse" />
41-
<span>Connection_Stable</span>
41+
<span>LIVE</span>
4242
</div>
4343
</div>
4444
</div>
@@ -151,7 +151,7 @@ const HomePage = () => {
151151
case 'projects':
152152
return (
153153
<section className="py-24 border-b border-white/10">
154-
<SectionHeader num={sectionNum} title="Artifacts" link="/projects" linkText="View all entries" />
154+
<SectionHeader num={sectionNum} title="Works" link="/projects" linkText="View all entries" />
155155
<div className="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-px bg-white/10 border border-white/10">
156156
{pinnedProjects.map((project) => (
157157
<div key={project.slug} className="bg-[#050505]">
@@ -166,7 +166,7 @@ const HomePage = () => {
166166
<section className="py-24">
167167
<div className="grid grid-cols-1 lg:grid-cols-12 gap-16 md:gap-24">
168168
<div className="lg:col-span-8">
169-
<SectionHeader num={sectionNum} title="Intel" link="/blog" linkText="Read archive" />
169+
<SectionHeader num={sectionNum} title="Posts" link="/blog" linkText="Read archive" />
170170
<div className="grid grid-cols-1 md:grid-cols-2 gap-6">
171171
{posts.slice(0, 4).map((item, index) => (
172172
<motion.div

0 commit comments

Comments
 (0)