VuePress Github Pages
Make sure that you have NodeJS and NPM or Yarn installed.
Start by forking or downloading this repository. If downloaded, extract the contents of the archive in a folder and navigate to that folder in your preferred terminal. Then:
npm run start
npm run build
README.md file in the root serves the purpose of
If you wish to create new pages, you can do so by adding new
.md files in the root.
VuePress builds your static website in the
/docs folder which is set to be used by Github Pages in the repository settings.
You can control the base dir of your site in the
See this page served via Gitlab Pages on https://scriptex.js.org/github-pages-vuepress/
Vuepress uses Stylus. It comes with default theme which can be easily overwritten.
Just place your styles in the
override.styl file in the
Here are the default theme colors:
$accentColor = #3eaf7c $textColor = #2c3e50 $borderColor = #eaecef $codeBgColor = #282c34
Here are the colors and settings for a Material Light theme:
$accentColor = #009688 $textColor = #212121 $borderColor = #bdbdbd $codeBgColor = #333 $bgColor = #fff html, body, .navbar, .sidebar, .theme-container .navbar, .theme-container .sidebar background-color $bgColor .theme-container .search-box input color $codeBgColor .theme-container .search-box .suggestion a color $accentColor .theme-container .content code color $bgColor background-color $codeBgColor
Here are the color for a Material Dark theme (used in my personal website):
$accentColor = #ef4c23 $textColor = #fff $borderColor = #bdbdbd $codeBgColor = #000 $bgColor = #263238 html, body, .navbar, .sidebar, .theme-container .navbar, .theme-container .sidebar background-color $bgColor .theme-container .search-box input color: $codeBgColor .theme-container .search-box .suggestion a color: $accentColor .theme-container .content code background-color $codeBgColor