Skip to content Component

The "Skip to Content Component" is a Vue component that offers a convenient way to provide a "Skip to content" link, enhancing the accessibility of your website.

!Version
!License

Installation

To install, use npm:

``bash
npm install @frankhoodbs/skip-link-cmp
`

Props

| Name | Type | Default | Description |
|---------------------|-----------------------|------------|-----------------------------------------|
| data-href | String | #content | The href attribute for the skip link. |
| data-link-classes | String, Object, Array | - | Custom classes to be added to the link. |

Slots

| Name | Description |
|-----------|-----------------------------------------|
| default | Slot for customizing skip link content. |

Custom CSS Properties

| Name | Default Value | Description |
|-----------------------------|---------------|---------------------------------------|
| --skip-link-padding-y | 12px | Vertical padding for the skip link. |
| --skip-link-padding-x | 20px | Horizontal padding for the skip link. |
| --skip-link-color | black | Color of the skip link text. |
| --skip-link-background | white | Background color of the skip link. |
| --skip-link-border-width | 1px | Border width of the skip link. |
| --skip-link-border-color | black | Border color of the skip link. |
| --skip-link-border-radius | 4px | Border radius of the skip link. |
| --skip-link-font-size | 1rem | Font size of the skip link text. |
| --skip-link-line-height | 1` | Line height of the skip link text. |