Pretty Ui Update
This commit is contained in:
Space-Banane
@@ -1,6 +1,6 @@
|
||||
export function Contact() {
|
||||
return (
|
||||
<section className="w-full max-w-2xl text-center space-y-4 pb-8">
|
||||
<section className="w-full max-w-2xl text-center space-y-4 pb-8 mx-auto">
|
||||
<h2 className="text-3xl font-bold text-transparent bg-clip-text bg-gradient-to-r from-green-400 via-blue-500 to-purple-500">
|
||||
Want to talk?
|
||||
</h2>
|
||||
|
||||
+77
-25
@@ -1,38 +1,90 @@
|
||||
import { useUmami } from "@danielgtmn/umami-react";
|
||||
import { Github, Mail, MessageSquare } from "lucide-react";
|
||||
|
||||
export function Footer() {
|
||||
const currentYear = new Date().getFullYear();
|
||||
|
||||
const handleLinkClick = (name: string, url: string) => {
|
||||
useUmami().track(`footer_click_${name.toLowerCase()}`, { url });
|
||||
};
|
||||
|
||||
return (
|
||||
<footer className="w-full border-t border-white/10 pt-4">
|
||||
<div className="text-center space-y-3">
|
||||
<div className="flex items-center justify-center gap-2">
|
||||
<img
|
||||
src="http://shsf.reversed.dev/SHSF%20SMALL%20TRANSPARENT.png"
|
||||
alt="SHSF Logo"
|
||||
className="w-6 h-6"
|
||||
/>
|
||||
<p className="text-gray-400 text-sm">
|
||||
Partly powered by{" "}
|
||||
<footer className="w-full border-t border-white/5 py-8 mt-20">
|
||||
<div className="max-w-7xl mx-auto px-6 flex flex-col items-center gap-6">
|
||||
{/* Social Icons Row */}
|
||||
<div className="flex items-center gap-6 text-gray-400">
|
||||
<a
|
||||
href="https://github.com/Space-Banane"
|
||||
target="_blank"
|
||||
rel="noreferrer"
|
||||
className="hover:text-purple-400 transition-colors"
|
||||
aria-label="GitHub"
|
||||
onClick={() =>
|
||||
handleLinkClick("GitHub", "https://github.com/Space-Banane")
|
||||
}
|
||||
>
|
||||
<Github className="w-5 h-5" />
|
||||
</a>
|
||||
<a
|
||||
href="mailto:space@reversed.dev"
|
||||
className="hover:text-purple-400 transition-colors"
|
||||
aria-label="Email"
|
||||
onClick={() =>
|
||||
handleLinkClick("Email", "mailto:space@reversed.dev")
|
||||
}
|
||||
>
|
||||
<Mail className="w-5 h-5" />
|
||||
</a>
|
||||
<a
|
||||
href="https://discord.com/users/456443941169004545"
|
||||
target="_blank"
|
||||
rel="noreferrer"
|
||||
className="hover:text-purple-400 transition-colors"
|
||||
aria-label="Discord"
|
||||
onClick={() =>
|
||||
handleLinkClick(
|
||||
"Discord",
|
||||
"https://discord.com/users/456443941169004545",
|
||||
)
|
||||
}
|
||||
>
|
||||
<MessageSquare className="w-5 h-5" />
|
||||
</a>
|
||||
</div>
|
||||
|
||||
{/* Branding & Attribution */}
|
||||
<div className="flex flex-col items-center gap-2 text-center">
|
||||
<p className="text-gray-500 text-xs tracking-wide">
|
||||
© {currentYear} • Space-Banane • Love from Space
|
||||
</p>
|
||||
<div className="flex items-center gap-3 text-[10px] text-gray-600 uppercase tracking-[0.2em]">
|
||||
<a
|
||||
href="https://github.com/Space-Banane/shsf"
|
||||
target="_blank"
|
||||
rel="noreferrer"
|
||||
className="text-purple-400 hover:text-purple-300 transition-colors"
|
||||
className="hover:text-gray-400 transition-colors"
|
||||
onClick={() =>
|
||||
handleLinkClick("SHSF", "https://github.com/Space-Banane/shsf")
|
||||
}
|
||||
>
|
||||
SHSF
|
||||
</a>
|
||||
</p>
|
||||
<span>•</span>
|
||||
<a
|
||||
href="https://gradienty.codes/"
|
||||
target="_blank"
|
||||
rel="noreferrer"
|
||||
className="hover:text-gray-400 transition-colors"
|
||||
onClick={() =>
|
||||
handleLinkClick("Gradienty", "https://gradienty.codes/")
|
||||
}
|
||||
>
|
||||
Gradienty
|
||||
</a>
|
||||
<span>•</span>
|
||||
<span>React</span>
|
||||
</div>
|
||||
</div>
|
||||
<p className="text-gray-400 text-sm">Love from Space ❤️</p>
|
||||
<p className="text-gray-500 text-xs">
|
||||
Designed with Copilot &{" "}
|
||||
<a
|
||||
href="https://gradienty.codes/"
|
||||
target="_blank"
|
||||
rel="noreferrer"
|
||||
className="text-purple-400 hover:text-purple-300 transition-colors underline"
|
||||
>
|
||||
gradienty.codes
|
||||
</a>
|
||||
, Tailwind and React
|
||||
</p>
|
||||
</div>
|
||||
</footer>
|
||||
);
|
||||
|
||||
@@ -69,6 +69,22 @@ export function Goals() {
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div className="md:col-span-2 p-6 rounded-2xl bg-gradient-to-br from-yellow-500/10 to-orange-500/5 backdrop-blur-sm border border-yellow-500/20">
|
||||
<div className="flex items-start gap-4">
|
||||
<div className="p-3 rounded-lg bg-yellow-500/20 text-3xl">
|
||||
🏠
|
||||
</div>
|
||||
<div>
|
||||
<h3 className="text-xl font-bold text-white mb-2">
|
||||
Embrace Self-Hosting
|
||||
</h3>
|
||||
<p className="text-gray-400 leading-relaxed">
|
||||
I want to learn more about self-hosting my own services and reduce reliance on cloud providers for personal projects.
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
);
|
||||
|
||||
@@ -1,44 +0,0 @@
|
||||
export function InternshipSection() {
|
||||
return (
|
||||
<section className="w-full space-y-8">
|
||||
<div className="text-center space-y-2">
|
||||
<h2 className="text-3xl font-bold text-transparent bg-clip-text bg-gradient-to-r from-yellow-400 to-orange-500">
|
||||
Real Life Experience (ABB Internship)
|
||||
</h2>
|
||||
<p className="text-gray-400 max-w-2xl mx-auto">
|
||||
My internship experience at ABB and what i learned from it
|
||||
</p>
|
||||
</div>
|
||||
|
||||
<div className="max-w-3xl mx-auto">
|
||||
<div className="p-6 rounded-2xl bg-gradient-to-br from-yellow-500/10 to-orange-500/5 backdrop-blur-sm border border-yellow-500/20">
|
||||
<div className="space-y-4 text-gray-300">
|
||||
<p className="leading-relaxed">
|
||||
I did an internship at{" "}
|
||||
<a
|
||||
href="https://www.abb.com/global/en"
|
||||
target="_blank"
|
||||
rel="noreferrer"
|
||||
className="text-red-500 hover:text-red-600 transition-colors font-semibold"
|
||||
>
|
||||
ABB{" "}
|
||||
</a>
|
||||
where i got to work on a project that involved internal management
|
||||
software. It was a great experience that taught me a lot about
|
||||
working in a professional environment and collaborating with a
|
||||
team of developers.
|
||||
</p>
|
||||
<p className="leading-relaxed">
|
||||
This was the first propper time i worked with a Framework (Angular) and it was a great learning experience. Which helped me understand why
|
||||
frameworks are a thing and how they can help structure and organize codebases, especially as they grow larger.
|
||||
</p>
|
||||
<p className="leading-relaxed">
|
||||
Also, this was the first time submitting a PR, which was scary but super rewarding when they merged it. From that point on
|
||||
i was hooked on Frameworks and OSS contribution. I want to do more of both in the future.
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
);
|
||||
}
|
||||
Reference in New Issue
Block a user