https://github.com/k2tzumi/slidev-addon-qrcode

Slidev add-on qrcode component
https://github.com/k2tzumi/slidev-addon-qrcode

hacktoberfest qrcode slidev-addon vuejs

Last synced: 3 months ago
JSON representation

Slidev add-on qrcode component

• Host: GitHub
• URL: https://github.com/k2tzumi/slidev-addon-qrcode
• Owner: k2tzumi
• License: mit
• Created: 2023-07-23T08:51:48.000Z (over 1 year ago)
• Default Branch: main
• Last Pushed: 2024-03-24T03:18:45.000Z (10 months ago)
• Last Synced: 2024-05-02T06:16:33.249Z (9 months ago)
• Topics: hacktoberfest, qrcode, slidev-addon, vuejs
• Language: Vue
• Homepage:
• Size: 252 KB
• Stars: 1
• Watchers: 1
• Forks: 1
• Open Issues: 1
• Metadata Files:
  • Readme: README.md
  • Changelog: CHANGELOG.md
  • License: LICENSE

Awesome Lists containing this project

README

        
# slidev-addon-qrcode

[Slidev](https://sli.dev/) add-on qrcode component

![screenshot](example-export/001.png)

## Dependencies

- [styled-qr-code](https://www.npmjs.com/package/styled-qr-code)

## Installation

```console

npm i @katzumi/slidev-addon-qrcode

```

## Slidev Configuration

Define this package into your slidev addons.

In your slides metadata (using Front Matter):

```yaml

addons:

  - "@katzumi/slidev-addon-qrcode"

```

Or in your `package.json`:

```json

{

  "slidev": {

    "addons": [

      "@katzumi/slidev-addon-qrcode"

    ]

  }

}

```

## Components

You can create a poll by using the [QRCode component](#QRCode).

### QRCode

```xml

```

Parameters:

* `value` (`string`) : The date will be encoded to the QR code

* `width` (`number` , default `200`)  : Size of canvas

* `height` (`number` , default `200`)  : Size of canvas

* `color` (`string` , default `000000`)  : Color code of QR dots

* `image` (`string`)  : The image will be copied to the center of the QR code