space/my-portfolio
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Codex tried to make the site more responsive on mobile
Build Check / build (push) Successful in 48s
Details
Build Check / push-image (push) Successful in 2m43s
Details
Build Check / deploy-coolify (push) Successful in 7s
Details

Browse Source
This commit is contained in:
Space-Banane
2026-06-03 15:58:29 +02:00
parent 40526e115e
commit aebeed3964
19 changed files with 130 additions and 131 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/sections/AgentSkills.tsx
+9 -9
View File
@@ -6,28 +6,28 @@ export function AgentSkills() {
const { skills } = useProfile();
return (
<section className="w-full max-w-6xl mx-auto px-4 space-y-8">
<section className="w-full max-w-6xl mx-auto px-4 space-y-6 sm:space-y-8">
<div className="text-center space-y-3">
<h2 className="text-4xl font-bold leading-tight text-transparent bg-clip-text bg-gradient-to-r from-amber-400 to-orange-500">
<h2 className="text-3xl font-bold leading-tight text-transparent bg-clip-text bg-gradient-to-r from-amber-400 to-orange-500 sm:text-4xl">
Agent Skills
</h2>
<p className="text-gray-400 max-w-2xl mx-auto">
<p className="mx-auto max-w-2xl text-sm text-gray-400 sm:text-base">
Skills i throw at my Agents to help them solve my prompts.
</p>
</div>
{skills.length === 0 ? (
<div className="rounded-3xl border border-white/10 bg-white/5 px-6 py-10 text-center text-gray-400">
<div className="rounded-3xl border border-white/10 bg-white/5 px-5 py-8 text-center text-gray-400 sm:px-6 sm:py-10">
No agent skills published yet.
</div>
) : (
<div className="grid grid-cols-1 lg:grid-cols-2 gap-6">
<div className="grid grid-cols-1 gap-5 lg:grid-cols-2 sm:gap-6">
{skills.map((skill, index) => (
<article
key={`${skill.name}-${index}`}
className="group rounded-3xl border border-amber-500/20 bg-gradient-to-br from-amber-500/10 via-white/5 to-orange-500/5 p-6 md:p-7 shadow-[0_0_0_1px_rgba(245,158,11,0.08)] backdrop-blur-sm transition-all duration-300 hover:border-amber-500/40"
className="group mx-auto w-full max-w-[20rem] rounded-3xl border border-amber-500/20 bg-gradient-to-br from-amber-500/10 via-white/5 to-orange-500/5 p-5 shadow-[0_0_0_1px_rgba(245,158,11,0.08)] backdrop-blur-sm transition-all duration-300 hover:border-amber-500/40 sm:max-w-none sm:p-6 md:p-7"
>
<div className="flex flex-wrap items-start justify-between gap-4">
<div className="flex flex-col gap-4 sm:flex-row sm:flex-wrap sm:items-start sm:justify-between">
<div className="space-y-2">
<div className="flex flex-wrap gap-2">
{(skill.emojis || []).map((emoji, emojiIndex) => (
@@ -40,7 +40,7 @@ export function AgentSkills() {
</span>
))}
</div>
<h3 className="text-2xl font-semibold text-white">{skill.name}</h3>
<h3 className="text-xl font-semibold text-white sm:text-2xl">{skill.name}</h3>
</div>
{skill.link ? (
@@ -48,7 +48,7 @@ export function AgentSkills() {
href={skill.link}
target="_blank"
rel="noreferrer"
className="inline-flex items-center rounded-full border border-amber-400/30 bg-amber-400/10 px-4 py-2 text-xs font-semibold text-amber-100 transition-colors hover:bg-amber-400/20"
className="inline-flex items-center justify-center rounded-full border border-amber-400/30 bg-amber-400/10 px-4 py-2 text-xs font-semibold text-amber-100 transition-colors hover:bg-amber-400/20 sm:self-start"
>
Open Link
</a>