alee/relicario
1
0
Fork 0
Code Issues Pull Requests 4 Actions Packages Projects Releases Wiki Activity

feat(ext): add GLYPH_NEXT and replace ASCII arrows with ▸

Browse Source 
Replaces the ASCII rightwards arrow → with U+25B8 ▸ in settings-vault
buttons. Matches the existing ▾/▸ disclosure-glyph family.
This commit is contained in:
adlee-was-taken
2026-05-02 14:17:55 -04:00
parent 60d7c074c3
commit 308ef2c974
3 changed files with 26 additions and 2 deletions
Download Patch File Download Diff File Expand all files Collapse all files

5
extension/src/popup/components/settings-vault.ts
View File

@@ -7,6 +7,7 @@ import type {
VaultSettings, TrashRetention, HistoryRetention, GeneratorRequest,
} from '../../shared/types';
import { openGeneratorPanel, closeGeneratorPanel, isGeneratorPanelOpen } from './generator-panel';
import { GLYPH_NEXT } from '../../shared/glyphs';
let pendingSettings: VaultSettings | null = null;
let activeKeyHandler: ((e: KeyboardEvent) => void) | null = null;
@@ -161,14 +162,14 @@ export function renderVaultSettings(app: HTMLElement): void {
<div class="settings-section">
<div class="settings-section__title">backup &amp; restore</div>
<div class="settings-row">
<button class="btn" id="open-backup">Backup &amp; restore →</button>
<button class="btn" id="open-backup">Backup &amp; restore ${GLYPH_NEXT}</button>
</div>
</div>
<div class="settings-section">
<div class="settings-section__title">import</div>
<div class="settings-row">
<button class="btn" id="open-import">LastPass CSV →</button>
<button class="btn" id="open-import">LastPass CSV ${GLYPH_NEXT}</button>
</div>
</div>

22
extension/src/shared/__tests__/glyphs.test.ts
View File

@@ -1,5 +1,10 @@
import { describe, it, expect } from 'vitest';
import * as glyphs from '../glyphs';
import {
GLYPH_REVEAL, GLYPH_HIDE, GLYPH_GENERATE, GLYPH_FILL_FROM_TAB,
GLYPH_QR, GLYPH_MONO, GLYPH_TRASH, GLYPH_DEVICES, GLYPH_SETTINGS,
GLYPH_LOCK, GLYPH_NEXT,
} from '../glyphs';
describe('glyphs', () => {
it('exports the documented glyph constants', () => {
@@ -19,3 +24,20 @@ describe('glyphs', () => {
expect(glyphs.REQUIRED_PILL_HTML).toBe('<span class="req-pill">required</span>');
});
});
describe('glyph constants', () => {
it('uses single unicode codepoints (no emoji multi-codepoint)', () => {
const all = [
GLYPH_REVEAL, GLYPH_HIDE, GLYPH_GENERATE, GLYPH_FILL_FROM_TAB,
GLYPH_QR, GLYPH_MONO, GLYPH_TRASH, GLYPH_DEVICES, GLYPH_SETTINGS,
GLYPH_LOCK, GLYPH_NEXT,
];
for (const g of all) {
expect([...g].length).toBe(1);
}
});
it('GLYPH_NEXT is the small right triangle (U+25B8)', () => {
expect(GLYPH_NEXT).toBe('▸');
});
});

1
extension/src/shared/glyphs.ts
View File

@@ -16,6 +16,7 @@ export const GLYPH_TRASH = '▦'; // sidebar trash nav
export const GLYPH_DEVICES = '⌬'; // sidebar devices nav
export const GLYPH_SETTINGS = '⚙'; // sidebar settings nav
export const GLYPH_LOCK = '⏻'; // sidebar lock nav
export const GLYPH_NEXT = '▸'; // forward / next button (matches ▾/▸ disclosure family)
/// Inline HTML snippet for the required-field pill. Use after a label's text:
/// `<label class="label" for="f-title">title ${REQUIRED_PILL_HTML}</label>`