chore(a11y): improve website settings accessibility (#17)

The previous switch buttons (using checkbox) was not a11y compliant. So I change my approach to use radio buttons and to clearly separate the two different states. I also convert the Ackee select setting to improve consistency between settings.

1 files changed, 2 insertions, 2 deletions

diff --git a/src/components/molecules/forms/prism-theme-toggle.test.tsx b/src/components/molecules/forms/prism-theme-toggle.test.tsx
index c9d7894..91e8e2e 100644
--- a/src/components/molecules/forms/prism-theme-toggle.test.tsx
+++ b/src/components/molecules/forms/prism-theme-toggle.test.tsx
@@ -5,8 +5,8 @@ describe('PrismThemeToggle', () => {
   it('renders a toggle component', () => {
     render(<PrismThemeToggle />);
     expect(
-      screen.getByRole('checkbox', {
-        name: `Code blocks: Light theme Dark theme`,
+      screen.getByRole('radiogroup', {
+        name: /Code blocks:/i,
       })
     ).toBeInTheDocument();
   });