Skip to content

fix: update font sizes in GitHub settings and task sections for consi… #11

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Merged
pikann merged 1 commit into from
Jun 22, 2026
Merged

fix: update font sizes in GitHub settings and task sections for consi… #11

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
1 commit
Select commit
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
16 changes: 8 additions & 8 deletions frontend/src/GitHubSettingsTab.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -301,19 +301,19 @@ function TokenCard({
<div className="space-y-4">
<p className="text-sm text-muted-foreground">
Add a GitHub personal access token with{" "}
<code className="rounded bg-muted px-1 py-0.5 text-[11px] font-mono">
<code className="rounded bg-muted px-1 py-0.5 text-xs font-mono">
repo
</code>{" "}
(includes{" "}
<code className="rounded bg-muted px-1 py-0.5 text-[11px] font-mono">
<code className="rounded bg-muted px-1 py-0.5 text-xs font-mono">
contents
</code>{" "}
and{" "}
<code className="rounded bg-muted px-1 py-0.5 text-[11px] font-mono">
<code className="rounded bg-muted px-1 py-0.5 text-xs font-mono">
pull requests
</code>{" "}
permissions) and the{" "}
<code className="rounded bg-muted px-1 py-0.5 text-[11px] font-mono">
<code className="rounded bg-muted px-1 py-0.5 text-xs font-mono">
admin:repo_hook
</code>{" "}
scope to link repositories, create branches, and track pull requests.
Expand All @@ -340,7 +340,7 @@ function TokenCard({
/>
<button
type="button"
className="absolute right-2.5 top-1/2 -translate-y-1/2 text-muted-foreground/60 hover:text-muted-foreground text-[10px] font-medium"
className="absolute right-2.5 top-1/2 -translate-y-1/2 text-muted-foreground/60 hover:text-muted-foreground text-xs font-medium"
onClick={() => setShowToken((v) => !v)}
tabIndex={-1}
>
Expand Down Expand Up @@ -525,7 +525,7 @@ function AddRepoDialog({
{repo.full_name}
</span>
{repo.private && (
<span className="shrink-0 rounded px-1.5 py-0.5 text-[10px] font-semibold bg-muted text-muted-foreground">
<span className="shrink-0 rounded px-1.5 py-0.5 text-xs font-semibold bg-muted text-muted-foreground">
Private
</span>
)}
Expand Down Expand Up @@ -738,7 +738,7 @@ function GitHubSettingsInner({
<div key={step.num} className="flex items-center gap-3">
<div
className={cn(
"flex size-6 items-center justify-center rounded-full text-[11px] font-bold shrink-0 transition-colors",
"flex size-6 items-center justify-center rounded-full text-xs font-bold shrink-0 transition-colors",
step.done
? "bg-emerald-500 text-white"
: "border-2 border-border text-muted-foreground/60",
Expand All @@ -765,7 +765,7 @@ function GitHubSettingsInner({
<div className="space-y-4">
<div className="flex items-center gap-2">
<KeyRound className="size-3.5 text-muted-foreground/70" />
<label className="text-[13px] font-semibold text-foreground/80">
<label className="text-sm font-semibold text-foreground/80">
Personal Access Token
</label>
</div>
Expand Down
46 changes: 23 additions & 23 deletions frontend/src/GitHubTaskSection.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -47,22 +47,22 @@ function cn(...classes: (string | undefined | null | false)[]): string {
function PRStateBadge({ state }: { state: PullRequest["state"] }) {
if (state === "merged") {
return (
<span className="inline-flex items-center gap-1 rounded-full bg-violet-500/15 px-2 py-0.5 text-[10px] font-semibold text-violet-500">
<span className="inline-flex items-center gap-1 rounded-full bg-violet-500/15 px-2 py-0.5 text-xs font-semibold text-violet-500">
<GitMerge className="size-3" />
Merged
</span>
);
}
if (state === "closed") {
return (
<span className="inline-flex items-center gap-1 rounded-full bg-destructive/15 px-2 py-0.5 text-[10px] font-semibold text-destructive/80">
<span className="inline-flex items-center gap-1 rounded-full bg-destructive/15 px-2 py-0.5 text-xs font-semibold text-destructive/80">
<GitPullRequestClosed className="size-3" />
Closed
</span>
);
}
return (
<span className="inline-flex items-center gap-1 rounded-full bg-emerald-500/15 px-2 py-0.5 text-[10px] font-semibold text-emerald-600 dark:text-emerald-500">
<span className="inline-flex items-center gap-1 rounded-full bg-emerald-500/15 px-2 py-0.5 text-xs font-semibold text-emerald-600 dark:text-emerald-500">
<GitPullRequest className="size-3" />
Open
</span>
Expand Down Expand Up @@ -111,17 +111,17 @@ function PRRow({
<ExternalLink className="size-3 shrink-0 opacity-50" />
</a>
<div className="flex items-center gap-2 mt-1 flex-wrap">
<span className="text-[11px] text-muted-foreground font-mono">
<span className="text-xs text-muted-foreground font-mono">
#{pr.pr_number}
</span>
<span className="text-muted-foreground/40">·</span>
<span className="text-[11px] text-muted-foreground">
<span className="text-xs text-muted-foreground">
{pr.head_branch}
</span>
{pr.author && (
<>
<span className="text-muted-foreground/40">·</span>
<span className="text-[11px] text-muted-foreground">
<span className="text-xs text-muted-foreground">
by {pr.author}
</span>
</>
Expand Down Expand Up @@ -264,7 +264,7 @@ function LinkPRForm({
<div className="space-y-3 rounded-lg border border-border/50 bg-card px-3 py-3">
{/* Repository selector */}
<div>
<p className="text-[11px] text-muted-foreground mb-1">Repository</p>
<p className="text-xs text-muted-foreground mb-1">Repository</p>
<select
value={parsed ? (urlMatchedRepo?.id ?? "") : selectedRepoId}
onChange={(e) => {
Expand All @@ -285,7 +285,7 @@ function LinkPRForm({

{/* PR number or URL */}
<div>
<p className="text-[11px] text-muted-foreground mb-1">
<p className="text-xs text-muted-foreground mb-1">
PR number or GitHub URL
</p>
<input
Expand All @@ -309,15 +309,15 @@ function LinkPRForm({
disabled={mutation.isPending}
/>
{parsed && urlMatchedRepo && (
<p className="mt-1 text-[11px] text-muted-foreground">
<p className="mt-1 text-xs text-muted-foreground">
Will link PR #{parsed.prNumber} from{" "}
<span className="font-medium">{urlMatchedRepo.full_name}</span>
</p>
)}
</div>

{error && (
<p className="text-[11px] text-destructive/80 leading-relaxed">
<p className="text-xs text-destructive/80 leading-relaxed">
{error}
</p>
)}
Expand Down Expand Up @@ -384,13 +384,13 @@ function PullRequestsSection({
<div>
<button
type="button"
className="flex w-full items-center gap-2 text-[11px] font-semibold uppercase tracking-[0.08em] text-muted-foreground/70 mb-3 hover:text-muted-foreground transition-colors"
className="flex w-full items-center gap-2 text-xs font-semibold uppercase tracking-[0.08em] text-muted-foreground/70 mb-3 hover:text-muted-foreground transition-colors"
onClick={() => setExpanded((v) => !v)}
>
<GitPullRequest className="size-3.5 shrink-0" />
<span>Pull Requests</span>
{count > 0 && (
<span className="rounded-full bg-muted px-1.5 py-0.5 text-[10px] font-bold text-muted-foreground normal-case tracking-normal">
<span className="rounded-full bg-muted px-1.5 py-0.5 text-xs font-bold text-muted-foreground normal-case tracking-normal">
{count}
</span>
)}
Expand Down Expand Up @@ -491,7 +491,7 @@ function CommandBlock({ command }: { command: string }) {
return (
<div className="flex items-center gap-2 rounded-md bg-muted/60 border border-border/50 px-3 py-2 mt-1.5">
<Terminal className="size-3.5 shrink-0 text-muted-foreground/50" />
<code className="flex-1 text-[11px] font-mono text-foreground/80 break-all">
<code className="flex-1 text-xs font-mono text-foreground/80 break-all">
{command}
</code>
<CopyButton text={command} />
Expand All @@ -507,7 +507,7 @@ function BranchRow({ branch }: { branch: TaskBranch }) {
<div className="rounded-lg border border-border/50 bg-card px-3 py-2.5 space-y-1.5">
<div className="flex items-center gap-2">
<GitBranch className="size-3.5 shrink-0 text-muted-foreground/60" />
<span className="text-[12px] font-mono truncate text-foreground/90 flex-1">
<span className="text-xs font-mono truncate text-foreground/90 flex-1">
{branch.branch_name}
</span>
</div>
Expand Down Expand Up @@ -642,15 +642,15 @@ function CreateBranchForm({
<div className="space-y-3 rounded-lg border border-border/50 bg-card px-3 py-3">
{/* Branch type pills */}
<div>
<p className="text-[11px] text-muted-foreground mb-1.5">Type</p>
<p className="text-xs text-muted-foreground mb-1.5">Type</p>
<div className="flex flex-wrap gap-1.5">
{BRANCH_TYPES.map((t) => (
<button
key={t}
type="button"
onClick={() => handleTypeChange(t)}
className={cn(
"rounded-full px-2.5 py-0.5 text-[11px] font-medium border transition-colors",
"rounded-full px-2.5 py-0.5 text-xs font-medium border transition-colors",
t === type
? "border-primary/60 bg-primary/10 text-primary"
: "border-border/50 text-muted-foreground hover:border-border",
Expand All @@ -664,7 +664,7 @@ function CreateBranchForm({

{/* Branch name */}
<div>
<p className="text-[11px] text-muted-foreground mb-1">Branch name</p>
<p className="text-xs text-muted-foreground mb-1">Branch name</p>
<input
type="text"
value={branchName}
Expand All @@ -681,7 +681,7 @@ function CreateBranchForm({
{/* Repo selector — only when multiple repos */}
{repos.length > 1 && (
<div>
<p className="text-[11px] text-muted-foreground mb-1">Repository</p>
<p className="text-xs text-muted-foreground mb-1">Repository</p>
<select
value={selectedRepoId}
onChange={(e) => setSelectedRepoId(e.target.value)}
Expand All @@ -699,7 +699,7 @@ function CreateBranchForm({

{/* Source branch (optional) */}
<div>
<p className="text-[11px] text-muted-foreground mb-1">
<p className="text-xs text-muted-foreground mb-1">
Source branch{" "}
<span className="opacity-60">(optional, defaults to repo default)</span>
</p>
Expand All @@ -714,7 +714,7 @@ function CreateBranchForm({
</div>

{error && (
<p className="text-[11px] text-destructive/80 leading-relaxed">
<p className="text-xs text-destructive/80 leading-relaxed">
{error}
</p>
)}
Expand All @@ -736,7 +736,7 @@ function CreateBranchForm({
</button>

<div>
<p className="text-[11px] text-muted-foreground mb-0.5">
<p className="text-xs text-muted-foreground mb-0.5">
Or create locally:
</p>
<CommandBlock command={localCmd} />
Expand Down Expand Up @@ -797,13 +797,13 @@ function BranchesSection({
<div>
<button
type="button"
className="flex w-full items-center gap-2 text-[11px] font-semibold uppercase tracking-[0.08em] text-muted-foreground/70 mb-3 hover:text-muted-foreground transition-colors"
className="flex w-full items-center gap-2 text-xs font-semibold uppercase tracking-[0.08em] text-muted-foreground/70 mb-3 hover:text-muted-foreground transition-colors"
onClick={() => setExpanded((v) => !v)}
>
<GitBranch className="size-3.5 shrink-0" />
<span>Branches</span>
{count > 0 && (
<span className="rounded-full bg-muted px-1.5 py-0.5 text-[10px] font-bold text-muted-foreground normal-case tracking-normal">
<span className="rounded-full bg-muted px-1.5 py-0.5 text-xs font-bold text-muted-foreground normal-case tracking-normal">
{count}
</span>
)}
Expand Down
Loading