# Dark Admin Theme

**URL:** <https://discourse.pi-hole.net/t/dark-admin-theme/647>\
**Category:** Customizing Pi-hole\
**Created:** [November 21, 2016, 10:14pm UTC](https://discourse.pi-hole.net/t/dark-admin-theme/647 "2016-11-21T22:14:16Z")\
**Posts on this page:** 20\
**Page:** 1

<div class="post-metadata">

**Author:** ![doctormidnight](https://discourse-cdn.pi-hole.net/user_avatar/discourse.pi-hole.net/doctormidnight/32/236_2.png) [@doctormidnight](https://discourse.pi-hole.net/u/doctormidnight)\
**Post date:** [November 21, 2016, 10:14pm UTC](https://discourse.pi-hole.net/t/dark-admin-theme/647/1 "2016-11-21T22:14:16Z")

</div>

Had a little time this morning so I thought I would give my admin dashboard a makeover.

I was originally aiming towards a stylish style so you wouldn't have to do anything with the pi-hole itself. However the graph colors are a little tricky and would probably need a userscript. So I'm thinking the non-destructive approach may need to be thrown out.

Just a little preview since the graphs are ugly at the moment.

 ![](https://discourse.pi-hole.net/uploads/default/original/3X/f/a/fa0b02d3fa489f281cc28f2a2ea1de321919f3ed.png)

UPDATE: Here is some work on the chart

 ![](https://discourse.pi-hole.net/uploads/default/original/3X/a/b/ab92c25df56d256d42ee28a987dcc60e43475608.png)

---

<div class="post-metadata">

**Author:** ![Davey](https://discourse-cdn.pi-hole.net/user_avatar/discourse.pi-hole.net/davey/32/100_2.png) [@Davey](https://discourse.pi-hole.net/u/Davey)\
**Post date:** [November 22, 2016, 3:49pm UTC](https://discourse.pi-hole.net/t/dark-admin-theme/647/2 "2016-11-22T15:49:09Z")

</div>

That looks great, any chance of a release or tutorial on how to change it? 🙂

---

<div class="post-metadata">

**Author:** ![doctormidnight](https://discourse-cdn.pi-hole.net/user_avatar/discourse.pi-hole.net/doctormidnight/32/236_2.png) [@doctormidnight](https://discourse.pi-hole.net/u/doctormidnight)\
**Post date:** [November 22, 2016, 4:13pm UTC](https://discourse.pi-hole.net/t/dark-admin-theme/647/3 "2016-11-22T16:13:49Z")

</div>

Yeah it will be coming in time. I was hoping to just have it be css that you could load using stylish, however the charts are themed in the index.js file.

So now since I have to edit the file anyways I thought I would do a little more than just a re-theming.  
I've been looking for a side-project to start so I may redo the dashboard in it's entirety with Angular 2.

For now though, I'll get this in a complete state and then post an install script.

---

<div class="post-metadata">

**Author:** ![Mcat12](https://discourse-cdn.pi-hole.net/user_avatar/discourse.pi-hole.net/mcat12/32/20_2.png) [@Mcat12](https://discourse.pi-hole.net/u/Mcat12)\
**Post date:** [November 22, 2016, 9:06pm UTC](https://discourse.pi-hole.net/t/dark-admin-theme/647/4 "2016-11-22T21:06:23Z")

</div>

That looks great! I really like dark themes.

---

<div class="post-metadata">

**Author:** ![doctormidnight](https://discourse-cdn.pi-hole.net/user_avatar/discourse.pi-hole.net/doctormidnight/32/236_2.png) [@doctormidnight](https://discourse.pi-hole.net/u/doctormidnight)\
**Post date:** [November 22, 2016, 9:50pm UTC](https://discourse.pi-hole.net/t/dark-admin-theme/647/5 "2016-11-22T21:50:44Z")

</div>

Currently looks like so:

 ![](https://discourse.pi-hole.net/uploads/default/original/3X/1/7/172bf9eb7cd48edd56de6e3fd61d975af47d13a7.png)

---

<div class="post-metadata">

**Author:** ![DanSchaper](https://discourse-cdn.pi-hole.net/user_avatar/discourse.pi-hole.net/danschaper/32/91_2.png) [@DanSchaper](https://discourse.pi-hole.net/u/DanSchaper)\
**Post date:** [November 22, 2016, 10:05pm UTC](https://discourse.pi-hole.net/t/dark-admin-theme/647/6 "2016-11-22T22:05:18Z")

</div>

That's great work, and we'd be interested in collaborating with you on that. Mind shooting me an email at `dan.schaper@pi-hole.net`?

---

<div class="post-metadata">

**Author:** ![doctormidnight](https://discourse-cdn.pi-hole.net/user_avatar/discourse.pi-hole.net/doctormidnight/32/236_2.png) [@doctormidnight](https://discourse.pi-hole.net/u/doctormidnight)\
**Post date:** [November 23, 2016, 1:48am UTC](https://discourse.pi-hole.net/t/dark-admin-theme/647/7 "2016-11-23T01:48:13Z")

</div>

Just finishing up the last couple elements...

> Edit: Made delete button change to red on hover

 ![](https://discourse.pi-hole.net/uploads/default/original/3X/9/2/92ff5a995b908e7a1a45a2d94894d94eaaad55ea.png)

> I'm thinking it would be better without the alternating rows..

 ![](https://discourse.pi-hole.net/uploads/default/original/3X/f/3/f3aef5f69375c4bca661e03a67b2c90e7135cad2.png)

> Edit: Just about done. New flatish logo to tie it together

 ![](https://discourse.pi-hole.net/uploads/default/original/3X/0/3/031a8b9cf054295f4d2eb1d3f7d80a4cdc3d3df8.png)

I'll have to bottle this all up into a script tomorrow if I have time.

---

<div class="post-metadata">

**Author:** ![DanSchaper](https://discourse-cdn.pi-hole.net/user_avatar/discourse.pi-hole.net/danschaper/32/91_2.png) [@DanSchaper](https://discourse.pi-hole.net/u/DanSchaper)\
**Post date:** [November 23, 2016, 3:38am UTC](https://discourse.pi-hole.net/t/dark-admin-theme/647/8 "2016-11-23T03:38:37Z")

</div>

We've got a new logo that gets rid of the "Evil Eye" over on gitlab.pi-hole.net. It will be out with the next release of the web interface.

---

<div class="post-metadata">

**Author:** ![jacob.salmela](https://discourse-cdn.pi-hole.net/user_avatar/discourse.pi-hole.net/jacob.salmela/32/8_2.png) [@jacob.salmela](https://discourse.pi-hole.net/u/jacob.salmela)\
**Post date:** [November 23, 2016, 3:55am UTC](https://discourse.pi-hole.net/t/dark-admin-theme/647/9 "2016-11-23T03:55:30Z")

</div>

I actually kind of like the evil eye in @doctormidnight's rendition...something about it.

---

<div class="post-metadata">

**Author:** ![DanSchaper](https://discourse-cdn.pi-hole.net/user_avatar/discourse.pi-hole.net/danschaper/32/91_2.png) [@DanSchaper](https://discourse.pi-hole.net/u/DanSchaper)\
**Post date:** [November 23, 2016, 3:57am UTC](https://discourse.pi-hole.net/t/dark-admin-theme/647/10 "2016-11-23T03:57:04Z")

</div>

I like the dimensional shading of the berry, do we want to go for another round of logo shuffle? 🙂

I just can't un-see the "Angry Hemorrhoid Logo" now, that comment ruined things for me...

---

<div class="post-metadata">

**Author:** ![jacob.salmela](https://discourse-cdn.pi-hole.net/user_avatar/discourse.pi-hole.net/jacob.salmela/32/8_2.png) [@jacob.salmela](https://discourse.pi-hole.net/u/jacob.salmela)\
**Post date:** [November 23, 2016, 4:00am UTC](https://discourse.pi-hole.net/t/dark-admin-theme/647/11 "2016-11-23T04:00:52Z")

</div>

> [@DanSchaper](#):
>
> I just can't un-see the "Angry Hemorrhoid Logo" now

Haha I know what you mean. I think about that now and then, too. 😆

---

<div class="post-metadata">

**Author:** ![doctormidnight](https://discourse-cdn.pi-hole.net/user_avatar/discourse.pi-hole.net/doctormidnight/32/236_2.png) [@doctormidnight](https://discourse.pi-hole.net/u/doctormidnight)\
**Post date:** [November 23, 2016, 5:11am UTC](https://discourse.pi-hole.net/t/dark-admin-theme/647/12 "2016-11-23T05:11:19Z")

</div>

Now that's all I see, hahaha. I like the new cleaner look, but I also liked the black hole idea so I'll probably make one for fun tomorrow morning, less hemorrhoidy..

---

<div class="post-metadata">

**Author:** ![DanSchaper](https://discourse-cdn.pi-hole.net/user_avatar/discourse.pi-hole.net/danschaper/32/91_2.png) [@DanSchaper](https://discourse.pi-hole.net/u/DanSchaper)\
**Post date:** [November 23, 2016, 5:19am UTC](https://discourse.pi-hole.net/t/dark-admin-theme/647/13 "2016-11-23T05:19:45Z")

</div>

I got totally hammered on our other forum when I did that monstrosity of the `Angry Hemorrhoid`, but I really like the shading and the dimension feel. Please share with what you come up with, I'm not opposed to a shift in the branding.

---

<div class="post-metadata">

**Author:** ![DanSchaper](https://discourse-cdn.pi-hole.net/user_avatar/discourse.pi-hole.net/danschaper/32/91_2.png) [@DanSchaper](https://discourse.pi-hole.net/u/DanSchaper)\
**Post date:** [November 23, 2016, 5:20am UTC](https://discourse.pi-hole.net/t/dark-admin-theme/647/14 "2016-11-23T05:20:50Z")

</div>

And if you need/want any of the AI's they should all be on the asset repo.

---

<div class="post-metadata">

**Author:** ![doctormidnight](https://discourse-cdn.pi-hole.net/user_avatar/discourse.pi-hole.net/doctormidnight/32/236_2.png) [@doctormidnight](https://discourse.pi-hole.net/u/doctormidnight)\
**Post date:** [November 23, 2016, 5:02pm UTC](https://discourse.pi-hole.net/t/dark-admin-theme/647/15 "2016-11-23T17:02:43Z")

</div>

Here is something I threw together this morning, not in love with it overall but I like the concept.  
I'm going to explore the idea a bit when I have time.

 ![](https://discourse.pi-hole.net/uploads/default/original/3X/d/1/d14536422326e4b46b03d5447d51cac44c3e98ca.png)

---

<div class="post-metadata">

**Author:** ![hupo](https://discourse-cdn.pi-hole.net/letter_avatar_proxy/v4/letter/h/cc9497/32.png) [@hupo](https://discourse.pi-hole.net/u/hupo)\
**Post date:** [November 23, 2016, 5:19pm UTC](https://discourse.pi-hole.net/t/dark-admin-theme/647/16 "2016-11-23T17:19:01Z")

</div>

wow thats pretty nice  
well done!

tbh i don't like the current logo either.

---

<div class="post-metadata">

**Author:** ![doctormidnight](https://discourse-cdn.pi-hole.net/user_avatar/discourse.pi-hole.net/doctormidnight/32/236_2.png) [@doctormidnight](https://discourse.pi-hole.net/u/doctormidnight)\
**Post date:** [November 24, 2016, 1:19am UTC](https://discourse.pi-hole.net/t/dark-admin-theme/647/17 "2016-11-24T01:19:32Z")

</div>

Had about 5 minutes to mess with it a little bit. It definitely was the holes perspective among other things. Still something off though...

Not bad for 20 minutes total of work though.

 ![](https://discourse.pi-hole.net/uploads/default/original/3X/9/d/9d819f423dda5e3756bc16f2412ac5248b96b8b6.png)

---

<div class="post-metadata">

**Author:** ![DanSchaper](https://discourse-cdn.pi-hole.net/user_avatar/discourse.pi-hole.net/danschaper/32/91_2.png) [@DanSchaper](https://discourse.pi-hole.net/u/DanSchaper)\
**Post date:** [November 30, 2016, 6:46pm UTC](https://discourse.pi-hole.net/t/dark-admin-theme/647/18 "2016-11-30T18:46:24Z")

</div>

Eager to see more of this!

---

<div class="post-metadata">

**Author:** ![doctormidnight](https://discourse-cdn.pi-hole.net/user_avatar/discourse.pi-hole.net/doctormidnight/32/236_2.png) [@doctormidnight](https://discourse.pi-hole.net/u/doctormidnight)\
**Post date:** [December 1, 2016, 3:17am UTC](https://discourse.pi-hole.net/t/dark-admin-theme/647/19 "2016-12-01T03:17:09Z")

</div>

I've been swamped with work, we have a crazy appletv threading bug that is a phantom. Cant stand iOS these days. I just took over the project so I've been reading way too much code so when I have some time tomorrow I'll be getting back into this for sure.

I also made some progress on my angular frontend, once I get the back end tied in I'll push a new branch.  
Still early stuff, but I spent an afternoon optimizing my Python log parser and it's looking good.

---

<div class="post-metadata">

**Author:** ![DanSchaper](https://discourse-cdn.pi-hole.net/user_avatar/discourse.pi-hole.net/danschaper/32/91_2.png) [@DanSchaper](https://discourse.pi-hole.net/u/DanSchaper)\
**Post date:** [December 1, 2016, 6:32am UTC](https://discourse.pi-hole.net/t/dark-admin-theme/647/20 "2016-12-01T06:32:14Z")

</div>

Great to hear, looking forward to it!

Edit (The progress that is, not the iOS overload...)

[Next page](https://discourse.pi-hole.net/t/dark-admin-theme/647.md?page=2)