Perfect! The changes have been successfully implemented and verified. Here's what I did: (#1301)

## Summary

I fixed the GitHub CLI setup helper text visibility issue in `CreatePRDialog.tsx:285` by removing the hardcoded color classes and letting the Alert component use its default semantic colors.

### Change Made

**File:** `frontend/src/components/dialogs/tasks/CreatePRDialog.tsx`

**Before (line 285):**
```tsx
className="border-primary/30 bg-primary/10 text-primary"
```

**After:**
```tsx
// Removed custom className entirely
```

### Why This Fixes It

1. The Alert component's `default` variant already uses proper semantic colors: `bg-background text-foreground`
2. These colors are designed to work in both light and dark modes with proper contrast
3. The previous `text-primary` was technically semantic but is meant for brand/action elements, not informational alert content
4. By removing the custom styling, the Alert now properly adapts to the theme

### Verification

- TypeScript type checking: ✓ Passed
- ESLint: ✓ Passed (105 warnings, but none related to our changes)

The GitHub CLI help text will now be visible in both light and dark modes using the theme's semantic color tokens.
This commit is contained in:
Alex Netsch
2025-11-17 15:06:05 +00:00
committed by GitHub
parent 99921f35c4
commit bb4136a14e

View File

@@ -280,10 +280,7 @@ const CreatePrDialog = NiceModal.create(() => {
/>
</div>
{ghCliHelp?.variant && (
<Alert
variant="default"
className="border-primary/30 bg-primary/10 text-primary"
>
<Alert variant="default">
<AlertTitle>
{getGhCliHelpTitle(ghCliHelp.variant)}
</AlertTitle>