chore: update readme

Author: HedwigJDoets

packages/pluggableWidgets/skiplink-web/README.md

@@ -1,27 +1,22 @@
-# SkipLink Web Widget
+# Skip Link
 
-A simple accessibility widget that adds a skip link to the top of the page. The link is only visible when focused and allows users to jump directly to the main content.
+Adds a skip navigation link for keyboard accessibility. The link is hidden until focused and allows users to jump directly to the main content.
 
 ## Usage
 
-1. Place the `<SkipLink />` component at the very top of your page or layout.
-2. Ensure your main content container has `id="main-content"`.
+1. Add the Skip Link widget anywhere on your page, preferrably at the top or in a layout.
+2. Configure the **Link Text** and **Main Content ID** properties.
+3. Ensure your main content element has the specified ID, or there's a main tag on the page.
 
-    ```jsx
-    <SkipLink />
-    <main id="main-content">Main content here</main>
-    ```
+The widget automatically inserts the skip link as the first child of the `#root` element.
 
-## Accessibility
+## Properties
 
-- The skip link is visually hidden except when focused, making it accessible for keyboard and screen reader users.
+- **Link Text**: Text displayed for the skip link (default: "Skip to main content").
+- **Main Content ID**: ID of the main content element to focus (optional).
 
-## End-to-End Testing
+If the target element is not found, the widget will focus the first `<main>` element instead.
 
-E2E tests are located in the `e2e/` folder and use Playwright. Run them with:
+## Accessibility
 
-```
-npm install
-npx playwright install
-npm test
-```
+The skip link is positioned absolutely at the top-left of the page, hidden by default with `transform: translateY(-120%)`, and becomes visible when focused via keyboard navigation.