diff --git a/README.md b/README.md
index 6fccdca..6bb5b60 100644
--- a/README.md
+++ b/README.md
@@ -309,7 +309,7 @@ The number of pixels the content height can surpass the container height without
**Default: 0**
### stopPropagationOnClick
-When set to false, when clicking on a rail, the click event will be allowed to propagate.
+When set to false, when clicking on a rail, the click event will be allowed to pr##opagate.
**Default: true**
### useSelectionScroll
@@ -317,29 +317,35 @@ When set to true, you can scroll the container by selecting text and move the cu
**Default: false**
### theme
-A string. It's a class name added to the container element. The class name is prepended with `ps-theme-`. So default theme class name is `ps-theme-default`. In order to create custom themes with scss use `ps-container($theme)` mixin, where `$theme` is a scss map. Look at `themes.scss` as a reference for how to create custom themes.
+A string. It's a class name added to the container element. The class name is prepended with `ps-theme-`. So default theme class name is `ps-theme-default`. In order to create custom themes with scss use `ps-container($theme)` mixin, where `$theme` is a scss map.
**Default: 'default'**
-Example:
+**Example 1:**
+Add `theme` parameter:
```javascript
Ps.initialize(container, {
- theme: 'my-theme-name',
+ theme: 'my-theme-name'
});
```
-
-```css
+Create a class name prefixed with `.ps-theme-`. Include `ps-container()` mixin. It's recommended to use `map-merge()` to extend `$ps-theme-default` map with your custom styles.
+```css#
.ps-theme-my-theme-name {
@include ps-container(map-merge($ps-theme-default, (
- border-radius: 0,
- scrollbar-x-rail-height: 20px,
- scrollbar-x-height: 20px,
- scrollbar-y-rail-width: 20px,
- scrollbar-y-width: 20px,)
+ border-radius: 0,
+ scrollbar-x-rail-height: 20px,
+ scrollbar-x-height: 20px,
+ scrollbar-y-rail-width: 20px,
+ scrollbar-y-width: 20px,)
));
}
```
+**Example 2:**
+
+Alternatively, if you don't want to create your own themes, but only modify the default one, you could simply overwrite `$ps-*` variables with your own values. In this case `theme` parameter is not required when calling `.initialize()` method. Remember do define your own variables before the `theme.scss` file is imported.
+
+
## Events
perfect-scrollbar dispatches custom events.
diff --git a/examples/custom-theme.html b/examples/custom-theme.html
index e1ad56f..c9d4965 100644
--- a/examples/custom-theme.html
+++ b/examples/custom-theme.html
@@ -1,30 +1,27 @@
-
- perfect-scrollbar example
-
-
-
+
+ perfect-scrollbar example
+
+
+