Is there a way to reduce the width of the left panel of Vuepress?

user_1553014 0
Viewed 785

I think that the left-pane in Vuepress is too wide. Wondering if there are any settings that would reduce the width of the left-hand panel?

vuepress
2 Answers

Add a file override.styl to the .vuepress folder, and add the following line to set side panel width (default is 20rem)

$sidebarWidth = 10rem

There's a bunch of other stuff that can go in here as well. To explore the options, use the command

vuepress eject ejected

then navigate to /ejected/.vuepress/theme/styles/ and take a look at what style tags are used in the base project.

Be sure to remove the ejected files from the project if you want to update VuePress in the future.

user_47162450

Just in case anyone comes across this question using Vuepress >= 1. In the new version of Vuepress, override.styl is deprecated and this is now done by creating a folder called styles/ in .vuepress/ and creating a file called palette.styl. You can then use the command from Richard's answer.

user_63176080
Related