refactor: 清理无用资源并更新项目配置
删除大量未使用的图标、图片和组件文件 更新.gitignore、tsconfig.json和astro配置 添加新的工具函数和UI组件 修改项目元数据和依赖项
This commit is contained in:
joyzhao
65
src/components/AwardsSection.tsx
Normal file
65
src/components/AwardsSection.tsx
Normal file
@@ -0,0 +1,65 @@
|
||||
import React from "react";
|
||||
import { awards } from "@/lib/data";
|
||||
import { Trophy } from "lucide-react";
|
||||
import MotionWrapper from "./MotionWrapper";
|
||||
import { GlassCard } from "./ui/glass-card";
|
||||
import { motion } from "framer-motion";
|
||||
|
||||
export default function AwardsSection() {
|
||||
return (
|
||||
<section
|
||||
id="awards"
|
||||
className="py-12 bg-gradient-to-b from-background to-muted/10"
|
||||
>
|
||||
<div className="container max-w-4xl mx-auto px-6 md:px-4">
|
||||
<MotionWrapper>
|
||||
<h2 className="text-2xl font-bold mb-8 text-center md:text-left">
|
||||
🏆 Awards
|
||||
</h2>
|
||||
</MotionWrapper>
|
||||
|
||||
<div className="grid grid-cols-1 sm:grid-cols-2 md:grid-cols-3 gap-4">
|
||||
{awards.map((award, index) => (
|
||||
<MotionWrapper key={award.name + award.date} delay={index * 0.1}>
|
||||
<GlassCard className="p-4 dark:border-purple-500/10 hover:border-purple-500/30 transition-all duration-300 flex flex-col h-full">
|
||||
<div className="flex items-center mb-2">
|
||||
<motion.div
|
||||
whileHover={{ rotate: 20 }}
|
||||
transition={{ type: "spring", stiffness: 500 }}
|
||||
className="flex items-center justify-center bg-gradient-to-r from-amber-500 to-yellow-500 rounded-full p-1.5 mr-2"
|
||||
>
|
||||
<Trophy className="h-4 w-4 text-white" />
|
||||
</motion.div>
|
||||
<h3 className="font-medium">{award.name}</h3>
|
||||
</div>
|
||||
<p className="text-xs text-muted-foreground mb-1 pl-8">
|
||||
🏢 {award.issuer}
|
||||
</p>
|
||||
<div className="flex flex-col space-y-2 mt-auto">
|
||||
<div className="flex justify-between items-center">
|
||||
<span className="text-xs text-muted-foreground bg-background/50 px-2 py-1 rounded-md">
|
||||
📅 {award.date}
|
||||
</span>
|
||||
<motion.span
|
||||
className="text-xs px-2 py-1 bg-purple-500/10 rounded-full"
|
||||
whileHover={{ scale: 1.05 }}
|
||||
>
|
||||
{award.position}
|
||||
</motion.span>
|
||||
</div>
|
||||
<motion.span
|
||||
className="text-xs text-muted-foreground/80 bg-background/50 px-2 py-1 rounded-md w-fit"
|
||||
whileHover={{ scale: 1.05 }}
|
||||
>
|
||||
{award.type === "International" ? "🌎 " : "🇮🇳 "}
|
||||
{award.type}
|
||||
</motion.span>
|
||||
</div>
|
||||
</GlassCard>
|
||||
</MotionWrapper>
|
||||
))}
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
);
|
||||
}
|
||||
72
src/components/EducationSection.tsx
Normal file
72
src/components/EducationSection.tsx
Normal file
@@ -0,0 +1,72 @@
|
||||
import { education } from "@/lib/data";
|
||||
import TimelineItem from "./TimelineItem";
|
||||
import { Award } from "lucide-react";
|
||||
import MotionWrapper from "./MotionWrapper";
|
||||
import { motion } from "framer-motion";
|
||||
|
||||
export default function EducationSection() {
|
||||
return (
|
||||
<section
|
||||
id="education"
|
||||
className="py-12 bg-gradient-to-b from-muted/10 to-background"
|
||||
>
|
||||
<div className="container max-w-4xl mx-auto px-6 md:px-4">
|
||||
<MotionWrapper>
|
||||
<h2 className="text-2xl font-bold mb-8 text-center md:text-left">
|
||||
🎓 Education
|
||||
</h2>
|
||||
</MotionWrapper>
|
||||
|
||||
<div className="mb-8">
|
||||
{education.map((edu, index) => (
|
||||
<TimelineItem
|
||||
key={edu.institution}
|
||||
title={`🎓 ${edu.degree}`}
|
||||
subtitle={`🏛️ ${edu.institution}`}
|
||||
date={`📅 ${edu.period}`}
|
||||
isLast={index === education.length - 1}
|
||||
index={index}
|
||||
>
|
||||
<p className="text-sm text-muted-foreground mb-3">
|
||||
📍 {edu.location}
|
||||
</p>
|
||||
|
||||
{edu.achievements && edu.achievements.length > 0 && (
|
||||
<motion.div
|
||||
className="mt-3 p-4 bg-background/80 backdrop-blur-sm backdrop-filter rounded-lg border border-purple-500/20 dark:bg-card/10 dark:border-purple-500/10 shadow-sm"
|
||||
initial={{ opacity: 0, y: 20 }}
|
||||
whileInView={{ opacity: 1, y: 0 }}
|
||||
transition={{ duration: 0.5, delay: 0.2 }}
|
||||
viewport={{ once: true }}
|
||||
>
|
||||
<div className="flex items-center mb-3">
|
||||
<div className="h-6 w-6 flex items-center justify-center rounded-full bg-purple-500/10 mr-2">
|
||||
<Award className="h-4 w-4 text-purple-500" />
|
||||
</div>
|
||||
<h4 className="text-sm font-medium">
|
||||
✨ Achievements & Activities
|
||||
</h4>
|
||||
</div>
|
||||
<ul className="list-none ml-4 space-y-2 text-sm">
|
||||
{edu.achievements.map((achievement, i) => (
|
||||
<motion.li
|
||||
key={i}
|
||||
className="text-muted-foreground relative pl-6"
|
||||
initial={{ opacity: 0, x: -10 }}
|
||||
whileInView={{ opacity: 1, x: 0 }}
|
||||
transition={{ duration: 0.3, delay: 0.1 * i }}
|
||||
viewport={{ once: true }}
|
||||
>
|
||||
{achievement}
|
||||
</motion.li>
|
||||
))}
|
||||
</ul>
|
||||
</motion.div>
|
||||
)}
|
||||
</TimelineItem>
|
||||
))}
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
);
|
||||
}
|
||||
72
src/components/ExperienceSection.tsx
Normal file
72
src/components/ExperienceSection.tsx
Normal file
@@ -0,0 +1,72 @@
|
||||
import { workExperience } from "@/lib/data";
|
||||
import TimelineItem from "./TimelineItem";
|
||||
import { Briefcase } from "lucide-react";
|
||||
import { motion } from "framer-motion";
|
||||
import MotionWrapper from "./MotionWrapper";
|
||||
|
||||
export default function ExperienceSection() {
|
||||
return (
|
||||
<section
|
||||
id="experience"
|
||||
className="py-12 bg-gradient-to-b from-muted/20 to-background"
|
||||
>
|
||||
<div className="container max-w-4xl mx-auto px-6 md:px-4">
|
||||
<MotionWrapper>
|
||||
<h2 className="text-2xl font-bold mb-8 text-center md:text-left flex items-center md:inline-block">
|
||||
<motion.span
|
||||
className="inline-block mr-2"
|
||||
initial={{ rotate: 0 }}
|
||||
whileInView={{ rotate: [0, -10, 10, -5, 5, 0] }}
|
||||
transition={{ duration: 0.5, delay: 0.2 }}
|
||||
viewport={{ once: true }}
|
||||
>
|
||||
💼
|
||||
</motion.span>{" "}
|
||||
Work Experience
|
||||
</h2>
|
||||
</MotionWrapper>
|
||||
<div className="mb-8">
|
||||
{workExperience.map((job, index) => (
|
||||
<TimelineItem
|
||||
key={job.company + job.period}
|
||||
title={`👨💻 ${job.position} | ${job.company}`}
|
||||
subtitle={`🌍 ${job.location}`}
|
||||
date={`📅 ${job.period}`}
|
||||
isLast={index === workExperience.length - 1}
|
||||
index={index}
|
||||
>
|
||||
<motion.div
|
||||
className="mt-3 p-4 bg-background/80 backdrop-blur-sm backdrop-filter rounded-lg border border-purple-500/20 dark:bg-card/10 dark:border-purple-500/10 shadow-sm"
|
||||
initial={{ opacity: 0, y: 20 }}
|
||||
whileInView={{ opacity: 1, y: 0 }}
|
||||
transition={{ duration: 0.5, delay: 0.2 }}
|
||||
viewport={{ once: true }}
|
||||
>
|
||||
<div className="flex items-center mb-3">
|
||||
<div className="h-6 w-6 flex items-center justify-center rounded-full bg-purple-500/10 mr-2">
|
||||
<Briefcase className="h-4 w-4 text-purple-500" />
|
||||
</div>
|
||||
<h4 className="text-sm font-medium">Key Achievements</h4>
|
||||
</div>
|
||||
<ul className="list-none ml-4 space-y-2 text-sm">
|
||||
{job.achievements.map((achievement, i) => (
|
||||
<motion.li
|
||||
key={i}
|
||||
className="text-muted-foreground relative pl-6"
|
||||
initial={{ opacity: 0, x: -10 }}
|
||||
whileInView={{ opacity: 1, x: 0 }}
|
||||
transition={{ duration: 0.3, delay: 0.1 * i }}
|
||||
viewport={{ once: true }}
|
||||
>
|
||||
{achievement}
|
||||
</motion.li>
|
||||
))}
|
||||
</ul>
|
||||
</motion.div>
|
||||
</TimelineItem>
|
||||
))}
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
);
|
||||
}
|
||||
58
src/components/Footer.tsx
Normal file
58
src/components/Footer.tsx
Normal file
@@ -0,0 +1,58 @@
|
||||
import { personalInfo } from "@/lib/data";
|
||||
import { motion } from "framer-motion";
|
||||
|
||||
export default function Footer() {
|
||||
return (
|
||||
<footer className="border-t border-purple-500/10 py-6 bg-gradient-to-b from-background to-muted/20 backdrop-blur-sm">
|
||||
<div className="container max-w-4xl mx-auto px-6 md:px-4">
|
||||
<motion.div
|
||||
className="flex flex-col md:flex-row justify-between items-center"
|
||||
initial={{ opacity: 0, y: 20 }}
|
||||
whileInView={{ opacity: 1, y: 0 }}
|
||||
transition={{ duration: 0.5 }}
|
||||
viewport={{ once: true }}
|
||||
>
|
||||
<motion.p
|
||||
className="text-sm text-muted-foreground text-center md:text-left"
|
||||
whileHover={{ scale: 1.01 }}
|
||||
>
|
||||
© {new Date().getFullYear()} {personalInfo.name}. All rights
|
||||
reserved. ✨
|
||||
</motion.p>
|
||||
<motion.p
|
||||
className="text-sm text-muted-foreground mt-2 md:mt-0 text-center md:text-left"
|
||||
initial={{ opacity: 0 }}
|
||||
whileInView={{ opacity: 1 }}
|
||||
transition={{ delay: 0.2, duration: 0.5 }}
|
||||
viewport={{ once: true }}
|
||||
whileHover={{ scale: 1.01 }}
|
||||
>
|
||||
Built with{" "}
|
||||
<motion.span
|
||||
className="inline-block"
|
||||
initial={{ rotate: 0 }}
|
||||
whileHover={{ rotate: 360 }}
|
||||
transition={{ duration: 0.5 }}
|
||||
>
|
||||
💻
|
||||
</motion.span>{" "}
|
||||
and{" "}
|
||||
<motion.span
|
||||
className="inline-block"
|
||||
animate={{
|
||||
scale: [1, 1.2, 1],
|
||||
}}
|
||||
transition={{
|
||||
repeat: Infinity,
|
||||
repeatType: "reverse",
|
||||
duration: 1.5,
|
||||
}}
|
||||
>
|
||||
❤️
|
||||
</motion.span>
|
||||
</motion.p>
|
||||
</motion.div>
|
||||
</div>
|
||||
</footer>
|
||||
);
|
||||
}
|
||||
100
src/components/GlassHeader.tsx
Normal file
100
src/components/GlassHeader.tsx
Normal file
@@ -0,0 +1,100 @@
|
||||
import ThemeToggle from "./ui/theme-toggle";
|
||||
import { personalInfo } from "@/lib/data";
|
||||
import { useState } from "react";
|
||||
import { Menu, X } from "lucide-react";
|
||||
import { motion, AnimatePresence } from "framer-motion";
|
||||
|
||||
export default function GlassHeader() {
|
||||
const [isMenuOpen, setIsMenuOpen] = useState(false);
|
||||
|
||||
const toggleMenu = () => setIsMenuOpen(!isMenuOpen);
|
||||
|
||||
return (
|
||||
<header className="sticky z-50 w-full backdrop-blur-md backdrop-filter bg-background/70 dark:bg-background/40 border-b border-border/40 supports-[backdrop-filter]:bg-background/60">
|
||||
<div className="container max-w-4xl mx-auto p-4 flex justify-between items-center">
|
||||
<motion.a
|
||||
className="flex items-center text-lg font-medium"
|
||||
href="/"
|
||||
whileHover={{ scale: 1.05 }}
|
||||
whileTap={{ scale: 0.95 }}
|
||||
>
|
||||
✨ {personalInfo.name}
|
||||
</motion.a>
|
||||
|
||||
{/* Desktop Navigation */}
|
||||
<nav className="hidden md:flex items-center space-x-6 text-sm font-medium">
|
||||
{["experience", "skills", "projects", "awards", "education"].map(
|
||||
(item, index) => (
|
||||
<motion.a
|
||||
key={item}
|
||||
href={`#${item}`}
|
||||
className="transition-colors hover:text-foreground/80 text-foreground/60"
|
||||
initial={{ opacity: 0, y: -10 }}
|
||||
animate={{ opacity: 1, y: 0 }}
|
||||
transition={{ duration: 0.2, delay: index * 0.1 }}
|
||||
whileHover={{ y: -2 }}
|
||||
>
|
||||
{item === "experience" && "💼 "}
|
||||
{item === "skills" && "🛠️ "}
|
||||
{item === "projects" && "🚀 "}
|
||||
{item === "awards" && "🏆 "}
|
||||
{item === "education" && "🎓 "}
|
||||
{item.charAt(0).toUpperCase() + item.slice(1)}
|
||||
</motion.a>
|
||||
)
|
||||
)}
|
||||
</nav>
|
||||
|
||||
<div className="flex items-center space-x-2">
|
||||
<ThemeToggle />
|
||||
|
||||
{/* Mobile Menu Button */}
|
||||
<motion.button
|
||||
className="md:hidden p-2 text-foreground"
|
||||
onClick={toggleMenu}
|
||||
aria-label="Toggle menu"
|
||||
whileTap={{ scale: 0.95 }}
|
||||
>
|
||||
{isMenuOpen ? <X size={24} /> : <Menu size={24} />}
|
||||
</motion.button>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{/* Mobile Navigation */}
|
||||
<AnimatePresence>
|
||||
{isMenuOpen && (
|
||||
<motion.div
|
||||
className="md:hidden py-4 px-4 border-t border-border/10 backdrop-blur-md backdrop-filter bg-background/80 dark:bg-background/40"
|
||||
initial={{ opacity: 0, height: 0 }}
|
||||
animate={{ opacity: 1, height: "auto" }}
|
||||
exit={{ opacity: 0, height: 0 }}
|
||||
transition={{ duration: 0.3 }}
|
||||
>
|
||||
<nav className="flex flex-col space-y-4 text-sm font-medium">
|
||||
{["experience", "skills", "projects", "awards", "education"].map(
|
||||
(item, index) => (
|
||||
<motion.a
|
||||
key={item}
|
||||
href={`#${item}`}
|
||||
className="transition-colors hover:text-foreground/80 text-foreground/60 py-2"
|
||||
onClick={toggleMenu}
|
||||
initial={{ opacity: 0, x: -20 }}
|
||||
animate={{ opacity: 1, x: 0 }}
|
||||
transition={{ duration: 0.2, delay: index * 0.1 }}
|
||||
>
|
||||
{item === "experience" && "💼 "}
|
||||
{item === "skills" && "🛠️ "}
|
||||
{item === "projects" && "🚀 "}
|
||||
{item === "awards" && "🏆 "}
|
||||
{item === "education" && "🎓 "}
|
||||
{item.charAt(0).toUpperCase() + item.slice(1)}
|
||||
</motion.a>
|
||||
)
|
||||
)}
|
||||
</nav>
|
||||
</motion.div>
|
||||
)}
|
||||
</AnimatePresence>
|
||||
</header>
|
||||
);
|
||||
}
|
||||
140
src/components/HeroSection.tsx
Normal file
140
src/components/HeroSection.tsx
Normal file
@@ -0,0 +1,140 @@
|
||||
import { personalInfo } from "@/lib/data";
|
||||
import { Mail, Github, MapPin, Linkedin } from "lucide-react";
|
||||
import { motion } from "framer-motion";
|
||||
import MotionWrapper from "./MotionWrapper";
|
||||
|
||||
export default function HeroSection() {
|
||||
const containerVariants = {
|
||||
hidden: { opacity: 0 },
|
||||
visible: {
|
||||
opacity: 1,
|
||||
transition: {
|
||||
staggerChildren: 0.2,
|
||||
delayChildren: 0.3,
|
||||
},
|
||||
},
|
||||
};
|
||||
|
||||
const childVariants = {
|
||||
hidden: { opacity: 0, y: 20 },
|
||||
visible: {
|
||||
opacity: 1,
|
||||
y: 0,
|
||||
transition: {
|
||||
duration: 0.5,
|
||||
},
|
||||
},
|
||||
};
|
||||
|
||||
return (
|
||||
<section className="py-16 md:py-24 relative overflow-hidden">
|
||||
<div className="container max-w-4xl mx-auto px-6 md:px-4 relative z-10">
|
||||
<motion.div
|
||||
className="flex flex-col md:flex-row md:items-center justify-between mb-8"
|
||||
variants={containerVariants}
|
||||
initial="hidden"
|
||||
animate="visible"
|
||||
>
|
||||
<div className="text-center md:text-left">
|
||||
<motion.h1
|
||||
className="text-4xl font-bold mb-2"
|
||||
variants={childVariants}
|
||||
>
|
||||
{personalInfo.name}{" "}
|
||||
<span className="inline-block animate-pulse">✨</span>
|
||||
</motion.h1>
|
||||
|
||||
<motion.p
|
||||
className="text-xl text-muted-foreground mb-6"
|
||||
variants={childVariants}
|
||||
>
|
||||
Software Engineer 👨💻
|
||||
</motion.p>
|
||||
|
||||
<motion.div
|
||||
className="flex flex-col gap-2 items-center md:items-start"
|
||||
variants={containerVariants}
|
||||
>
|
||||
<motion.div
|
||||
className="flex items-center text-sm text-muted-foreground"
|
||||
variants={childVariants}
|
||||
whileHover={{ scale: 1.05, color: "#4b5563" }}
|
||||
>
|
||||
<MapPin className="h-4 w-4 mr-2" />
|
||||
📍 {personalInfo.location}
|
||||
</motion.div>
|
||||
|
||||
<motion.a
|
||||
href={`mailto:${personalInfo.email}`}
|
||||
className="flex items-center text-sm text-muted-foreground hover:text-foreground transition-colors"
|
||||
variants={childVariants}
|
||||
whileHover={{ scale: 1.05, color: "#4b5563" }}
|
||||
>
|
||||
<Mail className="h-4 w-4 mr-2" />
|
||||
✉️ {personalInfo.email}
|
||||
</motion.a>
|
||||
|
||||
<motion.a
|
||||
href={personalInfo.github}
|
||||
target="_blank"
|
||||
rel="noopener noreferrer"
|
||||
className="flex items-center text-sm text-muted-foreground hover:text-foreground transition-colors"
|
||||
variants={childVariants}
|
||||
whileHover={{ scale: 1.05, color: "#4b5563" }}
|
||||
>
|
||||
<Github className="h-4 w-4 mr-2" />
|
||||
🌟 GitHub
|
||||
</motion.a>
|
||||
|
||||
<motion.a
|
||||
href={personalInfo.linkedin}
|
||||
target="_blank"
|
||||
rel="noopener noreferrer"
|
||||
className="flex items-center text-sm text-muted-foreground hover:text-foreground transition-colors"
|
||||
variants={childVariants}
|
||||
whileHover={{ scale: 1.05, color: "#4b5563" }}
|
||||
>
|
||||
<Linkedin className="h-4 w-4 mr-2" />
|
||||
🔗 LinkedIn
|
||||
</motion.a>
|
||||
</motion.div>
|
||||
</div>
|
||||
|
||||
<motion.div
|
||||
className="mt-6 md:mt-0 flex justify-center"
|
||||
variants={childVariants}
|
||||
whileHover={{ scale: 1.05 }}
|
||||
whileTap={{ scale: 0.95 }}
|
||||
>
|
||||
<div className="relative">
|
||||
<div className="absolute -inset-1 bg-gradient-to-r from-pink-500 to-purple-500 rounded-full blur opacity-30 group-hover:opacity-100 transition duration-1000 group-hover:duration-200"></div>
|
||||
<img
|
||||
src="/profile.jpg"
|
||||
alt="Profile"
|
||||
className="w-48 md:w-60 rounded-full relative ring-2 ring-purple-500/50"
|
||||
style={{ objectFit: "cover" }}
|
||||
/>
|
||||
</div>
|
||||
</motion.div>
|
||||
</motion.div>
|
||||
|
||||
<MotionWrapper>
|
||||
<div className="bg-gradient-to-r from-purple-500/10 to-pink-500/10 backdrop-blur-sm backdrop-filter p-4 rounded-lg border border-purple-500/20 dark:border-purple-500/10 shadow-sm">
|
||||
<p className="text-muted-foreground pl-4 py-2 mb-4 relative">
|
||||
<span className="absolute left-0 top-0 h-full w-1 bg-gradient-to-b from-purple-500 to-pink-500 rounded-full"></span>
|
||||
🚀 Passionate software engineer with a versatile skill set
|
||||
spanning multiple domains. I thrive on solving complex challenges
|
||||
across different platforms and environments, adapting quickly to
|
||||
new technologies and methodologies. My holistic approach combines
|
||||
technical expertise with creative problem-solving, allowing me to
|
||||
develop solutions that are both innovative and practical. I'm
|
||||
driven by continuous learning and a commitment to excellence,
|
||||
whether working independently or collaborating with diverse teams
|
||||
to create impactful, scalable solutions.
|
||||
</p>
|
||||
</div>
|
||||
</MotionWrapper>
|
||||
</div>
|
||||
</section>
|
||||
);
|
||||
}
|
||||
41
src/components/MotionWrapper.tsx
Normal file
41
src/components/MotionWrapper.tsx
Normal file
@@ -0,0 +1,41 @@
|
||||
import React from "react";
|
||||
import { motion } from "framer-motion";
|
||||
import type { MotionProps } from "framer-motion";
|
||||
|
||||
interface MotionWrapperProps extends MotionProps {
|
||||
children: React.ReactNode;
|
||||
delay?: number;
|
||||
}
|
||||
|
||||
// Default animations for sections
|
||||
const defaultAnimations = {
|
||||
hidden: { opacity: 0, y: 20 },
|
||||
visible: (delay: number = 0) => ({
|
||||
opacity: 1,
|
||||
y: 0,
|
||||
transition: {
|
||||
duration: 0.6,
|
||||
delay: delay,
|
||||
ease: "easeOut",
|
||||
},
|
||||
}),
|
||||
};
|
||||
|
||||
export default function MotionWrapper({
|
||||
children,
|
||||
delay = 0,
|
||||
...props
|
||||
}: MotionWrapperProps) {
|
||||
return (
|
||||
<motion.div
|
||||
initial="hidden"
|
||||
whileInView="visible"
|
||||
viewport={{ once: true, margin: "-100px" }}
|
||||
variants={defaultAnimations}
|
||||
custom={delay}
|
||||
{...props}
|
||||
>
|
||||
{children}
|
||||
</motion.div>
|
||||
);
|
||||
}
|
||||
70
src/components/ProjectsSection.tsx
Normal file
70
src/components/ProjectsSection.tsx
Normal file
@@ -0,0 +1,70 @@
|
||||
import React from "react";
|
||||
import { projects } from "@/lib/data";
|
||||
import {
|
||||
CardContent,
|
||||
CardDescription,
|
||||
CardFooter,
|
||||
CardHeader,
|
||||
CardTitle,
|
||||
} from "./ui/card";
|
||||
import { Github } from "lucide-react";
|
||||
import { GlassCard } from "./ui/glass-card";
|
||||
import MotionWrapper from "./MotionWrapper";
|
||||
import { motion } from "framer-motion";
|
||||
|
||||
export default function ProjectsSection() {
|
||||
return (
|
||||
<section id="projects" className="py-12 relative">
|
||||
<div className="container max-w-4xl mx-auto px-6 md:px-4">
|
||||
<MotionWrapper>
|
||||
<h2 className="text-2xl font-bold mb-8 text-center md:text-left">
|
||||
🚀 Projects
|
||||
</h2>
|
||||
</MotionWrapper>
|
||||
|
||||
<div className="grid grid-cols-1 md:grid-cols-2 gap-6">
|
||||
{projects.map((project, index) => (
|
||||
<MotionWrapper key={project.title} delay={index * 0.2}>
|
||||
<GlassCard className="group overflow-hidden dark:border-purple-500/10 h-full flex flex-col">
|
||||
<CardHeader className="bg-gradient-to-r from-purple-500/5 to-pink-500/5">
|
||||
<CardTitle className="text-center md:text-left group-hover:text-purple-500 transition-colors duration-300">
|
||||
{project.title}
|
||||
</CardTitle>
|
||||
</CardHeader>
|
||||
<CardContent className="flex-grow">
|
||||
<ul className="list-disc ml-4 space-y-1 text-sm group-hover:space-y-2 transition-all duration-300">
|
||||
{project.description.map((desc, i) => (
|
||||
<motion.li
|
||||
key={i}
|
||||
className="text-muted-foreground"
|
||||
initial={{ opacity: 0, x: -10 }}
|
||||
whileInView={{ opacity: 1, x: 0 }}
|
||||
transition={{ delay: i * 0.1 }}
|
||||
viewport={{ once: true }}
|
||||
>
|
||||
{desc}
|
||||
</motion.li>
|
||||
))}
|
||||
</ul>
|
||||
</CardContent>
|
||||
<CardFooter className="flex justify-center md:justify-start items-center border-t border-border/30 bg-gradient-to-r from-purple-500/5 to-pink-500/5">
|
||||
<motion.a
|
||||
href={project.github}
|
||||
target="_blank"
|
||||
rel="noopener noreferrer"
|
||||
className="flex items-center text-sm text-muted-foreground hover:text-purple-500 transition-colors group/link pt-8"
|
||||
whileHover={{ scale: 1.05 }}
|
||||
whileTap={{ scale: 0.95 }}
|
||||
>
|
||||
<Github className="h-4 w-4 mr-2 group-hover/link:rotate-12 transition-transform duration-300" />
|
||||
View on GitHub 🔗
|
||||
</motion.a>
|
||||
</CardFooter>
|
||||
</GlassCard>
|
||||
</MotionWrapper>
|
||||
))}
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
);
|
||||
}
|
||||
148
src/components/SkillsSection.tsx
Normal file
148
src/components/SkillsSection.tsx
Normal file
@@ -0,0 +1,148 @@
|
||||
import React from "react";
|
||||
import { skills } from "@/lib/data";
|
||||
import { motion } from "framer-motion";
|
||||
import MotionWrapper from "./MotionWrapper";
|
||||
import { GlassCard } from "./ui/glass-card";
|
||||
|
||||
function SkillTag({ skill, index }: { skill: string; index: number }) {
|
||||
return (
|
||||
<motion.div
|
||||
initial={{ opacity: 0, scale: 0.8 }}
|
||||
whileInView={{ opacity: 1, scale: 1 }}
|
||||
transition={{
|
||||
type: "spring",
|
||||
stiffness: 260,
|
||||
damping: 20,
|
||||
delay: 0.05 * index,
|
||||
}}
|
||||
whileHover={{ scale: 1.05, y: -2 }}
|
||||
className="px-3 py-1 bg-muted/80 backdrop-blur-sm rounded-md text-sm border border-purple-500/10 shadow-sm"
|
||||
>
|
||||
{skill}
|
||||
</motion.div>
|
||||
);
|
||||
}
|
||||
|
||||
const containerVariants = {
|
||||
hidden: { opacity: 0 },
|
||||
visible: {
|
||||
opacity: 1,
|
||||
transition: {
|
||||
staggerChildren: 0.1,
|
||||
},
|
||||
},
|
||||
};
|
||||
|
||||
const skillCategoryVariants = {
|
||||
hidden: { opacity: 0, y: 20 },
|
||||
visible: {
|
||||
opacity: 1,
|
||||
y: 0,
|
||||
transition: {
|
||||
duration: 0.5,
|
||||
},
|
||||
},
|
||||
};
|
||||
|
||||
export default function SkillsSection() {
|
||||
return (
|
||||
<section
|
||||
id="skills"
|
||||
className="py-12 bg-gradient-to-b from-background to-muted/20"
|
||||
>
|
||||
<div className="container max-w-4xl mx-auto px-6 md:px-4">
|
||||
<MotionWrapper>
|
||||
<h2 className="text-2xl font-bold mb-8 text-center md:text-left">
|
||||
🛠️ Skills
|
||||
</h2>
|
||||
</MotionWrapper>
|
||||
|
||||
<motion.div
|
||||
className="space-y-6"
|
||||
variants={containerVariants}
|
||||
initial="hidden"
|
||||
whileInView="visible"
|
||||
viewport={{ once: true, margin: "-50px" }}
|
||||
>
|
||||
<motion.div variants={skillCategoryVariants}>
|
||||
<GlassCard className="p-4">
|
||||
<h3 className="text-lg font-medium mb-3 text-center md:text-left flex items-center">
|
||||
<span className="mr-2 text-xl">💻</span> Programming Languages
|
||||
</h3>
|
||||
<div className="flex flex-wrap gap-2 justify-center md:justify-start">
|
||||
{skills.programmingLanguages.map((skill, index) => (
|
||||
<SkillTag key={skill} skill={skill} index={index} />
|
||||
))}
|
||||
</div>
|
||||
</GlassCard>
|
||||
</motion.div>
|
||||
|
||||
<motion.div variants={skillCategoryVariants}>
|
||||
<GlassCard className="p-4">
|
||||
<h3 className="text-lg font-medium mb-3 text-center md:text-left flex items-center">
|
||||
<span className="mr-2 text-xl">🎨</span> Frontend Development
|
||||
</h3>
|
||||
<div className="flex flex-wrap gap-2 justify-center md:justify-start">
|
||||
{skills.frontendDevelopment.map((skill, index) => (
|
||||
<SkillTag key={skill} skill={skill} index={index} />
|
||||
))}
|
||||
</div>
|
||||
</GlassCard>
|
||||
</motion.div>
|
||||
|
||||
<motion.div variants={skillCategoryVariants}>
|
||||
<GlassCard className="p-4">
|
||||
<h3 className="text-lg font-medium mb-3 text-center md:text-left flex items-center">
|
||||
<span className="mr-2 text-xl">⚙️</span> Backend Development
|
||||
</h3>
|
||||
<div className="flex flex-wrap gap-2 justify-center md:justify-start">
|
||||
{skills.backendDevelopment.map((skill, index) => (
|
||||
<SkillTag key={skill} skill={skill} index={index} />
|
||||
))}
|
||||
</div>
|
||||
</GlassCard>
|
||||
</motion.div>
|
||||
|
||||
<motion.div variants={skillCategoryVariants}>
|
||||
<GlassCard className="p-4">
|
||||
<h3 className="text-lg font-medium mb-3 text-center md:text-left flex items-center">
|
||||
<span className="mr-2 text-xl">🗄️</span> Database & Storage
|
||||
</h3>
|
||||
<div className="flex flex-wrap gap-2 justify-center md:justify-start">
|
||||
{skills.databaseAndStorage.map((skill, index) => (
|
||||
<SkillTag key={skill} skill={skill} index={index} />
|
||||
))}
|
||||
</div>
|
||||
</GlassCard>
|
||||
</motion.div>
|
||||
|
||||
<motion.div variants={skillCategoryVariants}>
|
||||
<GlassCard className="p-4">
|
||||
<h3 className="text-lg font-medium mb-3 text-center md:text-left flex items-center">
|
||||
<span className="mr-2 text-xl">☁️</span> Cloud & DevOps
|
||||
</h3>
|
||||
<div className="flex flex-wrap gap-2 justify-center md:justify-start">
|
||||
{skills.cloudAndDevOps.map((skill, index) => (
|
||||
<SkillTag key={skill} skill={skill} index={index} />
|
||||
))}
|
||||
</div>
|
||||
</GlassCard>
|
||||
</motion.div>
|
||||
|
||||
<motion.div variants={skillCategoryVariants}>
|
||||
<GlassCard className="p-4">
|
||||
<h3 className="text-lg font-medium mb-3 text-center md:text-left flex items-center">
|
||||
<span className="mr-2 text-xl">🧰</span> Tools & Services
|
||||
</h3>
|
||||
<div className="flex flex-wrap gap-2 justify-center md:justify-start">
|
||||
{skills.toolsAndServices.map((skill, index) => (
|
||||
<SkillTag key={skill} skill={skill} index={index} />
|
||||
))}
|
||||
</div>
|
||||
</GlassCard>
|
||||
</motion.div>
|
||||
</motion.div>
|
||||
</div>
|
||||
</section>
|
||||
);
|
||||
}
|
||||
76
src/components/TimelineItem.tsx
Normal file
76
src/components/TimelineItem.tsx
Normal file
@@ -0,0 +1,76 @@
|
||||
import * as React from "react";
|
||||
import { cn } from "@/lib/utils";
|
||||
import { motion } from "framer-motion";
|
||||
|
||||
interface TimelineItemProps {
|
||||
title: string;
|
||||
subtitle: string;
|
||||
date: string;
|
||||
isLast?: boolean;
|
||||
index?: number;
|
||||
children?: React.ReactNode;
|
||||
}
|
||||
|
||||
export default function TimelineItem({
|
||||
title,
|
||||
subtitle,
|
||||
date,
|
||||
isLast = false,
|
||||
index = 0,
|
||||
children,
|
||||
}: TimelineItemProps) {
|
||||
return (
|
||||
<motion.div
|
||||
className="relative flex gap-6"
|
||||
initial={{ opacity: 0, y: 20 }}
|
||||
whileInView={{ opacity: 1, y: 0 }}
|
||||
transition={{ duration: 0.5, delay: index * 0.2 }}
|
||||
viewport={{ once: true, margin: "-50px" }}
|
||||
>
|
||||
<div className="flex flex-col items-center">
|
||||
<motion.div
|
||||
className="flex h-[18px] w-[18px] rounded-full border border-purple-500/50 bg-background dark:bg-muted z-10"
|
||||
initial={{ scale: 0 }}
|
||||
whileInView={{ scale: 1 }}
|
||||
transition={{
|
||||
type: "spring",
|
||||
stiffness: 300,
|
||||
damping: 15,
|
||||
delay: index * 0.2 + 0.2,
|
||||
}}
|
||||
viewport={{ once: true, margin: "-50px" }}
|
||||
/>
|
||||
{!isLast && (
|
||||
<motion.div
|
||||
className="w-px grow bg-gradient-to-b from-purple-500/50 to-pink-500/30 dark:from-purple-500/30 dark:to-pink-500/10"
|
||||
initial={{ height: 0 }}
|
||||
whileInView={{ height: "100%" }}
|
||||
transition={{ duration: 0.8, delay: index * 0.2 + 0.3 }}
|
||||
viewport={{ once: true, margin: "-50px" }}
|
||||
/>
|
||||
)}
|
||||
</div>
|
||||
<div className={cn("pb-8", isLast ? "pb-0" : "")}>
|
||||
<motion.div
|
||||
className="flex flex-col gap-0.5"
|
||||
initial={{ opacity: 0, x: -20 }}
|
||||
whileInView={{ opacity: 1, x: 0 }}
|
||||
transition={{ duration: 0.5, delay: index * 0.2 + 0.1 }}
|
||||
viewport={{ once: true, margin: "-50px" }}
|
||||
>
|
||||
<h3 className="font-medium">{title}</h3>
|
||||
<p className="text-sm text-muted-foreground">{subtitle}</p>
|
||||
<p className="text-xs text-muted-foreground/70 mb-2">{date}</p>
|
||||
</motion.div>
|
||||
<motion.div
|
||||
initial={{ opacity: 0 }}
|
||||
whileInView={{ opacity: 1 }}
|
||||
transition={{ duration: 0.5, delay: index * 0.2 + 0.4 }}
|
||||
viewport={{ once: true, margin: "-50px" }}
|
||||
>
|
||||
{children}
|
||||
</motion.div>
|
||||
</div>
|
||||
</motion.div>
|
||||
);
|
||||
}
|
||||
@@ -1,31 +0,0 @@
|
||||
---
|
||||
const { title, url, date, image, tags = [], languages = [] } = Astro.props;
|
||||
|
||||
import Tag from "../ui/Tag.astro";
|
||||
import ReadMore from "../ui/ReadMore.astro";
|
||||
import DatePub from "./DatePub.astro";
|
||||
import Capsule from "../ui/Capsule.astro";
|
||||
|
||||
---
|
||||
|
||||
<article class="bg-white dark:bg-zinc-900/25 dark:border dark:border-zinc-800 dark:hover:border-mint-300 hover:backdrop-blur-none backdrop-blur-lg shadow-sm overflow-auto hover:shadow-[5px_5px_rgba(0,98,90,0.4),10px_10px_rgba(0,98,90,0.3),15px_15px_rgba(0,98,90,0.2),20px_20px_rgba(0,98,90,0.1),25px_25px_rgba(0,98,90,0.05)] p-8 max-md:p-6 w-full flex justify-between items-center bg-linear-to-r hover:from-teal-200 hover:to-emerald-200 dark:hover:from-riptide-500 dark:hover:to-mint-500 transition-all hover:scale-105 duration-200 ease-in-out gap-8 max-md:gap-4 rounded-3xl max-md:flex-col-reverse">
|
||||
<div class="flex flex-col">
|
||||
<a href={url} class="flex flex-col gap-4 w-full">
|
||||
<DatePub date={date} />
|
||||
<h2 class="dark:text-mint-50 text-blacktext text-3xl font-bold text-pretty">{title}</h2>
|
||||
<ReadMore />
|
||||
</a>
|
||||
<div class="gap-3 mt-3 flex flex-col">
|
||||
<div class="flex gap-2 flex-wrap">
|
||||
|
||||
{languages.length > 0 && languages.map((language: string) => <Capsule lang={language} />)}
|
||||
</div>
|
||||
<div class="gap-2 flex flex-wrap justify-start items-center">
|
||||
{tags.length > 0 && tags.map((tag: string) => <Tag tag={tag}>{tag}</Tag>)}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
{image?.url && (
|
||||
<a href={url} style={{ backgroundImage: `url(${image.url})` }} class="shrink-0 rounded-2xl bg-center bg-cover aspect-video max-md:aspect-video w-2/6 max-md:w-full" />
|
||||
)}
|
||||
</article>
|
||||
@@ -1,28 +0,0 @@
|
||||
---
|
||||
const {date, class: className} = Astro.props;
|
||||
---
|
||||
|
||||
<span
|
||||
class={`flex flex-row center text-sm font-semibold items-center gap-3 text-blacktext dark:text-riptide-50 ${className || ''}`}
|
||||
>
|
||||
<svg
|
||||
width="15"
|
||||
height="15"
|
||||
viewBox="0 0 15 15"
|
||||
fill="none"
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
><path
|
||||
d="M4.5 1C4.77614 1 5 1.22386 5 1.5V2H10V1.5C10 1.22386 10.2239 1 10.5 1C10.7761 1 11 1.22386 11 1.5V2H12.5C13.3284 2 14 2.67157 14 3.5V12.5C14 13.3284 13.3284 14 12.5 14H2.5C1.67157 14 1 13.3284 1 12.5V3.5C1 2.67157 1.67157 2 2.5 2H4V1.5C4 1.22386 4.22386 1 4.5 1ZM10 3V3.5C10 3.77614 10.2239 4 10.5 4C10.7761 4 11 3.77614 11 3.5V3H12.5C12.7761 3 13 3.22386 13 3.5V5H2V3.5C2 3.22386 2.22386 3 2.5 3H4V3.5C4 3.77614 4.22386 4 4.5 4C4.77614 4 5 3.77614 5 3.5V3H10ZM2 6V12.5C2 12.7761 2.22386 13 2.5 13H12.5C12.7761 13 13 12.7761 13 12.5V6H2ZM7 7.5C7 7.22386 7.22386 7 7.5 7C7.77614 7 8 7.22386 8 7.5C8 7.77614 7.77614 8 7.5 8C7.22386 8 7 7.77614 7 7.5ZM9.5 7C9.22386 7 9 7.22386 9 7.5C9 7.77614 9.22386 8 9.5 8C9.77614 8 10 7.77614 10 7.5C10 7.22386 9.77614 7 9.5 7ZM11 7.5C11 7.22386 11.2239 7 11.5 7C11.7761 7 12 7.22386 12 7.5C12 7.77614 11.7761 8 11.5 8C11.2239 8 11 7.77614 11 7.5ZM11.5 9C11.2239 9 11 9.22386 11 9.5C11 9.77614 11.2239 10 11.5 10C11.7761 10 12 9.77614 12 9.5C12 9.22386 11.7761 9 11.5 9ZM9 9.5C9 9.22386 9.22386 9 9.5 9C9.77614 9 10 9.22386 10 9.5C10 9.77614 9.77614 10 9.5 10C9.22386 10 9 9.77614 9 9.5ZM7.5 9C7.22386 9 7 9.22386 7 9.5C7 9.77614 7.22386 10 7.5 10C7.77614 10 8 9.77614 8 9.5C8 9.22386 7.77614 9 7.5 9ZM5 9.5C5 9.22386 5.22386 9 5.5 9C5.77614 9 6 9.22386 6 9.5C6 9.77614 5.77614 10 5.5 10C5.22386 10 5 9.77614 5 9.5ZM3.5 9C3.22386 9 3 9.22386 3 9.5C3 9.77614 3.22386 10 3.5 10C3.77614 10 4 9.77614 4 9.5C4 9.22386 3.77614 9 3.5 9ZM3 11.5C3 11.2239 3.22386 11 3.5 11C3.77614 11 4 11.2239 4 11.5C4 11.7761 3.77614 12 3.5 12C3.22386 12 3 11.7761 3 11.5ZM5.5 11C5.22386 11 5 11.2239 5 11.5C5 11.7761 5.22386 12 5.5 12C5.77614 12 6 11.7761 6 11.5C6 11.2239 5.77614 11 5.5 11ZM7 11.5C7 11.2239 7.22386 11 7.5 11C7.77614 11 8 11.2239 8 11.5C8 11.7761 7.77614 12 7.5 12C7.22386 12 7 11.7761 7 11.5ZM9.5 11C9.22386 11 9 11.2239 9 11.5C9 11.7761 9.22386 12 9.5 12C9.77614 12 10 11.7761 10 11.5C10 11.2239 9.77614 11 9.5 11Z"
|
||||
fill="currentColor"
|
||||
fill-rule="evenodd"
|
||||
clip-rule="evenodd"></path></svg
|
||||
>
|
||||
{
|
||||
new Date(date).toLocaleDateString("en-US", {
|
||||
timeZone: "UTC", // Avoid timezone adjustments
|
||||
day: "numeric",
|
||||
month: "long",
|
||||
year: "numeric",
|
||||
})
|
||||
}</span
|
||||
>
|
||||
@@ -1,103 +0,0 @@
|
||||
---
|
||||
import Button from "../ui/Button.astro";
|
||||
import LastPost from "../blog/LastPost.astro";
|
||||
import Languages from "../blog/Languages.astro";
|
||||
import { Icon } from "astro-icon/components";
|
||||
import Heading from "../ui/Heading.astro";
|
||||
import { AstroError } from "astro/errors";
|
||||
import { getCollection} from "astro:content";
|
||||
|
||||
const [staticData] = await getCollection('staticData');
|
||||
|
||||
if (!staticData) {
|
||||
throw new AstroError("JSON data not found");
|
||||
}
|
||||
---
|
||||
|
||||
<section class="py-8 px-8 max-sm:px-4 max-sm:py-2">
|
||||
<div
|
||||
class="grid md:grid-cols-4 md:grid-rows-2 gap-4 max-sm:gap-3 grid-cols-2 grid-rows-4 max-w-7xl mx-auto max-md:h-[80vh] max-sm:h-auto max-sm:grid-rows-[auto_200px_auto_auto] max-xl:h-[550px] xl:h-[700px]"
|
||||
>
|
||||
<div
|
||||
class="p-8 max-md:gap-0 max-xl:p-5 h-full max-md:p-4 max-lg:gap-1 gap-3 flex flex-col border border-emerald-50 rounded-2xl dark:bg-zinc-800 bg-linear-to-r from-riptide-200 to-mint-200 dark:from-riptide-500 dark:to-mint-500 dark:border-zinc-800 dark:border-2 dark:bg-gradient-radial md:col-start-4 col-start-2 row-start-2"
|
||||
>
|
||||
<Heading text={staticData.data.techsTitle} textGradient="" level={3}/>
|
||||
|
||||
<div class="overflow-y-auto">
|
||||
<Languages />
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
||||
<div
|
||||
class="group hover:shadow-[0_20px_50px_rgba(13,188,130,0.4)] hover:scale-105 z-40 rounded-2xl transition-all ease-in duration-150 col-start-1 row-start-2 md:col-start-3 bg-linear-to-r from-mint-300 dark:from-mint-600 to-mint-50 dark:to-mint-200/5 hover:to-mint-300/30 dark:hover:to-mint-600/30 p-[.2rem] "
|
||||
>
|
||||
<div class="w-full h-full overflow-hidden rounded-2xl dark:bg-zinc-900">
|
||||
<div
|
||||
class="w-full h-full relative overflow-hidden rounded-2xl bg-linear-to-tr from-riptide-100 to-white dark:from-transparent dark:bg-linear-to-bl dark:to-transparent "
|
||||
>
|
||||
<a target="_blank" href={staticData.data.github}>
|
||||
<div
|
||||
class="p-8 h-full relative max-xl:p-5 max-md:p-4 flex flex-col gap-8 dark:before:bg-[radial-gradient(circle,rgba(13,188,130)_0,rgba(1,45,34)_100%)] before:bg-[radial-gradient(circle,rgba(95,255,202)_0,rgba(144,253,210)_100%)] before:h-[30%] before:absolute before:aspect-square xl:before:bottom-10 before:left-30 before:bottom-30 before:rounded-full before:blur-3xl before:opacity-90 before:transition before:z-0"
|
||||
>
|
||||
<div class="z-2">
|
||||
<Heading
|
||||
text={staticData.data.githubText}
|
||||
textGradient=""
|
||||
level={3}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<Icon
|
||||
class="group-hover:animate-pulse ease-in-out size-50 absolute -bottom-10 xl:size-56 xl:-bottom-5 left-30 max-sm:left-10 max-md:left-30 xl:-right-24 text-mint-500/30"
|
||||
name="github"
|
||||
/>
|
||||
</div>
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div
|
||||
class="flex col-span-2 col-start-1 row-start-1 md:col-start-3 bg-linear-to-r rounded-2xl from-mint-300 dark:from-mint-600 to-mint-50 dark:to-mint-200/5 hover:to-mint-300/30 dark:hover:to-mint-600/30 p-[.2rem] "
|
||||
>
|
||||
<article
|
||||
class="group hover:shadow-[0_10px_50px_rgba(13,188,130,0.2)] w-full h-full overflow-hidden p-4 max-md:p-4 gap-4 max-md:gap-1 max-lg:gap-0 rounded-2xl bg-linear-to-tr from-riptide-100 to-mint-50 flex dark:bg-linear-to-r z-0 dark:overflow-hidden relative dark:from-mint-900 dark:to-mint-950 dark:before:bg-[radial-gradient(circle,rgba(13,188,130)_0,rgba(1,45,34)_100%)] before:bg-[radial-gradient(circle,rgba(95,255,202)_0,rgba(144,253,210)_100%)] dark:before:h-[80%] before:h-[30%] before:absolute before:aspect-square dark:before:left-30 before:left-50 dark:before:-bottom-0 before:bottom-40 before:rounded-full dark:before:blur-3xl before:blur-2xl dark:before:opacity-80 before:opacity-100 before:-z-10 before:transition"
|
||||
>
|
||||
<div
|
||||
class="group-hover:scale-103 ease-in-out duration-500 w-5/12 max-sm:w-auto flex justify-center items-center"
|
||||
>
|
||||
<div
|
||||
aria-label={staticData.data.profileAlt}
|
||||
class="h-full w-full max-sm:rounded-full rounded-2xl max-sm:size-20 bg-center bg-cover"
|
||||
style={`background-image: url(${staticData.data.profileImage})`}
|
||||
>
|
||||
<a href={staticData.data.profileLink} class="h-full w-full flex"></a>
|
||||
</div>
|
||||
</div>
|
||||
<div class="p-4 w-7/12 flex flex-col justify-center gap-4 max-sm:w-fit max-md:gap-2">
|
||||
<span
|
||||
class="font-extrabold text-lg max-xl:text-base max-lg:text-sm max-lg:flex max-lg:flex-col-reverse max-md:flex-row leading-normal max-sm:leading-none"
|
||||
><b
|
||||
class="bg-linear-to-r from-riptide-400 to-mint-400 dark:from-riptide-200 dark:to-mint-400 text-transparent bg-clip-text"
|
||||
>{staticData.data.profileTitle}</b
|
||||
> 🚀</span
|
||||
>
|
||||
<Heading
|
||||
text={staticData.data.profileName}
|
||||
level={3}
|
||||
/>
|
||||
<Button
|
||||
link={staticData.data.profileLink}
|
||||
text="About Me"
|
||||
iconName="person"
|
||||
class="drop-shadow-xl"
|
||||
/>
|
||||
</div>
|
||||
</article>
|
||||
</div>
|
||||
<div class="col-span-2 row-span-2 md:col-start-1 md:row-start-1 bg-conic/[from_var(--border-angle)] dark:from-mint-200/30 dark:via-mint-500 dark:to-mint-200/20 from-mint-300/30 via-mint-500 to-mint-300/20 from-20% to-80% animate-rotate-border rounded-2xl p-[.2rem]">
|
||||
<LastPost />
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
@@ -1,27 +0,0 @@
|
||||
---
|
||||
const allPosts = await Astro.glob("../../pages/blog/posts/*.md");
|
||||
const languages = [
|
||||
...new Set(allPosts.map((post) => post.frontmatter.languages).flat()),
|
||||
];
|
||||
import Capsule from "../ui/Capsule.astro";
|
||||
|
||||
const { variant = "default" } = Astro.props;
|
||||
|
||||
const baseClasses = "flex flex-wrap";
|
||||
|
||||
const variantClasses = {
|
||||
default: "gap-3 max-lg:gap-1",
|
||||
vertical: "gap-6 flex-col"
|
||||
} as const;
|
||||
|
||||
const classes = `${baseClasses} ${variantClasses[variant as keyof typeof variantClasses] || variantClasses.default}`;
|
||||
---
|
||||
|
||||
<div class={classes}>
|
||||
{languages.map((language) => (
|
||||
<Capsule lang={language} linkEnabled={true} size="md" />
|
||||
))}
|
||||
</div>
|
||||
|
||||
|
||||
|
||||
@@ -1,83 +0,0 @@
|
||||
---
|
||||
const allPosts = await Astro.glob("../../pages/blog/posts/*.md");
|
||||
|
||||
import Tag from "../ui/Tag.astro";
|
||||
import ReadMore from "../ui/ReadMore.astro";
|
||||
import Capsule from "../ui/Capsule.astro";
|
||||
import DatePub from "./DatePub.astro";
|
||||
|
||||
// Get the latest post using reduce
|
||||
const latestPost = allPosts.reduce((latest, current) => {
|
||||
const latestDate = new Date(latest.frontmatter.pubDate).getTime();
|
||||
const currentDate = new Date(current.frontmatter.pubDate).getTime();
|
||||
return currentDate > latestDate ? current : latest;
|
||||
});
|
||||
|
||||
const tags = [...new Set(latestPost.frontmatter.tags ?? [])];
|
||||
const languages = [...new Set(latestPost.frontmatter.languages ?? [])];
|
||||
const image = latestPost.frontmatter.image.url;
|
||||
const imageAlt =
|
||||
latestPost.frontmatter.image.alt || latestPost.frontmatter.title;
|
||||
---
|
||||
|
||||
{
|
||||
latestPost && (
|
||||
<div
|
||||
style={{ backgroundImage: `url(${image})` }}
|
||||
class="h-full hover:shadow-[0_20px_50px_rgba(13,188,130,0.2)] flex flex-col overflow-hidden rounded-2xl bg-linear-to-br bg-center bg-cover transition-all ease-in-out duration-200"
|
||||
role="article"
|
||||
aria-labelledby="post-title"
|
||||
>
|
||||
<article class="h-full flex flex-col justify-between max-sm:bg-zinc-900 max-sm:relative sm:bg-linear-to-t from-black/95 from-25% to-transparent max-sm:from-60% p-8 max-md:p-6 max-sm:mp-0 max-sm:p-0">
|
||||
<a
|
||||
href=""
|
||||
class="sm:hidden relative top-0 left-0 w-full h-auto -z-0"
|
||||
aria-hidden="true"
|
||||
>
|
||||
<img
|
||||
src={image}
|
||||
alt={imageAlt}
|
||||
class="w-full h-auto"
|
||||
loading="lazy"
|
||||
/>
|
||||
</a>
|
||||
<div
|
||||
class="w-full flex pb-5 gap-2 flex-wrap justify-end z-10 max-sm:px-6 max-sm:pt-6"
|
||||
role="list"
|
||||
aria-label="Programming languages"
|
||||
>
|
||||
{languages.map((language: unknown) => (
|
||||
<Capsule lang={language?.toString() || ""} />
|
||||
))}
|
||||
</div>
|
||||
|
||||
<a
|
||||
href={latestPost.url}
|
||||
class="text-mint-50 gap-3 h-full flex items-end max-sm:px-6 rounded-lg transition-all"
|
||||
aria-label={`Read article: ${latestPost.frontmatter.title}`}
|
||||
>
|
||||
<div class="gap-3 flex flex-col justify-end drop-shadow-[1px_6px_1px_rgba(0,0,0,0.3)]">
|
||||
<DatePub date={latestPost.frontmatter.pubDate} class="text-mint-50" />
|
||||
<h2
|
||||
id="post-title"
|
||||
class="text-4xl max-xl:text-3xl max-sm:text-2xl font-bold"
|
||||
>
|
||||
<span>{latestPost.frontmatter.title}</span>
|
||||
</h2>
|
||||
<ReadMore class="text-mint-50" />
|
||||
</div>
|
||||
</a>
|
||||
|
||||
<div
|
||||
class="gap-2 mt-3 justify-start items-center flex flex-row flex-wrap max-sm:px-6 max-sm:pb-6"
|
||||
role="list"
|
||||
aria-label="Article tags"
|
||||
>
|
||||
{tags.map((tag) => (
|
||||
<Tag tag={tag} forceDark="true">{tag}</Tag>
|
||||
))}
|
||||
</div>
|
||||
</article>
|
||||
</div>
|
||||
)
|
||||
}
|
||||
@@ -1,82 +0,0 @@
|
||||
---
|
||||
import BlogPost from "./BlogPost.astro";
|
||||
import Heading from "../ui/Heading.astro";
|
||||
|
||||
// Prop to determine whether to exclude the latest post or a specific post
|
||||
export interface Props {
|
||||
excludeLatest?: boolean;
|
||||
currentPostUrl?: string;
|
||||
all?: boolean;
|
||||
}
|
||||
|
||||
const { excludeLatest = false, currentPostUrl = "", all = false } = Astro.props;
|
||||
|
||||
const allPosts = await Astro.glob("../../pages/blog/posts/*.md");
|
||||
// Sort by date in descending order (newest first)
|
||||
allPosts.sort((a, b) => {
|
||||
const dateA = new Date(a.frontmatter.pubDate).getTime();
|
||||
const dateB = new Date(b.frontmatter.pubDate).getTime();
|
||||
return dateB - dateA;
|
||||
});
|
||||
|
||||
// Filter posts according to props
|
||||
let postsToShow = allPosts;
|
||||
|
||||
if (currentPostUrl) {
|
||||
// Exclude current post if its URL is provided
|
||||
postsToShow = postsToShow.filter((post) => {
|
||||
if (!post.url) return false; // If no URL, keep the post
|
||||
// Normalize URLs for comparison
|
||||
const normalizedPostUrl = post.url.replace(/\/$/, ""); // Remove trailing slash if exists
|
||||
const normalizedCurrentUrl = currentPostUrl.replace(/\/$/, ""); // Remove trailing slash if exists
|
||||
return normalizedPostUrl !== normalizedCurrentUrl;
|
||||
});
|
||||
} else if (excludeLatest) {
|
||||
// If no specific URL but want to exclude the latest
|
||||
postsToShow = postsToShow.slice(1);
|
||||
}
|
||||
|
||||
// Limit to 4 posts if all is false
|
||||
if (!all) {
|
||||
postsToShow = postsToShow.slice(0, 4);
|
||||
}
|
||||
---
|
||||
|
||||
<section
|
||||
class="py-8 max-lg:px-4 max-md:px-8 max-sm:px-0 max-md:py-4 max-w-4xl mx-auto"
|
||||
>
|
||||
{
|
||||
all && (
|
||||
<div class="flex gap-4 pb-6 items-center text-center justify-center">
|
||||
<Heading text="All" textGradient="Posts" level={2} />
|
||||
</div>
|
||||
)
|
||||
}
|
||||
|
||||
<div class="flex flex-col gap-8 w-full mx-auto">
|
||||
{
|
||||
postsToShow.map((post) => (
|
||||
<BlogPost
|
||||
url={post.url}
|
||||
title={post.frontmatter.title}
|
||||
date={post.frontmatter.pubDate}
|
||||
tags={post.frontmatter.tags}
|
||||
languages={post.frontmatter.languages}
|
||||
image={post.frontmatter.image}
|
||||
/>
|
||||
))
|
||||
}
|
||||
</div>
|
||||
{
|
||||
!all && (
|
||||
<div id="morePosts" class="w-full flex justify-center text-center my-12">
|
||||
<a
|
||||
href="/blog/posts/"
|
||||
class="font-bold cursor-pointer text-mint-400 dark:text-mint-100 hover:text-mint-500 dark:hover:text-mint-300 transition-all"
|
||||
>
|
||||
View all posts...
|
||||
</a>
|
||||
</div>
|
||||
)
|
||||
}
|
||||
</section>
|
||||
@@ -1,32 +0,0 @@
|
||||
---
|
||||
const allPosts = await Astro.glob("../../pages/blog/posts/*.md");
|
||||
import Tag from "../ui/Tag.astro";
|
||||
|
||||
const tags = [...new Set(allPosts.map((post) => post.frontmatter.tags).flat())];
|
||||
type VariantType = "default" | "vertical" | "compact";
|
||||
const { variant = "default" } = Astro.props as { variant?: VariantType };
|
||||
|
||||
// Common base classes
|
||||
const baseClasses = "max-w-7xl";
|
||||
|
||||
// Variant-specific classes
|
||||
const variantClasses: Record<VariantType, string> = {
|
||||
default: "max-lg:px-8 py-8 max-md:py-4 flex-wrap mx-auto gap-4 max-sm:gap-3 justify-center items-center flex flex-row",
|
||||
vertical: "gap-6 justify-start items-start flex flex-col",
|
||||
compact: "flex-wrap mx-auto gap-2 max-sm:gap-3 justify-start flex flex-row"
|
||||
};
|
||||
|
||||
// Combine base classes with variant-specific classes
|
||||
const classes = `${baseClasses} ${variantClasses[variant]}`;
|
||||
---
|
||||
|
||||
<div id="tags" class={classes}>
|
||||
{tags.map((tag) => <Tag tag={tag}></Tag>)}
|
||||
</div>
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
@@ -1,47 +0,0 @@
|
||||
---
|
||||
import Social from "../ui/Social.astro";
|
||||
import { Icon } from "astro-icon/components";
|
||||
import { AstroError } from "astro/errors";
|
||||
import { getCollection} from "astro:content";
|
||||
|
||||
const [staticData] = await getCollection('staticData');
|
||||
|
||||
if (!staticData) {
|
||||
throw new AstroError("JSON data not found");
|
||||
}
|
||||
---
|
||||
|
||||
<footer
|
||||
class="relative bottom-0 w-full px-4 py-8 font-medium text-blacktext dark:bg-transparent dark:border-b-2 dark:border-zinc-800 dark:text-zinc-300 max-lg:mt-3"
|
||||
role="contentinfo"
|
||||
aria-label="Site footer"
|
||||
>
|
||||
<nav
|
||||
class="mx-auto flex max-w-7xl flex-row items-center justify-between gap-4 text-xl max-xl:px-6 max-sm:flex-col"
|
||||
aria-label="Footer navigation"
|
||||
>
|
||||
<div
|
||||
class="relative h-6 cursor-pointer before:absolute before:left-1/2 before:top-1/2 before:h-full before:w-[40%] before:-translate-x-1/2 before:-translate-y-1/2 before:rounded-full before:bg-[#50fd8f25] before:blur-3xl before:opacity-80 before:-z-1 hover:text-mint-500 transition-all [text-shadow:0_1px_2px_#000]"
|
||||
>
|
||||
<a href="/" aria-label="Return to homepage">
|
||||
<!-- This icon represents the logo -->
|
||||
<Icon name="logo" aria-hidden="true" />
|
||||
</a>
|
||||
</div>
|
||||
<div class="text-center">
|
||||
<a
|
||||
href={staticData.data.github}
|
||||
class="flex items-center justify-center gap-3 text-base font-normal italic max-sm:text-sm"
|
||||
aria-label="About the website development"
|
||||
><Icon name="code" aria-hidden="true" /> Developed by <strong>{staticData.data.alias}</strong>, with Astro</a
|
||||
>
|
||||
</div>
|
||||
<div class="flex items-center justify-center gap-5" role="list" aria-label="Social media links">
|
||||
<Social link={`mailto:${staticData.data.email}`} iconName={staticData.data.emailIconName} label={`Send email to ${staticData.data.email}`} />
|
||||
<Social link={staticData.data.instagram} iconName={staticData.data.instagramIconName} label={`Visit ${staticData.data.alias} on Instagram`} />
|
||||
<Social link={staticData.data.youtube} iconName={staticData.data.youtubeIconName} label={`Visit ${staticData.data.alias} on YouTube`} />
|
||||
<Social link={staticData.data.github} iconName={staticData.data.githubIconName} label={`Visit ${staticData.data.alias} on GitHub`} />
|
||||
<Social link={staticData.data.linkedin} iconName={staticData.data.linkedinIconName} label={`Visit ${staticData.data.alias} on LinkedIn`} />
|
||||
</div>
|
||||
</nav>
|
||||
</footer>
|
||||
@@ -1,63 +0,0 @@
|
||||
---
|
||||
import Navigation from "./Navigation.astro";
|
||||
import ThemeIcon from "../ui/ThemeIcon.astro";
|
||||
import Social from "../ui/Social.astro";
|
||||
import { Icon } from "astro-icon/components";
|
||||
import { AstroError } from "astro/errors";
|
||||
import { getCollection} from "astro:content";
|
||||
|
||||
const [staticData] = await getCollection('staticData');
|
||||
|
||||
if (!staticData) {
|
||||
throw new AstroError("JSON data not found");
|
||||
}
|
||||
|
||||
const currentPath = Astro.url.pathname;
|
||||
const routes = ["/", "/portfolio", "/about-me", ];
|
||||
|
||||
// Check if the current route is in the list of routes
|
||||
const isActiveRoute = routes.includes(currentPath);
|
||||
|
||||
const navItems = isActiveRoute
|
||||
? ["home", "experience", "projects", "about", "blog",]
|
||||
: ["home", "blog", "about"]; // Change the items
|
||||
---
|
||||
|
||||
<header
|
||||
role="banner"
|
||||
aria-label="Main navigation"
|
||||
class="sticky top-0 z-50 w-full p-4 font-medium text-blacktext dark:text-zinc-300 dark:bg-[#0E0E11]/80 dark:border-b dark:border-zinc-800 bg-white/90 backdrop-blur-xs dark:backdrop-blur-xs max-md:z-50 max-md:px-0 transition-all"
|
||||
>
|
||||
<div
|
||||
class="relative mx-auto flex max-w-7xl flex-row items-center justify-between max-xl:px-6"
|
||||
>
|
||||
<a href="/" aria-label="Go to home">
|
||||
<Icon
|
||||
name="logo"
|
||||
class="h-6 cursor-pointer transition-all hover:text-mint-300"
|
||||
aria-hidden="true"
|
||||
/>
|
||||
</a>
|
||||
|
||||
<Navigation items={navItems} />
|
||||
|
||||
<div class="flex items-center justify-between gap-5 text-xl">
|
||||
<div class="max-md:hidden flex items-center justify-center gap-5" role="list">
|
||||
<Social link={staticData.data.github} iconName={staticData.data.githubIconName} />
|
||||
<Social link={staticData.data.linkedin} iconName={staticData.data.linkedinIconName} />
|
||||
</div>
|
||||
</div>
|
||||
<div class="flex items-center gap-5 text-xl md:pl-5">
|
||||
<ThemeIcon />
|
||||
<button
|
||||
class="hamburger"
|
||||
aria-label="Open menu"
|
||||
aria-expanded="false"
|
||||
aria-controls="mobile-menu"
|
||||
>
|
||||
<Icon name="bars" class="hamburger-icon bars-icon" aria-hidden="true" />
|
||||
<Icon name="xmark" class="hamburger-icon xmark-icon" aria-hidden="true" />
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
</header>
|
||||
@@ -1,92 +0,0 @@
|
||||
---
|
||||
const { title } = Astro.props;
|
||||
---
|
||||
|
||||
<div class="max-xl:hidden ">
|
||||
<div id="nav-content" class="bg-white dark:bg-transparent sticky w-72 mt-8 rounded-2xl dark:border-0 border border-neutral-100 top-14 max-h-[calc(100svh-3.5rem)] overflow-x-hidden px-6 pt-8 pb-12">
|
||||
<div class="flex flex-col gap-4 pl-0">
|
||||
<div>
|
||||
<h3 class="dark:text-zinc-400 text-blacktext/90 font-black tracking-wide text-md uppercase">Table of Contents</h3>
|
||||
</div>
|
||||
<div class="flex flex-col gap-2 pr-6 text-neutral-500 dark:text-neutral-300 ">
|
||||
<ul id="toc-list" class="leading-loose text-base gap-2 border-l dark:border-neutral-500/20 border-blacktext/20">
|
||||
<li class="leading-loose">
|
||||
<a class="inline-block leading-5 pl-4 font-bold text-white border-l dark:border-white border-blacktext dark:hover:border-white hover:border-blacktext" href="#">{title}</a>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<script>
|
||||
document.addEventListener("DOMContentLoaded", function () {
|
||||
const tocList = document.getElementById("toc-list");
|
||||
const content = document.getElementById("content");
|
||||
|
||||
if (!tocList || !content) return;
|
||||
|
||||
const headers = content.querySelectorAll("h2, h3");
|
||||
let currentUl = tocList;
|
||||
|
||||
headers.forEach((header, index) => {
|
||||
if (!header.id) {
|
||||
header.id = header.textContent?.trim().toLowerCase().replace(/\s+/g, "-") + "-" + index;
|
||||
// 👈 Add the class
|
||||
}
|
||||
|
||||
const li = document.createElement("li");
|
||||
const link = document.createElement("a");
|
||||
link.href = `#${header.id}`;
|
||||
link.textContent = header.textContent?.trim() || header.id;
|
||||
|
||||
// If the header is H2, keep pl-6, and if it's H3, use pl-12
|
||||
link.classList.add("inline-block","leading-5", "hover:text-mint-400", "py-2", "border-l", "border-transparent", "dark:hover:border-white","hover:border-blacktext");
|
||||
link.classList.add(header.tagName === "H2" ? "pl-6" : "pl-12");
|
||||
console.log("classes removed 2");
|
||||
li.appendChild(link);
|
||||
|
||||
if (header.tagName === "H2") {
|
||||
currentUl = document.createElement("ul");
|
||||
currentUl.classList.add("border-neutral-400","dark:hover:border-white","hover:border-blacktext", "pl-0");
|
||||
console.log("classes removed 3");
|
||||
const h2Li = document.createElement("li");
|
||||
h2Li.appendChild(link);
|
||||
h2Li.appendChild(currentUl);
|
||||
tocList.appendChild(h2Li);
|
||||
} else {
|
||||
currentUl.appendChild(li);
|
||||
}
|
||||
|
||||
// Smooth scroll when clicking on a link
|
||||
link.addEventListener("click", function (e) {
|
||||
e.preventDefault();
|
||||
document.getElementById(header.id)?.scrollIntoView({ behavior: "smooth", block: "start" });
|
||||
});
|
||||
});
|
||||
|
||||
// 👇 Detect the active header
|
||||
const observer = new IntersectionObserver(
|
||||
(entries) => {
|
||||
entries.forEach((entry) => {
|
||||
const id = entry.target.getAttribute("id");
|
||||
const link = document.querySelector(`a[href="#${id}"]`);
|
||||
|
||||
if (entry.isIntersecting) {
|
||||
// Remove class from all and add only to the active one
|
||||
document.querySelectorAll("#toc-list a").forEach((el) => {
|
||||
el.classList.remove("font-semibold", "dark:text-mint-300!", "text-blacktext!", "dark:border-white!", "border-blacktext!" );
|
||||
el.classList.add("dark:text-neutral-300","text-neutral-500" );
|
||||
console.log("classes removed 4");
|
||||
});
|
||||
|
||||
link?.classList.add("font-semibold", "dark:text-mint-300!", "text-blacktext!", "border-l", "dark:border-white!", "border-blacktext!");
|
||||
}
|
||||
});
|
||||
},
|
||||
{ rootMargin: "-30% 0px -65% 0px", threshold: 0.1 } // Adjusted to improve visibility
|
||||
);
|
||||
|
||||
headers.forEach((header) => observer.observe(header));
|
||||
});
|
||||
</script>
|
||||
@@ -1,168 +0,0 @@
|
||||
---
|
||||
import Social from "../ui/Social.astro";
|
||||
import { AstroError } from "astro/errors";
|
||||
import { getCollection} from "astro:content";
|
||||
|
||||
const [staticData] = await getCollection('staticData');
|
||||
|
||||
if (!staticData) {
|
||||
throw new AstroError("JSON data not found");
|
||||
}
|
||||
|
||||
const { items = [] }: { items: (keyof typeof menu)[] } = Astro.props as {
|
||||
items: (keyof typeof menu)[];
|
||||
};
|
||||
|
||||
const menu = {
|
||||
about: { name: "About Me", path: "/about-me" },
|
||||
blog: {
|
||||
name: "Blog",
|
||||
path: "/blog/",
|
||||
dropdown: [
|
||||
{ name: "All Posts", path: "/blog/posts/" },
|
||||
]
|
||||
},
|
||||
home: { name: "Home", path: "/#home" },
|
||||
experience: { name: "Experience", path: "/#experience" },
|
||||
projects: { name: "Projects", path: "/#projects" },
|
||||
};
|
||||
|
||||
// Common base classes
|
||||
const baseClasses = {
|
||||
nav: "nav-links flex w-full justify-center gap-6 max-md:gap-3 max-md:py-6",
|
||||
link: "px-2 py-2 transition-all hover:text-mint-300 max-md:mx-auto max-md:w-full max-md:px-6 max-md:py-2 ",
|
||||
socialContainer: "flex items-center justify-center gap-5 md:hidden",
|
||||
dropdown: "relative group flex items-center",
|
||||
dropdownMenu: "absolute left-0 top-full hidden group-hover:block bg-white dark:bg-zinc-800 shadow-lg rounded-md py-2 min-w-[200px] z-50",
|
||||
dropdownItem: "block px-4 py-2 text-sm hover:bg-mint-100 dark:hover:bg-zinc-700 transition-colors"
|
||||
} as const;
|
||||
---
|
||||
|
||||
<script>
|
||||
document.addEventListener("DOMContentLoaded", () => {
|
||||
const isHome = window.location.pathname === "/";
|
||||
|
||||
// Classes for link states
|
||||
const linkClasses = {
|
||||
active: ["text-mint-500","dark:text-mint-400", "font-bold", "[text-shadow:1px_1px_11px_rgba(208,251,229,0.7)]"],
|
||||
inactive: ["dark:text-zinc-300", "text-blacktext"]
|
||||
};
|
||||
|
||||
function toggleLinkClasses(link: Element, isActive: boolean) {
|
||||
if (isActive) {
|
||||
link.classList.add(...linkClasses.active);
|
||||
link.classList.remove(...linkClasses.inactive);
|
||||
link.setAttribute('aria-current', 'page');
|
||||
} else {
|
||||
link.classList.remove(...linkClasses.active);
|
||||
link.classList.add(...linkClasses.inactive);
|
||||
link.removeAttribute('aria-current');
|
||||
}
|
||||
}
|
||||
|
||||
function updateActiveLink() {
|
||||
const currentPath = window.location.pathname;
|
||||
const currentHash = window.location.hash ? `#${window.location.hash.substring(1)}` : "";
|
||||
|
||||
document.querySelectorAll("nav a").forEach((link) => {
|
||||
const path = link.getAttribute("data-path");
|
||||
toggleLinkClasses(link, path === currentPath || path === currentHash);
|
||||
});
|
||||
}
|
||||
|
||||
function setupScrollSpy() {
|
||||
if (!isHome) return;
|
||||
|
||||
const sections = document.querySelectorAll("section[id]");
|
||||
const navLinks = document.querySelectorAll("nav a");
|
||||
|
||||
const observerOptions = {
|
||||
root: null,
|
||||
rootMargin: "-50% 0px",
|
||||
threshold: 0
|
||||
};
|
||||
|
||||
const observer = new IntersectionObserver((entries) => {
|
||||
entries.forEach(entry => {
|
||||
if (entry.isIntersecting) {
|
||||
const sectionId = entry.target.getAttribute("id");
|
||||
if (sectionId) {
|
||||
navLinks.forEach(link => {
|
||||
const path = link.getAttribute("data-path");
|
||||
toggleLinkClasses(link, path === `/#${sectionId}`);
|
||||
});
|
||||
}
|
||||
}
|
||||
});
|
||||
}, observerOptions);
|
||||
|
||||
sections.forEach(section => observer.observe(section));
|
||||
}
|
||||
|
||||
updateActiveLink();
|
||||
setupScrollSpy();
|
||||
window.addEventListener("hashchange", updateActiveLink);
|
||||
});
|
||||
</script>
|
||||
|
||||
<nav
|
||||
class={baseClasses.nav}
|
||||
role="navigation"
|
||||
aria-label="Main Navigation"
|
||||
>
|
||||
{
|
||||
items.map((key: string) => {
|
||||
const item = menu[key as keyof typeof menu];
|
||||
if (!item) return null;
|
||||
|
||||
if ('dropdown' in item) {
|
||||
return (
|
||||
<div class={baseClasses.dropdown}>
|
||||
<a
|
||||
href={item.path}
|
||||
class={baseClasses.link}
|
||||
data-path={item.path}
|
||||
aria-label={item.name}
|
||||
aria-current={item.path === Astro.url.pathname ? 'page' : undefined}
|
||||
>
|
||||
{item.name}
|
||||
</a>
|
||||
<div class={baseClasses.dropdownMenu}>
|
||||
{item.dropdown.map((dropdownItem) => (
|
||||
<a
|
||||
href={dropdownItem.path}
|
||||
class={baseClasses.dropdownItem}
|
||||
data-path={dropdownItem.path}
|
||||
aria-label={dropdownItem.name}
|
||||
>
|
||||
{dropdownItem.name}
|
||||
</a>
|
||||
))}
|
||||
</div>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
|
||||
return (
|
||||
<a
|
||||
href={item.path}
|
||||
class={baseClasses.link}
|
||||
data-path={item.path}
|
||||
aria-label={item.name}
|
||||
aria-current={item.path === Astro.url.pathname ? 'page' : undefined}
|
||||
>
|
||||
{item.name}
|
||||
</a>
|
||||
);
|
||||
})
|
||||
}
|
||||
|
||||
<div
|
||||
class={baseClasses.socialContainer}
|
||||
role="group"
|
||||
aria-label="Social Media Links"
|
||||
>
|
||||
<Social link={staticData.data.github} iconName={staticData.data.githubIconName} />
|
||||
<Social link={staticData.data.linkedin} iconName={staticData.data.linkedinIconName} />
|
||||
</div>
|
||||
</nav>
|
||||
@@ -1,42 +0,0 @@
|
||||
---
|
||||
const allPosts = await Astro.glob("../../pages/blog/posts/*.md");
|
||||
|
||||
|
||||
// Ensure posts have a date before sorting them
|
||||
const sortedPosts = allPosts
|
||||
.filter(post => post.frontmatter.pubDate)
|
||||
.sort((a, b) => new Date(b.frontmatter.pubDate).getTime() - new Date(a.frontmatter.pubDate).getTime());
|
||||
|
||||
const currentSlug = Astro.url.pathname.split("/").filter(Boolean).pop();
|
||||
const currentIndex = sortedPosts.findIndex((post) =>
|
||||
post.url && post.url.includes(currentSlug || "")
|
||||
);
|
||||
const nextPost = currentIndex > 0 ? sortedPosts[currentIndex - 1] : null;
|
||||
const prevPost = currentIndex < sortedPosts.length - 1 ? sortedPosts[currentIndex + 1] : null;
|
||||
|
||||
console.log({ prevPost, nextPost });
|
||||
---
|
||||
|
||||
<nav class="mt-8 flex flex-row gap-2 w-full p-6 max-xl:p-3 max-lg:p-2">
|
||||
{prevPost && (
|
||||
<a
|
||||
href={prevPost.url}
|
||||
style="width: -webkit-fill-available;"
|
||||
class="relative flex min-w-1/2 items-center justify-start gap-2 font-semibold dark:text-white text-blacktext text-left text-pretty max-sm:text-xs max-md:text-sm max-md:leading-4 hover:text-mint-300 hover:[text-shadow:1px_1px_11px_rgba(208,251,229,0.7)] transition-all before:absolute before:-top-5 before:left-0 before:text-sm before:font-light before:content-['Previous_Post']"
|
||||
>
|
||||
<svg width="15" height="15" viewBox="0 0 15 15" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M6.85355 3.85355C7.04882 3.65829 7.04882 3.34171 6.85355 3.14645C6.65829 2.95118 6.34171 2.95118 6.14645 3.14645L2.14645 7.14645C1.95118 7.34171 1.95118 7.65829 2.14645 7.85355L6.14645 11.8536C6.34171 12.0488 6.65829 12.0488 6.85355 11.8536C7.04882 11.6583 7.04882 11.3417 6.85355 11.1464L3.20711 7.5L6.85355 3.85355ZM12.8536 3.85355C13.0488 3.65829 13.0488 3.34171 12.8536 3.14645C12.6583 2.95118 12.3417 2.95118 12.1464 3.14645L8.14645 7.14645C7.95118 7.34171 7.95118 7.65829 8.14645 7.85355L12.1464 11.8536C12.3417 12.0488 12.6583 12.0488 12.8536 11.8536C13.0488 11.6583 13.0488 11.3417 12.8536 11.1464L9.20711 7.5L12.8536 3.85355Z" fill="currentColor" fill-rule="evenodd" clip-rule="evenodd"></path></svg>
|
||||
{prevPost.frontmatter.title}
|
||||
</a>
|
||||
)}
|
||||
|
||||
{nextPost && (
|
||||
<a
|
||||
href={nextPost.url}
|
||||
style="width: -webkit-fill-available;"
|
||||
class="relative flex min-w-1/2 items-center justify-end gap-2 font-semibold dark:text-white text-blacktext text-right text-pretty max-sm:text-xs max-md:text-sm max-md:leading-4 hover:text-mint-300 hover:[text-shadow:1px_1px_11px_rgba(208,251,229,0.7)] transition-all before:absolute before:-top-5 before:right-0 before:text-sm before:font-light before:content-['Next_Post']"
|
||||
>
|
||||
{nextPost.frontmatter.title}
|
||||
<svg width="15" height="15" viewBox="0 0 15 15" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M2.14645 11.1464C1.95118 11.3417 1.95118 11.6583 2.14645 11.8536C2.34171 12.0488 2.65829 12.0488 2.85355 11.8536L6.85355 7.85355C7.04882 7.65829 7.04882 7.34171 6.85355 7.14645L2.85355 3.14645C2.65829 2.95118 2.34171 2.95118 2.14645 3.14645C1.95118 3.34171 1.95118 3.65829 2.14645 3.85355L5.79289 7.5L2.14645 11.1464ZM8.14645 11.1464C7.95118 11.3417 7.95118 11.6583 8.14645 11.8536C8.34171 12.0488 8.65829 12.0488 8.85355 11.8536L12.8536 7.85355C13.0488 7.65829 13.0488 7.34171 12.8536 7.14645L8.85355 3.14645C8.65829 2.95118 8.34171 2.95118 8.14645 3.14645C7.95118 3.34171 7.95118 3.65829 8.14645 3.85355L11.7929 7.5L8.14645 11.1464Z" fill="currentColor" fill-rule="evenodd" clip-rule="evenodd"></path></svg>
|
||||
</a>
|
||||
)}
|
||||
</nav>
|
||||
@@ -1,40 +0,0 @@
|
||||
---
|
||||
import Heading from "../ui/Heading.astro";
|
||||
import Button from "../ui/Button.astro";
|
||||
import { AstroError } from "astro/errors";
|
||||
import { getCollection} from "astro:content";
|
||||
|
||||
const [staticData] = await getCollection('staticData');
|
||||
|
||||
if (!staticData) {
|
||||
throw new AstroError("JSON data not found");
|
||||
}
|
||||
---
|
||||
|
||||
<section>
|
||||
<div
|
||||
class="w-full border-b bg-linear-to-b from-mint-100 to-transparent dark:from-mint-800 dark:border-mint-950 border-mint-100"
|
||||
>
|
||||
<div class="mx-auto max-w-5xl px-8 py-24 max-sm:py-12">
|
||||
<div class="flex items-center justify-between max-sm:flex-col max-sm:gap-8 max-sm:text-center">
|
||||
<div class="max-w-lg">
|
||||
<Heading
|
||||
text={staticData.data.contactSectionSubtitle}
|
||||
textGradient={staticData.data.contactSectionSubtitle}
|
||||
level={2}
|
||||
/>
|
||||
</div>
|
||||
<div
|
||||
class="transition-all duration-500 group-hover:animate-jump group-hover:animate-duration-[300ms] group-hover:animate-ease-in-out group-hover:scale-105 hover:scale-125"
|
||||
>
|
||||
<Button
|
||||
variant="big"
|
||||
link={`mailto:${staticData.data.email}`}
|
||||
text={staticData.data.contactSectionButtonText}
|
||||
iconName={staticData.data.contactSectionButtonIcon}
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
@@ -1,39 +0,0 @@
|
||||
---
|
||||
import ExperienceItem from "./ExperienceItem.astro";
|
||||
const EXPERIENCE = [
|
||||
{
|
||||
date: "2021 - Present",
|
||||
title: "Software Development Coordinator",
|
||||
company: "EFEELE.DEV",
|
||||
description:
|
||||
"I lead the planning, development, and implementation of software projects to optimize administrative processes and improve digital services. I manage and provide support for technology platforms, coordinating development teams to deliver efficient solutions.",
|
||||
},
|
||||
{
|
||||
date: "2019 - 2020",
|
||||
title: "Software Development Coordinator",
|
||||
company: "EFEELE.DEV",
|
||||
description:
|
||||
"I lead the planning, development, and implementation of software projects to optimize administrative processes and improve digital services. I manage and provide support for technology platforms, coordinating development teams to deliver efficient solutions.",
|
||||
},
|
||||
|
||||
];
|
||||
---
|
||||
|
||||
<div class="relative max-md:mt-0 mt-8" aria-label="Professional experience">
|
||||
<ol class="relative mt-10">
|
||||
{
|
||||
EXPERIENCE.map((experience, index) => (
|
||||
<li class="">
|
||||
<article role="article" aria-labelledby={`experience-title-${index}`}>
|
||||
<div
|
||||
class="flex flex-col gap-2 text-zinc-00 dark:text-zinc-300 md:col-span-3"
|
||||
aria-describedby={`experience-title-${index}`}
|
||||
>
|
||||
<ExperienceItem {...experience} />
|
||||
</div>
|
||||
</article>
|
||||
</li>
|
||||
))
|
||||
}
|
||||
</ol>
|
||||
</div>
|
||||
@@ -1,41 +0,0 @@
|
||||
---
|
||||
interface Props {
|
||||
title: string;
|
||||
company: string;
|
||||
description: string;
|
||||
link?: string;
|
||||
date: string;
|
||||
}
|
||||
|
||||
const { title, company, description, link, date } = Astro.props;
|
||||
---
|
||||
|
||||
<div
|
||||
class="relative mx-12 pb-12 grid md:grid-cols-5 md:gap-10 before:absolute before:left-[-35px] before:block before:h-full before:border-l-2 before:border-black/20 dark:before:border-white/15 before:content-['']"
|
||||
>
|
||||
<div class="pb-12 md:col-span-2">
|
||||
<div class="sticky top-0">
|
||||
<span
|
||||
class="absolute -left-[42px] text-5xl text-mint-400 rounded-full drop-shadow-[0px_0px_8px_rgba(0,255,94,1)]"
|
||||
>•</span
|
||||
>
|
||||
<h3
|
||||
|
||||
class="text-xl font-bold text-mint-400"
|
||||
>
|
||||
{title}
|
||||
</h3>
|
||||
<h4 class="text-xl font-semibold text-zinc-600 dark:text-white">
|
||||
{company}
|
||||
</h4>
|
||||
<time datetime={date} class="text-sm text-zinc-600/80 dark:text-white/80">
|
||||
{date}
|
||||
</time>
|
||||
</div>
|
||||
</div>
|
||||
<div
|
||||
class="flex flex-col gap-2 pb-4 text-zinc-00 dark:text-zinc-300 md:col-span-3"
|
||||
>
|
||||
{description}
|
||||
</div>
|
||||
</div>
|
||||
@@ -1,206 +0,0 @@
|
||||
---
|
||||
import Button from "../ui/Button.astro";
|
||||
import Heading from "../ui/Heading.astro";
|
||||
import Tools from "../portfolio/Tools.astro";
|
||||
import { Icon } from "astro-icon/components";
|
||||
import Hobbies from "../portfolio/Hobbies.astro";
|
||||
import { AstroError } from "astro/errors";
|
||||
import { getCollection} from "astro:content";
|
||||
|
||||
const [staticData] = await getCollection('staticData');
|
||||
|
||||
if (!staticData) {
|
||||
throw new AstroError("JSON data not found");
|
||||
}
|
||||
---
|
||||
|
||||
<section
|
||||
class="scroll-m-16 px-8 max-sm:px-4 py-8"
|
||||
id="home"
|
||||
aria-label="Professional profile and introduction"
|
||||
>
|
||||
<div
|
||||
class="mx-auto mb-4 h-96 w-full max-w-7xl rounded-2xl bg-linear-to-r from-mint-300 dark:from-mint-600 to-mint-50 dark:to-mint-200/5 hover:to-mint-300/30 dark:hover:to-mint-600/30 p-[.2rem] max-md:h-auto"
|
||||
>
|
||||
<div
|
||||
class="group relative z-0 flex h-full items-center justify-center gap-8 overflow-hidden rounded-2xl bg-linear-to-tr from-riptide-100 to-white p-4 transition-all hover:shadow-[0_10px_50px_rgba(13,188,130,0.2)] dark:bg-linear-to-r dark:from-mint-950 dark:to-zinc-950 dark:overflow-hidden max-md:w-full max-md:gap-3 max-lg:gap-2 max-sm:flex-col dark:before:bg-[radial-gradient(circle,rgba(13,188,130)_0,rgba(1,45,34)_100%)] before:bg-[radial-gradient(circle,rgba(95,255,202)_0,rgba(144,253,210)_100%)] before:absolute before:left-65 before:top-10 before:h-[40%] before:aspect-square before:rounded-full before:blur-3xl before:opacity-80 before:-z-10 before:transition hover:before:animate-pulse"
|
||||
>
|
||||
<div class="aspect-square h-4/5 max-md:size-32">
|
||||
<div
|
||||
class="group-hover:scale-105 relative z-10 flex w-full cursor-pointer items-center overflow-hidden rounded-full p-[2px] transition-all duration-500"
|
||||
>
|
||||
<div
|
||||
class="absolute inset-0 h-full w-full rounded-fullfrom-transparent to-riptide-500 dark:from-transparent f dark:to-mint-300 animate-rotate-border bg-conic/[from_var(--border-angle)] "
|
||||
>
|
||||
</div>
|
||||
<div class="relative z-20 flex w-full rounded-full bg-mint-900">
|
||||
<div
|
||||
class="w-full aspect-square rounded-full bg-center bg-cover"
|
||||
style={`background-image: url(${staticData.data.profileImage})`}
|
||||
aria-label={staticData.data.profileAlt}
|
||||
>
|
||||
<a
|
||||
href={staticData.data.profileLink}
|
||||
class="flex h-full w-full"
|
||||
aria-label="View about me page"></a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div
|
||||
class="flex h-full w-7/12 flex-col justify-center gap-4 p-4 max-md:w-full max-md:gap-2"
|
||||
>
|
||||
<span
|
||||
class="relative inline-flex items-center text-xs font-semibold leading-0 dark:text-white text-blacktext max-md:font-medium max-sm:justify-center"
|
||||
>
|
||||
<span
|
||||
class="before:mr-2 before:block before:h-1.5 before:w-1.5 before:rounded-full before:bg-green-400 before:shadow-[0px_0px_0px_3px_rgba(34,197,94,0.5)] before:animate-pulse before:content-['']"
|
||||
></span>
|
||||
Available for work
|
||||
</span>
|
||||
|
||||
<h1
|
||||
class="text-4xl font-black leading-none text-blacktext dark:text-white max-xl:text-3xl max-lg:text-2xl max-sm:text-center"
|
||||
>
|
||||
{staticData.data.profileName} 👋
|
||||
</h1>
|
||||
<p
|
||||
class="mb-0 text-lg font-semibold leading-8 text-blacktext dark:text-gray-200 max-xl:text-base"
|
||||
>
|
||||
<span
|
||||
class="bg-linear-to-r from-riptide-500 to-mint-500 bg-clip-text font-black text-transparent dark:from-riptide-300 dark:to-mint-200"
|
||||
>{staticData.data.profileTitle}</span
|
||||
> with <span
|
||||
class="bg-linear-to-r from-riptide-500 to-mint-500 bg-clip-text font-black text-transparent dark:from-riptide-300 dark:to-mint-200"
|
||||
>8 years of experience</span
|
||||
>, passionate about development, technology, and coffee that sparks ideas. I love bringing digital projects to life. 🚀☕
|
||||
</p>
|
||||
|
||||
<div class="flex gap-4 max-sm:flex-col max-sm:items-center">
|
||||
<Button
|
||||
link={"mailto:" + staticData.data.email}
|
||||
text={staticData.data.contactSectionButtonText}
|
||||
iconName={staticData.data.emailIconName}
|
||||
/>
|
||||
<Button
|
||||
link={staticData.data.profileLink}
|
||||
text="About Me"
|
||||
iconName="person"
|
||||
variant="dark"
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div
|
||||
class="mx-auto grid max-w-7xl grid-cols-2 grid-rows-4 max-sm:gap-3 gap-4 max-md:h-[80vh] max-sm:h-[900px] max-xl:h-[550px] xl:h-[700px] md:grid-cols-4 md:grid-rows-2"
|
||||
>
|
||||
<div
|
||||
class="col-start-2 row-start-2 flex flex-col gap-3 rounded-2xl border border-emerald-50 bg-linear-to-r from-riptide-200 to-mint-200 p-8 dark:border-zinc-800 dark:border-2 dark:bg-zinc-800 dark:bg-gradient-radial dark:from-riptide-500 dark:to-mint-500 max-md:gap-0 max-xl:p-5 max-md:p-4 max-lg:gap-1 md:col-start-4"
|
||||
>
|
||||
<div class="flex flex-col-reverse items-start gap-4 max-md:gap-2">
|
||||
<Heading text="Beyond the Code" level={3} />
|
||||
</div>
|
||||
|
||||
<div class="overflow-y-auto">
|
||||
<Hobbies />
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div
|
||||
class="col-start-1 row-start-2 rounded-2xl bg-linear-to-r from-mint-300 dark:from-mint-600 to-mint-50 dark:to-mint-200/5 hover:to-mint-300/30 dark:hover:to-mint-600/30 p-[.2rem] transition-all ease-in duration-150 hover:scale-105 hover:shadow-[0_20px_50px_rgba(13,188,130,0.4)] z-40 md:col-start-3"
|
||||
>
|
||||
<div class="h-full w-full overflow-hidden rounded-2xl dark:bg-zinc-900">
|
||||
<div
|
||||
class="relative h-full w-full overflow-hidden rounded-2xl bg-linear-to-tr from-riptide-100 to-white dark:from-transparent dark:bg-linear-to-bl dark:to-transparent "
|
||||
>
|
||||
<a
|
||||
target="_blank"
|
||||
href={staticData.data.github}
|
||||
aria-label="View this site's code repository on GitHub"
|
||||
>
|
||||
<div
|
||||
class="relative flex h-full flex-col gap-8 p-8 dark:before:bg-[radial-gradient(circle,rgba(13,188,130)_0,rgba(1,45,34)_100%)] before:bg-[radial-gradient(circle,rgba(95,255,202)_0,rgba(144,253,210)_100%)] before:absolute before:left-30 before:bottom-30 before:h-[30%] before:aspect-square before:rounded-full before:blur-3xl before:opacity-90 before:transition before:z-0 max-xl:p-5 max-md:p-4 xl:before:bottom-10"
|
||||
>
|
||||
<div class="z-2">
|
||||
<Heading text="Do you like this site's design?" level={3}/>
|
||||
</div>
|
||||
|
||||
<Icon
|
||||
class="absolute -bottom-10 left-30 size-50 text-mint-500/30 group-hover:animate-pulse ease-in-out max-sm:left-10 max-md:left-30 xl:size-56 xl:-bottom-5 xl:-right-24"
|
||||
name="github"
|
||||
aria-hidden="true"
|
||||
/>
|
||||
</div>
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div
|
||||
class="col-span-2 col-start-1 row-start-1 rounded-2xl bg-linear-to-r from-mint-300 dark:from-mint-600 to-mint-50 dark:to-mint-200/5 hover:to-mint-300/30 dark:hover:to-mint-600/30 p-[.2rem] md:col-start-3"
|
||||
>
|
||||
<article
|
||||
class="group relative z-0 flex h-full w-full flex-col overflow-hidden rounded-2xl bg-linear-to-tr from-riptide-100 to-mint-100 p-6 transition hover:shadow-[0_10px_50px_rgba(13,188,130,0.2)] dark:bg-linear-to-r dark:from-mint-900 dark:to-mint-950 dark:overflow-hidden max-md:p-4 gap-6 max-md:gap-3 max-lg:gap-4 dark:before:bg-[radial-gradient(circle,rgba(13,188,130)_0,rgba(1,45,34)_100%)] before:bg-[radial-gradient(circle,rgba(95,255,202)_0,rgba(144,253,210)_100%)] before:absolute before:left-30 before:-bottom-0 before:h-[80%] before:aspect-square before:rounded-full before:blur-3xl dark:before:opacity-80 before:opacity-30 before:-z-10 before:transition"
|
||||
>
|
||||
<div class="flex items-center gap-4 max-md:gap-2">
|
||||
<Icon
|
||||
class="text-3xl dark:text-white text-mint-500 max-md:text-2xl max-sm:text-sm"
|
||||
name="dashboard"
|
||||
aria-hidden="true"
|
||||
/>
|
||||
<Heading text="Tech" textGradient="Stack" level={3} />
|
||||
</div>
|
||||
<div class="overflow-y-auto">
|
||||
<Tools />
|
||||
</div>
|
||||
</article>
|
||||
</div>
|
||||
|
||||
<div
|
||||
class="col-span-2 row-span-2 rounded-2xl bg-linear-to-r from-mint-300 dark:from-mint-600 to-mint-50 dark:to-mint-200/5 p-[.2rem] hover:to-mint-300/30 dark:hover:to-mint-600/30 md:col-start-1 md:row-start-1"
|
||||
>
|
||||
<article
|
||||
class="group relative flex h-full flex-col justify-start overflow-hidden rounded-2xl bg-linear-to-br from-riptide-100 to-white dark:from-mint-950 dark:to-zinc-950 p-8 transition-all hover:shadow-[0_20px_50px_rgba(13,188,130,0.4)] max-md:p-6 dark:before:bg-[radial-gradient(circle,rgba(13,188,130)_0,rgba(1,45,34)_100%)] before:bg-[radial-gradient(circle,rgba(95,255,202)_0,rgba(144,253,210)_100%)] before:absolute before:left-1/2 before:bottom-30 before:h-[30%] before:aspect-square before:rounded-full before:blur-3xl before:opacity-70 before:transition before:-z-0 hover:before:animate-pulse xl:before:bottom-2/5"
|
||||
>
|
||||
<a
|
||||
href="#projects"
|
||||
class="absolute left-0 top-0 z-40 h-full w-full bg-transparent"
|
||||
aria-label="View projects section"></a>
|
||||
<div class="flex items-center gap-4 max-md:gap-2">
|
||||
<Icon
|
||||
class="text-3xl dark:text-white text-mint-500 max-md:text-2xl max-sm:text-xl"
|
||||
name="code"
|
||||
aria-hidden="true"
|
||||
/>
|
||||
<Heading text="Projects" level={3}/>
|
||||
</div>
|
||||
<p
|
||||
class="z-2 my-6 text-lg font-semibold leading-6 dark:text-gray-200 text-blacktext max-xl:text-base max-w-[90%] max-md:max-w-[85%]"
|
||||
>
|
||||
I love <span
|
||||
class="bg-linear-to-r from-riptide-500 to-mint-500 bg-clip-text font-black text-transparent dark:from-riptide-300 dark:to-mint-200"
|
||||
>turning ideas into real projects.</span
|
||||
>
|
||||
<br /> Here I show you some of the <span
|
||||
class="bg-linear-to-r from-riptide-500 to-mint-500 bg-clip-text font-black text-transparent dark:from-riptide-300 dark:to-mint-200"
|
||||
>developments</span
|
||||
> I've worked on, applying technology, design, and lots of creativity.
|
||||
<span
|
||||
class="bg-linear-to-r from-riptide-500 to-mint-500 font-black bg-clip-text text-transparent dark:from-riptide-300 dark:to-mint-200"
|
||||
>Check them out!</span
|
||||
>
|
||||
</p>
|
||||
<img
|
||||
class="relative left-0 z-0 mt-40 w-full object-cover transition-all ease-in-out duration-500 group-hover:rotate-2 group-hover:scale-185 max-xl:mt-28 max-lg:mt-10 max-sm:mt-0 max-md:scale-100 max-sm:scale-125 scale-180 max-md:group-hover:scale-105 before:bg-[radial-gradient(circle,rgba(13,188,130)_0,rgba(1,45,34)_100%)] before:absolute before:left-30 before:-bottom-0 before:h-[80%] before:aspect-square before:rounded-full before:blur-3xl before:opacity-80 before:-z-10 before:transition"
|
||||
src={staticData.data.portfolioImage}
|
||||
alt="View of two website interfaces with modern and dark design. The first screen shows the title 'Behind the Code' with a rocket and dark background, explaining the origin of a community software project. The second screen presents a platform for finding speakers, with an attractive design, expert photos, and a prominent search button."
|
||||
loading="lazy"
|
||||
width="480"
|
||||
height="320"
|
||||
/>
|
||||
</article>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
@@ -1,9 +0,0 @@
|
||||
---
|
||||
const { tag } = Astro.props;
|
||||
---
|
||||
|
||||
<span
|
||||
class="px-4 py-1 rounded-full text-sm font-medium text-zinc-500 dark:text-neutral-400 hover:text-blacktext bg-riptide-50 dark:bg-zinc-800 hover:bg-mint-200 cursor-default transition-all ease-in-out duration-300"
|
||||
>
|
||||
{tag}
|
||||
</span>
|
||||
@@ -1,37 +0,0 @@
|
||||
---
|
||||
interface Props {
|
||||
variant?: 'default' | 'vertical';
|
||||
}
|
||||
|
||||
const hobbies = [
|
||||
"Writing",
|
||||
"Camping",
|
||||
"Coffee",
|
||||
"Music",
|
||||
"Movies",
|
||||
"Board Games"
|
||||
];
|
||||
|
||||
import Hobbie from "./Hobbie.astro";
|
||||
|
||||
const baseClasses = "max-w-7xl gap-3 py-4 max-md:py-3";
|
||||
|
||||
const variants = {
|
||||
default: `${baseClasses} flex-wrap mx-auto max-md:gap-2 max-sm:gap-1 justify-start items-center flex flex-row`,
|
||||
vertical: `${baseClasses} max-sm:gap-2 justify-start items-start flex flex-col`
|
||||
} as const;
|
||||
|
||||
const { variant = "default" } = Astro.props as Props;
|
||||
const classes = variants[variant];
|
||||
---
|
||||
|
||||
<div id="tags" class={classes}>
|
||||
{hobbies.map((hobby) => <Hobbie tag={hobby} />)}
|
||||
</div>
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
@@ -1,61 +0,0 @@
|
||||
---
|
||||
import Project from "./Project.astro";
|
||||
const allPosts = await Astro.glob("../../pages/portfolio/projects/*.md");
|
||||
// Sort by descending date (most recent first)
|
||||
allPosts.sort(
|
||||
(a, b) =>
|
||||
new Date(b.frontmatter.pubDate).getTime() -
|
||||
new Date(a.frontmatter.pubDate).getTime(),
|
||||
);
|
||||
---
|
||||
|
||||
<section class="relative pt-8 pb-32 max-2xl:px-8 max-md:pt-4">
|
||||
<div class="mx-auto max-w-7xl py-8">
|
||||
<slot />
|
||||
</div>
|
||||
|
||||
<div
|
||||
id="containerProjects"
|
||||
class="mx-auto max-w-7xl grid grid-cols-3 max-lg:grid-cols-2 max-md:grid-cols-1 gap-5 p-2 py-4 max-h-[150vh] overflow-hidden transition-[max-height] duration-500 ease-in-out"
|
||||
>
|
||||
{
|
||||
allPosts.map((post) => (
|
||||
<Project
|
||||
url={post.url}
|
||||
title={post.frontmatter.title}
|
||||
description={post.frontmatter.description}
|
||||
date={post.frontmatter.pubDate}
|
||||
languages={post.frontmatter.languages}
|
||||
image={post.frontmatter.image}
|
||||
/>
|
||||
))
|
||||
}
|
||||
</div>
|
||||
|
||||
<div
|
||||
id="moreProjects"
|
||||
class="absolute bottom-0 left-0 w-full flex justify-center text-center bg-linear-to-t from-[#FBFEFD] dark:from-[#0e0e10] from-55% to-transparent to-100% pb-30 pt-52"
|
||||
>
|
||||
<button
|
||||
class="absolute font-bold cursor-pointer text-mint-400 dark:text-mint-100 hover:text-mint-500 dark:hover:text-mint-300 transition-all"
|
||||
>
|
||||
View More Projects...
|
||||
</button>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<script>
|
||||
document.querySelector("#moreProjects")?.addEventListener("click", () => {
|
||||
const contenedor = document.querySelector("#containerProjects") as HTMLElement;
|
||||
const moreprojects = document.querySelector("#moreProjects");
|
||||
|
||||
if (contenedor && moreprojects) {
|
||||
// Use a very large max height to show all content
|
||||
contenedor.style.maxHeight = "15000px";
|
||||
// Hide the view more button
|
||||
setTimeout(() => {
|
||||
moreprojects.classList.add("hidden");
|
||||
}, 5000);
|
||||
}
|
||||
});
|
||||
</script>
|
||||
@@ -1,32 +0,0 @@
|
||||
---
|
||||
const { title, url, image, languages, description, size = "xs" } = Astro.props;
|
||||
|
||||
import Capsule from "../ui/Capsule.astro";
|
||||
---
|
||||
|
||||
<a href={url} class="w-full h-full hover:scale-105 transition-all duration-300 ease-in-out rounded-3xl bg-linear-to-br from-mint-50/50 to-mint-300/10 dark:from-zinc-800 dark:to-mint-800/10">
|
||||
<article class="group h-full gap-4 p-4 max-md:p-6 flex flex-col justify-start items-center cursor-pointer transition-all duration-200 ease-in-out rounded-3xl bg-transparent backdrop-blur-lg hover:backdrop-blur-none overflow-hidden hover:shadow-[0_10px_10px_rgba(0,0,0,0.05)] dark:border-0 dark:hover:shadow-[0_10px_10px_rgba(13,188,130,0.05)] before:absolute before:size-36 before:aspect-square before:rounded-full before:blur-3xl dark:before:blur-3xl dark:before:opacity-20 before:opacity-5 before:transition before:-z-1 before:left-7/12 before:bottom-50 xl:before:-bottom-0 before:bg-[radial-gradient(circle,rgba(71,255,194)_0,rgba(0,255,191)_100%)] dark:before:bg-[radial-gradient(circle,rgba(7,255,173)_0,rgba(1,45,34)_100%)] after:absolute after:size-40 after:aspect-square after:rounded-full dark:after:blur-2xl after:blur-3xl dark:after:opacity-20 after:opacity-10 after:transition after:-z-1 after:-left-10 after:top-1/2 after:bg-[radial-gradient(circle,rgba(0,255,217)_0,rgba(121,249,255,65%)_70%)] dark:after:bg-[radial-gradient(circle,rgba(0,255,218)_0,rgba(2,181,190,65%)_70%)]">
|
||||
<div class="overflow-hidden rounded-xl">
|
||||
<img class="h-auto rounded-xl transition-all duration-300 ease-in-out group-hover:scale-105" src={image.url} alt={image.alt} />
|
||||
</div>
|
||||
<div class="flex flex-col p-2">
|
||||
<div class="flex flex-col gap-3 w-full">
|
||||
<h2 class="text-3xl font-bold text-blacktext dark:text-mint-50">
|
||||
{title}
|
||||
</h2>
|
||||
|
||||
<div class="flex flex-wrap gap-3">
|
||||
{
|
||||
languages.map((language: string) => (
|
||||
<Capsule size={size} linkEnabled={false} lang={language} />
|
||||
))
|
||||
}
|
||||
</div>
|
||||
|
||||
<p class="text-lg max-xl:text-base w-full max-md:max-w-[85%] my-2 leading-6 font-medium text-blacktext dark:text-gray-200">
|
||||
{description}
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
</article>
|
||||
</a>
|
||||
@@ -1,54 +0,0 @@
|
||||
---
|
||||
const allTools = [
|
||||
"html",
|
||||
"javascript",
|
||||
"ts",
|
||||
"angular",
|
||||
"astro",
|
||||
|
||||
"node",
|
||||
|
||||
"css",
|
||||
"tailwind",
|
||||
"sass",
|
||||
"bootstrap",
|
||||
|
||||
"mongo",
|
||||
"firebase",
|
||||
"mysql",
|
||||
|
||||
"cloudflare",
|
||||
|
||||
"figma",
|
||||
"vercel",
|
||||
"netlify",
|
||||
|
||||
"git",
|
||||
"markdown",
|
||||
|
||||
"php",
|
||||
"wordpress",
|
||||
];
|
||||
|
||||
import Capsule from "../ui/Capsule.astro";
|
||||
|
||||
type ToolVariant = "default" | "center";
|
||||
|
||||
// Base classes that are common to all variants
|
||||
const baseClasses = "flex flex-wrap gap-4 max-lg:gap-1 grid-auto-efe";
|
||||
|
||||
// Variant-specific classes
|
||||
const variantClasses: Record<ToolVariant, string> = {
|
||||
default: "cursor-default",
|
||||
center: "justify-center cursor-default",
|
||||
};
|
||||
|
||||
const { variant = "default", linkEnabled = false, size = "md" } = Astro.props;
|
||||
|
||||
// Combine base classes with variant-specific classes
|
||||
const classes = `${baseClasses} ${variantClasses[variant as ToolVariant]}`;
|
||||
---
|
||||
|
||||
<div class={classes}>
|
||||
{allTools.map((tool) => <Capsule lang={tool} linkEnabled={linkEnabled} size={size} />)}
|
||||
</div>
|
||||
@@ -1,166 +0,0 @@
|
||||
---
|
||||
type ButtonVariant = "default" | "big" | "dark";
|
||||
|
||||
interface Props {
|
||||
link: string;
|
||||
text: string;
|
||||
iconName?: string;
|
||||
variant?: ButtonVariant;
|
||||
ariaLabel?: string;
|
||||
disabled?: boolean;
|
||||
isLoading?: boolean;
|
||||
isExternal?: boolean;
|
||||
isActive?: boolean;
|
||||
class?: string;
|
||||
}
|
||||
|
||||
const {
|
||||
link,
|
||||
text,
|
||||
iconName,
|
||||
variant = "default",
|
||||
ariaLabel,
|
||||
disabled = false,
|
||||
isLoading = false,
|
||||
isExternal = false,
|
||||
isActive = false,
|
||||
class: className = ""
|
||||
} = Astro.props as Props;
|
||||
import { Icon } from "astro-icon/components";
|
||||
|
||||
// Common base classes for all buttons
|
||||
const baseClasses = `
|
||||
z-2
|
||||
text-center
|
||||
cursor-pointer
|
||||
leading-none
|
||||
hover:scale-110
|
||||
w-fit
|
||||
font-medium
|
||||
flex
|
||||
gap-2
|
||||
transition-all
|
||||
ease-in-out
|
||||
justify-center
|
||||
items-center
|
||||
rounded-full
|
||||
disabled:opacity-50
|
||||
disabled:cursor-not-allowed
|
||||
disabled:hover:scale-100
|
||||
disabled:hover:bg-none
|
||||
disabled:hover:shadow-none
|
||||
aria-disabled:opacity-50
|
||||
aria-disabled:cursor-not-allowed
|
||||
aria-disabled:hover:scale-100
|
||||
aria-disabled:hover:bg-none
|
||||
aria-disabled:hover:shadow-none
|
||||
`;
|
||||
|
||||
// Specific classes for each variant
|
||||
const variantClasses = {
|
||||
default: `
|
||||
text-blacktext/90
|
||||
dark:text-mint-50
|
||||
dark:hover:text-white
|
||||
px-6
|
||||
py-4
|
||||
max-xl:px-5
|
||||
max-sm:py-2
|
||||
max-sm:px-3
|
||||
text-lg
|
||||
max-xl:text-base
|
||||
max-sm:text-sm
|
||||
hover:bg-linear-to-l
|
||||
bg-linear-to-r
|
||||
from-riptide-300
|
||||
to-mint-300
|
||||
dark:from-riptide-500
|
||||
dark:to-mint-500
|
||||
`,
|
||||
big: `
|
||||
font-normal
|
||||
gap-3
|
||||
max-md:gap-1
|
||||
text-blacktext
|
||||
dark:text-mint-50
|
||||
dark:hover:text-white
|
||||
px-8
|
||||
max-sm:py-3
|
||||
py-5
|
||||
max-xl:px-6
|
||||
max-sm:px-3
|
||||
text-2xl
|
||||
max-xl:text-xl
|
||||
max-sm:text-lg
|
||||
hover:bg-linear-to-l
|
||||
bg-linear-to-r
|
||||
from-riptide-200
|
||||
to-mint-200
|
||||
dark:from-riptide-500
|
||||
dark:to-mint-500
|
||||
`,
|
||||
dark: `
|
||||
group
|
||||
dark:text-mint-50
|
||||
text-blacktext
|
||||
dark:hover:text-white
|
||||
px-6
|
||||
py-4
|
||||
max-xl:px-5
|
||||
max-sm:py-2
|
||||
max-sm:px-3
|
||||
text-lg
|
||||
max-xl:text-base
|
||||
max-sm:text-sm
|
||||
dark:bg-zinc-800
|
||||
bg-white
|
||||
dark:hover:bg-mint-500
|
||||
`,
|
||||
};
|
||||
|
||||
// Icon classes for each variant
|
||||
const iconClasses = {
|
||||
default: "size-5",
|
||||
big: "size-5",
|
||||
dark: "size-5 dark:text-mint-300 text-blacktext group-hover:text-blacktext dark:group-hover:text-white transition-colors",
|
||||
};
|
||||
|
||||
// Combine base classes with variant-specific classes
|
||||
const buttonClasses = `${baseClasses} ${variantClasses[variant]}`;
|
||||
|
||||
// Generate aria-label if not provided
|
||||
const buttonAriaLabel = ariaLabel || (iconName ? `${text} ${iconName}` : text);
|
||||
|
||||
// Determine if it's an external link
|
||||
const isExternalLink = isExternal || link.startsWith('http');
|
||||
|
||||
// Additional attributes for external links
|
||||
const externalAttributes = isExternalLink ? {
|
||||
target: '_blank',
|
||||
rel: 'noopener noreferrer'
|
||||
} : {};
|
||||
|
||||
// Loading state
|
||||
const loadingText = isLoading ? 'Loading...' : text;
|
||||
const loadingAriaLabel = isLoading ? `${buttonAriaLabel} - Loading` : buttonAriaLabel;
|
||||
---
|
||||
|
||||
<div
|
||||
class="w-fit h-fit from-transparent via-riptide-300 to-transparent dark:from-transparent dark:via-mint-500 dark:to-transparent from-40% to-60% animate-rotate-border bg-conic/[from_var(--border-angle)] p-px hover:shadow-lg
|
||||
hover:shadow-mint-500/30 rounded-full"
|
||||
>
|
||||
<a
|
||||
class:list={[buttonClasses, className]}
|
||||
href={disabled ? '#' : link}
|
||||
aria-label={loadingAriaLabel}
|
||||
role="button"
|
||||
aria-disabled={disabled}
|
||||
aria-busy={isLoading}
|
||||
aria-pressed={isActive}
|
||||
{...externalAttributes}
|
||||
>
|
||||
{iconName && <Icon name={iconName} class={iconClasses[variant]} aria-hidden="true" />}
|
||||
{isLoading && <Icon name="mdi:loading" class="animate-spin" aria-hidden="true" />}
|
||||
{loadingText}
|
||||
</a>
|
||||
</div>
|
||||
@@ -1,87 +0,0 @@
|
||||
---
|
||||
import { Icon } from "astro-icon/components";
|
||||
import { getLanguage } from "../../utils/languages";
|
||||
|
||||
interface Props {
|
||||
lang: string;
|
||||
size?: "xs" | "md";
|
||||
linkEnabled?: boolean;
|
||||
}
|
||||
|
||||
const { size = "md", lang, linkEnabled = true } = Astro.props as Props;
|
||||
|
||||
const baseClasses = {
|
||||
container: [
|
||||
"flex items-center w-fit",
|
||||
"pl-2 pr-2 py-0.5 gap-1",
|
||||
"text-sm font-semibold leading-3",
|
||||
"bg-white shadow rounded-full",
|
||||
"transition-all duration-300 ease-in-out hover:bg-zinc-800 hover:text-white",
|
||||
"max-sm:pl-1 max-sm:pr-1.5 max-sm:text-xs max-sm:gap-0.5",
|
||||
].join(" "),
|
||||
iconContainer: [
|
||||
"flex items-center justify-center",
|
||||
"aspect-square",
|
||||
"bg-black rounded-full p-1",
|
||||
].join(" "),
|
||||
};
|
||||
|
||||
const sizeClasses = {
|
||||
xs: "size-5",
|
||||
md: "size-7",
|
||||
};
|
||||
|
||||
const selectedLanguage = getLanguage(lang);
|
||||
|
||||
const getContainerClasses = () => {
|
||||
const textSize = selectedLanguage.name.length > 10 ? "text-sm" : "text-base";
|
||||
return `${baseClasses.container} ${textSize}`;
|
||||
};
|
||||
|
||||
const getIconContainerClasses = () => {
|
||||
return `${baseClasses.iconContainer} ${sizeClasses[size]} max-lg:size-6 max-sm:size-5 ${
|
||||
selectedLanguage.className ? selectedLanguage.className : ""
|
||||
}`;
|
||||
};
|
||||
---
|
||||
|
||||
{
|
||||
linkEnabled ? (
|
||||
<a
|
||||
class="cursor-pointer"
|
||||
href={`/blog/techs/${lang}`}
|
||||
aria-label={`View articles about ${selectedLanguage.name}`}
|
||||
role="link"
|
||||
>
|
||||
<span
|
||||
class={getContainerClasses()}
|
||||
role="presentation"
|
||||
aria-hidden="true"
|
||||
>
|
||||
<div
|
||||
class={getIconContainerClasses()}
|
||||
role="img"
|
||||
aria-label={`${selectedLanguage.name} icon`}
|
||||
>
|
||||
<Icon class="w-full!" name={selectedLanguage.iconName} />
|
||||
</div>
|
||||
{selectedLanguage.name}
|
||||
</span>
|
||||
</a>
|
||||
) : (
|
||||
<span
|
||||
class={`${getContainerClasses()} cursor-default`}
|
||||
role="presentation"
|
||||
aria-hidden="true"
|
||||
>
|
||||
<div
|
||||
class={getIconContainerClasses()}
|
||||
role="img"
|
||||
aria-label={`${selectedLanguage.name} icon`}
|
||||
>
|
||||
<Icon class="w-full!" name={selectedLanguage.iconName} />
|
||||
</div>
|
||||
{selectedLanguage.name}
|
||||
</span>
|
||||
)
|
||||
}
|
||||
@@ -1,35 +0,0 @@
|
||||
---
|
||||
interface Props {
|
||||
text?: string;
|
||||
textGradient?: string;
|
||||
level?: 1 | 2 | 3;
|
||||
className?: string;
|
||||
}
|
||||
|
||||
const { text = "", textGradient = "", level = 1, className = "" } = Astro.props;
|
||||
|
||||
const Tag = `h${level}`;
|
||||
---
|
||||
|
||||
<Tag class:list={[
|
||||
"font-extrabold text-4xl max-xl:text-3xl",
|
||||
level === 2 && "max-md:text-3xl ",
|
||||
level === 3 && "max-md:text-xl ",
|
||||
"dark:text-white text-blacktext",
|
||||
className
|
||||
]}>
|
||||
{text && (
|
||||
<>
|
||||
{text}
|
||||
{textGradient && " "}
|
||||
</>
|
||||
)}
|
||||
{textGradient && (
|
||||
<b
|
||||
class:list={[
|
||||
"bg-linear-to-r from-riptide-500 to-mint-400 dark:from-riptide-500 dark:to-mint-500 text-transparent bg-clip-text",
|
||||
level === 1
|
||||
]}
|
||||
>{textGradient}</b>
|
||||
)}
|
||||
</Tag>
|
||||
@@ -1,10 +0,0 @@
|
||||
---
|
||||
const {class: className} = Astro.props;
|
||||
import { Icon } from "astro-icon/components";
|
||||
---
|
||||
<div
|
||||
class={`flex justify-start items-center gap-2 text-blacktext dark:text-mint-50 ${className || ''}`}
|
||||
>
|
||||
<span class="font-medium tracking-wider">Read more </span>
|
||||
<Icon name="arrow-left" class="size-4 rotate-180" />
|
||||
</div>
|
||||
@@ -1,41 +0,0 @@
|
||||
---
|
||||
import { Icon } from "astro-icon/components";
|
||||
|
||||
const { tweetText, currentUrl } = Astro.props;
|
||||
|
||||
const shareLinks = [
|
||||
{
|
||||
name: "Twitter",
|
||||
icon: "twitter",
|
||||
href: `https://twitter.com/intent/tweet?text=${tweetText}&url=${currentUrl}`,
|
||||
},
|
||||
{
|
||||
name: "Facebook",
|
||||
icon: "facebook",
|
||||
href: `https://www.facebook.com/sharer/sharer.php?u=${currentUrl}`,
|
||||
},
|
||||
{
|
||||
name: "WhatsApp",
|
||||
icon: "whatsapp",
|
||||
href: `https://api.whatsapp.com/send?text=${encodeURIComponent(`${currentUrl}`)}`,
|
||||
},
|
||||
];
|
||||
---
|
||||
|
||||
<div class="flex items-center gap-5 text-lg" role="group" aria-label="Share on social media">
|
||||
<span class="text-base font-bold text-blacktext dark:text-white">Share </span>
|
||||
{
|
||||
shareLinks.map((link) => (
|
||||
<a
|
||||
href={link.href}
|
||||
class="bg-blacktext rounded-full p-2"
|
||||
target="_blank"
|
||||
rel="noopener noreferrer"
|
||||
aria-label={`Share on ${link.name}`}
|
||||
title={`Share on ${link.name}`}
|
||||
>
|
||||
<Icon name={link.icon} />
|
||||
</a>
|
||||
))
|
||||
}
|
||||
</div>
|
||||
@@ -1,26 +0,0 @@
|
||||
---
|
||||
import { Icon } from "astro-icon/components"
|
||||
|
||||
interface Props {
|
||||
iconName: string;
|
||||
link: string;
|
||||
label?: string;
|
||||
}
|
||||
|
||||
const { iconName, link, label = `Link to ${iconName}` } = Astro.props;
|
||||
|
||||
// Validate required props
|
||||
if (!iconName || !link) {
|
||||
throw new Error('Social component requires both iconName and link props');
|
||||
}
|
||||
---
|
||||
|
||||
<a
|
||||
class="hover:text-mint-300 hover:scale-150 transition-all"
|
||||
target="_blank"
|
||||
href={link}
|
||||
rel="noopener noreferrer"
|
||||
aria-label={label}
|
||||
>
|
||||
<Icon name={iconName} aria-hidden="true" />
|
||||
</a>
|
||||
@@ -1,10 +0,0 @@
|
||||
---
|
||||
const { tag, forceDark = false } = Astro.props;
|
||||
---
|
||||
|
||||
<a
|
||||
href={`/blog/tags/${tag}`}
|
||||
class={`max-md:text-xs text-sm font-medium ${forceDark ? 'text-neutral-400 bg-zinc-800' : 'text-zinc-500 dark:text-neutral-400 hover:text-blacktext'} transition-all ease-in-out duration-300 px-4 py-1 max-md:px-3 rounded-full ${forceDark ? 'bg-zinc-800' : 'bg-mint-950/5 dark:bg-zinc-800 hover:bg-mint-200'}`}
|
||||
>
|
||||
{tag}
|
||||
</a>
|
||||
@@ -1,75 +0,0 @@
|
||||
---
|
||||
import { Icon } from "astro-icon/components";
|
||||
---
|
||||
|
||||
<button id="themeToggle" class="hover:cursor-pointer hover:text-mint-400 transition-all">
|
||||
<Icon name="sun" class="sun"/>
|
||||
<Icon name="moon" class="moon"/>
|
||||
</button>
|
||||
|
||||
|
||||
<style>
|
||||
#themeToggle {
|
||||
border: 0;
|
||||
background: none;
|
||||
}
|
||||
.sun {
|
||||
display: block;
|
||||
}
|
||||
.moon {
|
||||
display: none;
|
||||
}
|
||||
|
||||
:global(.dark) .sun {
|
||||
display: none;
|
||||
}
|
||||
:global(.dark) .moon {
|
||||
display: block;
|
||||
}
|
||||
</style>
|
||||
|
||||
<script is:inline>
|
||||
// Execute immediately before the page loads
|
||||
(function() {
|
||||
const theme = (() => {
|
||||
if (typeof localStorage !== "undefined" && localStorage.getItem("theme")) {
|
||||
return localStorage.getItem("theme");
|
||||
}
|
||||
if (window.matchMedia("(prefers-color-scheme: dark)").matches) {
|
||||
return "dark";
|
||||
}
|
||||
return "light";
|
||||
})();
|
||||
|
||||
if (theme === "light") {
|
||||
document.documentElement.classList.remove("dark");
|
||||
} else {
|
||||
document.documentElement.classList.add("dark");
|
||||
}
|
||||
|
||||
window.localStorage.setItem("theme", theme);
|
||||
})();
|
||||
|
||||
// Listen for changes in system preferences
|
||||
window.matchMedia("(prefers-color-scheme: dark)").addEventListener("change", (e) => {
|
||||
if (!localStorage.getItem("theme")) {
|
||||
if (e.matches) {
|
||||
document.documentElement.classList.add("dark");
|
||||
} else {
|
||||
document.documentElement.classList.remove("dark");
|
||||
}
|
||||
}
|
||||
});
|
||||
|
||||
const handleToggleClick = () => {
|
||||
const element = document.documentElement;
|
||||
element.classList.toggle("dark");
|
||||
|
||||
const isDark = element.classList.contains("dark");
|
||||
localStorage.setItem("theme", isDark ? "dark" : "light");
|
||||
};
|
||||
|
||||
document
|
||||
.getElementById("themeToggle")
|
||||
.addEventListener("click", handleToggleClick);
|
||||
</script>
|
||||
56
src/components/ui/button.tsx
Normal file
56
src/components/ui/button.tsx
Normal file
@@ -0,0 +1,56 @@
|
||||
import * as React from "react";
|
||||
import { Slot } from "@radix-ui/react-slot";
|
||||
import { cva, type VariantProps } from "class-variance-authority";
|
||||
import { cn } from "@/lib/utils";
|
||||
|
||||
const buttonVariants = cva(
|
||||
"inline-flex items-center justify-center whitespace-nowrap rounded-md text-sm font-medium transition-colors focus-visible:outline-none focus-visible:ring-1 focus-visible:ring-ring disabled:pointer-events-none disabled:opacity-50",
|
||||
{
|
||||
variants: {
|
||||
variant: {
|
||||
default:
|
||||
"bg-primary text-primary-foreground shadow hover:bg-primary/90",
|
||||
destructive:
|
||||
"bg-destructive text-destructive-foreground shadow-sm hover:bg-destructive/90",
|
||||
outline:
|
||||
"border border-input bg-background shadow-sm hover:bg-accent hover:text-accent-foreground",
|
||||
secondary:
|
||||
"bg-secondary text-secondary-foreground shadow-sm hover:bg-secondary/80",
|
||||
ghost: "hover:bg-accent hover:text-accent-foreground",
|
||||
link: "text-primary underline-offset-4 hover:underline",
|
||||
},
|
||||
size: {
|
||||
default: "h-9 px-4 py-2",
|
||||
sm: "h-8 rounded-md px-3 text-xs",
|
||||
lg: "h-10 rounded-md px-8",
|
||||
icon: "h-9 w-9",
|
||||
},
|
||||
},
|
||||
defaultVariants: {
|
||||
variant: "default",
|
||||
size: "default",
|
||||
},
|
||||
}
|
||||
);
|
||||
|
||||
export interface ButtonProps
|
||||
extends React.ButtonHTMLAttributes<HTMLButtonElement>,
|
||||
VariantProps<typeof buttonVariants> {
|
||||
asChild?: boolean;
|
||||
}
|
||||
|
||||
const Button = React.forwardRef<HTMLButtonElement, ButtonProps>(
|
||||
({ className, variant, size, asChild = false, ...props }, ref) => {
|
||||
const Comp = asChild ? Slot : "button";
|
||||
return (
|
||||
<Comp
|
||||
className={cn(buttonVariants({ variant, size, className }))}
|
||||
ref={ref}
|
||||
{...props}
|
||||
/>
|
||||
);
|
||||
}
|
||||
);
|
||||
Button.displayName = "Button";
|
||||
|
||||
export { Button, buttonVariants };
|
||||
82
src/components/ui/card.tsx
Normal file
82
src/components/ui/card.tsx
Normal file
@@ -0,0 +1,82 @@
|
||||
import * as React from "react";
|
||||
import { cn } from "@/lib/utils";
|
||||
|
||||
const Card = React.forwardRef<
|
||||
HTMLDivElement,
|
||||
React.HTMLAttributes<HTMLDivElement>
|
||||
>(({ className, ...props }, ref) => (
|
||||
<div
|
||||
ref={ref}
|
||||
className={cn(
|
||||
"rounded-lg border bg-card text-card-foreground shadow-sm",
|
||||
className
|
||||
)}
|
||||
{...props}
|
||||
/>
|
||||
));
|
||||
Card.displayName = "Card";
|
||||
|
||||
const CardHeader = React.forwardRef<
|
||||
HTMLDivElement,
|
||||
React.HTMLAttributes<HTMLDivElement>
|
||||
>(({ className, ...props }, ref) => (
|
||||
<div
|
||||
ref={ref}
|
||||
className={cn("flex flex-col space-y-1.5 p-6", className)}
|
||||
{...props}
|
||||
/>
|
||||
));
|
||||
CardHeader.displayName = "CardHeader";
|
||||
|
||||
const CardTitle = React.forwardRef<
|
||||
HTMLParagraphElement,
|
||||
React.HTMLAttributes<HTMLHeadingElement>
|
||||
>(({ className, ...props }, ref) => (
|
||||
<h3
|
||||
ref={ref}
|
||||
className={cn("text-lg font-medium leading-none tracking-tight", className)}
|
||||
{...props}
|
||||
/>
|
||||
));
|
||||
CardTitle.displayName = "CardTitle";
|
||||
|
||||
const CardDescription = React.forwardRef<
|
||||
HTMLParagraphElement,
|
||||
React.HTMLAttributes<HTMLParagraphElement>
|
||||
>(({ className, ...props }, ref) => (
|
||||
<p
|
||||
ref={ref}
|
||||
className={cn("text-sm text-muted-foreground", className)}
|
||||
{...props}
|
||||
/>
|
||||
));
|
||||
CardDescription.displayName = "CardDescription";
|
||||
|
||||
const CardContent = React.forwardRef<
|
||||
HTMLDivElement,
|
||||
React.HTMLAttributes<HTMLDivElement>
|
||||
>(({ className, ...props }, ref) => (
|
||||
<div ref={ref} className={cn("p-6 pt-0", className)} {...props} />
|
||||
));
|
||||
CardContent.displayName = "CardContent";
|
||||
|
||||
const CardFooter = React.forwardRef<
|
||||
HTMLDivElement,
|
||||
React.HTMLAttributes<HTMLDivElement>
|
||||
>(({ className, ...props }, ref) => (
|
||||
<div
|
||||
ref={ref}
|
||||
className={cn("flex items-center p-6 pt-0", className)}
|
||||
{...props}
|
||||
/>
|
||||
));
|
||||
CardFooter.displayName = "CardFooter";
|
||||
|
||||
export {
|
||||
Card,
|
||||
CardHeader,
|
||||
CardFooter,
|
||||
CardTitle,
|
||||
CardDescription,
|
||||
CardContent,
|
||||
};
|
||||
37
src/components/ui/glass-card.tsx
Normal file
37
src/components/ui/glass-card.tsx
Normal file
@@ -0,0 +1,37 @@
|
||||
import * as React from "react";
|
||||
import { cn } from "@/lib/utils";
|
||||
import { motion } from "framer-motion";
|
||||
import type { HTMLMotionProps } from "framer-motion";
|
||||
|
||||
interface GlassCardProps extends HTMLMotionProps<"div"> {
|
||||
hoverEffect?: boolean;
|
||||
}
|
||||
|
||||
const GlassCard = React.forwardRef<HTMLDivElement, GlassCardProps>(
|
||||
({ className, hoverEffect = true, ...props }, ref) => {
|
||||
return (
|
||||
<motion.div
|
||||
ref={ref}
|
||||
className={cn(
|
||||
"rounded-lg border border-border/50 bg-background/80 backdrop-blur-md backdrop-filter shadow-sm dark:bg-card/30 dark:backdrop-blur-md",
|
||||
hoverEffect &&
|
||||
"hover:shadow-md transition-all duration-300 ease-in-out",
|
||||
className
|
||||
)}
|
||||
whileHover={
|
||||
hoverEffect
|
||||
? {
|
||||
y: -5,
|
||||
transition: { duration: 0.2 },
|
||||
}
|
||||
: undefined
|
||||
}
|
||||
{...props}
|
||||
/>
|
||||
);
|
||||
}
|
||||
);
|
||||
|
||||
GlassCard.displayName = "GlassCard";
|
||||
|
||||
export { GlassCard };
|
||||
36
src/components/ui/theme-toggle.tsx
Normal file
36
src/components/ui/theme-toggle.tsx
Normal file
@@ -0,0 +1,36 @@
|
||||
import { Moon, Sun } from "lucide-react";
|
||||
import { Button } from "./button";
|
||||
import { useEffect, useState } from "react";
|
||||
|
||||
export default function ThemeToggle() {
|
||||
const [theme, setTheme] = useState<"light" | "dark">("light");
|
||||
|
||||
useEffect(() => {
|
||||
const isDark = document.documentElement.classList.contains("dark");
|
||||
setTheme(isDark ? "dark" : "light");
|
||||
}, []);
|
||||
|
||||
const toggleTheme = () => {
|
||||
const isDark = document.documentElement.classList.contains("dark");
|
||||
const newTheme = isDark ? "light" : "dark";
|
||||
|
||||
document.documentElement.classList.toggle("dark");
|
||||
setTheme(newTheme);
|
||||
};
|
||||
|
||||
return (
|
||||
<Button
|
||||
variant="ghost"
|
||||
size="icon"
|
||||
onClick={toggleTheme}
|
||||
className="rounded-full cursor-pointer"
|
||||
>
|
||||
{theme === "light" ? (
|
||||
<Moon className="h-5 w-5" />
|
||||
) : (
|
||||
<Sun className="h-5 w-5" />
|
||||
)}
|
||||
<span className="sr-only">Toggle theme</span>
|
||||
</Button>
|
||||
);
|
||||
}
|
||||
@@ -1,36 +0,0 @@
|
||||
// src/content/config.ts
|
||||
import { defineCollection, z } from 'astro:content';
|
||||
|
||||
const jsonDataCollection = defineCollection({
|
||||
type: 'data',
|
||||
schema: z.object({
|
||||
//Define JSON-file structure
|
||||
profileImage: z.string(),
|
||||
profileAlt: z.string(),
|
||||
profileLink: z.string(),
|
||||
profileTitle: z.string(),
|
||||
profileName: z.string(),
|
||||
github: z.string().url(),
|
||||
githubText: z.string(),
|
||||
portfolioImage: z.string(),
|
||||
email: z.string().email(),
|
||||
linkedin: z.string().url(),
|
||||
instagram: z.string().url(),
|
||||
youtube: z.string().url(),
|
||||
alias: z.string(),
|
||||
contactSectionTitle: z.string(),
|
||||
contactSectionSubtitle: z.string(),
|
||||
contactSectionButtonText: z.string(),
|
||||
contactSectionButtonIcon: z.string(),
|
||||
techsTitle: z.string(),
|
||||
instagramIconName: z.string(),
|
||||
youtubeIconName: z.string(),
|
||||
githubIconName: z.string(),
|
||||
linkedinIconName: z.string(),
|
||||
emailIconName: z.string()
|
||||
}),
|
||||
});
|
||||
|
||||
export const collections = {
|
||||
staticData: jsonDataCollection,
|
||||
};
|
||||
@@ -1,25 +0,0 @@
|
||||
{
|
||||
"profileImage": "/images/efeeleprofile.webp",
|
||||
"profileAlt": "Photo of Fernando Aldair López Ponce (EFEELE) for the blog",
|
||||
"profileLink": "/about-me",
|
||||
"profileTitle": "FrontEnd Developer",
|
||||
"profileName": "Fernando López",
|
||||
"github": "https://github.com/EFEELE/NeonMint",
|
||||
"githubText": "Do you like this blog's design?",
|
||||
"portfolioImage": "/images/portfolio.webp",
|
||||
"email": "hello@efeele.dev",
|
||||
"linkedin": "https://www.linkedin.com/in/efeele/",
|
||||
"instagram": "https://www.instagram.com/efeele.dev/",
|
||||
"youtube": "https://www.youtube.com/@efeeledev",
|
||||
"alias": "EFEELE",
|
||||
"contactSectionTitle": "Ready to take your idea to the next level?",
|
||||
"contactSectionSubtitle": "Let's work together.",
|
||||
"contactSectionButtonText": "Contact Me",
|
||||
"contactSectionButtonIcon": "paperplane",
|
||||
"techsTitle": "TECHS",
|
||||
"instagramIconName": "instagram",
|
||||
"youtubeIconName": "youtube",
|
||||
"githubIconName": "github",
|
||||
"linkedinIconName": "linkedin",
|
||||
"emailIconName": "envelope"
|
||||
}
|
||||
2
src/env.d.ts
vendored
2
src/env.d.ts
vendored
@@ -1,2 +0,0 @@
|
||||
/// <reference types="astro/client" />
|
||||
/// <reference path="../.astro/types.d.ts" />
|
||||
@@ -1,15 +0,0 @@
|
||||
<svg xmlns="http://www.w3.org/2000/svg" fill="none" class="w-full h-full" viewBox="0 0 242 256">
|
||||
<g clip-path="url(#a)">
|
||||
<mask id="b" width="242" height="256" x="0" y="0" maskUnits="userSpaceOnUse">
|
||||
<path fill="#fff" d="M0 0h242v256H0z"/>
|
||||
</mask>
|
||||
<g mask="url(#b)">
|
||||
<path fill="#C80D9D" d="m241 43-9 136L149 0l92 43Zm-58 176-62 36-63-36 12-31h101l12 31ZM121 68l32 80H88l33-80ZM9 179 0 43 92 0 9 179Z"/>
|
||||
</g>
|
||||
</g>
|
||||
<defs>
|
||||
<clipPath id="a">
|
||||
<path fill="#fff" d="M0 0h242v256H0z"/>
|
||||
</clipPath>
|
||||
</defs>
|
||||
</svg>
|
||||
|
Before Width: | Height: | Size: 555 B |
@@ -1 +0,0 @@
|
||||
<svg width="15" height="15" viewBox="0 0 15 15" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M6.85355 3.14645C7.04882 3.34171 7.04882 3.65829 6.85355 3.85355L3.70711 7H12.5C12.7761 7 13 7.22386 13 7.5C13 7.77614 12.7761 8 12.5 8H3.70711L6.85355 11.1464C7.04882 11.3417 7.04882 11.6583 6.85355 11.8536C6.65829 12.0488 6.34171 12.0488 6.14645 11.8536L2.14645 7.85355C1.95118 7.65829 1.95118 7.34171 2.14645 7.14645L6.14645 3.14645C6.34171 2.95118 6.65829 2.95118 6.85355 3.14645Z" fill="currentColor" fill-rule="evenodd" clip-rule="evenodd"></path></svg>
|
||||
|
Before Width: | Height: | Size: 563 B |
@@ -1,13 +0,0 @@
|
||||
<svg
|
||||
class="w-full"
|
||||
viewBox="0 0 256 366"
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
preserveAspectRatio="xMidYMid"
|
||||
><path
|
||||
fill="#fff"
|
||||
d="M182.022 9.147c2.982 3.702 4.502 8.697 7.543 18.687L256 246.074a276.467 276.467 0 0 0-79.426-26.891L133.318 73.008a5.63 5.63 0 0 0-10.802.017L79.784 219.11A276.453 276.453 0 0 0 0 246.04L66.76 27.783c3.051-9.972 4.577-14.959 7.559-18.654a24.541 24.541 0 0 1 9.946-7.358C88.67 0 93.885 0 104.314 0h47.683c10.443 0 15.664 0 20.074 1.774a24.545 24.545 0 0 1 9.95 7.373Z"
|
||||
></path><path
|
||||
fill="#FF5D01"
|
||||
d="M189.972 256.46c-10.952 9.364-32.812 15.751-57.992 15.751-30.904 0-56.807-9.621-63.68-22.56-2.458 7.415-3.009 15.903-3.009 21.324 0 0-1.619 26.623 16.898 45.14 0-9.615 7.795-17.41 17.41-17.41 16.48 0 16.46 14.378 16.446 26.043l-.001 1.041c0 17.705 10.82 32.883 26.21 39.28a35.685 35.685 0 0 1-3.588-15.647c0-16.886 9.913-23.173 21.435-30.48 9.167-5.814 19.353-12.274 26.372-25.232a47.588 47.588 0 0 0 5.742-22.735c0-5.06-.786-9.938-2.243-14.516Z"
|
||||
></path></svg
|
||||
>
|
||||
|
Before Width: | Height: | Size: 1.3 KiB |
@@ -1 +0,0 @@
|
||||
<svg width="15" height="15" viewBox="0 0 15 15" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M1.5 3C1.22386 3 1 3.22386 1 3.5C1 3.77614 1.22386 4 1.5 4H13.5C13.7761 4 14 3.77614 14 3.5C14 3.22386 13.7761 3 13.5 3H1.5ZM1 7.5C1 7.22386 1.22386 7 1.5 7H13.5C13.7761 7 14 7.22386 14 7.5C14 7.77614 13.7761 8 13.5 8H1.5C1.22386 8 1 7.77614 1 7.5ZM1 11.5C1 11.2239 1.22386 11 1.5 11H13.5C13.7761 11 14 11.2239 14 11.5C14 11.7761 13.7761 12 13.5 12H1.5C1.22386 12 1 11.7761 1 11.5Z" fill="currentColor" fill-rule="evenodd" clip-rule="evenodd"></path></svg>
|
||||
|
Before Width: | Height: | Size: 560 B |
@@ -1,3 +0,0 @@
|
||||
<svg width="182" height="218" viewBox="0 0 182 218" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||
<path d="M179.304 2.68965C177.498 0.887307 175.358 0 172.913 0H9.08607C6.61311 0 4.50136 0.887307 2.69526 2.68965C0.889156 4.49199 0 6.62707 0 9.06716V118.067C0 126.192 1.58381 134.26 4.75144 142.274C7.91906 150.26 11.8647 157.358 16.5606 163.569C21.2564 169.753 26.8414 175.798 33.3434 181.676C39.8454 187.554 45.8472 192.407 51.3211 196.289C56.8227 200.171 62.5467 203.831 68.5207 207.297C74.4947 210.763 78.746 213.092 81.2467 214.312C83.7475 215.532 85.7759 216.503 87.2763 217.14C88.4156 217.695 89.6382 218 90.9719 218C92.3056 218 93.5282 217.723 94.6675 217.14C96.1957 216.475 98.1963 215.532 100.725 214.312C103.226 213.092 107.477 210.735 113.451 207.297C119.425 203.831 125.149 200.171 130.651 196.289C136.152 192.407 142.154 187.527 148.656 181.676C155.158 175.798 160.743 169.78 165.439 163.569C170.135 157.358 174.053 150.287 177.248 142.274C180.416 134.288 181.999 126.219 181.999 118.067V9.09489C182.027 6.62707 181.11 4.49199 179.304 2.68965ZM158.187 119.093C158.187 158.551 90.9997 192.545 90.9997 192.545V23.3472H158.187C158.187 23.3472 158.187 79.6357 158.187 119.093Z" fill="#175DDC"/>
|
||||
</svg>
|
||||
|
Before Width: | Height: | Size: 1.2 KiB |
@@ -1 +0,0 @@
|
||||
<svg viewBox="0 0 256 204" xmlns="http://www.w3.org/2000/svg" width="256" height="204" preserveAspectRatio="xMidYMid"><path fill="#7E13F8" d="M53.172 0C38.565 0 27.756 12.785 28.24 26.65c.465 13.32-.139 30.573-4.482 44.642C19.402 85.402 12.034 94.34 0 95.488v12.956c12.034 1.148 19.402 10.086 23.758 24.197 4.343 14.069 4.947 31.32 4.482 44.641-.484 13.863 10.325 26.65 24.934 26.65h149.673c14.608 0 25.414-12.785 24.93-26.65-.464-13.32.139-30.572 4.482-44.641 4.359-14.11 11.707-23.05 23.741-24.197V95.488c-12.034-1.148-19.382-10.086-23.74-24.196-4.344-14.067-4.947-31.321-4.483-44.642C228.261 12.787 217.455 0 202.847 0H53.17h.002ZM173.56 125.533c0 19.092-14.24 30.67-37.872 30.67h-40.23a4.339 4.339 0 0 1-4.338-4.339V52.068a4.339 4.339 0 0 1 4.339-4.34h39.999c19.705 0 32.637 10.675 32.637 27.063 0 11.503-8.7 21.801-19.783 23.604v.601c15.089 1.655 25.248 12.104 25.248 26.537Zm-42.26-64.05h-22.937v32.4h19.32c14.934 0 23.17-6.014 23.17-16.764 0-10.073-7.082-15.636-19.552-15.636Zm-22.937 45.256v35.705h23.782c15.548 0 23.786-6.239 23.786-17.965 0-11.728-8.467-17.742-24.786-17.742h-22.782v.002Z"/></svg>
|
||||
|
Before Width: | Height: | Size: 1.1 KiB |
@@ -1 +0,0 @@
|
||||
<svg width="15" height="15" viewBox="0 0 15 15" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M5 1C5 0.447715 5.44772 0 6 0H9C9.55228 0 10 0.447715 10 1V2H14C14.5523 2 15 2.44772 15 3V6C15 6.8888 14.6131 7.68734 14 8.23608V11.5C14 12.3284 13.3284 13 12.5 13H2.5C1.67157 13 1 12.3284 1 11.5V8.2359C0.38697 7.68721 0 6.88883 0 6V3C0 2.44772 0.447716 2 1 2H5V1ZM9 1V2H6V1H9ZM1 3H5H5.5H9.5H10H14V6C14 6.654 13.6866 7.23467 13.1997 7.6004C12.8655 7.85144 12.4508 8 12 8H8V7.5C8 7.22386 7.77614 7 7.5 7C7.22386 7 7 7.22386 7 7.5V8H3C2.5493 8 2.1346 7.85133 1.80029 7.60022C1.31335 7.23446 1 6.65396 1 6V3ZM7 9H3C2.64961 9 2.31292 8.93972 2 8.82905V11.5C2 11.7761 2.22386 12 2.5 12H12.5C12.7761 12 13 11.7761 13 11.5V8.82915C12.6871 8.93978 12.3504 9 12 9H8V9.5C8 9.77614 7.77614 10 7.5 10C7.22386 10 7 9.77614 7 9.5V9Z" fill="currentColor" fill-rule="evenodd" clip-rule="evenodd"></path></svg>
|
||||
|
Before Width: | Height: | Size: 897 B |
@@ -1 +0,0 @@
|
||||
<svg viewBox="0 0 256 116" xmlns="http://www.w3.org/2000/svg" width="256" height="116" preserveAspectRatio="xMidYMid"><path fill="#FFF" d="m202.357 49.394-5.311-2.124C172.085 103.434 72.786 69.289 66.81 85.997c-.996 11.286 54.227 2.146 93.706 4.059 12.039.583 18.076 9.671 12.964 24.484l10.069.031c11.615-36.209 48.683-17.73 50.232-29.68-2.545-7.857-42.601 0-31.425-35.497Z"/><path fill="#F4811F" d="M176.332 108.348c1.593-5.31 1.062-10.622-1.593-13.809-2.656-3.187-6.374-5.31-11.154-5.842L71.17 87.634c-.531 0-1.062-.53-1.593-.53-.531-.532-.531-1.063 0-1.594.531-1.062 1.062-1.594 2.124-1.594l92.946-1.062c11.154-.53 22.839-9.56 27.087-20.182l5.312-13.809c0-.532.531-1.063 0-1.594C191.203 20.182 166.772 0 138.091 0 111.535 0 88.697 16.995 80.73 40.896c-5.311-3.718-11.684-5.843-19.12-5.31-12.747 1.061-22.838 11.683-24.432 24.43-.531 3.187 0 6.374.532 9.56C16.996 70.107 0 87.103 0 108.348c0 2.124 0 3.718.531 5.842 0 1.063 1.062 1.594 1.594 1.594h170.489c1.062 0 2.125-.53 2.125-1.594l1.593-5.842Z"/><path fill="#FAAD3F" d="M205.544 48.863h-2.656c-.531 0-1.062.53-1.593 1.062l-3.718 12.747c-1.593 5.31-1.062 10.623 1.594 13.809 2.655 3.187 6.373 5.31 11.153 5.843l19.652 1.062c.53 0 1.062.53 1.593.53.53.532.53 1.063 0 1.594-.531 1.063-1.062 1.594-2.125 1.594l-20.182 1.062c-11.154.53-22.838 9.56-27.087 20.182l-1.063 4.78c-.531.532 0 1.594 1.063 1.594h70.108c1.062 0 1.593-.531 1.593-1.593 1.062-4.25 2.124-9.03 2.124-13.81 0-27.618-22.838-50.456-50.456-50.456"/></svg>
|
||||
|
Before Width: | Height: | Size: 1.4 KiB |
@@ -1 +0,0 @@
|
||||
<svg width="15" height="15" viewBox="0 0 15 15" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M9.96424 2.68571C10.0668 2.42931 9.94209 2.13833 9.6857 2.03577C9.4293 1.93322 9.13832 2.05792 9.03576 2.31432L5.03576 12.3143C4.9332 12.5707 5.05791 12.8617 5.3143 12.9642C5.5707 13.0668 5.86168 12.9421 5.96424 12.6857L9.96424 2.68571ZM3.85355 5.14646C4.04882 5.34172 4.04882 5.6583 3.85355 5.85356L2.20711 7.50001L3.85355 9.14646C4.04882 9.34172 4.04882 9.6583 3.85355 9.85356C3.65829 10.0488 3.34171 10.0488 3.14645 9.85356L1.14645 7.85356C0.951184 7.6583 0.951184 7.34172 1.14645 7.14646L3.14645 5.14646C3.34171 4.9512 3.65829 4.9512 3.85355 5.14646ZM11.1464 5.14646C11.3417 4.9512 11.6583 4.9512 11.8536 5.14646L13.8536 7.14646C14.0488 7.34172 14.0488 7.6583 13.8536 7.85356L11.8536 9.85356C11.6583 10.0488 11.3417 10.0488 11.1464 9.85356C10.9512 9.6583 10.9512 9.34172 11.1464 9.14646L12.7929 7.50001L11.1464 5.85356C10.9512 5.6583 10.9512 5.34172 11.1464 5.14646Z" fill="currentColor" fill-rule="evenodd" clip-rule="evenodd"></path></svg>
|
||||
|
Before Width: | Height: | Size: 1.0 KiB |
@@ -1 +0,0 @@
|
||||
<svg height="1em" style="flex:none;line-height:1" viewBox="0 0 24 24" width="1em" xmlns="http://www.w3.org/2000/svg"><title>Cursor</title><path d="M11.925 24l10.425-6-10.425-6L1.5 18l10.425 6z" fill="url(#lobe-icons-cursorundefined-fill-0)"></path><path d="M22.35 18V6L11.925 0v12l10.425 6z" fill="url(#lobe-icons-cursorundefined-fill-1)"></path><path d="M11.925 0L1.5 6v12l10.425-6V0z" fill="url(#lobe-icons-cursorundefined-fill-2)"></path><path d="M22.35 6L11.925 24V12L22.35 6z" fill="#555"></path><path d="M22.35 6l-10.425 6L1.5 6h20.85z" fill="#ffff"></path><defs><linearGradient gradientUnits="userSpaceOnUse" id="lobe-icons-cursorundefined-fill-0" x1="11.925" x2="11.925" y1="12" y2="24"><stop offset=".16" stop-color="#ffff" stop-opacity=".39"></stop><stop offset=".658" stop-color="#ffff" stop-opacity=".8"></stop></linearGradient><linearGradient gradientUnits="userSpaceOnUse" id="lobe-icons-cursorundefined-fill-1" x1="22.35" x2="11.925" y1="6.037" y2="12.15"><stop offset=".182" stop-color="#ffff" stop-opacity=".31"></stop><stop offset=".715" stop-color="#ffff" stop-opacity="0"></stop></linearGradient><linearGradient gradientUnits="userSpaceOnUse" id="lobe-icons-cursorundefined-fill-2" x1="11.925" x2="1.5" y1="0" y2="18"><stop stop-color="#ffff" stop-opacity=".6"></stop><stop offset=".667" stop-color="#ffff" stop-opacity=".22"></stop></linearGradient></defs></svg>
|
||||
|
Before Width: | Height: | Size: 1.4 KiB |
@@ -1 +0,0 @@
|
||||
<svg xmlns="http://www.w3.org/2000/svg" width="1000" height="1000" aria-labelledby="css-logo-title css-logo-description" viewBox="0 0 1000 1000"><path fill="#639" d="M0 0h840a160 160 0 0 1 160 160v680a160 160 0 0 1-160 160H160A160 160 0 0 1 0 840V0Z"/><path fill="#fff" d="M816.54 919.9c-32.39 0-57.16-9.42-74.5-28.35-17.15-19.03-26.08-46.18-26.88-81.64h69.8c.4 31.36 11.42 47.08 33.08 47.08 11.04 0 18.86-3.5 23.37-10.42 4.41-6.9 6.72-17.93 6.72-33.05 0-12.02-3.01-22.04-8.83-29.95a73.2 73.2 0 0 0-29.48-21.14L783.95 750c-23.06-11.02-39.81-24.04-50.14-39.27-10.03-15.13-15.04-36.36-15.04-63.5 0-30.36 8.83-55 26.37-73.94 18.05-18.93 42.62-28.34 74-28.34 30.3 0 53.76 9.31 70.3 27.84 16.85 18.64 25.67 45.28 26.38 80.14h-67.19c.4-11.4-1.9-22.72-6.72-33.06-3.8-7.6-11.23-11.41-22.26-11.41-19.65 0-29.48 11.71-29.48 35.05 0 11.83 2.4 21.04 7.22 28.05A65.18 65.18 0 0 0 822.76 689l24.77 10.92c25.57 11.72 44.02 26.05 55.35 43.38 11.43 17.23 17.05 40.27 17.05 69.12 0 34.56-9.03 61.1-27.38 79.63-18.25 18.53-43.62 27.85-76 27.85Zm-225.42 0c-32.4 0-57.16-9.42-74.51-28.35-17.15-19.03-26.07-46.18-26.87-81.64h69.79c.4 31.36 11.43 47.08 33.1 47.08 11.02 0 18.84-3.5 23.25-10.42 4.52-6.9 6.72-17.93 6.72-33.05 0-12.02-2.9-22.04-8.72-29.95a73.2 73.2 0 0 0-29.48-21.14L558.53 750c-23.07-11.02-39.81-24.04-50.14-39.27-10.03-15.13-15.04-36.36-15.04-63.5 0-30.36 8.82-55 26.37-73.94 18.05-18.93 42.62-28.34 74-28.34 30.29 0 53.75 9.31 70.2 27.84 17.05 18.64 25.77 45.28 26.47 80.14h-67.18c.4-11.4-1.9-22.72-6.72-33.06-3.81-7.6-11.23-11.41-22.26-11.41-19.66 0-29.49 11.71-29.49 35.05 0 11.83 2.41 21.04 7.22 28.05A65.18 65.18 0 0 0 597.33 689l24.77 10.92c25.57 11.72 44.02 26.05 55.36 43.38 11.33 17.23 17.04 40.27 17.04 69.12 0 34.56-9.12 61.1-27.37 79.63-18.25 18.53-43.62 27.85-76.01 27.85Zm-234.75 0c-31.7 0-56.86-8.62-75.51-25.85-18.65-17.12-27.88-42.87-27.88-76.93V648.83c0-33.85 9.83-59.5 29.48-77.13 19.96-17.43 46.13-26.24 78.52-26.24 31.39 0 56.15 9.01 74.5 26.84 18.56 17.93 27.88 44.58 27.88 80.14v13.32h-73.9v-12.92c0-13.72-3.01-23.84-8.83-30.45a26.46 26.46 0 0 0-21.66-10.32c-12.03 0-20.55 4.1-25.37 12.42a79.04 79.04 0 0 0-6.72 36.66v146.26c0 30.55 10.74 46.08 32.1 46.38 10.02 0 17.54-3.61 22.76-10.82a51.74 51.74 0 0 0 7.72-30.46V801.6h73.9v11.42c0 23.74-4.61 43.57-13.94 59.4a88.8 88.8 0 0 1-38.2 35.66 121.46 121.46 0 0 1-54.85 11.82Z"/></svg>
|
||||
|
Before Width: | Height: | Size: 2.3 KiB |
@@ -1 +0,0 @@
|
||||
<svg height="1em" style="flex:none;line-height:1" viewBox="0 0 24 24" width="1em" xmlns="http://www.w3.org/2000/svg"><title>Cursor</title><path d="M11.925 24l10.425-6-10.425-6L1.5 18l10.425 6z" fill="url(#lobe-icons-cursorundefined-fill-0)"></path><path d="M22.35 18V6L11.925 0v12l10.425 6z" fill="url(#lobe-icons-cursorundefined-fill-1)"></path><path d="M11.925 0L1.5 6v12l10.425-6V0z" fill="url(#lobe-icons-cursorundefined-fill-2)"></path><path d="M22.35 6L11.925 24V12L22.35 6z" fill="#555"></path><path d="M22.35 6l-10.425 6L1.5 6h20.85z" fill="#ffff"></path><defs><linearGradient gradientUnits="userSpaceOnUse" id="lobe-icons-cursorundefined-fill-0" x1="11.925" x2="11.925" y1="12" y2="24"><stop offset=".16" stop-color="#ffff" stop-opacity=".39"></stop><stop offset=".658" stop-color="#ffff" stop-opacity=".8"></stop></linearGradient><linearGradient gradientUnits="userSpaceOnUse" id="lobe-icons-cursorundefined-fill-1" x1="22.35" x2="11.925" y1="6.037" y2="12.15"><stop offset=".182" stop-color="#ffff" stop-opacity=".31"></stop><stop offset=".715" stop-color="#ffff" stop-opacity="0"></stop></linearGradient><linearGradient gradientUnits="userSpaceOnUse" id="lobe-icons-cursorundefined-fill-2" x1="11.925" x2="1.5" y1="0" y2="18"><stop stop-color="#ffff" stop-opacity=".6"></stop><stop offset=".667" stop-color="#ffff" stop-opacity=".22"></stop></linearGradient></defs></svg>
|
||||
|
Before Width: | Height: | Size: 1.4 KiB |
File diff suppressed because one or more lines are too long
|
Before Width: | Height: | Size: 4.9 KiB |
@@ -1 +0,0 @@
|
||||
<svg xmlns="http://www.w3.org/2000/svg" style="flex:none;line-height:1" viewBox="0 0 24 24"><path fill="#4D6BFE" d="M23.748 4.482c-.254-.124-.364.113-.512.234-.051.039-.094.09-.137.136-.372.397-.806.657-1.373.626-.829-.046-1.537.214-2.163.848-.133-.782-.575-1.248-1.247-1.548-.352-.156-.708-.311-.955-.65-.172-.241-.219-.51-.305-.774-.055-.16-.11-.323-.293-.35-.2-.031-.278.136-.356.276-.313.572-.434 1.202-.422 1.84.027 1.436.633 2.58 1.838 3.393.137.093.172.187.129.323-.082.28-.18.552-.266.833-.055.179-.137.217-.329.14a5.526 5.526 0 0 1-1.736-1.18c-.857-.828-1.631-1.742-2.597-2.458a11.365 11.365 0 0 0-.689-.471c-.985-.957.13-1.743.388-1.836.27-.098.093-.432-.779-.428-.872.004-1.67.295-2.687.684a3.055 3.055 0 0 1-.465.137 9.597 9.597 0 0 0-2.883-.102c-1.885.21-3.39 1.102-4.497 2.623C.082 8.606-.231 10.684.152 12.85c.403 2.284 1.569 4.175 3.36 5.653 1.858 1.533 3.997 2.284 6.438 2.14 1.482-.085 3.133-.284 4.994-1.86.47.234.962.327 1.78.397.63.059 1.236-.03 1.705-.128.735-.156.684-.837.419-.961-2.155-1.004-1.682-.595-2.113-.926 1.096-1.296 2.746-2.642 3.392-7.003.05-.347.007-.565 0-.845-.004-.17.035-.237.23-.256a4.173 4.173 0 0 0 1.545-.475c1.396-.763 1.96-2.015 2.093-3.517.02-.23-.004-.467-.247-.588zM11.581 18c-2.089-1.642-3.102-2.183-3.52-2.16-.392.024-.321.471-.235.763.09.288.207.486.371.739.114.167.192.416-.113.603-.673.416-1.842-.14-1.897-.167-1.361-.802-2.5-1.86-3.301-3.307-.774-1.393-1.224-2.887-1.298-4.482-.02-.386.093-.522.477-.592a4.696 4.696 0 0 1 1.529-.039c2.132.312 3.946 1.265 5.468 2.774.868.86 1.525 1.887 2.202 2.891.72 1.066 1.494 2.082 2.48 2.914.348.292.625.514.891.677-.802.09-2.14.11-3.054-.614zm1-6.44a.306.306 0 0 1 .415-.287.302.302 0 0 1 .2.288.306.306 0 0 1-.31.307.303.303 0 0 1-.304-.308zm3.11 1.596c-.2.081-.399.151-.59.16a1.245 1.245 0 0 1-.798-.254c-.274-.23-.47-.358-.552-.758a1.73 1.73 0 0 1 .016-.588c.07-.327-.008-.537-.239-.727-.187-.156-.426-.199-.688-.199a.559.559 0 0 1-.254-.078.253.253 0 0 1-.114-.358c.028-.054.16-.186.192-.21.356-.202.767-.136 1.146.016.352.144.618.408 1.001.782.391.451.462.576.685.914.176.265.336.537.445.848.067.195-.019.354-.25.452z"/></svg>
|
||||
|
Before Width: | Height: | Size: 2.1 KiB |
@@ -1 +0,0 @@
|
||||
<svg width="15" height="15" viewBox="0 0 15 15" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M1 2C0.447715 2 0 2.44772 0 3V12C0 12.5523 0.447715 13 1 13H14C14.5523 13 15 12.5523 15 12V3C15 2.44772 14.5523 2 14 2H1ZM1 3L14 3V3.92494C13.9174 3.92486 13.8338 3.94751 13.7589 3.99505L7.5 7.96703L1.24112 3.99505C1.16621 3.94751 1.0826 3.92486 1 3.92494V3ZM1 4.90797V12H14V4.90797L7.74112 8.87995C7.59394 8.97335 7.40606 8.97335 7.25888 8.87995L1 4.90797Z" fill="currentColor" fill-rule="evenodd" clip-rule="evenodd"></path></svg>
|
||||
|
Before Width: | Height: | Size: 536 B |
@@ -1 +0,0 @@
|
||||
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 36 36" fill="url(#a)" height="40" width="40"><defs><linearGradient x1="50%" x2="50%" y1="97.078%" y2="0%" id="a"><stop offset="0%" stop-color="#0062E0"/><stop offset="100%" stop-color="#19AFFF"/></linearGradient></defs><path d="M15 35.8C6.5 34.3 0 26.9 0 18 0 8.1 8.1 0 18 0s18 8.1 18 18c0 8.9-6.5 16.3-15 17.8l-1-.8h-4l-1 .8z"/><path fill="#FFF" d="m25 23 .8-5H21v-3.5c0-1.4.5-2.5 2.7-2.5H26V7.4c-1.3-.2-2.7-.4-4-.4-4.1 0-7 2.5-7 7v4h-4.5v5H15v12.7c1 .2 2 .3 3 .3s2-.1 3-.3V23h4z"/></svg>
|
||||
|
Before Width: | Height: | Size: 542 B |
@@ -1,14 +0,0 @@
|
||||
<svg width="54" height="80" viewBox="0 0 54 80" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||
<g clip-path="url(#clip0_912_3)">
|
||||
<path d="M13.3333 80.0002C20.6933 80.0002 26.6667 74.0268 26.6667 66.6668V53.3335H13.3333C5.97333 53.3335 0 59.3068 0 66.6668C0 74.0268 5.97333 80.0002 13.3333 80.0002Z" fill="#0ACF83"/>
|
||||
<path d="M0 39.9998C0 32.6398 5.97333 26.6665 13.3333 26.6665H26.6667V53.3332H13.3333C5.97333 53.3332 0 47.3598 0 39.9998Z" fill="#A259FF"/>
|
||||
<path d="M0 13.3333C0 5.97333 5.97333 0 13.3333 0H26.6667V26.6667H13.3333C5.97333 26.6667 0 20.6933 0 13.3333Z" fill="#F24E1E"/>
|
||||
<path d="M26.6667 0H40.0001C47.3601 0 53.3334 5.97333 53.3334 13.3333C53.3334 20.6933 47.3601 26.6667 40.0001 26.6667H26.6667V0Z" fill="#FF7262"/>
|
||||
<path d="M53.3334 39.9998C53.3334 47.3598 47.3601 53.3332 40.0001 53.3332C32.6401 53.3332 26.6667 47.3598 26.6667 39.9998C26.6667 32.6398 32.6401 26.6665 40.0001 26.6665C47.3601 26.6665 53.3334 32.6398 53.3334 39.9998Z" fill="#1ABCFE"/>
|
||||
</g>
|
||||
<defs>
|
||||
<clipPath id="clip0_912_3">
|
||||
<rect width="53.3333" height="80" fill="white"/>
|
||||
</clipPath>
|
||||
</defs>
|
||||
</svg>
|
||||
|
Before Width: | Height: | Size: 1.1 KiB |
@@ -1 +0,0 @@
|
||||
<svg xmlns="http://www.w3.org/2000/svg" width="600" height="600" fill="none" viewBox="0 0 600 600"><path fill="#FF9100" d="M213.918 560.499c23.248 9.357 48.469 14.909 74.952 15.834 35.84 1.252 69.922-6.158 100.391-20.234-36.537-14.355-69.627-35.348-97.869-61.448-18.306 29.31-45.382 52.462-77.474 65.848Z"/><path fill="#FFC400" d="M291.389 494.66c-64.466-59.622-103.574-145.917-100.269-240.568.108-3.073.27-6.145.46-9.216a166.993 166.993 0 0 0-36.004-5.241 167.001 167.001 0 0 0-51.183 6.153c-17.21 30.145-27.594 64.733-28.888 101.781-3.339 95.611 54.522 179.154 138.409 212.939 32.093-13.387 59.168-36.51 77.475-65.848Z"/><path fill="#FF9100" d="M291.39 494.657c14.988-23.986 24.075-52.106 25.133-82.403 2.783-79.695-50.792-148.251-124.942-167.381-.19 3.071-.352 6.143-.46 9.216-3.305 94.651 35.803 180.946 100.269 240.568Z"/><path fill="#DD2C00" d="M308.231 20.858C266 54.691 232.652 99.302 212.475 150.693c-11.551 29.436-18.81 61.055-20.929 94.2 74.15 19.13 127.726 87.686 124.943 167.38-1.058 30.297-10.172 58.39-25.134 82.404 28.24 26.127 61.331 47.093 97.868 61.447 73.337-33.9 125.37-106.846 128.383-193.127 1.952-55.901-19.526-105.724-49.875-147.778-32.051-44.477-159.5-194.36-159.5-194.36Z"/></svg>
|
||||
|
Before Width: | Height: | Size: 1.2 KiB |
@@ -1 +0,0 @@
|
||||
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 128 128"><path fill="#64328B" d="M64 0C28.7 0 0 28.7 0 64s28.7 64 64 64 64-28.7 64-64S99.3 0 64 0zM13.2 64 64 114.8c-28.1 0-50.8-22.7-50.8-50.8zm62.2 49.5-60.9-61C19.7 30 39.9 13.2 64 13.2c16.6 0 31.3 7.9 40.5 20.2L97 40.6c-7.3-10.4-19.3-17.1-33-17.1-17.6 0-32.5 11.2-38.1 26.8C33.1 57 75.4 98.8 78.1 102c12.7-4.7 22.3-15.5 25.4-28.9H81.9v-9.4l33 .2c-.1 24.3-16.9 44.5-39.5 49.6z"/></svg>
|
||||
|
Before Width: | Height: | Size: 441 B |
@@ -1,3 +0,0 @@
|
||||
<svg xmlns="http://www.w3.org/2000/svg" preserveAspectRatio="xMidYMid" viewBox="0 0 256 256">
|
||||
<path d="M251.17 116.6 139.4 4.82a16.49 16.49 0 0 0-23.31 0l-23.21 23.2 29.44 29.45a19.57 19.57 0 0 1 24.8 24.96l28.37 28.38a19.61 19.61 0 1 1-11.75 11.06L137.28 95.4v69.64a19.62 19.62 0 1 1-16.13-.57V94.2a19.61 19.61 0 0 1-10.65-25.73L81.46 39.44 4.83 116.08a16.49 16.49 0 0 0 0 23.32L116.6 251.17a16.49 16.49 0 0 0 23.32 0l111.25-111.25a16.5 16.5 0 0 0 0-23.33" fill="#DE4C36"/>
|
||||
</svg>
|
||||
|
Before Width: | Height: | Size: 484 B |
@@ -1,11 +0,0 @@
|
||||
<svg
|
||||
viewBox="0 0 256 250"
|
||||
width="256"
|
||||
height="250"
|
||||
fill="#fff"
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
preserveAspectRatio="xMidYMid"
|
||||
>
|
||||
<path
|
||||
d="M128.001 0C57.317 0 0 57.307 0 128.001c0 56.554 36.676 104.535 87.535 121.46 6.397 1.185 8.746-2.777 8.746-6.158 0-3.052-.12-13.135-.174-23.83-35.61 7.742-43.124-15.103-43.124-15.103-5.823-14.795-14.213-18.73-14.213-18.73-11.613-7.944.876-7.78.876-7.78 12.853.902 19.621 13.19 19.621 13.19 11.417 19.568 29.945 13.911 37.249 10.64 1.149-8.272 4.466-13.92 8.127-17.116-28.431-3.236-58.318-14.212-58.318-63.258 0-13.975 5-25.394 13.188-34.358-1.329-3.224-5.71-16.242 1.24-33.874 0 0 10.749-3.44 35.21 13.121 10.21-2.836 21.16-4.258 32.038-4.307 10.878.049 21.837 1.47 32.066 4.307 24.431-16.56 35.165-13.12 35.165-13.12 6.967 17.63 2.584 30.65 1.255 33.873 8.207 8.964 13.173 20.383 13.173 34.358 0 49.163-29.944 59.988-58.447 63.157 4.591 3.972 8.682 11.762 8.682 23.704 0 17.126-.148 30.91-.148 35.126 0 3.407 2.304 7.398 8.792 6.14C219.37 232.5 256 184.537 256 128.002 256 57.307 198.691 0 128.001 0Zm-80.06 182.34c-.282.636-1.283.827-2.194.39-.929-.417-1.45-1.284-1.15-1.922.276-.655 1.279-.838 2.205-.399.93.418 1.46 1.293 1.139 1.931Zm6.296 5.618c-.61.566-1.804.303-2.614-.591-.837-.892-.994-2.086-.375-2.66.63-.566 1.787-.301 2.626.591.838.903 1 2.088.363 2.66Zm4.32 7.188c-.785.545-2.067.034-2.86-1.104-.784-1.138-.784-2.503.017-3.05.795-.547 2.058-.055 2.861 1.075.782 1.157.782 2.522-.019 3.08Zm7.304 8.325c-.701.774-2.196.566-3.29-.49-1.119-1.032-1.43-2.496-.726-3.27.71-.776 2.213-.558 3.315.49 1.11 1.03 1.45 2.505.701 3.27Zm9.442 2.81c-.31 1.003-1.75 1.459-3.199 1.033-1.448-.439-2.395-1.613-2.103-2.626.301-1.01 1.747-1.484 3.207-1.028 1.446.436 2.396 1.602 2.095 2.622Zm10.744 1.193c.036 1.055-1.193 1.93-2.715 1.95-1.53.034-2.769-.82-2.786-1.86 0-1.065 1.202-1.932 2.733-1.958 1.522-.03 2.768.818 2.768 1.868Zm10.555-.405c.182 1.03-.875 2.088-2.387 2.37-1.485.271-2.861-.365-3.05-1.386-.184-1.056.893-2.114 2.376-2.387 1.514-.263 2.868.356 3.061 1.403Z" />
|
||||
</svg>
|
||||
|
Before Width: | Height: | Size: 2.0 KiB |
@@ -1 +0,0 @@
|
||||
<svg width="15" height="15" viewBox="0 0 15 15" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M7.49933 0.25C3.49635 0.25 0.25 3.49593 0.25 7.50024C0.25 10.703 2.32715 13.4206 5.2081 14.3797C5.57084 14.446 5.70302 14.2222 5.70302 14.0299C5.70302 13.8576 5.69679 13.4019 5.69323 12.797C3.67661 13.235 3.25112 11.825 3.25112 11.825C2.92132 10.9874 2.44599 10.7644 2.44599 10.7644C1.78773 10.3149 2.49584 10.3238 2.49584 10.3238C3.22353 10.375 3.60629 11.0711 3.60629 11.0711C4.25298 12.1788 5.30335 11.8588 5.71638 11.6732C5.78225 11.205 5.96962 10.8854 6.17658 10.7043C4.56675 10.5209 2.87415 9.89918 2.87415 7.12104C2.87415 6.32925 3.15677 5.68257 3.62053 5.17563C3.54576 4.99226 3.29697 4.25521 3.69174 3.25691C3.69174 3.25691 4.30015 3.06196 5.68522 3.99973C6.26337 3.83906 6.8838 3.75895 7.50022 3.75583C8.1162 3.75895 8.73619 3.83906 9.31523 3.99973C10.6994 3.06196 11.3069 3.25691 11.3069 3.25691C11.7026 4.25521 11.4538 4.99226 11.3795 5.17563C11.8441 5.68257 12.1245 6.32925 12.1245 7.12104C12.1245 9.9063 10.4292 10.5192 8.81452 10.6985C9.07444 10.9224 9.30633 11.3648 9.30633 12.0413C9.30633 13.0102 9.29742 13.7922 9.29742 14.0299C9.29742 14.2239 9.42828 14.4496 9.79591 14.3788C12.6746 13.4179 14.75 10.7025 14.75 7.50024C14.75 3.49593 11.5036 0.25 7.49933 0.25Z" fill="currentColor" fill-rule="evenodd" clip-rule="evenodd"></path></svg>
|
||||
|
Before Width: | Height: | Size: 1.3 KiB |
@@ -1,18 +0,0 @@
|
||||
<svg
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
viewBox="0 0 452 520"
|
||||
>
|
||||
<path
|
||||
fill="#e34f26"
|
||||
d="M41 460L0 0h451l-41 460-185 52"></path>
|
||||
<path fill="#ef652a" d="M226 472l149-41 35-394H226"
|
||||
></path>
|
||||
<path
|
||||
fill="#ecedee"
|
||||
d="M226 208h-75l-5-58h80V94H84l15 171h127zm0 147l-64-17-4-45h-56l7 89 117 32z"
|
||||
></path>
|
||||
<path
|
||||
fill="#fff"
|
||||
d="M226 265h69l-7 73-62 17v59l115-32 16-174H226zm0-171v56h136l5-56z"
|
||||
></path>
|
||||
</svg>
|
||||
|
Before Width: | Height: | Size: 893 B |
@@ -1 +0,0 @@
|
||||
<svg width="15" height="15" viewBox="0 0 15 15" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M7.49991 0.876892C3.84222 0.876892 0.877075 3.84204 0.877075 7.49972C0.877075 11.1574 3.84222 14.1226 7.49991 14.1226C11.1576 14.1226 14.1227 11.1574 14.1227 7.49972C14.1227 3.84204 11.1576 0.876892 7.49991 0.876892ZM1.82707 7.49972C1.82707 4.36671 4.36689 1.82689 7.49991 1.82689C10.6329 1.82689 13.1727 4.36671 13.1727 7.49972C13.1727 10.6327 10.6329 13.1726 7.49991 13.1726C4.36689 13.1726 1.82707 10.6327 1.82707 7.49972ZM8.24992 4.49999C8.24992 4.9142 7.91413 5.24999 7.49992 5.24999C7.08571 5.24999 6.74992 4.9142 6.74992 4.49999C6.74992 4.08577 7.08571 3.74999 7.49992 3.74999C7.91413 3.74999 8.24992 4.08577 8.24992 4.49999ZM6.00003 5.99999H6.50003H7.50003C7.77618 5.99999 8.00003 6.22384 8.00003 6.49999V9.99999H8.50003H9.00003V11H8.50003H7.50003H6.50003H6.00003V9.99999H6.50003H7.00003V6.99999H6.50003H6.00003V5.99999Z" fill="currentColor" fill-rule="evenodd" clip-rule="evenodd"></path></svg>
|
||||
|
Before Width: | Height: | Size: 1007 B |
@@ -1 +0,0 @@
|
||||
<svg width="15" height="15" viewBox="0 0 15 15" fill="none" xmlns="http://www.w3.org/2000/svg"><path fill-rule="evenodd" clip-rule="evenodd" d="M12.9091 12.909C13.2365 12.5817 13.4918 12.1895 13.6588 11.7577C13.8195 11.3443 13.9294 10.8718 13.961 10.1799C13.9926 9.48665 14.0001 9.26529 14.0001 7.50001C14.0001 5.73473 13.9926 5.51328 13.961 4.82008C13.9294 4.12821 13.8195 3.65573 13.6588 3.24228C13.4956 2.80857 13.2398 2.41567 12.9091 2.091C12.5844 1.76028 12.1915 1.50437 11.7578 1.34113C11.3443 1.18056 10.8718 1.0707 10.1799 1.03924C9.48675 1.00748 9.26537 1 7.50006 1C5.73476 1 5.51333 1.00748 4.82014 1.03912C4.12826 1.0707 3.65578 1.18056 3.24233 1.34125C2.80862 1.50447 2.41573 1.76032 2.09105 2.09098C1.76032 2.41563 1.5044 2.80852 1.34113 3.24225C1.18056 3.65573 1.0707 4.12821 1.03924 4.82008C1.00748 5.51328 1 5.73471 1 7.50001C1 9.26532 1.00748 9.48675 1.03924 10.1799C1.07083 10.8718 1.18069 11.3443 1.34138 11.7577C1.5046 12.1915 1.76045 12.5843 2.09111 12.909C2.41578 13.2397 2.80867 13.4955 3.24238 13.6587C3.65586 13.8194 4.12834 13.9293 4.82019 13.9609C5.51348 13.9925 5.73483 14 7.50012 14C9.2654 14 9.48685 13.9925 10.18 13.9609C10.8719 13.9293 11.3444 13.8194 11.7578 13.6587C12.1896 13.4917 12.5818 13.2364 12.9091 12.909ZM1.99949 6.73496C1.99974 6.94524 2.00005 7.19543 2.00005 7.50002C2.00005 7.80461 1.99974 8.0548 1.99949 8.26507C1.99849 9.08596 1.99824 9.29856 2.01963 9.7655C2.04625 10.3509 2.07823 10.7811 2.17588 11.1053C2.26976 11.417 2.37505 11.7342 2.7188 12.1171C3.06255 12.4999 3.39411 12.6733 3.81645 12.8007C4.23879 12.928 4.7696 12.9554 5.23052 12.9764C5.75332 13.0003 5.96052 13.0002 7.05714 12.9999L7.50006 12.9999C7.79304 12.9999 8.03569 13.0001 8.2409 13.0004C9.08195 13.0013 9.29425 13.0015 9.76575 12.9799C10.3512 12.9533 10.7814 12.9213 11.1056 12.8237C11.4173 12.7298 11.7345 12.6245 12.1173 12.2807C12.5001 11.937 12.6735 11.6054 12.8009 11.1831C12.9283 10.7607 12.9557 10.2299 12.9767 9.76902C13.0005 9.24689 13.0004 9.04027 13.0002 7.94749V7.94738L13.0001 7.50039L13.0001 7.05747C13.0004 5.96085 13.0005 5.75365 12.9766 5.23085C12.9556 4.76993 12.9282 4.23912 12.8009 3.81678C12.6735 3.39445 12.5001 3.06288 12.1173 2.71913C11.7345 2.37538 11.4172 2.27009 11.1056 2.17621C10.7813 2.07856 10.3511 2.04658 9.76571 2.01996C9.29421 1.99836 9.08194 1.99859 8.24092 1.99951H8.24092C8.0357 1.99974 7.79305 2.00001 7.50006 2.00001L7.05704 1.99993C5.96051 1.99964 5.75331 1.99958 5.23052 2.02343C4.7696 2.04446 4.23879 2.07183 3.81645 2.19921C3.39411 2.32659 3.06255 2.49999 2.7188 2.88281C2.37505 3.26562 2.26976 3.58286 2.17588 3.89453C2.07823 4.21874 2.04625 4.64894 2.01963 5.23437C1.99824 5.70131 1.99849 5.91401 1.99949 6.73496ZM7.49996 5.25015C6.25741 5.25015 5.25012 6.25744 5.25012 7.49999C5.25012 8.74254 6.25741 9.74983 7.49996 9.74983C8.74251 9.74983 9.7498 8.74254 9.7498 7.49999C9.7498 6.25744 8.74251 5.25015 7.49996 5.25015ZM4.25012 7.49999C4.25012 5.70515 5.70512 4.25015 7.49996 4.25015C9.2948 4.25015 10.7498 5.70515 10.7498 7.49999C10.7498 9.29483 9.2948 10.7498 7.49996 10.7498C5.70512 10.7498 4.25012 9.29483 4.25012 7.49999ZM10.9697 4.7803C11.3839 4.7803 11.7197 4.44452 11.7197 4.0303C11.7197 3.61609 11.3839 3.2803 10.9697 3.2803C10.5555 3.2803 10.2197 3.61609 10.2197 4.0303C10.2197 4.44452 10.5555 4.7803 10.9697 4.7803Z" fill="currentColor"></path></svg>
|
||||
|
Before Width: | Height: | Size: 3.2 KiB |
@@ -1,8 +0,0 @@
|
||||
<svg
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
viewBox="0 0 1052 1052"
|
||||
><path fill="#f0db4f" d="M0 0h1052v1052H0z"
|
||||
></path><path
|
||||
d="M965.9 801.1c-7.7-48-39-88.3-131.7-125.9-32.2-14.8-68.1-25.399-78.8-49.8-3.8-14.2-4.3-22.2-1.9-30.8 6.9-27.9 40.2-36.6 66.6-28.6 17 5.7 33.1 18.801 42.8 39.7 45.4-29.399 45.3-29.2 77-49.399-11.6-18-17.8-26.301-25.4-34-27.3-30.5-64.5-46.2-124-45-10.3 1.3-20.699 2.699-31 4-29.699 7.5-58 23.1-74.6 44-49.8 56.5-35.6 155.399 25 196.1 59.7 44.8 147.4 55 158.6 96.9 10.9 51.3-37.699 67.899-86 62-35.6-7.4-55.399-25.5-76.8-58.4-39.399 22.8-39.399 22.8-79.899 46.1 9.6 21 19.699 30.5 35.8 48.7 76.2 77.3 266.899 73.5 301.1-43.5 1.399-4.001 10.6-30.801 3.199-72.101zm-394-317.6h-98.4c0 85-.399 169.4-.399 254.4 0 54.1 2.8 103.7-6 118.9-14.4 29.899-51.7 26.2-68.7 20.399-17.3-8.5-26.1-20.6-36.3-37.699-2.8-4.9-4.9-8.7-5.601-9-26.699 16.3-53.3 32.699-80 49 13.301 27.3 32.9 51 58 66.399 37.5 22.5 87.9 29.4 140.601 17.3 34.3-10 63.899-30.699 79.399-62.199 22.4-41.3 17.6-91.3 17.4-146.6.5-90.2 0-180.4 0-270.9z"
|
||||
fill="#323330"></path></svg
|
||||
>
|
||||
|
Before Width: | Height: | Size: 1.2 KiB |
@@ -1 +0,0 @@
|
||||
<svg width="15" height="15" viewBox="0 0 15 15" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M2 1C1.44772 1 1 1.44772 1 2V13C1 13.5523 1.44772 14 2 14H13C13.5523 14 14 13.5523 14 13V2C14 1.44772 13.5523 1 13 1H2ZM3.05 6H4.95V12H3.05V6ZM5.075 4.005C5.075 4.59871 4.59371 5.08 4 5.08C3.4063 5.08 2.925 4.59871 2.925 4.005C2.925 3.41129 3.4063 2.93 4 2.93C4.59371 2.93 5.075 3.41129 5.075 4.005ZM12 8.35713C12 6.55208 10.8334 5.85033 9.67449 5.85033C9.29502 5.83163 8.91721 5.91119 8.57874 6.08107C8.32172 6.21007 8.05265 6.50523 7.84516 7.01853H7.79179V6.00044H6V12.0047H7.90616V8.8112C7.8786 8.48413 7.98327 8.06142 8.19741 7.80987C8.41156 7.55832 8.71789 7.49825 8.95015 7.46774H9.02258C9.62874 7.46774 10.0786 7.84301 10.0786 8.78868V12.0047H11.9847L12 8.35713Z" fill="currentColor" fill-rule="evenodd" clip-rule="evenodd"></path></svg>
|
||||
|
Before Width: | Height: | Size: 848 B |
@@ -1,5 +0,0 @@
|
||||
<svg id="Capa_2" data-name="Capa 2" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 228.06 45">
|
||||
<g id="Capa_1-2" data-name="Capa 1">
|
||||
<path d="M225.64,9l2.41-9h-36l-2.41,9h0l-7.23,27h-22.5L169.56,0H12.06L0,45h49.5l4.82-18h15.75l2.41-9h-15.75l2.41-9h22.5l-7.23,27h0l-2.41,9h144l2.41-9h-22.5l2.41-9h15.75l2.41-9h-15.75l2.41-9h22.5ZM43.23,18l-2.41,9h0l-2.41,9H15.91l2.41-9h15.76l2.41-9h-15.76l2.41-9h22.5l-2.41,9h0ZM110.41,36h-22.5l2.41-9h15.75l2.41-9h-15.75l2.41-9h22.5l-7.23,27h0ZM146.41,36h-22.5l2.41-9h15.75l2.41-9h-15.75l2.41-9h22.5l-7.23,27h0Z"/>
|
||||
</g>
|
||||
</svg>
|
||||
|
Before Width: | Height: | Size: 568 B |
@@ -1 +0,0 @@
|
||||
<svg viewBox="0 0 208 128" xmlns="http://www.w3.org/2000/svg" xml:space="preserve" ><path fill="none" stroke="#FFF" stroke-width="10" d="M15 5h178a10 10 0 0 1 10 10v98a10 10 0 0 1-10 10H15a10 10 0 0 1-10-10V15A10 10 0 0 1 15 5z"/><path fill="#FFF" d="M30 98V30h20l20 25 20-25h20v68H90V59L70 84 50 59v39H30zm125 0-30-33h20V30h20v35h20l-30 33z"/></svg>
|
||||
|
Before Width: | Height: | Size: 350 B |
@@ -1 +0,0 @@
|
||||
<svg xmlns="http://www.w3.org/2000/svg" width="1000" height="1000" aria-labelledby="css-logo-title css-logo-description" viewBox="0 0 1000 1000"><path fill="#639" d="M0 0h840a160 160 0 0 1 160 160v680a160 160 0 0 1-160 160H160A160 160 0 0 1 0 840V0Z"/><path fill="#fff" d="M816.54 919.9c-32.39 0-57.16-9.42-74.5-28.35-17.15-19.03-26.08-46.18-26.88-81.64h69.8c.4 31.36 11.42 47.08 33.08 47.08 11.04 0 18.86-3.5 23.37-10.42 4.41-6.9 6.72-17.93 6.72-33.05 0-12.02-3.01-22.04-8.83-29.95a73.2 73.2 0 0 0-29.48-21.14L783.95 750c-23.06-11.02-39.81-24.04-50.14-39.27-10.03-15.13-15.04-36.36-15.04-63.5 0-30.36 8.83-55 26.37-73.94 18.05-18.93 42.62-28.34 74-28.34 30.3 0 53.76 9.31 70.3 27.84 16.85 18.64 25.67 45.28 26.38 80.14h-67.19c.4-11.4-1.9-22.72-6.72-33.06-3.8-7.6-11.23-11.41-22.26-11.41-19.65 0-29.48 11.71-29.48 35.05 0 11.83 2.4 21.04 7.22 28.05A65.18 65.18 0 0 0 822.76 689l24.77 10.92c25.57 11.72 44.02 26.05 55.35 43.38 11.43 17.23 17.05 40.27 17.05 69.12 0 34.56-9.03 61.1-27.38 79.63-18.25 18.53-43.62 27.85-76 27.85Zm-225.42 0c-32.4 0-57.16-9.42-74.51-28.35-17.15-19.03-26.07-46.18-26.87-81.64h69.79c.4 31.36 11.43 47.08 33.1 47.08 11.02 0 18.84-3.5 23.25-10.42 4.52-6.9 6.72-17.93 6.72-33.05 0-12.02-2.9-22.04-8.72-29.95a73.2 73.2 0 0 0-29.48-21.14L558.53 750c-23.07-11.02-39.81-24.04-50.14-39.27-10.03-15.13-15.04-36.36-15.04-63.5 0-30.36 8.82-55 26.37-73.94 18.05-18.93 42.62-28.34 74-28.34 30.29 0 53.75 9.31 70.2 27.84 17.05 18.64 25.77 45.28 26.47 80.14h-67.18c.4-11.4-1.9-22.72-6.72-33.06-3.81-7.6-11.23-11.41-22.26-11.41-19.66 0-29.49 11.71-29.49 35.05 0 11.83 2.41 21.04 7.22 28.05A65.18 65.18 0 0 0 597.33 689l24.77 10.92c25.57 11.72 44.02 26.05 55.36 43.38 11.33 17.23 17.04 40.27 17.04 69.12 0 34.56-9.12 61.1-27.37 79.63-18.25 18.53-43.62 27.85-76.01 27.85Zm-234.75 0c-31.7 0-56.86-8.62-75.51-25.85-18.65-17.12-27.88-42.87-27.88-76.93V648.83c0-33.85 9.83-59.5 29.48-77.13 19.96-17.43 46.13-26.24 78.52-26.24 31.39 0 56.15 9.01 74.5 26.84 18.56 17.93 27.88 44.58 27.88 80.14v13.32h-73.9v-12.92c0-13.72-3.01-23.84-8.83-30.45a26.46 26.46 0 0 0-21.66-10.32c-12.03 0-20.55 4.1-25.37 12.42a79.04 79.04 0 0 0-6.72 36.66v146.26c0 30.55 10.74 46.08 32.1 46.38 10.02 0 17.54-3.61 22.76-10.82a51.74 51.74 0 0 0 7.72-30.46V801.6h73.9v11.42c0 23.74-4.61 43.57-13.94 59.4a88.8 88.8 0 0 1-38.2 35.66 121.46 121.46 0 0 1-54.85 11.82Z"/></svg>
|
||||
|
Before Width: | Height: | Size: 2.3 KiB |
@@ -1 +0,0 @@
|
||||
<svg viewBox="0 0 256 549" xmlns="http://www.w3.org/2000/svg" width="256" height="549" preserveAspectRatio="xMidYMid"><path fill="#01EC64" d="M175.622 61.108C152.612 33.807 132.797 6.078 128.749.32a1.03 1.03 0 0 0-1.492 0c-4.048 5.759-23.863 33.487-46.874 60.788-197.507 251.896 31.108 421.89 31.108 421.89l1.917 1.28c1.704 26.234 5.966 63.988 5.966 63.988h17.045s4.26-37.54 5.965-63.987l1.918-1.494c.213.214 228.828-169.78 31.32-421.677Zm-47.726 418.05s-10.227-8.744-12.997-13.222v-.428l12.358-274.292c0-.853 1.279-.853 1.279 0l12.357 274.292v.428c-2.77 4.478-12.997 13.223-12.997 13.223Z"/></svg>
|
||||
|
Before Width: | Height: | Size: 598 B |
@@ -1 +0,0 @@
|
||||
<svg width="15" height="15" viewBox="0 0 15 15" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M2.89998 0.499976C2.89998 0.279062 2.72089 0.0999756 2.49998 0.0999756C2.27906 0.0999756 2.09998 0.279062 2.09998 0.499976V1.09998H1.49998C1.27906 1.09998 1.09998 1.27906 1.09998 1.49998C1.09998 1.72089 1.27906 1.89998 1.49998 1.89998H2.09998V2.49998C2.09998 2.72089 2.27906 2.89998 2.49998 2.89998C2.72089 2.89998 2.89998 2.72089 2.89998 2.49998V1.89998H3.49998C3.72089 1.89998 3.89998 1.72089 3.89998 1.49998C3.89998 1.27906 3.72089 1.09998 3.49998 1.09998H2.89998V0.499976ZM5.89998 3.49998C5.89998 3.27906 5.72089 3.09998 5.49998 3.09998C5.27906 3.09998 5.09998 3.27906 5.09998 3.49998V4.09998H4.49998C4.27906 4.09998 4.09998 4.27906 4.09998 4.49998C4.09998 4.72089 4.27906 4.89998 4.49998 4.89998H5.09998V5.49998C5.09998 5.72089 5.27906 5.89998 5.49998 5.89998C5.72089 5.89998 5.89998 5.72089 5.89998 5.49998V4.89998H6.49998C6.72089 4.89998 6.89998 4.72089 6.89998 4.49998C6.89998 4.27906 6.72089 4.09998 6.49998 4.09998H5.89998V3.49998ZM1.89998 6.49998C1.89998 6.27906 1.72089 6.09998 1.49998 6.09998C1.27906 6.09998 1.09998 6.27906 1.09998 6.49998V7.09998H0.499976C0.279062 7.09998 0.0999756 7.27906 0.0999756 7.49998C0.0999756 7.72089 0.279062 7.89998 0.499976 7.89998H1.09998V8.49998C1.09998 8.72089 1.27906 8.89997 1.49998 8.89997C1.72089 8.89997 1.89998 8.72089 1.89998 8.49998V7.89998H2.49998C2.72089 7.89998 2.89998 7.72089 2.89998 7.49998C2.89998 7.27906 2.72089 7.09998 2.49998 7.09998H1.89998V6.49998ZM8.54406 0.98184L8.24618 0.941586C8.03275 0.917676 7.90692 1.1655 8.02936 1.34194C8.17013 1.54479 8.29981 1.75592 8.41754 1.97445C8.91878 2.90485 9.20322 3.96932 9.20322 5.10022C9.20322 8.37201 6.82247 11.0878 3.69887 11.6097C3.45736 11.65 3.20988 11.6772 2.96008 11.6906C2.74563 11.702 2.62729 11.9535 2.77721 12.1072C2.84551 12.1773 2.91535 12.2458 2.98667 12.3128L3.05883 12.3795L3.31883 12.6045L3.50684 12.7532L3.62796 12.8433L3.81491 12.9742L3.99079 13.089C4.11175 13.1651 4.23536 13.2375 4.36157 13.3059L4.62496 13.4412L4.88553 13.5607L5.18837 13.6828L5.43169 13.7686C5.56564 13.8128 5.70149 13.8529 5.83857 13.8885C5.94262 13.9155 6.04767 13.9401 6.15405 13.9622C6.27993 13.9883 6.40713 14.0109 6.53544 14.0298L6.85241 14.0685L7.11934 14.0892C7.24637 14.0965 7.37436 14.1002 7.50322 14.1002C11.1483 14.1002 14.1032 11.1453 14.1032 7.50023C14.1032 7.25044 14.0893 7.00389 14.0623 6.76131L14.0255 6.48407C13.991 6.26083 13.9453 6.04129 13.8891 5.82642C13.8213 5.56709 13.7382 5.31398 13.6409 5.06881L13.5279 4.80132L13.4507 4.63542L13.3766 4.48666C13.2178 4.17773 13.0353 3.88295 12.8312 3.60423L12.6782 3.40352L12.4793 3.16432L12.3157 2.98361L12.1961 2.85951L12.0355 2.70246L11.8134 2.50184L11.4925 2.24191L11.2483 2.06498L10.9562 1.87446L10.6346 1.68894L10.3073 1.52378L10.1938 1.47176L9.95488 1.3706L9.67791 1.2669L9.42566 1.1846L9.10075 1.09489L8.83599 1.03486L8.54406 0.98184ZM10.4032 5.30023C10.4032 4.27588 10.2002 3.29829 9.83244 2.40604C11.7623 3.28995 13.1032 5.23862 13.1032 7.50023C13.1032 10.593 10.596 13.1002 7.50322 13.1002C6.63646 13.1002 5.81597 12.9036 5.08355 12.5522C6.5419 12.0941 7.81081 11.2082 8.74322 10.0416C8.87963 10.2284 9.10028 10.3497 9.34928 10.3497C9.76349 10.3497 10.0993 10.0139 10.0993 9.59971C10.0993 9.24256 9.84965 8.94373 9.51535 8.86816C9.57741 8.75165 9.63653 8.63334 9.6926 8.51332C9.88358 8.63163 10.1088 8.69993 10.35 8.69993C11.0403 8.69993 11.6 8.14028 11.6 7.44993C11.6 6.75976 11.0406 6.20024 10.3505 6.19993C10.3853 5.90487 10.4032 5.60464 10.4032 5.30023Z" fill="currentColor" fill-rule="evenodd" clip-rule="evenodd"></path></svg>
|
||||
|
Before Width: | Height: | Size: 3.5 KiB |
@@ -1,4 +0,0 @@
|
||||
<svg xmlns="http://www.w3.org/2000/svg" preserveAspectRatio="xMidYMid" viewBox="0 0 256 252">
|
||||
<path d="M236 194c-14 0-25 1-34 5-3 1-7 1-7 4l3 6c2 3 5 8 9 11l11 8 21 10 11 9 6 4-3-6-5-5c-5-7-11-13-18-18-6-3-18-9-20-15h-1l12-3 18-3 8-2v-2l-9-10c-8-8-18-15-28-22l-18-8c-2-1-6-2-7-4l-7-13-15-30-8-20c-18-30-38-48-68-65-6-4-14-5-22-7l-13-1-8-6C34 5 8-9 1 9c-5 11 7 22 11 28l9 13 3 9c3 8 5 17 9 24l6 10c2 2 4 3 5 6-3 4-3 9-4 13-7 20-4 44 5 59 2 4 9 14 18 10 8-3 6-13 8-22l1-4 8 14c5 9 14 18 22 24 4 3 8 8 13 10l-4-4-9-10c-8-10-14-21-20-32l-7-17-3-6c-3 4-7 7-9 12-3 7-3 17-4 26h-1c-6-1-8-7-10-12-5-12-6-32-1-46 1-4 6-15 4-19-1-3-4-5-6-7l-7-12-10-30-9-13c-3-5-7-8-10-14-1-2-2-5 0-7l2-2c2-2 9 0 11 1 6 3 12 5 17 9l8 6h4c6 1 12 0 17 2 9 3 18 7 25 12 23 14 42 35 54 59 3 4 3 8 5 12l12 26c4 8 7 16 12 23 3 4 14 6 18 8l12 4 18 12c2 2 11 7 12 10Z" fill="#00546B"/>
|
||||
<path d="m58 43-7 1 6 7 4 9v-1c3-1 4-4 4-8l-2-4-5-4Z" fill="#00546B"/>
|
||||
</svg>
|
||||
|
Before Width: | Height: | Size: 933 B |
@@ -1 +0,0 @@
|
||||
<svg viewBox="0 0 256 226" xmlns="http://www.w3.org/2000/svg" width="256" height="226" preserveAspectRatio="xMidYMid"><path fill="#05BDBA" d="M69.181 188.087h-2.417l-12.065-12.065v-2.417l18.444-18.444h12.778l1.704 1.704v12.778zM54.699 51.628v-2.417l12.065-12.065h2.417L87.625 55.59v12.778l-1.704 1.704H73.143z"/><path fill="#014847" d="M160.906 149.198h-17.552l-1.466-1.466v-41.089c0-7.31-2.873-12.976-11.689-13.174-4.537-.119-9.727 0-15.274.218l-.833.852v53.173l-1.466 1.466H95.074l-1.466-1.466v-70.19l1.466-1.467h39.503c15.354 0 27.795 12.441 27.795 27.795v43.882l-1.466 1.466Z"/><path fill="#05BDBA" d="M71.677 122.889H1.466L0 121.423V103.83l1.466-1.466h70.211l1.466 1.466v17.593zM254.534 122.889h-70.211l-1.466-1.466V103.83l1.466-1.466h70.211L256 103.83v17.593zM117.876 54.124V1.466L119.342 0h17.593l1.466 1.466v52.658l-1.466 1.466h-17.593zM117.876 223.787v-52.658l1.466-1.466h17.593l1.466 1.466v52.658l-1.466 1.465h-17.593z"/></svg>
|
||||
|
Before Width: | Height: | Size: 937 B |
@@ -1 +0,0 @@
|
||||
<svg viewBox="0 0 256 292" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="256" height="292"><defs><linearGradient id="a" x1="68.188%" x2="27.823%" y1="17.487%" y2="89.755%"><stop offset="0%" stop-color="#41873F"/><stop offset="32.88%" stop-color="#418B3D"/><stop offset="63.52%" stop-color="#419637"/><stop offset="93.19%" stop-color="#3FA92D"/><stop offset="100%" stop-color="#3FAE2A"/></linearGradient><linearGradient id="c" x1="43.277%" x2="159.245%" y1="55.169%" y2="-18.306%"><stop offset="13.76%" stop-color="#41873F"/><stop offset="40.32%" stop-color="#54A044"/><stop offset="71.36%" stop-color="#66B848"/><stop offset="90.81%" stop-color="#6CC04A"/></linearGradient><linearGradient id="f" x1="-4.389%" x2="101.499%" y1="49.997%" y2="49.997%"><stop offset="9.192%" stop-color="#6CC04A"/><stop offset="28.64%" stop-color="#66B848"/><stop offset="59.68%" stop-color="#54A044"/><stop offset="86.24%" stop-color="#41873F"/></linearGradient><path id="b" d="M134.923 1.832c-4.344-2.443-9.502-2.443-13.846 0L6.787 67.801C2.443 70.244 0 74.859 0 79.745v132.208c0 4.887 2.715 9.502 6.787 11.945l114.29 65.968c4.344 2.444 9.502 2.444 13.846 0l114.29-65.968c4.344-2.443 6.787-7.058 6.787-11.945V79.745c0-4.886-2.715-9.501-6.787-11.944L134.923 1.832Z"/><path id="e" d="M134.923 1.832c-4.344-2.443-9.502-2.443-13.846 0L6.787 67.801C2.443 70.244 0 74.859 0 79.745v132.208c0 4.887 2.715 9.502 6.787 11.945l114.29 65.968c4.344 2.444 9.502 2.444 13.846 0l114.29-65.968c4.344-2.443 6.787-7.058 6.787-11.945V79.745c0-4.886-2.715-9.501-6.787-11.944L134.923 1.832Z"/></defs><path fill="url(#a)" d="M134.923 1.832c-4.344-2.443-9.502-2.443-13.846 0L6.787 67.801C2.443 70.244 0 74.859 0 79.745v132.208c0 4.887 2.715 9.502 6.787 11.945l114.29 65.968c4.344 2.444 9.502 2.444 13.846 0l114.29-65.968c4.344-2.443 6.787-7.058 6.787-11.945V79.745c0-4.886-2.715-9.501-6.787-11.944L134.923 1.832Z"/><mask id="d" fill="#fff"><use xlink:href="#b"/></mask><path fill="url(#c)" d="M249.485 67.8 134.65 1.833c-1.086-.542-2.443-1.085-3.529-1.357L2.443 220.912c1.086 1.357 2.444 2.443 3.8 3.258l114.834 65.968c3.258 1.9 7.059 2.443 10.588 1.357L252.47 70.515c-.815-1.086-1.9-1.9-2.986-2.714Z" mask="url(#d)"/><mask id="g" fill="#fff"><use xlink:href="#e"/></mask><path fill="url(#f)" d="M249.756 223.898c3.258-1.9 5.701-5.158 6.787-8.687L130.579.204c-3.258-.543-6.787-.272-9.773 1.628L6.786 67.53l122.979 224.238c1.628-.272 3.529-.815 5.158-1.63l114.833-66.239Z" mask="url(#g)"/></svg>
|
||||
|
Before Width: | Height: | Size: 2.4 KiB |
@@ -1,3 +0,0 @@
|
||||
<svg width="15" height="15" viewBox="0 0 15 15" fill="none" xmlns="http://www.w3.org/2000/svg" transform="rotate(-45 7.5 7.5)">
|
||||
<path d="M1.20308 1.04312C1.00481 0.954998 0.772341 1.0048 0.627577 1.16641C0.482813 1.32802 0.458794 1.56455 0.568117 1.75196L3.92115 7.50002L0.568117 13.2481C0.458794 13.4355 0.482813 13.672 0.627577 13.8336C0.772341 13.9952 1.00481 14.045 1.20308 13.9569L14.7031 7.95693C14.8836 7.87668 15 7.69762 15 7.50002C15 7.30243 14.8836 7.12337 14.7031 7.04312L1.20308 1.04312ZM4.84553 7.10002L2.21234 2.586L13.2689 7.50002L2.21234 12.414L4.84552 7.90002H9C9.22092 7.90002 9.4 7.72094 9.4 7.50002C9.4 7.27911 9.22092 7.10002 9 7.10002H4.84553Z" fill="currentColor" fill-rule="evenodd" clip-rule="evenodd"/>
|
||||
</svg>
|
||||
|
Before Width: | Height: | Size: 740 B |
@@ -1 +0,0 @@
|
||||
<svg width="15" height="15" viewBox="0 0 15 15" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M7.5 0.875C5.49797 0.875 3.875 2.49797 3.875 4.5C3.875 6.15288 4.98124 7.54738 6.49373 7.98351C5.2997 8.12901 4.27557 8.55134 3.50407 9.31167C2.52216 10.2794 2.02502 11.72 2.02502 13.5999C2.02502 13.8623 2.23769 14.0749 2.50002 14.0749C2.76236 14.0749 2.97502 13.8623 2.97502 13.5999C2.97502 11.8799 3.42786 10.7206 4.17091 9.9883C4.91536 9.25463 6.02674 8.87499 7.49995 8.87499C8.97317 8.87499 10.0846 9.25463 10.8291 9.98831C11.5721 10.7206 12.025 11.8799 12.025 13.5999C12.025 13.8623 12.2376 14.0749 12.5 14.0749C12.7623 14.075 12.975 13.8623 12.975 13.6C12.975 11.72 12.4778 10.2794 11.4959 9.31166C10.7244 8.55135 9.70025 8.12903 8.50625 7.98352C10.0187 7.5474 11.125 6.15289 11.125 4.5C11.125 2.49797 9.50203 0.875 7.5 0.875ZM4.825 4.5C4.825 3.02264 6.02264 1.825 7.5 1.825C8.97736 1.825 10.175 3.02264 10.175 4.5C10.175 5.97736 8.97736 7.175 7.5 7.175C6.02264 7.175 4.825 5.97736 4.825 4.5Z" fill="currentColor" fill-rule="evenodd" clip-rule="evenodd"></path></svg>
|
||||
|
Before Width: | Height: | Size: 1.1 KiB |
@@ -1 +0,0 @@
|
||||
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 -1 100 50"><path fill="#fff" d="M7.579 10.123h14.204c4.169.035 7.19 1.237 9.063 3.604 1.873 2.367 2.491 5.6 1.855 9.699-.247 1.873-.795 3.71-1.643 5.512a16.385 16.385 0 01-3.392 4.876c-1.767 1.837-3.657 3.003-5.671 3.498a26.11 26.11 0 01-6.254.742h-6.36l-2.014 10.07H0l7.579-38.001m6.201 6.042l-3.18 15.9c.212.035.424.053.636.053h.742c3.392.035 6.219-.3 8.48-1.007 2.261-.742 3.781-3.321 4.558-7.738.636-3.71 0-5.848-1.908-6.413-1.873-.565-4.222-.83-7.049-.795-.424.035-.83.053-1.219.053h-1.113l.053-.053M41.093 0h7.314L46.34 10.123h6.572c3.604.071 6.289.813 8.056 2.226 1.802 1.413 2.332 4.099 1.59 8.056l-3.551 17.649h-7.42L54.979 21.2c.353-1.767.247-3.021-.318-3.763s-1.784-1.113-3.657-1.113l-5.883-.053-4.346 21.783h-7.314L41.093 0M70.412 10.123h14.204c4.169.035 7.19 1.237 9.063 3.604 1.873 2.367 2.491 5.6 1.855 9.699-.247 1.873-.795 3.71-1.643 5.512a16.385 16.385 0 01-3.392 4.876c-1.767 1.837-3.657 3.003-5.671 3.498a26.11 26.11 0 01-6.254.742h-6.36L70.2 48.124h-7.367l7.579-38.001m6.201 6.042l-3.18 15.9c.212.035.424.053.636.053h.742c3.392.035 6.219-.3 8.48-1.007 2.261-.742 3.781-3.321 4.558-7.738.636-3.71 0-5.848-1.908-6.413-1.873-.565-4.222-.83-7.049-.795-.424.035-.83.053-1.219.053H76.56l.053-.053"/></svg>
|
||||
|
Before Width: | Height: | Size: 1.2 KiB |
@@ -1 +0,0 @@
|
||||
<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="16 16 32 32"><path fill="url(#a)" d="M31.885 16c-8.124 0-7.617 3.523-7.617 3.523l.01 3.65h7.752v1.095H21.197S16 23.678 16 31.876c0 8.196 4.537 7.906 4.537 7.906h2.708v-3.804s-.146-4.537 4.465-4.537h7.688s4.32.07 4.32-4.175v-7.019S40.374 16 31.885 16zm-4.275 2.454a1.394 1.394 0 1 1 0 2.79 1.393 1.393 0 0 1-1.395-1.395c0-.771.624-1.395 1.395-1.395z"/><path fill="url(#b)" d="M32.115 47.833c8.124 0 7.617-3.523 7.617-3.523l-.01-3.65H31.97v-1.095h10.832S48 40.155 48 31.958c0-8.197-4.537-7.906-4.537-7.906h-2.708v3.803s.146 4.537-4.465 4.537h-7.688s-4.32-.07-4.32 4.175v7.019s-.656 4.247 7.833 4.247zm4.275-2.454a1.393 1.393 0 0 1-1.395-1.395 1.394 1.394 0 1 1 1.395 1.395z"/><defs><linearGradient id="a" x1="19.075" x2="34.898" y1="18.782" y2="34.658" gradientUnits="userSpaceOnUse"><stop stop-color="#387EB8"/><stop offset="1" stop-color="#366994"/></linearGradient><linearGradient id="b" x1="28.809" x2="45.803" y1="28.882" y2="45.163" gradientUnits="userSpaceOnUse"><stop stop-color="#FFE052"/><stop offset="1" stop-color="#FFC331"/></linearGradient></defs></svg>
|
||||
|
Before Width: | Height: | Size: 1.1 KiB |
@@ -1 +0,0 @@
|
||||
<svg width="15" height="15" viewBox="0 0 15 15" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M6.85357 3.85355L7.65355 3.05353C8.2981 2.40901 9.42858 1.96172 10.552 1.80125C11.1056 1.72217 11.6291 1.71725 12.0564 1.78124C12.4987 1.84748 12.7698 1.97696 12.8965 2.10357C13.0231 2.23018 13.1526 2.50125 13.2188 2.94357C13.2828 3.37086 13.2779 3.89439 13.1988 4.44801C13.0383 5.57139 12.591 6.70188 11.9464 7.34645L7.49999 11.7929L6.35354 10.6465C6.15827 10.4512 5.84169 10.4512 5.64643 10.6465C5.45117 10.8417 5.45117 11.1583 5.64643 11.3536L7.14644 12.8536C7.34171 13.0488 7.65829 13.0488 7.85355 12.8536L8.40073 12.3064L9.57124 14.2572C9.65046 14.3893 9.78608 14.4774 9.9389 14.4963C10.0917 14.5151 10.2447 14.4624 10.3535 14.3536L12.3535 12.3536C12.4648 12.2423 12.5172 12.0851 12.495 11.9293L12.0303 8.67679L12.6536 8.05355C13.509 7.19808 14.0117 5.82855 14.1887 4.58943C14.2784 3.9618 14.2891 3.33847 14.2078 2.79546C14.1287 2.26748 13.9519 1.74482 13.6035 1.39645C13.2552 1.04809 12.7325 0.871332 12.2045 0.792264C11.6615 0.710945 11.0382 0.721644 10.4105 0.8113C9.17143 0.988306 7.80189 1.491 6.94644 2.34642L6.32322 2.96968L3.07071 2.50504C2.91492 2.48278 2.75773 2.53517 2.64645 2.64646L0.646451 4.64645C0.537579 4.75533 0.484938 4.90829 0.50375 5.0611C0.522563 5.21391 0.61073 5.34954 0.742757 5.42876L2.69364 6.59928L2.14646 7.14645C2.0527 7.24022 2.00002 7.3674 2.00002 7.50001C2.00002 7.63261 2.0527 7.75979 2.14646 7.85356L3.64647 9.35356C3.84173 9.54883 4.15831 9.54883 4.35357 9.35356C4.54884 9.1583 4.54884 8.84172 4.35357 8.64646L3.20712 7.50001L3.85357 6.85356L6.85357 3.85355ZM10.0993 13.1936L9.12959 11.5775L11.1464 9.56067L11.4697 11.8232L10.0993 13.1936ZM3.42251 5.87041L5.43935 3.85356L3.17678 3.53034L1.80638 4.90074L3.42251 5.87041ZM2.35356 10.3535C2.54882 10.1583 2.54882 9.8417 2.35356 9.64644C2.1583 9.45118 1.84171 9.45118 1.64645 9.64644L0.646451 10.6464C0.451188 10.8417 0.451188 11.1583 0.646451 11.3535C0.841713 11.5488 1.1583 11.5488 1.35356 11.3535L2.35356 10.3535ZM3.85358 11.8536C4.04884 11.6583 4.04885 11.3417 3.85359 11.1465C3.65833 10.9512 3.34175 10.9512 3.14648 11.1465L1.14645 13.1464C0.95119 13.3417 0.951187 13.6583 1.14645 13.8535C1.34171 14.0488 1.65829 14.0488 1.85355 13.8536L3.85358 11.8536ZM5.35356 13.3535C5.54882 13.1583 5.54882 12.8417 5.35356 12.6464C5.1583 12.4512 4.84171 12.4512 4.64645 12.6464L3.64645 13.6464C3.45119 13.8417 3.45119 14.1583 3.64645 14.3535C3.84171 14.5488 4.1583 14.5488 4.35356 14.3535L5.35356 13.3535ZM9.49997 6.74881C10.1897 6.74881 10.7488 6.1897 10.7488 5.5C10.7488 4.8103 10.1897 4.25118 9.49997 4.25118C8.81026 4.25118 8.25115 4.8103 8.25115 5.5C8.25115 6.1897 8.81026 6.74881 9.49997 6.74881Z" fill="currentColor" fill-rule="evenodd" clip-rule="evenodd"></path></svg>
|
||||
|
Before Width: | Height: | Size: 2.7 KiB |
@@ -1 +0,0 @@
|
||||
<svg viewBox="0 0 512 384" xmlns="http://www.w3.org/2000/svg" width="512" height="384"><path fill="#CF649A" d="M441 221c-18 0-34 4-47 10-5-9-9-17-10-24s-2-11-1-20 6-21 6-22c0 0-1-5-11-5-11 0-20 2-21 5l-4 15c-2 9-20 43-31 60-4-7-7-13-7-17-1-8-2-12-1-21s6-20 6-21-1-6-11-6c-11 0-20 2-21 5l-4 15-34 76-8 18c-2 4 0 0 0 1l-3 5-4 5s-1-7 1-16c3-19 12-49 12-51 0 0 2-5-6-8-7-3-9 2-10 2l-1 1s8-34-16-34c-14 0-35 17-45 31l-34 19-17 9-1-1c-29-31-82-52-79-93 0-15 6-54 101-102 79-39 141-28 152-4 16 34-33 97-115 106-31 3-47-9-51-13-4-5-5-5-7-4s-1 5 0 8c3 6 13 17 30 23 15 5 51 8 95-9 49-19 88-72 77-117-12-45-87-60-157-35-43 15-88 39-121 70-39 36-45 68-43 81 10 47 74 78 100 100l-3 2c-13 7-63 33-75 60-14 31 2 53 13 56 33 10 68-7 86-34 18-28 16-64 8-80l-1-1 11-6 18-10c-3 9-5 19-6 34-2 17 6 40 15 49 4 4 9 4 12 4 11 0 16-9 22-20l13-28s-8 41 13 41c7 0 15-9 18-14l1-1 1-2 20-37 25-57 5 20c2 8 7 16 10 24l-4 7-8 10c-10 12-23 26-24 30-2 5-2 8 2 11 3 2 8 2 13 2l18-4 17-9c10-7 16-18 15-32 0-7-3-15-6-22l3-4c16-23 28-49 28-49l5 21 9 20a89 89 0 0 0-27 36c-6 17-2 24 7 26 4 1 10-1 14-3 5-1 11-4 17-8 10-8 20-18 19-32 0-6-2-13-4-19 12-5 29-8 49-5 45 5 54 33 52 44-2 12-11 18-14 20l-4 4c1 2 2 2 5 2 3-1 23-10 24-31 1-28-25-58-71-57zM97 336c-14 16-35 23-44 17-9-5-6-29 13-46 11-10 25-20 34-26l9-5 1-1 3-1c6 24 0 45-16 62zm108-73c-5 13-16 45-22 43-6-1-9-26-2-50 4-12 13-26 18-32 8-9 17-12 19-8 3 5-10 39-13 47zm89 43-5 1v-2l16-17 9-11v1c0 14-14 24-20 28zm68-16c-2-1-1-5 4-16 2-5 7-13 15-20l2 9c0 18-13 24-21 27z"/></svg>
|
||||
|
Before Width: | Height: | Size: 1.5 KiB |
@@ -1 +0,0 @@
|
||||
<svg width="15" height="15" viewBox="0 0 15 15" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M7.5 0C7.77614 0 8 0.223858 8 0.5V2.5C8 2.77614 7.77614 3 7.5 3C7.22386 3 7 2.77614 7 2.5V0.5C7 0.223858 7.22386 0 7.5 0ZM2.1967 2.1967C2.39196 2.00144 2.70854 2.00144 2.90381 2.1967L4.31802 3.61091C4.51328 3.80617 4.51328 4.12276 4.31802 4.31802C4.12276 4.51328 3.80617 4.51328 3.61091 4.31802L2.1967 2.90381C2.00144 2.70854 2.00144 2.39196 2.1967 2.1967ZM0.5 7C0.223858 7 0 7.22386 0 7.5C0 7.77614 0.223858 8 0.5 8H2.5C2.77614 8 3 7.77614 3 7.5C3 7.22386 2.77614 7 2.5 7H0.5ZM2.1967 12.8033C2.00144 12.608 2.00144 12.2915 2.1967 12.0962L3.61091 10.682C3.80617 10.4867 4.12276 10.4867 4.31802 10.682C4.51328 10.8772 4.51328 11.1938 4.31802 11.3891L2.90381 12.8033C2.70854 12.9986 2.39196 12.9986 2.1967 12.8033ZM12.5 7C12.2239 7 12 7.22386 12 7.5C12 7.77614 12.2239 8 12.5 8H14.5C14.7761 8 15 7.77614 15 7.5C15 7.22386 14.7761 7 14.5 7H12.5ZM10.682 4.31802C10.4867 4.12276 10.4867 3.80617 10.682 3.61091L12.0962 2.1967C12.2915 2.00144 12.608 2.00144 12.8033 2.1967C12.9986 2.39196 12.9986 2.70854 12.8033 2.90381L11.3891 4.31802C11.1938 4.51328 10.8772 4.51328 10.682 4.31802ZM8 12.5C8 12.2239 7.77614 12 7.5 12C7.22386 12 7 12.2239 7 12.5V14.5C7 14.7761 7.22386 15 7.5 15C7.77614 15 8 14.7761 8 14.5V12.5ZM10.682 10.682C10.8772 10.4867 11.1938 10.4867 11.3891 10.682L12.8033 12.0962C12.9986 12.2915 12.9986 12.608 12.8033 12.8033C12.608 12.9986 12.2915 12.9986 12.0962 12.8033L10.682 11.3891C10.4867 11.1938 10.4867 10.8772 10.682 10.682ZM5.5 7.5C5.5 6.39543 6.39543 5.5 7.5 5.5C8.60457 5.5 9.5 6.39543 9.5 7.5C9.5 8.60457 8.60457 9.5 7.5 9.5C6.39543 9.5 5.5 8.60457 5.5 7.5ZM7.5 4.5C5.84315 4.5 4.5 5.84315 4.5 7.5C4.5 9.15685 5.84315 10.5 7.5 10.5C9.15685 10.5 10.5 9.15685 10.5 7.5C10.5 5.84315 9.15685 4.5 7.5 4.5Z" fill="currentColor" fill-rule="evenodd" clip-rule="evenodd"></path></svg>
|
||||
|
Before Width: | Height: | Size: 1.9 KiB |
@@ -1,17 +0,0 @@
|
||||
<svg
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
fill="none"
|
||||
viewBox="0 0 54 33"
|
||||
><g clip-path="url(#a)"
|
||||
><path
|
||||
fill="#38bdf8"
|
||||
fill-rule="evenodd"
|
||||
d="M27 0c-7.2 0-11.7 3.6-13.5 10.8 2.7-3.6 5.85-4.95 9.45-4.05 2.054.513 3.522 2.004 5.147 3.653C30.744 13.09 33.808 16.2 40.5 16.2c7.2 0 11.7-3.6 13.5-10.8-2.7 3.6-5.85 4.95-9.45 4.05-2.054-.513-3.522-2.004-5.147-3.653C36.756 3.11 33.692 0 27 0zM13.5 16.2C6.3 16.2 1.8 19.8 0 27c2.7-3.6 5.85-4.95 9.45-4.05 2.054.514 3.522 2.004 5.147 3.653C17.244 29.29 20.308 32.4 27 32.4c7.2 0 11.7-3.6 13.5-10.8-2.7 3.6-5.85 4.95-9.45 4.05-2.054-.513-3.522-2.004-5.147-3.653C23.256 19.31 20.192 16.2 13.5 16.2z"
|
||||
clip-rule="evenodd"></path></g
|
||||
><defs
|
||||
><clipPath id="a"
|
||||
><path fill="#fff" d="M0 0h54v32.4H0z"
|
||||
></path></clipPath
|
||||
></defs
|
||||
></svg
|
||||
>
|
||||
|
Before Width: | Height: | Size: 1.2 KiB |
@@ -1 +0,0 @@
|
||||
<svg xmlns="http://www.w3.org/2000/svg" width="1200" height="1227" fill="none" viewBox="0 0 1200 1227"><path fill="#fff" d="M714.163 519.284 1160.89 0h-105.86L667.137 450.887 357.328 0H0l468.492 681.821L0 1226.37h105.866l409.625-476.152 327.181 476.152H1200L714.137 519.284h.026ZM569.165 687.828l-47.468-67.894-377.686-540.24h162.604l304.797 435.991 47.468 67.894 396.2 566.721H892.476L569.165 687.854v-.026Z"/></svg>
|
||||
|
Before Width: | Height: | Size: 417 B |
@@ -1 +0,0 @@
|
||||
<svg viewBox="0 0 256 256" width="256" height="256" xmlns="http://www.w3.org/2000/svg" preserveAspectRatio="xMidYMid"><path d="M20 0h216c11.046 0 20 8.954 20 20v216c0 11.046-8.954 20-20 20H20c-11.046 0-20-8.954-20-20V20C0 8.954 8.954 0 20 0Z" fill="#3178C6"/><path d="M150.518 200.475v27.62c4.492 2.302 9.805 4.028 15.938 5.179 6.133 1.151 12.597 1.726 19.393 1.726 6.622 0 12.914-.633 18.874-1.899 5.96-1.266 11.187-3.352 15.678-6.257 4.492-2.906 8.048-6.704 10.669-11.394 2.62-4.689 3.93-10.486 3.93-17.391 0-5.006-.749-9.394-2.246-13.163a30.748 30.748 0 0 0-6.479-10.055c-2.821-2.935-6.205-5.567-10.149-7.898-3.945-2.33-8.394-4.531-13.347-6.602-3.628-1.497-6.881-2.949-9.761-4.359-2.879-1.41-5.327-2.848-7.342-4.316-2.016-1.467-3.571-3.021-4.665-4.661-1.094-1.64-1.641-3.495-1.641-5.567 0-1.899.489-3.61 1.468-5.135s2.362-2.834 4.147-3.927c1.785-1.094 3.973-1.942 6.565-2.547 2.591-.604 5.471-.906 8.638-.906 2.304 0 4.737.173 7.299.518 2.563.345 5.14.877 7.732 1.597a53.669 53.669 0 0 1 7.558 2.719 41.7 41.7 0 0 1 6.781 3.797v-25.807c-4.204-1.611-8.797-2.805-13.778-3.582-4.981-.777-10.697-1.165-17.147-1.165-6.565 0-12.784.705-18.658 2.115-5.874 1.409-11.043 3.61-15.506 6.602-4.463 2.993-7.99 6.805-10.582 11.437-2.591 4.632-3.887 10.17-3.887 16.615 0 8.228 2.375 15.248 7.127 21.06 4.751 5.811 11.963 10.731 21.638 14.759a291.458 291.458 0 0 1 10.625 4.575c3.283 1.496 6.119 3.049 8.509 4.66 2.39 1.611 4.276 3.366 5.658 5.265 1.382 1.899 2.073 4.057 2.073 6.474a9.901 9.901 0 0 1-1.296 4.963c-.863 1.524-2.174 2.848-3.93 3.97-1.756 1.122-3.945 1.999-6.565 2.632-2.62.633-5.687.95-9.2.95-5.989 0-11.92-1.05-17.794-3.151-5.875-2.1-11.317-5.25-16.327-9.451Zm-46.036-68.733H140V109H41v22.742h35.345V233h28.137V131.742Z" fill="#FFF"/></svg>
|
||||
|
Before Width: | Height: | Size: 1.7 KiB |
@@ -1 +0,0 @@
|
||||
<svg viewBox="0 0 256 222" width="256" height="222" xmlns="http://www.w3.org/2000/svg" preserveAspectRatio="xMidYMid"><path fill="#fff" d="m128 0 128 221.705H0z"/></svg>
|
||||
|
Before Width: | Height: | Size: 169 B |
@@ -1 +0,0 @@
|
||||
<svg viewBox="0 0 256 259" width="256" height="259" xmlns="http://www.w3.org/2000/svg" preserveAspectRatio="xMidYMid"><path d="m67.663 221.823 4.185 2.093c17.44 10.463 36.971 15.346 56.503 15.346 61.385 0 111.609-50.224 111.609-111.609 0-29.297-11.859-57.897-32.785-78.824-20.927-20.927-48.83-32.785-78.824-32.785-61.385 0-111.61 50.224-110.912 112.307 0 20.926 6.278 41.156 16.741 58.594l2.79 4.186-11.16 41.156 41.853-10.464Z" fill="#00E676"/><path d="M219.033 37.668C195.316 13.254 162.531 0 129.048 0 57.898 0 .698 57.897 1.395 128.35c0 22.322 6.278 43.947 16.742 63.478L0 258.096l67.663-17.439c18.834 10.464 39.76 15.347 60.688 15.347 70.453 0 127.653-57.898 127.653-128.35 0-34.181-13.254-66.269-36.97-89.986ZM129.048 234.38c-18.834 0-37.668-4.882-53.712-14.648l-4.185-2.093-40.458 10.463 10.463-39.76-2.79-4.186C7.673 134.63 22.322 69.058 72.546 38.365c50.224-30.692 115.097-16.043 145.79 34.181 30.692 50.224 16.043 115.097-34.18 145.79-16.045 10.463-35.576 16.043-55.108 16.043Zm61.385-77.428-7.673-3.488s-11.16-4.883-18.136-8.371c-.698 0-1.395-.698-2.093-.698-2.093 0-3.488.698-4.883 1.396 0 0-.697.697-10.463 11.858-.698 1.395-2.093 2.093-3.488 2.093h-.698c-.697 0-2.092-.698-2.79-1.395l-3.488-1.395c-7.673-3.488-14.648-7.674-20.229-13.254-1.395-1.395-3.488-2.79-4.883-4.185-4.883-4.883-9.766-10.464-13.253-16.742l-.698-1.395c-.697-.698-.697-1.395-1.395-2.79 0-1.395 0-2.79.698-3.488 0 0 2.79-3.488 4.882-5.58 1.396-1.396 2.093-3.488 3.488-4.883 1.395-2.093 2.093-4.883 1.395-6.976-.697-3.488-9.068-22.322-11.16-26.507-1.396-2.093-2.79-2.79-4.883-3.488H83.01c-1.396 0-2.79.698-4.186.698l-.698.697c-1.395.698-2.79 2.093-4.185 2.79-1.395 1.396-2.093 2.79-3.488 4.186-4.883 6.278-7.673 13.951-7.673 21.624 0 5.58 1.395 11.161 3.488 16.044l.698 2.093c6.278 13.253 14.648 25.112 25.81 35.575l2.79 2.79c2.092 2.093 4.185 3.488 5.58 5.58 14.649 12.557 31.39 21.625 50.224 26.508 2.093.697 4.883.697 6.976 1.395h6.975c3.488 0 7.673-1.395 10.464-2.79 2.092-1.395 3.487-1.395 4.882-2.79l1.396-1.396c1.395-1.395 2.79-2.092 4.185-3.487 1.395-1.395 2.79-2.79 3.488-4.186 1.395-2.79 2.092-6.278 2.79-9.765v-4.883s-.698-.698-2.093-1.395Z" fill="#FFF"/></svg>
|
||||
|
Before Width: | Height: | Size: 2.1 KiB |
@@ -1 +0,0 @@
|
||||
<svg xmlns="http://www.w3.org/2000/svg" width="166" height="263" fill="none" viewBox="0 0 166 263"><g filter="url(#a)"><path fill="#58E5BB" d="M42.086 128.474 28.427 90.089c-2.383-6.696 2.436-13.802 9.291-13.48 76.537 3.589 115.804 31.534 112.144 112.12-13.311-56.28-77.153-60.255-107.776-60.255Z"/></g><g filter="url(#b)"><path fill="#58E5BB" d="M21.453 57.833 7.236 20.639C4.662 13.908 9.478 6.6 16.44 6.683c78.163.938 132.738 6.243 132.738 110.722-13.311-56.28-97.101-59.572-127.725-59.572Z"/></g><g filter="url(#c)"><path fill="#58E5BB" d="m63.245 201.377-14.653-41.075c-2.376-6.661 2.376-13.751 9.196-13.388 62.444 3.327 93.677 30.587 90.06 110.239-13.311-56.28-53.76-55.776-84.604-55.776Z"/></g><defs><filter id="a" width="122.286" height="116.131" x="27.81" y="76.598" color-interpolation-filters="sRGB" filterUnits="userSpaceOnUse"><feFlood flood-opacity="0" result="BackgroundImageFix"/><feBlend in="SourceGraphic" in2="BackgroundImageFix" result="shape"/><feColorMatrix in="SourceAlpha" result="hardAlpha" values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0"/><feOffset dy="4"/><feGaussianBlur stdDeviation="2"/><feComposite in2="hardAlpha" k2="-1" k3="1" operator="arithmetic"/><feColorMatrix values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0.25 0"/><feBlend in2="shape" result="effect1_innerShadow_15473_4390"/></filter><filter id="b" width="142.645" height="114.724" x="6.533" y="6.682" color-interpolation-filters="sRGB" filterUnits="userSpaceOnUse"><feFlood flood-opacity="0" result="BackgroundImageFix"/><feBlend in="SourceGraphic" in2="BackgroundImageFix" result="shape"/><feColorMatrix in="SourceAlpha" result="hardAlpha" values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0"/><feOffset dy="4"/><feGaussianBlur stdDeviation="2"/><feComposite in2="hardAlpha" k2="-1" k3="1" operator="arithmetic"/><feColorMatrix values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0.25 0"/><feBlend in2="shape" result="effect1_innerShadow_15473_4390"/></filter><filter id="c" width="100.158" height="114.252" x="47.972" y="146.9" color-interpolation-filters="sRGB" filterUnits="userSpaceOnUse"><feFlood flood-opacity="0" result="BackgroundImageFix"/><feBlend in="SourceGraphic" in2="BackgroundImageFix" result="shape"/><feColorMatrix in="SourceAlpha" result="hardAlpha" values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0"/><feOffset dy="4"/><feGaussianBlur stdDeviation="2"/><feComposite in2="hardAlpha" k2="-1" k3="1" operator="arithmetic"/><feColorMatrix values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0.25 0"/><feBlend in2="shape" result="effect1_innerShadow_15473_4390"/></filter></defs></svg>
|
||||
|
Before Width: | Height: | Size: 2.5 KiB |
@@ -1 +0,0 @@
|
||||
<svg viewBox="0 0 122.52 122.523" width="512" height="512" xmlns="http://www.w3.org/2000/svg"><g fill="#21759b"><path d="m8.708 61.26c0 20.802 12.089 38.779 29.619 47.298l-25.069-68.686c-2.916 6.536-4.55 13.769-4.55 21.388z"/><path d="m96.74 58.608c0-6.495-2.333-10.993-4.334-14.494-2.664-4.329-5.161-7.995-5.161-12.324 0-4.831 3.664-9.328 8.825-9.328.233 0 .454.029.681.042-9.35-8.566-21.807-13.796-35.489-13.796-18.36 0-34.513 9.42-43.91 23.688 1.233.037 2.395.063 3.382.063 5.497 0 14.006-.667 14.006-.667 2.833-.167 3.167 3.994.337 4.329 0 0-2.847.335-6.015.501l19.138 56.925 11.501-34.493-8.188-22.434c-2.83-.166-5.511-.501-5.511-.501-2.832-.166-2.5-4.496.332-4.329 0 0 8.679.667 13.843.667 5.496 0 14.006-.667 14.006-.667 2.835-.167 3.168 3.994.337 4.329 0 0-2.853.335-6.015.501l18.992 56.494 5.242-17.517c2.272-7.269 4.001-12.49 4.001-16.989z"/><path d="m62.184 65.857-15.768 45.819c4.708 1.384 9.687 2.141 14.846 2.141 6.12 0 11.989-1.058 17.452-2.979-.141-.225-.269-.464-.374-.724z"/><path d="m107.376 36.046c.226 1.674.354 3.471.354 5.404 0 5.333-.996 11.328-3.996 18.824l-16.053 46.413c15.624-9.111 26.133-26.038 26.133-45.426.001-9.137-2.333-17.729-6.438-25.215z"/><path d="m61.262 0c-33.779 0-61.262 27.481-61.262 61.26 0 33.783 27.483 61.263 61.262 61.263 33.778 0 61.265-27.48 61.265-61.263-.001-33.779-27.487-61.26-61.265-61.26zm0 119.715c-32.23 0-58.453-26.223-58.453-58.455 0-32.23 26.222-58.451 58.453-58.451 32.229 0 58.45 26.221 58.45 58.451 0 32.232-26.221 58.455-58.45 58.455z"/></g></svg>
|
||||
|
Before Width: | Height: | Size: 1.5 KiB |
@@ -1 +0,0 @@
|
||||
<svg width="15" height="15" viewBox="0 0 15 15" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M12.8536 2.85355C13.0488 2.65829 13.0488 2.34171 12.8536 2.14645C12.6583 1.95118 12.3417 1.95118 12.1464 2.14645L7.5 6.79289L2.85355 2.14645C2.65829 1.95118 2.34171 1.95118 2.14645 2.14645C1.95118 2.34171 1.95118 2.65829 2.14645 2.85355L6.79289 7.5L2.14645 12.1464C1.95118 12.3417 1.95118 12.6583 2.14645 12.8536C2.34171 13.0488 2.65829 13.0488 2.85355 12.8536L7.5 8.20711L12.1464 12.8536C12.3417 13.0488 12.6583 13.0488 12.8536 12.8536C13.0488 12.6583 13.0488 12.3417 12.8536 12.1464L8.20711 7.5L12.8536 2.85355Z" fill="currentColor" fill-rule="evenodd" clip-rule="evenodd"></path></svg>
|
||||
|
Before Width: | Height: | Size: 692 B |
@@ -1 +0,0 @@
|
||||
<svg width="15" height="15" viewBox="0 0 15 15" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M4.76447 3.12199C5.63151 3.04859 6.56082 3 7.5 3C8.43918 3 9.36849 3.04859 10.2355 3.12199C11.2796 3.21037 11.9553 3.27008 12.472 3.39203C12.9425 3.50304 13.2048 3.64976 13.4306 3.88086C13.4553 3.90618 13.4902 3.94414 13.5133 3.97092C13.7126 4.20149 13.8435 4.4887 13.918 5.03283C13.9978 5.6156 14 6.37644 14 7.52493C14 8.66026 13.9978 9.41019 13.9181 9.98538C13.8439 10.5206 13.7137 10.8061 13.5125 11.0387C13.4896 11.0651 13.4541 11.1038 13.4296 11.1287C13.2009 11.3625 12.9406 11.5076 12.4818 11.6164C11.9752 11.7365 11.3143 11.7942 10.2878 11.8797C9.41948 11.9521 8.47566 12 7.5 12C6.52434 12 5.58052 11.9521 4.7122 11.8797C3.68572 11.7942 3.02477 11.7365 2.51816 11.6164C2.05936 11.5076 1.7991 11.3625 1.57037 11.1287C1.54593 11.1038 1.51035 11.0651 1.48748 11.0387C1.28628 10.8061 1.15612 10.5206 1.08193 9.98538C1.00221 9.41019 1 8.66026 1 7.52493C1 6.37644 1.00216 5.6156 1.082 5.03283C1.15654 4.4887 1.28744 4.20149 1.48666 3.97092C1.5098 3.94414 1.54468 3.90618 1.56942 3.88086C1.7952 3.64976 2.05752 3.50304 2.52796 3.39203C3.04473 3.27008 3.7204 3.21037 4.76447 3.12199ZM0 7.52493C0 5.28296 0 4.16198 0.729985 3.31713C0.766457 3.27491 0.815139 3.22194 0.854123 3.18204C1.63439 2.38339 2.64963 2.29744 4.68012 2.12555C5.56923 2.05028 6.52724 2 7.5 2C8.47276 2 9.43077 2.05028 10.3199 2.12555C12.3504 2.29744 13.3656 2.38339 14.1459 3.18204C14.1849 3.22194 14.2335 3.27491 14.27 3.31713C15 4.16198 15 5.28296 15 7.52493C15 9.74012 15 10.8477 14.2688 11.6929C14.2326 11.7348 14.1832 11.7885 14.1444 11.8281C13.3629 12.6269 12.3655 12.71 10.3709 12.8763C9.47971 12.9505 8.50782 13 7.5 13C6.49218 13 5.52028 12.9505 4.62915 12.8763C2.63446 12.71 1.63712 12.6269 0.855558 11.8281C0.816844 11.7885 0.767442 11.7348 0.731221 11.6929C0 10.8477 0 9.74012 0 7.52493ZM5.25 5.38264C5.25 5.20225 5.43522 5.08124 5.60041 5.15369L10.428 7.27105C10.6274 7.35853 10.6274 7.64147 10.428 7.72895L5.60041 9.84631C5.43522 9.91876 5.25 9.79775 5.25 9.61736V5.38264Z" fill="currentColor" fill-rule="evenodd" clip-rule="evenodd"></path></svg>
|
||||
|
Before Width: | Height: | Size: 2.1 KiB |
@@ -1,94 +1,83 @@
|
||||
---
|
||||
import "../styles/global.css";
|
||||
import Header from "../components/layout/Header.astro";
|
||||
import Footer from "../components/layout/Footer.astro";
|
||||
import SpeedInsights from "@vercel/speed-insights/astro"
|
||||
const {
|
||||
pageTitle = "NeonMint by EFEELE 🚀",
|
||||
description = "Welcome to NeonMint by EFEELE, where I develop software and share knowledge.",
|
||||
ogimage = {
|
||||
url: "/images/imagedefault.webp",
|
||||
alt: "Default image of EFEELE",
|
||||
},
|
||||
} = Astro.props;
|
||||
|
||||
const siteUrl = new URL(Astro.url).origin;
|
||||
const SEO = {
|
||||
sitename: "NeonMint by EFEELE🚀",
|
||||
url: siteUrl,
|
||||
locale: "en_US",
|
||||
author: "Fernando Lopez | EFEELE",
|
||||
twitter: "@efeeledev",
|
||||
};
|
||||
interface Props {
|
||||
title?: string;
|
||||
description?: string;
|
||||
}
|
||||
|
||||
|
||||
const twitterimage = `${siteUrl}${ogimage.url}`;
|
||||
const { title = "Rishikesh S - Portfolio", description = "My Portfolio" } =
|
||||
Astro.props;
|
||||
---
|
||||
|
||||
<html
|
||||
lang="en"
|
||||
class="dark:bg-[#0E0E11] bg-mint-50/5 font-montserrat scroll-smooth"
|
||||
>
|
||||
<!doctype html>
|
||||
<html lang="en">
|
||||
<head>
|
||||
<meta charset="UTF-8" />
|
||||
<meta name="viewport" content="width=device-width" />
|
||||
<title>{pageTitle}</title>
|
||||
<!-- Favicon for different platforms -->
|
||||
<link rel="icon" href="/favicon-32x32.png" sizes="32x32" />
|
||||
<link rel="icon" href="/favicon-16x16.png" sizes="16x16" />
|
||||
<link rel="apple-touch-icon" href="/apple-touch-icon.png" />
|
||||
<link rel="icon" href="/android-chrome-192x192.png" sizes="192x192" />
|
||||
<link rel="icon" href="/android-chrome-512x512.png" sizes="512x512" />
|
||||
|
||||
<!-- Web manifest -->
|
||||
<link rel="manifest" href="/site.webmanifest" />
|
||||
|
||||
<link rel="icon" type="image/svg+xml" href="/favicon.svg" />
|
||||
<meta name="generator" content={Astro.generator} />
|
||||
<meta name="description" content={description} />
|
||||
<meta name="author" content={SEO.author} />
|
||||
<meta name="robots" content="index, follow" />
|
||||
<link rel="canonical" href={`${Astro.site}${Astro.url.pathname}`}>
|
||||
<!-- Open Graph / Facebook -->
|
||||
<meta property="og:title" content={pageTitle} />
|
||||
<meta property="og:description" content={description} />
|
||||
<meta property="og:image" content={ogimage.url} />
|
||||
<meta property="og:image:alt" content={ogimage.alt} />
|
||||
<meta property="og:url" content={SEO.url} />
|
||||
<meta property="og:type" content="website" />
|
||||
<meta property="og:site_name" content={SEO.sitename} />
|
||||
<meta property="og:locale" content={SEO.locale} />
|
||||
|
||||
|
||||
<!-- Twitter Cards -->
|
||||
<meta name="twitter:card" content="summary_large_image" />
|
||||
<meta name="twitter:title" content={pageTitle} />
|
||||
<meta name="twitter:description" content={description} />
|
||||
<meta name="twitter:image" content={twitterimage} />
|
||||
<meta name="twitter:image:alt" content={ogimage.alt} />
|
||||
<meta name="twitter:site" content={SEO.twitter} />
|
||||
|
||||
<meta name="theme-color" content="#0E0E11"/>
|
||||
|
||||
<!-- Sitemap -->
|
||||
<link rel="sitemap" href="/sitemap-index.xml" />
|
||||
|
||||
<title>{title}</title>
|
||||
<link rel="preconnect" href="https://fonts.googleapis.com" />
|
||||
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />
|
||||
<link
|
||||
href="https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700&display=swap"
|
||||
rel="stylesheet"
|
||||
/>
|
||||
</head>
|
||||
<body class="overflow-x-hidden">
|
||||
<SpeedInsights/>
|
||||
<div class="blur-circle"></div>
|
||||
<body
|
||||
class="min-h-screen bg-background font-sans antialiased selection:bg-purple-500/20 selection:text-purple-500"
|
||||
>
|
||||
<div
|
||||
style=" background:linear-gradient(45deg, rgba(96, 250, 155, 0) 10.79%, rgba(96, 250, 170, 0.03) 40.92%, rgba(96, 250, 155, 0) 90.35%)"
|
||||
class="fixed top-0 left-0 w-full h-full pointer-events-none -z-1"
|
||||
class="fixed inset-0 -z-10 h-full w-full bg-background bg-[radial-gradient(ellipse_80%_80%_at_50%_-20%,rgba(120,119,198,0.3),rgba(255,255,255,0))]"
|
||||
>
|
||||
</div>
|
||||
<Header />
|
||||
|
||||
<div class="min-h-[85vh] ">
|
||||
<slot />
|
||||
</div>
|
||||
|
||||
<Footer />
|
||||
<script>
|
||||
import "../scripts/menu.js";
|
||||
</script>
|
||||
<slot />
|
||||
</body>
|
||||
</html>
|
||||
|
||||
<script is:inline>
|
||||
const getThemePreference = () => {
|
||||
if (typeof localStorage !== "undefined" && localStorage.getItem("theme")) {
|
||||
return localStorage.getItem("theme");
|
||||
}
|
||||
return window.matchMedia("(prefers-color-scheme: dark)").matches
|
||||
? "dark"
|
||||
: "light";
|
||||
};
|
||||
const isDark = getThemePreference() === "dark";
|
||||
document.documentElement.classList[isDark ? "add" : "remove"]("dark");
|
||||
|
||||
if (typeof localStorage !== "undefined") {
|
||||
const observer = new MutationObserver(() => {
|
||||
const isDark = document.documentElement.classList.contains("dark");
|
||||
localStorage.setItem("theme", isDark ? "dark" : "light");
|
||||
});
|
||||
observer.observe(document.documentElement, {
|
||||
attributes: true,
|
||||
attributeFilter: ["class"],
|
||||
});
|
||||
}
|
||||
</script>
|
||||
|
||||
<style>
|
||||
html,
|
||||
body {
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
scroll-behavior: smooth;
|
||||
}
|
||||
|
||||
:root {
|
||||
--transition-standard: 0.3s cubic-bezier(0.4, 0, 0.2, 1);
|
||||
}
|
||||
|
||||
body {
|
||||
transition:
|
||||
background-color var(--transition-standard),
|
||||
color var(--transition-standard);
|
||||
}
|
||||
</style>
|
||||
|
||||
@@ -1,109 +0,0 @@
|
||||
---
|
||||
import Layout from "./Layout.astro";
|
||||
import { Icon } from "astro-icon/components";
|
||||
import Heading from "../components/ui/Heading.astro";
|
||||
import Experience from "../components/portfolio/Experience.astro";
|
||||
import NavArticle from "../components/layout/NavArticle.astro";
|
||||
import Contact from "../components/portfolio/Contact.astro";
|
||||
import Tools from "../components/portfolio/Tools.astro";
|
||||
const { frontmatter } = Astro.props;
|
||||
---
|
||||
|
||||
<script>
|
||||
document.addEventListener("DOMContentLoaded", function () {
|
||||
document.querySelectorAll("h1, h2, h3, h4, h5, h6").forEach((header) => {
|
||||
header.classList.add("scroll-m-28");
|
||||
});
|
||||
});
|
||||
</script>
|
||||
|
||||
<Layout
|
||||
pageTitle={frontmatter.title}
|
||||
description={frontmatter.description}
|
||||
ogimage={frontmatter.image}
|
||||
>
|
||||
<section
|
||||
class="w-full px-8 mt-5 max-sm:px-4 py-4 flex flex-row justify-center gap-6"
|
||||
>
|
||||
<div class="w-64 max-xl:hidden"></div>
|
||||
|
||||
<article
|
||||
class="flex flex-col gap-8 max-w-3xl max-md:w-full pb-10 pt-8 mt-8 max-sm:mt-0 px-14 max-md:px-10 max-sm:px-6 dark:bg-transparent bg-white dark:border-0 border border-neutral-100 rounded-2xl"
|
||||
>
|
||||
<div class="w-full h-auto mb-4 mx-auto" id="#">
|
||||
<div
|
||||
class="transition-all justify-center w-full gap-8 max-md:gap-3 max-lg:gap-2 flex flex-col items-center z-0 relative dark:from-mint-950 dark:to-zinc-950"
|
||||
>
|
||||
<div class="aspect-square h-60 max-md:size-32">
|
||||
<div
|
||||
class="group-hover:scale-105 relative z-10 flex w-full cursor-pointer items-center overflow-hidden rounded-full dark:p-[1.5px] p-[2px] transition-all duration-500"
|
||||
>
|
||||
<div
|
||||
class="absolute inset-0 h-full w-full rounded-fullfrom-transparent to-riptide-500 dark:from-transparent f dark:to-mint-300 animate-rotate-border bg-conic/[from_var(--border-angle)]"
|
||||
>
|
||||
</div>
|
||||
<div class="relative z-20 flex w-full rounded-full bg-mint-900">
|
||||
<div
|
||||
class="w-full aspect-square rounded-full bg-[url(/images/efeeleprofile.webp)] bg-center bg-cover"
|
||||
aria-label="Photo of Fernando Aldair López Ponce (EFEELE) for the blog"
|
||||
>
|
||||
<a
|
||||
href="/about-me"
|
||||
class="flex h-full w-full"
|
||||
aria-label="View about me page"></a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="w-full flex flex-col justify-center gap-4 max-md:gap-2">
|
||||
<div class="text-center">
|
||||
<Heading textGradient="Fernando López | EFEELE" />
|
||||
</div>
|
||||
|
||||
<p
|
||||
class="text-lg max-xl:text-base text-blacktext dark:text-gray-200 mb-0 leading-8 font-semibold"
|
||||
>
|
||||
<b
|
||||
class="bg-linear-to-r from-riptide-400 to-mint-500 dark:to-mint-200 dark:from-riptide-300 text-transparent bg-clip-text"
|
||||
>Frontend Developer</b
|
||||
> with <b
|
||||
class="bg-linear-to-r from-riptide-400 to-mint-500 dark:to-mint-200 dark:from-riptide-300 text-transparent bg-clip-text"
|
||||
>8 years of experience</b
|
||||
>, passionate about development, technology, and coffee that
|
||||
sparks ideas. I love bringing digital projects to life. 🚀☕
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="flex gap-4 items-center">
|
||||
<Heading text="About" textGradient="me" />
|
||||
</div>
|
||||
|
||||
<div class="markdown text-white" id="content">
|
||||
<slot />
|
||||
</div>
|
||||
</article>
|
||||
<NavArticle title={frontmatter.title} />
|
||||
</section>
|
||||
<section class="py-8 px-8 max-md:py-4 mb-4 scroll-m-16" id="experience">
|
||||
<div class="flex flex-col gap-8 pt-8 max-w-4xl mx-auto">
|
||||
<div class="flex gap-4 items-center justify-center">
|
||||
<Icon class="text-3xl text-white" name="briefcase" />
|
||||
<Heading text="Experience" textGradient="Work" level={2} />
|
||||
</div>
|
||||
|
||||
<Experience />
|
||||
</div>
|
||||
</section>
|
||||
<section class="py-8 px-8 max-md:py-4 mt-10 mb-20 scroll-m-16" id="sttack">
|
||||
<div class="flex flex-col gap-8 max-w-3xl justify-center mx-auto">
|
||||
<div class="flex gap-4 items-center justify-center">
|
||||
<Icon class="text-3xl text-white" name="dashboard" />
|
||||
<Heading text="Stack" textGradient="Technological" level={2} />
|
||||
</div>
|
||||
<Tools variant="center" />
|
||||
</div>
|
||||
</section>
|
||||
<Contact />
|
||||
</Layout>
|
||||
@@ -1,143 +0,0 @@
|
||||
---
|
||||
import Layout from "./Layout.astro";
|
||||
import { Icon } from "astro-icon/components";
|
||||
import DatePub from "../components/blog/DatePub.astro";
|
||||
import Tag from "../components/ui/Tag.astro";
|
||||
import Capsule from "../components/ui/Capsule.astro";
|
||||
import NavArticle from "../components/layout/NavArticle.astro";
|
||||
import ListPosts from "../components/blog/ListPosts.astro";
|
||||
import NavigationArticles from "../components/layout/NavigationArticles.astro";
|
||||
import Share from "../components/ui/Share.astro";
|
||||
const { frontmatter } = Astro.props;
|
||||
const currentUrl = `${Astro.site}${Astro.url.pathname}`;
|
||||
const tweetText = encodeURIComponent(
|
||||
`"${frontmatter.title}" - by ${frontmatter.author} | EFEELE`
|
||||
);
|
||||
import Heading from "../components/ui/Heading.astro";
|
||||
---
|
||||
|
||||
<script>
|
||||
const copyButtonLabel = `<svg width="15" height="15" viewBox="0 0 15 15" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M5 2V1H10V2H5ZM4.75 0C4.33579 0 4 0.335786 4 0.75V1H3.5C2.67157 1 2 1.67157 2 2.5V12.5C2 13.3284 2.67157 14 3.5 14H7V13H3.5C3.22386 13 3 12.7761 3 12.5V2.5C3 2.22386 3.22386 2 3.5 2H4V2.25C4 2.66421 4.33579 3 4.75 3H10.25C10.6642 3 11 2.66421 11 2.25V2H11.5C11.7761 2 12 2.22386 12 2.5V7H13V2.5C13 1.67157 12.3284 1 11.5 1H11V0.75C11 0.335786 10.6642 0 10.25 0H4.75ZM9 8.5C9 8.77614 8.77614 9 8.5 9C8.22386 9 8 8.77614 8 8.5C8 8.22386 8.22386 8 8.5 8C8.77614 8 9 8.22386 9 8.5ZM10.5 9C10.7761 9 11 8.77614 11 8.5C11 8.22386 10.7761 8 10.5 8C10.2239 8 10 8.22386 10 8.5C10 8.77614 10.2239 9 10.5 9ZM13 8.5C13 8.77614 12.7761 9 12.5 9C12.2239 9 12 8.77614 12 8.5C12 8.22386 12.2239 8 12.5 8C12.7761 8 13 8.22386 13 8.5ZM14.5 9C14.7761 9 15 8.77614 15 8.5C15 8.22386 14.7761 8 14.5 8C14.2239 8 14 8.22386 14 8.5C14 8.77614 14.2239 9 14.5 9ZM15 10.5C15 10.7761 14.7761 11 14.5 11C14.2239 11 14 10.7761 14 10.5C14 10.2239 14.2239 10 14.5 10C14.7761 10 15 10.2239 15 10.5ZM14.5 13C14.7761 13 15 12.7761 15 12.5C15 12.2239 14.7761 12 14.5 12C14.2239 12 14 12.2239 14 12.5C14 12.7761 14.2239 13 14.5 13ZM14.5 15C14.7761 15 15 14.7761 15 14.5C15 14.2239 14.7761 14 14.5 14C14.2239 14 14 14.2239 14 14.5C14 14.7761 14.2239 15 14.5 15ZM8.5 11C8.77614 11 9 10.7761 9 10.5C9 10.2239 8.77614 10 8.5 10C8.22386 10 8 10.2239 8 10.5C8 10.7761 8.22386 11 8.5 11ZM9 12.5C9 12.7761 8.77614 13 8.5 13C8.22386 13 8 12.7761 8 12.5C8 12.2239 8.22386 12 8.5 12C8.77614 12 9 12.2239 9 12.5ZM8.5 15C8.77614 15 9 14.7761 9 14.5C9 14.2239 8.77614 14 8.5 14C8.22386 14 8 14.2239 8 14.5C8 14.7761 8.22386 15 8.5 15ZM11 14.5C11 14.7761 10.7761 15 10.5 15C10.2239 15 10 14.7761 10 14.5C10 14.2239 10.2239 14 10.5 14C10.7761 14 11 14.2239 11 14.5ZM12.5 15C12.7761 15 13 14.7761 13 14.5C13 14.2239 12.7761 14 12.5 14C12.2239 14 12 14.2239 12 14.5C12 14.7761 12.2239 15 12.5 15Z" fill="currentColor" fill-rule="evenodd" clip-rule="evenodd"></path></svg>`;
|
||||
let codeBlocks = Array.from(document.querySelectorAll("pre"));
|
||||
|
||||
for (let codeBlock of codeBlocks) {
|
||||
let wrapper = document.createElement("div");
|
||||
wrapper.style.position = "relative";
|
||||
wrapper.classList.add("code-block-efe", "group");
|
||||
let copyButton = document.createElement("button");
|
||||
copyButton.className = "copy-code";
|
||||
copyButton.innerHTML = copyButtonLabel;
|
||||
|
||||
codeBlock.setAttribute("tabindex", "0");
|
||||
|
||||
// wrap codeblock with relative parent element
|
||||
if (codeBlock.parentNode) {
|
||||
codeBlock.parentNode.insertBefore(wrapper, codeBlock);
|
||||
wrapper.appendChild(codeBlock);
|
||||
|
||||
// Add the copy button to the wrapper instead of the codeBlock
|
||||
// This ensures the button stays fixed relative to the code block container
|
||||
wrapper.appendChild(copyButton);
|
||||
}
|
||||
|
||||
copyButton.addEventListener("click", async () => {
|
||||
await copyCode(codeBlock, copyButton);
|
||||
});
|
||||
}
|
||||
|
||||
async function copyCode(block: HTMLElement, button: HTMLButtonElement) {
|
||||
let code = block.querySelector("code");
|
||||
if (!code) return;
|
||||
|
||||
let text = code.innerText;
|
||||
|
||||
await navigator.clipboard.writeText(text);
|
||||
|
||||
// visual feedback that task is completed
|
||||
button.innerHTML = `<svg width="15" height="15" viewBox="0 0 15 15" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M11.4669 3.72684C11.7558 3.91574 11.8369 4.30308 11.648 4.59198L7.39799 11.092C7.29783 11.2452 7.13556 11.3467 6.95402 11.3699C6.77247 11.3931 6.58989 11.3355 6.45446 11.2124L3.70446 8.71241C3.44905 8.48022 3.43023 8.08494 3.66242 7.82953C3.89461 7.57412 4.28989 7.55529 4.5453 7.78749L6.75292 9.79441L10.6018 3.90792C10.7907 3.61902 11.178 3.53795 11.4669 3.72684Z" fill="currentColor" fill-rule="evenodd" clip-rule="evenodd"></path></svg> Copied`;
|
||||
|
||||
setTimeout(() => {
|
||||
button.innerHTML = copyButtonLabel;
|
||||
}, 700);
|
||||
}
|
||||
</script>
|
||||
|
||||
<Layout
|
||||
pageTitle={frontmatter.title}
|
||||
description={frontmatter.description}
|
||||
ogimage={frontmatter.image}
|
||||
>
|
||||
<section
|
||||
class="relative mx-auto px-8 max-sm:px-4 flex flex-row justify-center gap-6"
|
||||
>
|
||||
<div class="w-64 max-xl:hidden"></div>
|
||||
<article
|
||||
class="flex flex-col gap-8 max-w-3xl max-md:w-full pb-10 pt-8 mt-8 px-14 max-md:px-10 max-sm:px-4 dark:bg-transparent bg-white dark:border-0 border border-neutral-100 rounded-2xl"
|
||||
>
|
||||
<header class="flex flex-col gap-4" id="start">
|
||||
<div class="flex gap-2 flex-wrap">
|
||||
{
|
||||
frontmatter.languages.map((language: string) => (
|
||||
<Capsule lang={language} />
|
||||
))
|
||||
}
|
||||
</div>
|
||||
<div class="gap-3 flex flex-wrap justify-start items-center">
|
||||
{frontmatter.tags.map((tag: string) => <Tag tag={tag}>{tag}</Tag>)}
|
||||
</div>
|
||||
<DatePub date={frontmatter.pubDate} />
|
||||
|
||||
<Heading text={frontmatter.title} />
|
||||
|
||||
<div
|
||||
class="flex items-center max-sm:flex-col gap-2 max-sm:items-start justify-between"
|
||||
>
|
||||
<div class="white flex items-center gap-4">
|
||||
<div
|
||||
aria-label="Photo of Fernando Aldair López Ponce (EFEELE) for the blog"
|
||||
class="size-10 bg-cover bg-center rounded-full drop-shadow-lg"
|
||||
style="background-image: url(/images/efeeleprofile.webp);"
|
||||
>
|
||||
</div>
|
||||
<a
|
||||
id={frontmatter.title}
|
||||
class="leading-0 text-sm font-semibold items-center gap-3 text-blacktext dark:text-riptide-50"
|
||||
href="/blog"
|
||||
>{frontmatter.author}
|
||||
</a>
|
||||
</div>
|
||||
<Share currentUrl={currentUrl} tweetText={tweetText} />
|
||||
</div>
|
||||
</header>
|
||||
|
||||
<figure>
|
||||
{
|
||||
frontmatter.image?.url && (
|
||||
<img
|
||||
class="w-full rounded-xl"
|
||||
src={frontmatter.image.url}
|
||||
alt={frontmatter.image.alt || "Article image"}
|
||||
/>
|
||||
)
|
||||
}
|
||||
</figure>
|
||||
|
||||
<div class="markdown" id="content">
|
||||
<slot />
|
||||
</div>
|
||||
<Share currentUrl={currentUrl} tweetText={tweetText} />
|
||||
</article>
|
||||
<NavArticle title={frontmatter.title} />
|
||||
</section>
|
||||
<div
|
||||
class="flex flex-col gap-6 max-w-4xl max-lg:py-2 py-3 max-xl:py-2 mx-auto"
|
||||
>
|
||||
<div class="px-8">
|
||||
<NavigationArticles />
|
||||
<hr class="text-mint-300/50" />
|
||||
</div>
|
||||
<div class="px-8 max-sm:px-4">
|
||||
<ListPosts currentPostUrl={Astro.url.pathname} />
|
||||
</div>
|
||||
</div>
|
||||
</Layout>
|
||||
Some files were not shown because too many files have changed in this diff Show More
Reference in New Issue
Block a user