Mirror/vega
1
0
Fork 0
mirror of https://github.com/hoornet/vega.git synced 2026-07-30 03:38:12 -07:00
Code Issues Packages Projects Releases Wiki Activity

Normalize theme tokens: accent-text, zap-text, remove hard-coded colors

Browse Source 
- Add accent-text and zap-text tokens to all 7 themes for proper contrast
  on accent/zap-colored buttons (fixes white-on-light-accent in Catppuccin,
  Nord Frost, Hackerman, Sepia, Gruvbox)
- Replace text-white → text-accent-text on all accent buttons (20+ instances)
- Replace text-white → text-zap-text on zap buttons
- Replace hover:text-white → hover:text-accent-text on follow/action buttons
- Replace bg-blue-500 → bg-accent in FountainCard (theme-aware)
- Remaining text-white is correct: overlays on bg-black, danger badges
This commit is contained in:
Jure
2026-04-02 17:33:59 +02:00
parent 1fd613425d
commit 1006b1a1f0
21 changed files with 47 additions and 29 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/components/article/ArticleEditor.tsx
+2 -2
View File
@@ -328,7 +328,7 @@ export function ArticleEditor() {
<button
onClick={handlePublish}
disabled={!canPublish || publishing || published}
className="px-4 py-1 text-[11px] bg-accent hover:bg-accent-hover text-white transition-colors disabled:opacity-30 disabled:cursor-not-allowed"
className="px-4 py-1 text-[11px] bg-accent hover:bg-accent-hover text-accent-text transition-colors disabled:opacity-30 disabled:cursor-not-allowed"
>
{published ? "published ✓" : publishing ? "publishing…" : "publish"}
</button>
@@ -493,7 +493,7 @@ function DraftListView({ onNewDraft }: { onNewDraft: () => void }) {
</div>
<button
onClick={onNewDraft}
className="px-3 py-1 text-[11px] bg-accent hover:bg-accent-hover text-white transition-colors"
className="px-3 py-1 text-[11px] bg-accent hover:bg-accent-hover text-accent-text transition-colors"
>
new draft
</button>
src/components/article/ArticleFeed.tsx
+1 -1
View File
@@ -68,7 +68,7 @@ export function ArticleFeed() {
<h1 className="text-text text-sm font-medium">Articles</h1>
<button
onClick={() => setView("article-editor")}
className="text-[11px] px-3 py-1 border border-accent/60 text-accent hover:bg-accent hover:text-white transition-colors"
className="text-[11px] px-3 py-1 border border-accent/60 text-accent hover:bg-accent hover:text-accent-text transition-colors"
>
write article
</button>
src/components/article/ArticleView.tsx
+1 -1
View File
@@ -456,7 +456,7 @@ export function ArticleView() {
{loggedIn && (
<button
onClick={() => setShowZap(true)}
className="text-[11px] px-4 py-1.5 bg-zap hover:bg-zap/90 text-white transition-colors"
className="text-[11px] px-4 py-1.5 bg-zap hover:bg-zap/90 text-zap-text transition-colors"
>
⚡ Zap {authorName}
</button>
src/components/dm/DMView.tsx
+1 -1
View File
@@ -220,7 +220,7 @@ function ThreadPanel({
<button
onClick={handleSend}
disabled={!text.trim() || sending}
className="px-3 self-end py-2 text-[11px] bg-accent hover:bg-accent-hover text-white transition-colors disabled:opacity-30 disabled:cursor-not-allowed shrink-0"
className="px-3 self-end py-2 text-[11px] bg-accent hover:bg-accent-hover text-accent-text transition-colors disabled:opacity-30 disabled:cursor-not-allowed shrink-0"
>
{sending ? "…" : "send"}
</button>
src/components/feed/ComposeBox.tsx
+1 -1
View File
@@ -313,7 +313,7 @@ export function ComposeBox({ onPublished, onNoteInjected }: { onPublished?: () =
<button
onClick={handlePublish}
disabled={!canPost}
className="px-3 py-1 text-[11px] bg-accent hover:bg-accent-hover text-white transition-colors disabled:opacity-30 disabled:cursor-not-allowed"
className="px-3 py-1 text-[11px] bg-accent hover:bg-accent-hover text-accent-text transition-colors disabled:opacity-30 disabled:cursor-not-allowed"
>
{publishing ? "posting…" : "post"}
</button>
src/components/feed/FountainCard.tsx
+4 -4
View File
@@ -27,8 +27,8 @@ export function FountainCard({ seg }: { seg: ContentSegment }) {
rel="noopener noreferrer"
className="mt-2 flex items-center gap-3 rounded-sm bg-bg-raised border border-border p-3 hover:bg-bg-hover transition-colors cursor-pointer"
>
<div className="w-10 h-10 rounded-full bg-blue-500/20 flex items-center justify-center shrink-0">
<span className="text-blue-400 text-lg font-bold">F</span>
<div className="w-10 h-10 rounded-full bg-accent/20 flex items-center justify-center shrink-0">
<span className="text-accent text-lg font-bold">F</span>
</div>
<div className="min-w-0">
<div className="text-[11px] text-text-muted">Fountain.fm</div>
@@ -74,8 +74,8 @@ export function FountainCard({ seg }: { seg: ContentSegment }) {
onError={(e) => { (e.target as HTMLImageElement).style.display = "none"; }}
/>
) : (
<div className="w-12 h-12 rounded-sm bg-blue-500/20 flex items-center justify-center shrink-0">
<span className="text-blue-400 text-lg font-bold">F</span>
<div className="w-12 h-12 rounded-sm bg-accent/20 flex items-center justify-center shrink-0">
<span className="text-accent text-lg font-bold">F</span>
</div>
)}
<div className="min-w-0 flex-1">
src/components/feed/InlineReplyBox.tsx
+1 -1
View File
@@ -228,7 +228,7 @@ export function InlineReplyBox({ event, name, rootEvent }: InlineReplyBoxProps)
<button
onClick={handleReplySubmit}
disabled={(!replyText.trim() && attachments.length === 0) || replying || uploading}
className="px-2 py-0.5 text-[10px] bg-accent hover:bg-accent-hover text-white transition-colors disabled:opacity-30 disabled:cursor-not-allowed"
className="px-2 py-0.5 text-[10px] bg-accent hover:bg-accent-hover text-accent-text transition-colors disabled:opacity-30 disabled:cursor-not-allowed"
>
{replySent ? "replied ✓" : replying ? "posting…" : "reply"}
</button>
src/components/feed/QuoteModal.tsx
+1 -1
View File
@@ -93,7 +93,7 @@ export function QuoteModal({ event, authorName, authorAvatar, onClose, onPublish
<button
onClick={handlePublish}
disabled={!canPublish}
className="px-4 py-1.5 text-[11px] bg-accent hover:bg-accent-hover text-white transition-colors disabled:opacity-30 disabled:cursor-not-allowed"
className="px-4 py-1.5 text-[11px] bg-accent hover:bg-accent-hover text-accent-text transition-colors disabled:opacity-30 disabled:cursor-not-allowed"
>
{publishing ? "posting…" : "quote & post"}
</button>
src/components/follows/FollowsView.tsx
+1 -1
View File
@@ -74,7 +74,7 @@ function FollowRow({
className={`shrink-0 px-3 py-1 text-[11px] transition-colors ${
isFollowing
? "text-text-dim border border-border hover:text-danger hover:border-danger"
: "bg-accent hover:bg-accent-hover text-white"
: "bg-accent hover:bg-accent-hover text-accent-text"
}`}
>
{isFollowing ? "unfollow" : "follow"}
src/components/onboarding/OnboardingFlow.tsx
+4 -4
View File
@@ -47,7 +47,7 @@ function WelcomeStep({ onCreateNew, onHaveKey }: { onCreateNew: () => void; onHa
<div className="space-y-3">
<button
onClick={onCreateNew}
className="w-full py-2.5 text-[13px] font-medium bg-accent hover:bg-accent-hover text-white transition-colors"
className="w-full py-2.5 text-[13px] font-medium bg-accent hover:bg-accent-hover text-accent-text transition-colors"
>
Create a new identity
</button>
@@ -101,7 +101,7 @@ function CreateStep({ onNext }: { onNext: (signer: NDKPrivateKeySigner) => void
<button
onClick={() => onNext(signer)}
className="w-full py-2.5 text-[13px] font-medium bg-accent hover:bg-accent-hover text-white transition-colors"
className="w-full py-2.5 text-[13px] font-medium bg-accent hover:bg-accent-hover text-accent-text transition-colors"
>
Next: back up your secret key →
</button>
@@ -185,7 +185,7 @@ function BackupStep({ signer, onComplete }: { signer: NDKPrivateKeySigner; onCom
<button
onClick={handleStart}
disabled={!confirmed || saving}
className="w-full py-2.5 text-[13px] font-medium bg-accent hover:bg-accent-hover text-white transition-colors disabled:opacity-30 disabled:cursor-not-allowed"
className="w-full py-2.5 text-[13px] font-medium bg-accent hover:bg-accent-hover text-accent-text transition-colors disabled:opacity-30 disabled:cursor-not-allowed"
>
{saving ? "Setting up…" : "Start using Vega"}
</button>
@@ -267,7 +267,7 @@ function LoginStep({ onBack, onComplete }: { onBack: () => void; onComplete: ()
<button
onClick={handleLogin}
disabled={!value.trim() || loading}
className="w-full py-2.5 text-[13px] font-medium bg-accent hover:bg-accent-hover text-white transition-colors disabled:opacity-30 disabled:cursor-not-allowed"
className="w-full py-2.5 text-[13px] font-medium bg-accent hover:bg-accent-hover text-accent-text transition-colors disabled:opacity-30 disabled:cursor-not-allowed"
>
{loading ? (mode === "bunker" ? "Connecting…" : "Logging in…") : "Log in"}
</button>
src/components/profile/EditProfileForm.tsx
+1 -1
View File
@@ -87,7 +87,7 @@ export function EditProfileForm({ pubkey, onSaved }: { pubkey: string; onSaved:
<button
onClick={handleSave}
disabled={saving || saved}
className="px-4 py-1.5 text-[11px] bg-accent hover:bg-accent-hover text-white transition-colors disabled:opacity-30 disabled:cursor-not-allowed"
className="px-4 py-1.5 text-[11px] bg-accent hover:bg-accent-hover text-accent-text transition-colors disabled:opacity-30 disabled:cursor-not-allowed"
>
{saved ? "saved ✓" : saving ? "saving…" : "save profile"}
</button>
src/components/profile/ProfileView.tsx
+1 -1
View File
@@ -176,7 +176,7 @@ export function ProfileView() {
className={`text-[11px] px-3 py-1 border transition-colors disabled:opacity-40 disabled:cursor-not-allowed ${
isFollowing
? "border-border text-text-muted hover:text-danger hover:border-danger/40"
: "border-accent/60 text-accent hover:bg-accent hover:text-white"
: "border-accent/60 text-accent hover:bg-accent hover:text-accent-text"
}`}
>
{followPending ? "…" : isFollowing ? "unfollow" : "follow"}
src/components/search/SearchView.tsx
+2 -2
View File
@@ -74,7 +74,7 @@ function UserRow({ user }: { user: ParsedUser }) {
className={`text-[11px] px-3 py-1 border transition-colors shrink-0 disabled:opacity-40 disabled:cursor-not-allowed ${
isFollowing
? "border-border text-text-muted hover:text-danger hover:border-danger/40"
: "border-accent/60 text-accent hover:bg-accent hover:text-white"
: "border-accent/60 text-accent hover:bg-accent hover:text-accent-text"
}`}
>
{pending ? "…" : isFollowing ? "unfollow" : "follow"}
@@ -114,7 +114,7 @@ function SuggestionFollowButton({ pubkey }: { pubkey: string }) {
className={`text-[11px] px-3 py-1 border transition-colors shrink-0 disabled:opacity-40 disabled:cursor-not-allowed ${
isFollowing
? "border-border text-text-muted hover:text-danger hover:border-danger/40"
: "border-accent/60 text-accent hover:bg-accent hover:text-white"
: "border-accent/60 text-accent hover:bg-accent hover:text-accent-text"
}`}
>
{pending ? "..." : isFollowing ? "unfollow" : "follow"}
src/components/shared/AboutView.tsx
+1 -1
View File
@@ -65,7 +65,7 @@ export function AboutView() {
</p>
<button
onClick={() => setShowZap(true)}
className="px-4 py-2 text-[12px] font-medium bg-zap hover:bg-zap/90 text-white transition-colors"
className="px-4 py-2 text-[12px] font-medium bg-zap hover:bg-zap/90 text-zap-text transition-colors"
>
⚡ Zap hoornet
</button>
src/components/shared/LoginModal.tsx
+2 -2
View File
@@ -69,7 +69,7 @@ function NewAccountTab({ onClose }: { onClose: () => void }) {
<button
onClick={handleConfirm}
disabled={!confirmed || logging}
className="w-full px-4 py-2 text-[12px] bg-accent hover:bg-accent-hover text-white transition-colors disabled:opacity-30 disabled:cursor-not-allowed"
className="w-full px-4 py-2 text-[12px] bg-accent hover:bg-accent-hover text-accent-text transition-colors disabled:opacity-30 disabled:cursor-not-allowed"
>
{logging ? "logging in…" : "create account"}
</button>
@@ -197,7 +197,7 @@ export function LoginModal({ onClose }: LoginModalProps) {
<button
onClick={handleLogin}
disabled={!input.trim() || loading}
className="w-full mt-3 px-4 py-2 text-[12px] bg-accent hover:bg-accent-hover text-white transition-colors disabled:opacity-30 disabled:cursor-not-allowed"
className="w-full mt-3 px-4 py-2 text-[12px] bg-accent hover:bg-accent-hover text-accent-text transition-colors disabled:opacity-30 disabled:cursor-not-allowed"
>
{loading
? (tab === "bunker" ? "Connecting…" : "Logging in…")
src/components/shared/NWCWizard.tsx
+1 -1
View File
@@ -146,7 +146,7 @@ function WalletCard({ wallet, onSelect }: { wallet: WalletDef; onSelect: () => v
)}
<button
onClick={onSelect}
className="text-[10px] px-2 py-1 border border-accent/60 text-accent hover:bg-accent hover:text-white transition-colors"
className="text-[10px] px-2 py-1 border border-accent/60 text-accent hover:bg-accent hover:text-accent-text transition-colors"
>
connect →
</button>
src/components/thread/ThreadNode.tsx
+1 -1
View File
@@ -99,7 +99,7 @@ function InlineThreadReply({ replyTo, rootEvent, onPublished }: {
<button
onClick={handleSubmit}
disabled={!text.trim() || replying}
className="px-2 py-0.5 text-[10px] bg-accent hover:bg-accent-hover text-white transition-colors disabled:opacity-30 disabled:cursor-not-allowed"
className="px-2 py-0.5 text-[10px] bg-accent hover:bg-accent-hover text-accent-text transition-colors disabled:opacity-30 disabled:cursor-not-allowed"
>
{sent ? "replied ✓" : replying ? "posting..." : "reply"}
</button>
src/components/thread/ThreadView.tsx
+1 -1
View File
@@ -248,7 +248,7 @@ export function ThreadView() {
<button
onClick={handleRootReply}
disabled={!replyText.trim() || replying}
className="px-2 py-0.5 text-[10px] bg-accent hover:bg-accent-hover text-white transition-colors disabled:opacity-30 disabled:cursor-not-allowed"
className="px-2 py-0.5 text-[10px] bg-accent hover:bg-accent-hover text-accent-text transition-colors disabled:opacity-30 disabled:cursor-not-allowed"
>
{replySent ? "replied ✓" : replying ? "posting..." : "reply"}
</button>
src/components/zap/ZapModal.tsx
+2 -2
View File
@@ -68,7 +68,7 @@ export function ZapModal({ target, recipientName, onClose }: ZapModalProps) {
</p>
<button
onClick={() => { onClose(); setView("settings"); }}
className="px-4 py-1.5 text-[11px] border border-accent/60 text-accent hover:bg-accent hover:text-white transition-colors"
className="px-4 py-1.5 text-[11px] border border-accent/60 text-accent hover:bg-accent hover:text-accent-text transition-colors"
>
go to settings →
</button>
@@ -123,7 +123,7 @@ export function ZapModal({ target, recipientName, onClose }: ZapModalProps) {
<button
onClick={handleZap}
disabled={effectiveAmount <= 0}
className="w-full py-2 text-[12px] font-medium bg-zap hover:bg-zap/90 text-white transition-colors disabled:opacity-30 disabled:cursor-not-allowed"
className="w-full py-2 text-[12px] font-medium bg-zap hover:bg-zap/90 text-zap-text transition-colors disabled:opacity-30 disabled:cursor-not-allowed"
>
⚡ Zap {effectiveAmount > 0 ? `${effectiveAmount} sats` : ""}
</button>