https://github.com/opdavies/tailwindcss-plugin-skip-link

Tailwind CSS plugin to easily add a 'skip to main content' link.
https://github.com/opdavies/tailwindcss-plugin-skip-link

tailwindcss tailwindcss-plugin

Last synced: about 2 months ago
JSON representation

Tailwind CSS plugin to easily add a 'skip to main content' link.

• Host: GitHub
• URL: https://github.com/opdavies/tailwindcss-plugin-skip-link
• Owner: opdavies
• License: mit
• Created: 2018-12-19T23:33:39.000Z (almost 6 years ago)
• Default Branch: master
• Last Pushed: 2020-11-23T06:29:20.000Z (almost 4 years ago)
• Last Synced: 2024-07-26T12:25:37.846Z (about 2 months ago)
• Topics: tailwindcss, tailwindcss-plugin
• Language: JavaScript
• Homepage:
• Size: 14.6 KB
• Stars: 13
• Watchers: 3
• Forks: 0
• Open Issues: 5
• Metadata Files:
  • Readme: README.md
  • License: LICENSE

Awesome Lists containing this project

README

        
# Tailwind CSS Plugin: Skip Link

## Overview

```sh

# Using npm

npm install --save-dev tailwindcss-skip-link

# Using yarn

yarn add --dev tailwindcss-skip-link

```

## Usage

You can add the plugin to your Tailwind config as follows:

```js

plugins: [

  // ...

  require('tailwindcss-skip-link')(),

],

```

Within your HTML, add the skip link straight after the `body` tag along with any other additional classes:

```html

Skip to main content

```

Then add the matching ID to skip to on your main content element.

```html



    
Lorem ipsum



```


## Example

To see an example of this plugin in use, see the [oliverdavies.uk repository](https://github.com/opdavies/oliverdavies.uk) or the [rebuilding-bartik repository](https://github.com/opdavies/rebuilding-bartik).

## Author

[Oliver Davies](https://www.oliverdavies.uk) - Full Stack Developer