Skip to content

Commit b707f9e

Browse files
committed
docs(plugin-back-to-top): add styles customization reference
1 parent 064c931 commit b707f9e

File tree

2 files changed

+26
-0
lines changed

2 files changed

+26
-0
lines changed

docs/reference/plugin/back-to-top.md

Lines changed: 13 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -3,3 +3,16 @@
33
> @vuepress/plugin-back-to-top
44
55
This plugin will add a _back to top_ button to your site. The button will be displayed in the bottom right corner of the page when scrolling down. By clicking the button, the page will scroll to the top.
6+
7+
## Styles
8+
9+
You can custom the style of the _back to top_ button via CSS variables:
10+
11+
```css
12+
:root {
13+
/* color */
14+
--back-to-top-color: #3eaf7c;
15+
/* color on mouse hover */
16+
--back-to-top-color-hover: #71cda3;
17+
}
18+
```

docs/zh/reference/plugin/back-to-top.md

Lines changed: 13 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -3,3 +3,16 @@
33
> @vuepress/plugin-back-to-top
44
55
该插件会给你的站点添加一个 _返回顶部_ 按钮。当页面向下滚动时,该按钮会显示在页面的右下角,点击它就会滚动到页面顶部。
6+
7+
## 样式
8+
9+
你可以通过 CSS 变量来自定义 _返回顶部_ 按钮的样式:
10+
11+
```css
12+
:root {
13+
/* 颜色 */
14+
--back-to-top-color: #3eaf7c;
15+
/* 鼠标悬停时的颜色 */
16+
--back-to-top-color-hover: #71cda3;
17+
}
18+
```

0 commit comments

Comments
 (0)