@frankhoodbs/skip-link-cmp NPM

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:

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` (`--fh-base-font-size`)	Font size of the skip link text.
`--skip-link-line-height`	`1` (`--fh-base-line-height`)	Line height of the skip link text.