feat(ext/popup): rename sig-block--blue to --gold for accuracy
Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
This commit is contained in:
@@ -67,9 +67,9 @@ describe('renderConcealedRow', () => {
|
||||
});
|
||||
|
||||
describe('renderSignatureBlock', () => {
|
||||
it('default accent is blue', () => {
|
||||
it('default accent is gold', () => {
|
||||
const html = renderSignatureBlock({ children: '<p>hi</p>' });
|
||||
expect(html).toContain('sig-block--blue');
|
||||
expect(html).toContain('sig-block--gold');
|
||||
expect(html).toContain('<p>hi</p>');
|
||||
});
|
||||
|
||||
|
||||
@@ -70,14 +70,14 @@ export function renderConcealedRow(opts: ConcealedRowOpts): string {
|
||||
}
|
||||
|
||||
export interface SignatureBlockOpts {
|
||||
accent?: 'blue' | 'green' | 'amber' | 'red';
|
||||
accent?: 'gold' | 'green' | 'amber' | 'red';
|
||||
children: string;
|
||||
}
|
||||
|
||||
/// Container for the type-specific signature panel. `children` is HTML
|
||||
/// the caller has already produced (and escaped where needed).
|
||||
export function renderSignatureBlock(opts: SignatureBlockOpts): string {
|
||||
const accent = opts.accent ?? 'blue';
|
||||
const accent = opts.accent ?? 'gold';
|
||||
return `
|
||||
<div class="sig-block sig-block--${accent}">${opts.children}</div>
|
||||
`;
|
||||
|
||||
@@ -78,7 +78,7 @@ export async function renderDetail(app: HTMLElement, item: Item): Promise<void>
|
||||
<div class="pad">
|
||||
<div style="margin-bottom:12px;">
|
||||
<div class="detail-title" style="margin-bottom:8px;">${escapeHtml(item.title)}</div>
|
||||
${renderSignatureBlock({ accent: 'blue', children: sigInner })}
|
||||
${renderSignatureBlock({ accent: 'gold', children: sigInner })}
|
||||
</div>
|
||||
${c.cvv ? renderConcealedRow({ id: 'card-cvv', label: 'cvv', value: c.cvv, monospace: true }) : ''}
|
||||
${c.pin ? renderConcealedRow({ id: 'card-pin', label: 'pin', value: c.pin, monospace: true }) : ''}
|
||||
|
||||
@@ -54,7 +54,7 @@ export async function renderDetail(app: HTMLElement, item: Item): Promise<void>
|
||||
app.innerHTML = `
|
||||
<div class="pad">
|
||||
<div style="margin-bottom:12px;">
|
||||
${renderSignatureBlock({ accent: 'blue', children: sigInner })}
|
||||
${renderSignatureBlock({ accent: 'gold', children: sigInner })}
|
||||
</div>
|
||||
${username ? renderRow({ label: 'username', value: username, copyable: true }) : ''}
|
||||
${renderConcealedRow({ id: 'login-password', label: 'password', value: password })}
|
||||
|
||||
@@ -80,7 +80,7 @@ export async function renderDetail(app: HTMLElement, item: Item): Promise<void>
|
||||
<div class="pad">
|
||||
<div style="margin-bottom:12px;">
|
||||
<div class="detail-title" style="margin-bottom:8px;">${escapeHtml(item.title)}</div>
|
||||
${renderSignatureBlock({ accent: 'blue', children: sigInner })}
|
||||
${renderSignatureBlock({ accent: 'gold', children: sigInner })}
|
||||
</div>
|
||||
${c.issuer ? renderRow({ label: 'issuer', value: c.issuer }) : ''}
|
||||
${c.label ? renderRow({ label: 'label', value: c.label }) : ''}
|
||||
|
||||
@@ -504,7 +504,7 @@ textarea {
|
||||
padding: 14px;
|
||||
margin-bottom: 10px;
|
||||
}
|
||||
.sig-block--blue { border-left-color: #7c5719; }
|
||||
.sig-block--gold { border-left-color: #7c5719; }
|
||||
.sig-block--green { border-left-color: #3fb950; }
|
||||
.sig-block--amber { border-left-color: #d29922; }
|
||||
.sig-block--red { border-left-color: #ab2b20; }
|
||||
|
||||
Reference in New Issue
Block a user