Homepage
Customization
Customize Bookmarks
Bookmarks are now held in the bookmarks.js file for easy updating. bookmarks is an array of objects with a title and links property. The title defines what the header of the "bookmark section" box will be. link is an array of link objects each with a name and a url to link to.
The way the site is currently styled bookmarks should always have a length of
4if you want to have more sections you need to change thewidthproperty of the css classbookmark-set
Customize Search Engine
You can change the search engine used by the search overlay by updating the url value stored in the searchUrl var in index.html to the correct string for your engine.
Examples:
- DuckDuckGo:
https://duckduckgo.com/?q= - Bing:
https://www.bing.com/search?q=
Customize Styling
Styles are handled through CSS variables. To update the colors you just need to change the variable definitions defined in :root.
| Variable | default | description |
|---|---|---|
--bg |
#5f4b8b |
Defines the body background color |
--fg |
#ffffff |
Defines the primary foreground (text) color for clock, weather, and titles |
--secondaryFg |
#b3b3b3 |
Defines the foreground (text) color for links |
--containerBg |
#272727 |
Defines the background color of the boxes |
--searchBg |
--containerBg |
Defines the background color of the search overlay |
--scrollbarColor |
#3f3f3f |
Defines the color of the custom scrollbars |
--fontFamily |
"Roboto Mono", monospace |
Defines the font used. To change to a custom font you will also have to import that font from whatever source is available |