https://github.com/motea927/mt-step

A lightweight, highly customizable Vue component to help users step by step focus on the page.
https://github.com/motea927/mt-step

Last synced: about 6 hours ago
JSON representation

A lightweight, highly customizable Vue component to help users step by step focus on the page.

• Host: GitHub
• URL: https://github.com/motea927/mt-step
• Owner: motea927
• Created: 2023-01-26T16:06:42.000Z (almost 2 years ago)
• Default Branch: master
• Last Pushed: 2023-02-04T13:37:53.000Z (almost 2 years ago)
• Last Synced: 2023-05-21T21:06:12.394Z (over 1 year ago)
• Language: TypeScript
• Homepage: https://mt-step.morty.tw/
• Size: 2.39 MB
• Stars: 1
• Watchers: 1
• Forks: 0
• Open Issues: 0
• Metadata Files:
  • Readme: README.md

Awesome Lists containing this project

README

        
# mt-step

A lightweight, highly customizable's Vue component to help user step by step focus on the page.

![image](https://raw.githubusercontent.com/motea927/mt-step/master/assets/demo.gif)

## 🚀 Features

- ⚡ **Lightweight**: Bundle size <3kb when gzipped.

- 🧩 **Customizable**: Configurable z-index to fit any project.

- 👍 **Vue Component**: Work for Vue 2 and Vue 3.

- 🧶 **Highlighting multiple element**: Support highlighting single or multiple element on a step.

- 🔌 **Flexible**: Support no hint, single hint, multiple hint on a step and single hint corresponds multiple highlight.

- 🦾 **Type Strong**: Written in TypeScript.

## 🏎 Usage

```vue

  

    

  

import 'mt-step/css'

import { MtStep, MtStepItem } from 'mt-step'

```

Refer to [documentations](https://mt-step.morty.tw/) for more details.

## 📦 Install

```bash

yarn add mt-step

```