nate/Siteforge
1
0 Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Fix host portal using wrong CSS variables; v2.0.10
Publish Container / docker (push) Has been cancelled
Details

Browse Source 
Replaced --color-bg/surface/border/input-bg fallbacks (which don't exist
in the site's CSS) with the actual --brand-* tokens so the portal
renders in the site's dark theme instead of light fallback colors.

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
This commit is contained in:
nmemmertandClaude Sonnet 4.6 committed 2026-09-08 14:40:47 -04:00
1 parent f5c5281684
commit 4940e53a98
2 files changed
+38 -35
Download Patch File Download Diff File Expand all files Collapse all files

No files matched your search

src/components/NuggetsHostPortal.tsx
+37 -34
View File
@@ -336,22 +336,22 @@ const s: Record<string, React.CSSProperties> = {
alignItems: 'center',
justifyContent: 'center',
padding: '2rem 1rem',
background: 'var(--color-bg, #f7f5f0)',
background: 'var(--brand-black, #0a0a08)',
},
card: {
background: 'var(--color-surface, #fff)',
border: '1px solid var(--color-border, #e5e0d5)',
background: 'var(--brand-black-2, #0f0f0c)',
border: '1px solid var(--brand-border, #2a2518)',
borderRadius: 16,
padding: '2.25rem 2rem',
width: '100%',
maxWidth: 420,
boxShadow: '0 4px 24px rgba(0,0,0,0.06)',
boxShadow: '0 4px 24px rgba(0,0,0,0.4)',
},
logoRow: { display: 'flex', alignItems: 'center', gap: 8, marginBottom: 14 },
logoEmoji: { fontSize: '1.5rem' },
logoTitle: { fontWeight: 700, fontSize: '1rem' },
heading: { fontSize: '1.4rem', fontWeight: 700, margin: '0 0 6px' },
subText: { color: '#888', fontSize: '0.88rem', margin: '0 0 1.4rem' },
logoTitle: { fontWeight: 700, fontSize: '1rem', color: 'var(--brand-gold, #c9a84c)' },
heading: { fontSize: '1.4rem', fontWeight: 700, margin: '0 0 6px', color: 'var(--brand-warm-white, #f0ead8)' },
subText: { color: 'var(--brand-muted, #b0a48c)', fontSize: '0.88rem', margin: '0 0 1.4rem' },
header: {
display: 'flex',
alignItems: 'flex-start',
@@ -361,66 +361,69 @@ const s: Record<string, React.CSSProperties> = {
flexWrap: 'wrap',
},
headerRight: { display: 'flex', alignItems: 'center', gap: 10, paddingTop: 2 },
welcomeText: { fontSize: '0.85rem', color: '#888', fontWeight: 500 },
welcomeText: { fontSize: '0.85rem', color: 'var(--brand-muted, #b0a48c)', fontWeight: 500 },
btnGhost: {
background: 'none',
border: '1px solid var(--color-border, #e5e0d5)',
border: '1px solid var(--brand-border, #2a2518)',
borderRadius: 6,
padding: '0.3rem 0.65rem',
fontSize: '0.8rem',
cursor: 'pointer',
color: 'var(--brand-muted, #b0a48c)',
},
warning: {
background: '#fff8e1',
border: '1px solid #ffe082',
background: 'rgba(200,169,110,0.1)',
border: '1px solid var(--brand-gold-dark, #8a6e28)',
borderRadius: 8,
padding: '0.6rem 0.85rem',
fontSize: '0.84rem',
marginBottom: 16,
color: '#7a5f00',
color: 'var(--brand-gold-light, #e0c070)',
},
form: { display: 'flex', flexDirection: 'column', gap: 14 },
field: { display: 'flex', flexDirection: 'column', gap: 5 },
label: { fontSize: '0.85rem', fontWeight: 600 },
req: { color: '#c0392b' },
label: { fontSize: '0.85rem', fontWeight: 600, color: 'var(--brand-warm-white, #f0ead8)' },
req: { color: '#e07070' },
input: {
padding: '0.55rem 0.75rem',
border: '1px solid var(--color-border, #e5e0d5)',
border: '1px solid var(--brand-border, #2a2518)',
borderRadius: 8,
fontSize: '0.93rem',
background: 'var(--color-input-bg, #faf9f7)',
background: 'var(--brand-black-3, #1a1a15)',
color: 'var(--brand-warm-white, #f0ead8)',
outline: 'none',
width: '100%',
boxSizing: 'border-box',
fontFamily: 'inherit',
},
dropZone: {
border: '2px dashed var(--color-border, #ddd8cc)',
border: '2px dashed var(--brand-border, #2a2518)',
borderRadius: 10,
padding: '1.4rem 1rem',
textAlign: 'center',
cursor: 'pointer',
transition: 'border-color 0.15s, background 0.15s',
userSelect: 'none',
color: 'var(--brand-warm-white, #f0ead8)',
},
dropZoneActive: { borderColor: '#c8a96e', background: 'rgba(200,169,110,0.06)' },
dropZoneDisabled: { cursor: 'default', opacity: 0.65 },
dropZoneHasFile: { borderColor: '#27ae60', background: 'rgba(39,174,96,0.04)' },
dropZoneActive: { borderColor: 'var(--brand-gold, #c9a84c)', background: 'rgba(201,168,76,0.06)' },
dropZoneDisabled: { cursor: 'default', opacity: 0.5 },
dropZoneHasFile: { borderColor: 'var(--brand-gold, #c9a84c)', background: 'rgba(201,168,76,0.04)' },
dropIcon: { fontSize: '1.8rem', display: 'block', marginBottom: 6 },
dropLabel: { fontWeight: 600, margin: '0 0 3px', fontSize: '0.9rem' },
dropSub: { color: '#888', fontSize: '0.8rem', margin: 0 },
dropSub: { color: 'var(--brand-muted, #b0a48c)', fontSize: '0.8rem', margin: 0 },
fileInfo: { display: 'flex', alignItems: 'center', gap: 12, textAlign: 'left' },
fileIcon: { fontSize: '1.8rem', flexShrink: 0 },
fileName: { fontWeight: 600, fontSize: '0.88rem', margin: '0 0 2px', wordBreak: 'break-all' },
fileSize: { color: '#888', fontSize: '0.78rem', margin: 0 },
fileName: { fontWeight: 600, fontSize: '0.88rem', margin: '0 0 2px', wordBreak: 'break-all', color: 'var(--brand-warm-white, #f0ead8)' },
fileSize: { color: 'var(--brand-muted, #b0a48c)', fontSize: '0.78rem', margin: 0 },
progressWrap: { display: 'flex', flexDirection: 'column', gap: 5 },
progressBar: { height: 7, background: '#e5e0d5', borderRadius: 4, overflow: 'hidden' },
progressFill: { height: '100%', background: '#c8a96e', borderRadius: 4, transition: 'width 0.2s' },
progressLabel: { fontSize: '0.82rem', color: '#888', margin: 0, textAlign: 'center' },
errorMsg: { color: '#c0392b', fontSize: '0.84rem', margin: '2px 0' },
progressBar: { height: 7, background: 'var(--brand-black-3, #1a1a15)', borderRadius: 4, overflow: 'hidden' },
progressFill: { height: '100%', background: 'var(--brand-gold, #c9a84c)', borderRadius: 4, transition: 'width 0.2s' },
progressLabel: { fontSize: '0.82rem', color: 'var(--brand-muted, #b0a48c)', margin: 0, textAlign: 'center' },
errorMsg: { color: '#e07070', fontSize: '0.84rem', margin: '2px 0' },
btnPrimary: {
background: '#c8a96e',
color: '#fff',
background: 'var(--brand-gold, #c9a84c)',
color: '#0a0a08',
border: 'none',
borderRadius: 8,
padding: '0.7rem 1rem',
@@ -431,20 +434,20 @@ const s: Record<string, React.CSSProperties> = {
},
submittedList: {
marginTop: 20,
border: '1px solid var(--color-border, #e5e0d5)',
border: '1px solid var(--brand-border, #2a2518)',
borderRadius: 10,
padding: '0.75rem 1rem',
},
submittedTitle: {
fontWeight: 600,
fontSize: '0.78rem',
color: '#888',
color: 'var(--brand-muted, #b0a48c)',
margin: '0 0 8px',
textTransform: 'uppercase',
letterSpacing: '0.05em',
},
submittedRow: { display: 'flex', alignItems: 'flex-start', gap: 10, padding: '5px 0' },
checkMark: { color: '#27ae60', fontWeight: 700, flexShrink: 0 },
submittedEp: { fontWeight: 600, fontSize: '0.88rem', margin: '0 0 2px' },
submittedMeta: { color: '#888', fontSize: '0.78rem', margin: 0 },
checkMark: { color: 'var(--brand-gold, #c9a84c)', fontWeight: 700, flexShrink: 0 },
submittedEp: { fontWeight: 600, fontSize: '0.88rem', margin: '0 0 2px', color: 'var(--brand-warm-white, #f0ead8)' },
submittedMeta: { color: 'var(--brand-muted, #b0a48c)', fontSize: '0.78rem', margin: 0 },
}