diff --git a/client/src/components/Journey/JourneyShareSection.test.tsx b/client/src/components/Journey/JourneyShareSection.test.tsx
index 6c2972fb9..1e45a1163 100644
--- a/client/src/components/Journey/JourneyShareSection.test.tsx
+++ b/client/src/components/Journey/JourneyShareSection.test.tsx
@@ -1,4 +1,4 @@
-// FE-JRN-SHARE-001 to FE-JRN-SHARE-014
+// FE-JRN-SHARE-001 to FE-JRN-SHARE-015
import { describe, it, expect, beforeEach, afterEach, vi } from 'vitest'
import { http, HttpResponse, delay } from 'msw'
@@ -245,4 +245,15 @@ describe('JourneyShareSection', () => {
expect(plan).toHaveAttribute('aria-pressed', 'false')
expect(screen.getByRole('button', { name: /Recorded routes/ })).toBeDisabled()
})
+
+ it('FE-JRN-SHARE-015: a filled accent button sets its words in the colour made for it, not in the accent itself', async () => {
+ server.use(http.get('/api/journeys/7/share-link', () => HttpResponse.json({ link: existingLink() })))
+ render()
+
+ const filled = [await screen.findByRole('button', { name: 'Timeline' }), screen.getByRole('button', { name: 'Copy' })]
+ for (const button of filled) {
+ expect(button.className).toContain('text-accent-text')
+ expect(button.className).not.toContain('text-accent-on')
+ }
+ })
})
diff --git a/client/src/components/Journey/JourneyShareSection.tsx b/client/src/components/Journey/JourneyShareSection.tsx
index a39599286..1d6876fc4 100644
--- a/client/src/components/Journey/JourneyShareSection.tsx
+++ b/client/src/components/Journey/JourneyShareSection.tsx
@@ -69,7 +69,7 @@ export default function JourneyShareSection({ journeyId }: { journeyId: number }
{shareUrl}
@@ -94,7 +94,7 @@ export default function JourneyShareSection({ journeyId }: { journeyId: number }
onClick={() => togglePerm(key)}
className={`flex items-center gap-2.5 px-3 py-2 rounded-xl border text-body font-medium transition-all ${
link[key]
- ? 'border-accent bg-accent text-accent-on'
+ ? 'border-accent bg-accent text-accent-text'
: 'border-edge text-content-muted hover:border-content-faint'
}`}
>