import {
  SiDeno,
  SiDocker,
  SiGo,
  SiPostgresql,
  SiReact,
  SiRedis,
  SiTypescript,
} from "@preact-icons/si";

export default function TechLinks() {
  return (
    <div class="flex flex-row gap-4 text-3xl">
      <a
        href="https://react.dev/"
        target="_blank"
        rel="noopener noreferrer"
        aria-label="React"
        class="hover:text-primary transition-colors"
      >
        <SiReact />
      </a>

      <a
        href="https://www.typescriptlang.org/"
        target="_blank"
        rel="noopener noreferrer"
        aria-label="TypeScript"
        class="hover:text-primary transition-colors"
      >
        <SiTypescript />
      </a>

      <a
        href="https://deno.com/"
        target="_blank"
        rel="noopener noreferrer"
        aria-label="Deno"
        class="hover:text-primary transition-colors"
      >
        <SiDeno />
      </a>

      <a
        href="https://go.dev/"
        target="_blank"
        rel="noopener noreferrer"
        aria-label="Go"
        class="hover:text-primary transition-colors"
      >
        <SiGo />
      </a>

      <a
        href="https://www.postgresql.org/"
        target="_blank"
        rel="noopener noreferrer"
        aria-label="PostgreSQL"
        class="hover:text-primary transition-colors"
      >
        <SiPostgresql />
      </a>

      <a
        href="https://redis.io/"
        target="_blank"
        rel="noopener noreferrer"
        aria-label="Redis"
        class="hover:text-primary transition-colors"
      >
        <SiRedis />
      </a>

      <a
        href="https://www.docker.com/"
        target="_blank"
        rel="noopener noreferrer"
        aria-label="Docker"
        class="hover:text-primary transition-colors"
      >
        <SiDocker />
      </a>
    </div>
  );
}