From 0bd842ab73e6356cc86a2f6e31cc184dc1eb3efe Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Rafa=C5=82=20Olszewski?= <me@orafal.dev>
Date: Wed, 12 May 2021 15:11:33 +0200
Subject: [PATCH] Update README.md

---
 README.md | 54 ++++++++++++++++++++++++++++++++++++++++++++++++++----
 1 file changed, 50 insertions(+), 4 deletions(-)

diff --git a/README.md b/README.md
index 719b94d..bf86476 100644
--- a/README.md
+++ b/README.md
@@ -1,26 +1,72 @@
 # vue3-smooth-scrollbar
 
+[![Test build](https://github.com/rafalolszewski94/vue3-smooth-scrollbar/actions/workflows/test-build.yml/badge.svg)](https://github.com/rafalolszewski94/vue3-smooth-scrollbar/actions/workflows/test-build.yml)
+
 Based on [vue-smooth-scrollbar](https://github.com/BlackBP/vue-smooth-scrollbar)
 
 ## Requirements
 - Vue 3
 
-## Project setup
+## Installation
+
+NPM
+```bash
+npm install vue3-smooth-scrollbar  #  yarn add vue3-smooth-scrollbar
+```
+
+## Usage
+
+### Custom main scrollbar
+
+**App.vue**
+```vue
+<template>
+  <scrollbar>
+    <!-- content -->
+  </scrollbar>
+</template>
+
+<script>
+import Scrollbar from "vue3-smooth-scrollbar";
+
+export default {
+  components: { Navbar, Scrollbar },
+};
+</script>
+```
+
+**Add to your styles**
+```scss
+body {
+  overflow: hidden;
+}
+
+// Assuming you're using default mount element
+#app {
+  height: 100vh;
+  overflow: auto;
+}
+```
+
+
+## Development
+
+#### Project setup
 ```
 npm run install
 ```
 
-### Compiles and hot-reloads for development
+#### Compiles and hot-reloads for development
 ```
 npm run serve
 ```
 
-### Compiles and minifies for production
+#### Compiles and minifies for production
 ```
 npm run build
 ```
 
-### Lints and fixes files
+#### Lints and fixes files
 ```
 npm run lint
 ```