Jump to content
Sign in to follow this  
LivingL393nd

Is there a Dark theme for the web interface?

Recommended Posts

You can start by modifying the theme by unminifying the bootstrap.min.css and main.css. Look at the pineapple-theme repo as an example.

Share this post


Link to post
Share on other sites

Thanks mate! So if I want to modify all the text including drop-downs, pretty much every text in this type of blue ( #306EFF ) should I replace all the #c6c6c6 values with #306EFF like how I have mine here? This is the main.css.. I tried looking at bootstrap.css but not sure which color values to change. Any help would be much appreciated ?

Also once I'm done modifying the colours on the github file would I have to send a request to the owner of the file (yourself) to approve the changes since not sure it won't let me write to the file? So basically it creates a fork project with my changes and you get to approve it?

image.png.6a1a6324096a1aea5a186c607eff168f.png

Share this post


Link to post
Share on other sites

What I would do is this:

  • Find an element with the colour you want to change on a page. As an example I'll use an orange button.
  • Right click on the element with the colour and select "Inspect Element", then find the background colour of the object (I'll use the classic orange #FFA500 as orange).
  • Go to the unminified CSS file and do a 'Find and Replace' using Notepad++ or something and put #FFA500 as the 'Find' and 'Replace' it with whatever hex you would like. I think you wanted #306EFF, so use that.
  • Save the file and it should be good to go.

If you find there are variations of the colour you replaced (e.g. a darker orange for highlights or something) then just repeat the above process.

That's what I would do. It's quite time consuming sometimes, though.

Edited by Dave-ee Jones

Share this post


Link to post
Share on other sites

As @Dave-ee Jones said you can inspect element and change that elements' color and other properties. You can take advantage of newer versions of Chrome using local override for easier theme editing.

If you'd like to contribute a theme you can fork the repository then apply your changes to your forked repository, then you can submit a pull request after.

Share this post


Link to post
Share on other sites

Join the conversation

You can post now and register later. If you have an account, sign in now to post with your account.

Guest
Reply to this topic...

×   Pasted as rich text.   Paste as plain text instead

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   Your previous content has been restored.   Clear editor

×   You cannot paste images directly. Upload or insert images from URL.

Loading...
Sign in to follow this  

  • Recently Browsing   0 members

    No registered users viewing this page.

×
×
  • Create New...