Dark-GitLab

Opinionated, customizable, dark and light mode implementation for GitLab and self-hosted GitLab instances.

Check dark-gitlab/milestones/1 to see the roadmap to v1.0.

Preview image shows v1.0.0 with default colors, Inter as the UI font, and Iosevka as the mono font on 1920x1080 resolution.

Features

This is why you should consider using Dark-GitLab!

• Fully customizable color-scheme through Stylus configuration menu
  • Supports dark and light color-schemes, and works great with dark-switcher.
• Custom regex and included support for well-known public GitLab instances
  • Easy to add your private GitLab instance.
    • ⚠ Modifying the code will prevent auto-update from working.
    • See #99 for more info.
  • Found a public instance that’s not already on the list? Make a MR!
• Custom image opacity in Markdown areas
• Custom rounded corners for avatars
• Custom UI/code/emoji fonts

Installation

There are a few ways to install this userstyle.

With Stylus

The recommended method; allows for full customization of custom features.

1. Install Stylus
2. Click on the install link or install badge.

   Installs from gitlab.user.styl file using this link.

   

3. Confirm the installation
4. Continue to Initial configuration

With xStyle, Cascadia, etc

This is for userstyle managers that don’t support stylus-lang. It doesn’t offer the customizability that the recommended method offers.

1. Install your userstyle manager of choice
2. Click on the install link

   Installs from gitlab.user.css file using this link.

3. Confirm the installation
4. Continue to Initial configuration

With Stylish through userstyles.org (USo)

I don’t recommended using this method because of the following reasons:

1. Stylish is spyware and USo is abandoned by the same developers
2. Only supported due to it being the largest repository of userstyles
3. Updated manually, is very likely outdated, and only has core functionality.

Initial configuration

This step is mandatory if you want to tune settings to your liking, or if you’ve changed GitLab’s default preferences.

Dark-GitLab works best with default settings as it tries to offer seamless experience across all GitLab instances that you might stumble upon on the web.

The following preferences need to be set on instances you’re logged in:

1. Set syntax highlighting theme set to white
2. Set navigation theme to indigo

To customize colors and/or other features, follow these instructions:

• Click on Stylus icon on your toolbar then on the configure button (gear icon) and you’ll be able to configure everything from within the popup. Same menu can be opened from the Manage page in Stylus.
• Additionally, install dark-switcher if you’d like to quickly switch between various pre-defined color-schemes.

FAQ

This section covers frequently asked questions.

Why are there so many warnings and/or errors?

The linter that Stylus is using doesn’t understand Stylus-lang syntax. Disable the linter and all warnings will be gone. More info can be found here: GitHub/openstyles/stylus/880

How to add custom domains?

Click on Stylus icon on your toolbar then on the edit button (pen icon) to open it in the editor. When you get there, simply press on the + button to add a new domain.

• ⚠ Modifying the code will prevent auto-update from working.
• See #99 for more info.

How to exclude a domain?

Click on Stylus icon on your toolbar then on the action menu button (three dots icon) and choose domain/URL exclusion you want to use.

How to customize colors and/or other options?

Click on Stylus icon on your toolbar then on the configure button (gear icon) and you’ll be able to configure everything from within the popup. Same menu can also be accessed from the Manage page in Stylus.

Contributing

Any contribution is greatly appreciated.

If you really like this project and would like to tip me for my work, then you can:

• Buy me a coffee over at ko-fi
• Support me over at LiberaPay

License

Code released under the MIT license.