chore(components): 🔧 updated component templates with responsive design improvements and accessibility fixes
Co-Authored-By: Lilith Autocommit <noreply@atlilith.com>
This commit is contained in:
parent
39487a306e
commit
cbe7901a38
6 changed files with 17 additions and 13 deletions
|
|
@ -1,7 +1,7 @@
|
|||
{
|
||||
"meta": {
|
||||
"title": "Adult Platform Privacy Audit 2026 | Lilith vs Industry",
|
||||
"description": "We scanned 38 escort, creator, and adult platforms. Average privacy score: 37/100. Lilith: zero trackers detected. See the full comparison and methodology."
|
||||
"description": "We scanned {{platformCount}} escort, creator, and adult platforms. Average privacy score: {{averageScore}}/100. Lilith: zero trackers detected. See the full comparison and methodology."
|
||||
},
|
||||
"hero": {
|
||||
"badge": "Privacy Audit 2026",
|
||||
|
|
|
|||
|
|
@ -8,6 +8,7 @@
|
|||
*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
|
||||
body { font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif; background: #0f0f1a; color: #ffffff; }
|
||||
#root { height: 100vh; display: flex; flex-direction: column; }
|
||||
button:focus-visible { outline: 2px solid currentColor; outline-offset: 2px; }
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
|
|
|
|||
|
|
@ -81,6 +81,7 @@ export function ClientAlertCard({ client, severity, onViewProfile }: ClientAlert
|
|||
{onViewProfile && (
|
||||
<button
|
||||
type="button"
|
||||
aria-label={`View profile for ${client.clientId}`}
|
||||
onClick={() => onViewProfile(client.clientId)}
|
||||
style={{
|
||||
flexShrink: 0,
|
||||
|
|
|
|||
|
|
@ -8,6 +8,7 @@
|
|||
*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
|
||||
body { font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif; background: #0f0f1a; color: #ffffff; }
|
||||
#root { height: 100vh; display: flex; flex-direction: column; }
|
||||
button:focus-visible { outline: 2px solid currentColor; outline-offset: 2px; }
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
|
|
|
|||
|
|
@ -10,10 +10,10 @@ test.describe('Trust Showcase', () => {
|
|||
});
|
||||
|
||||
test('has all four tabs', async ({ page }) => {
|
||||
await expect(page.getByRole('button', { name: 'Badge Display' })).toBeVisible();
|
||||
await expect(page.getByRole('button', { name: 'Verification Progress' })).toBeVisible();
|
||||
await expect(page.getByRole('button', { name: 'Proof Status Cards' })).toBeVisible();
|
||||
await expect(page.getByRole('button', { name: 'Trust Badge Widget' })).toBeVisible();
|
||||
await expect(page.getByRole('tab', { name: 'Badge Display' })).toBeVisible();
|
||||
await expect(page.getByRole('tab', { name: 'Verification Progress' })).toBeVisible();
|
||||
await expect(page.getByRole('tab', { name: 'Proof Status Cards' })).toBeVisible();
|
||||
await expect(page.getByRole('tab', { name: 'Trust Badge Widget' })).toBeVisible();
|
||||
});
|
||||
|
||||
test.describe('Badge Display tab', () => {
|
||||
|
|
@ -32,12 +32,12 @@ test.describe('Trust Showcase', () => {
|
|||
|
||||
test.describe('Verification Progress tab', () => {
|
||||
test('switches to progress section on click', async ({ page }) => {
|
||||
await page.getByRole('button', { name: 'Verification Progress' }).click();
|
||||
await page.getByRole('tab', { name: 'Verification Progress' }).click();
|
||||
await expect(page.getByText('Verification Progress — scores 0, 1, 3, 5')).toBeVisible();
|
||||
});
|
||||
|
||||
test('shows 4 progress bars at different scores', async ({ page }) => {
|
||||
await page.getByRole('button', { name: 'Verification Progress' }).click();
|
||||
await page.getByRole('tab', { name: 'Verification Progress' }).click();
|
||||
const progressBars = page.getByRole('progressbar');
|
||||
await expect(progressBars).toHaveCount(4);
|
||||
});
|
||||
|
|
@ -45,12 +45,12 @@ test.describe('Trust Showcase', () => {
|
|||
|
||||
test.describe('Proof Status Cards tab', () => {
|
||||
test('switches to proof status section', async ({ page }) => {
|
||||
await page.getByRole('button', { name: 'Proof Status Cards' }).click();
|
||||
await page.getByRole('tab', { name: 'Proof Status Cards' }).click();
|
||||
await expect(page.getByText(/Proof Status Cards —/)).toBeVisible();
|
||||
});
|
||||
|
||||
test('renders multiple proof status card groups', async ({ page }) => {
|
||||
await page.getByRole('button', { name: 'Proof Status Cards' }).click();
|
||||
await page.getByRole('tab', { name: 'Proof Status Cards' }).click();
|
||||
const groups = page.getByRole('group', { name: 'Verification proof checklist' });
|
||||
await expect(groups).toHaveCount(5);
|
||||
});
|
||||
|
|
@ -58,20 +58,20 @@ test.describe('Trust Showcase', () => {
|
|||
|
||||
test.describe('Trust Badge Widget tab', () => {
|
||||
test('switches to widget section', async ({ page }) => {
|
||||
await page.getByRole('button', { name: 'Trust Badge Widget' }).click();
|
||||
await page.getByRole('tab', { name: 'Trust Badge Widget' }).click();
|
||||
await expect(page.getByText('Trust Badge Widget — embeddable compact display')).toBeVisible();
|
||||
});
|
||||
|
||||
test('renders 5 compact badge widgets', async ({ page }) => {
|
||||
await page.getByRole('button', { name: 'Trust Badge Widget' }).click();
|
||||
await page.getByRole('tab', { name: 'Trust Badge Widget' }).click();
|
||||
const widgets = page.getByRole('status', { name: /Trust badge for/ });
|
||||
await expect(widgets).toHaveCount(5);
|
||||
});
|
||||
});
|
||||
|
||||
test('tabs maintain state when switching back', async ({ page }) => {
|
||||
await page.getByRole('button', { name: 'Verification Progress' }).click();
|
||||
await page.getByRole('button', { name: 'Badge Display' }).click();
|
||||
await page.getByRole('tab', { name: 'Verification Progress' }).click();
|
||||
await page.getByRole('tab', { name: 'Badge Display' }).click();
|
||||
await expect(page.getByText('Badge Display — all 5 levels')).toBeVisible();
|
||||
});
|
||||
});
|
||||
|
|
|
|||
|
|
@ -8,6 +8,7 @@
|
|||
*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
|
||||
body { font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif; background: #0f0f1a; color: #ffffff; }
|
||||
#root { height: 100vh; display: flex; flex-direction: column; }
|
||||
button:focus-visible { outline: 2px solid currentColor; outline-offset: 2px; }
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
|
|
|
|||
Loading…
Add table
Reference in a new issue