Compare commits

..
Author SHA1 Message Date
cfbender 189881104b style: repository cards 2024-11-01 08:03:54 -04:00
5 changed files with 14 additions and 19 deletions
@@ -49,21 +49,21 @@ export const ProjectRepoCard: React.FC<ProjectRepoCardProps> = ({
onClick={createProject}
>
{/* Icon container */}
<div className="w-10 h-10 bg-base-bg rounded-md justify-center items-center flex">
<div className="w-10 h-10 bg-base-bg rounded-md justify-center items-center flex dark:bg-overlay">
<GithubIcon />
</div>
{/* Content */}
<div className="flex flex-1 gap-3 flex-wrap">
<div className="flex flex-col gap-1">
<p className="text-elements-high-em text-sm font-medium tracking-[-0.006em]">
<p className="text-elements-high-em dark:text-foreground text-sm font-medium tracking-[-0.006em]">
{repository.full_name}
</p>
<p className="text-elements-low-em text-xs">
<p className="text-elements-low-em dark:text-foreground-secondary text-xs">
{repository.updated_at && relativeTimeISO(repository.updated_at)}
</p>
</div>
{repository.visibility === 'private' && (
<div className="bg-orange-50 border border-orange-200 px-2 py-1 flex items-center gap-1 rounded-lg text-xs text-orange-600 h-fit">
<div className="bg-orange-50 border border-orange-200 px-2 py-1 flex items-center gap-1 rounded-lg text-xs text-orange-600 dark:text-error h-fit">
<LockIcon />
Private
</div>
@@ -166,7 +166,9 @@ export const RepositoryList = () => {
</div>
) : (
<div className="mt-4 p-6 flex flex-col gap-4 items-center justify-center">
<p className="text-elements-high-em font-sans">No repository found</p>
<p className="text-elements-high-em dark:text-foreground font-sans">
No repository found
</p>
<Button
variant="tertiary"
leftIcon={<RefreshIcon />}
@@ -57,7 +57,7 @@ const CreateWithTemplate = () => {
return (
<div className="flex flex-col items-center gap-6 lg:gap-10 mx-auto w-full lg:w-5/6">
<div className="flex flex-col lg:flex-row justify-between w-full my-4 bg-base-bg-alternate dark:bg-overlay rounded-xl p-6 gap-3 items-start lg:items-center">
<div className="flex flex-col lg:flex-row justify-between w-full my-4 bg-base-bg-alternate rounded-xl p-6 gap-3 items-start lg:items-center">
<div className="flex items-center gap-3">
<TemplateIcon type={template?.icon as TemplateIconType} size={48} />
<Heading className="font-medium">{template?.name}</Heading>
@@ -55,7 +55,7 @@ const Id = () => {
</div>
{/* Card */}
<div className="bg-base-bg-alternate dark:bg-overlay2 rounded-xl shadow-inset w-full px-1 py-1">
<div className="bg-base-bg-alternate rounded-xl shadow-inset w-full px-1 py-1">
{/* Trigger question */}
<div className="flex gap-2 justify-center items-center py-3">
<div className="h-5 w-5">
@@ -67,7 +67,7 @@ const Id = () => {
</div>
{/* CTA card */}
<div className="bg-surface-card dark:bg-overlay rounded-xl shadow-card-sm dark:shadow-background px-4 py-4">
<div className="bg-surface-card rounded-xl shadow-card-sm px-4 py-4">
<div className="flex gap-2">
<Badge variant="secondary">1</Badge>
<div className="space-y-3">
@@ -75,7 +75,7 @@ const Id = () => {
<Heading as="h6" className="text-sm font-sans">
Add a custom domain
</Heading>
<p className="text-xs text-elements-low-em dark:text-foreground-secondary font-sans">
<p className="text-xs text-elements-low-em font-sans">
Make it easy for your visitors to remember your URL with a
custom domain.
</p>
@@ -152,18 +152,13 @@ const CreateRepo = () => {
<Heading as="h3" className="text-lg font-medium">
Create a repository
</Heading>
<Heading
as="h5"
className="text-sm font-sans text-elements-low-em dark:text-foreground-secondary"
>
<Heading as="h5" className="text-sm font-sans text-elements-low-em">
The project will be cloned into this repository
</Heading>
</div>
<div className="flex flex-col justify-start gap-3">
<span className="text-sm text-elements-high-em dark:text-foreground">
Git account
</span>
<span className="text-sm text-elements-high-em">Git account</span>
{gitAccounts.length > 0 ? (
<Controller
name="account"
@@ -186,9 +181,7 @@ const CreateRepo = () => {
)}
</div>
<div className="flex flex-col justify-start gap-3">
<span className="text-sm text-elements-high-em dark:text-foreground">
Name the repo
</span>
<span className="text-sm text-elements-high-em">Name the repo</span>
<Controller
name="repoName"
control={control}