Something went wrong. Try again.
Mirror of https://github.com/kualta/site — web infrastructure
Something went wrong. Try again.
2.1 kB · 63 lines
Astro
at master
12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152535455565758596061626364---import type { Project } from "@/types";import IconTooltip from "@/components/IconTooltip.astro";import { ArchiveIcon, ExternalLinkIcon, GithubIcon, GitlabIcon } from "@/components/icons";
interface Props { project: Project;}
const { project } = Astro.props;const href = project.link || project.git_link || "#";const isGitlab = project.git_link?.includes("gitlab.com");---<div class="flex w-full min-w-0 flex-row items-baseline gap-2 rounded-xl bg-secondary px-4 py-2 text-lg drop-shadow-sm dark:bg-dark-secondary"> <a href={href} target="_blank" rel="noreferrer" class="flex flex-row items-baseline gap-2 min-w-0 flex-grow hover:opacity-70" > <span class="font-medium whitespace-nowrap">{project.full_name || project.name}</span> <span class="min-w-0 truncate text-sm text-secondary-text">{project.description}</span> </a> <span class="w-5 shrink-0 flex justify-center"> {project.git_link && ( <IconTooltip label={isGitlab ? "GitLab" : "GitHub"}> <a href={project.git_link} target="_blank" rel="noreferrer" class="text-secondary-text hover:opacity-70" aria-label={`${project.full_name || project.name} on ${isGitlab ? "GitLab" : "GitHub"}`} > {isGitlab ? <GitlabIcon /> : <GithubIcon />} </a> </IconTooltip> )} </span> <!-- an archived project has nowhere live to link to, so its badge takes the website's place --> <span class="w-5 shrink-0 flex justify-center text-secondary-text"> {project.status === "archived" ? ( <IconTooltip label="archived"> <ArchiveIcon aria-hidden="true" /> <span class="sr-only">archived</span> </IconTooltip> ) : project.link && ( <IconTooltip label="website"> <a href={project.link} target="_blank" rel="noreferrer" class="text-secondary-text hover:opacity-70" aria-label={`${project.full_name || project.name} website`} > <ExternalLinkIcon /> </a> </IconTooltip> )} </span></div>