dark theme first look

Started by marjohn56, January 16, 2018, 12:02:40 PM

Previous topic - Next topic
You can just use the plugins.git on any OPNsense..

# opnsense-code plugins

Create a new directory:

# cd /usr/plugins
# mkdir -p themes/theme-dark/src

and populate src/ with the file structure that is used in core.git, find a Makefile in another plugin, try "make upgrade" should install the plugin ok.... at the end PR and done :)

Took me a while to find out I needed to cd to the new directory... THEN the make worked.

OK, it works, now what, post it here or ...?
OPNsense 24.7 - Qotom Q355G4 - ISP - Squirrel 1Gbps.

Team Rebellion Member

Post GitHub branch URL or do a PR against plugins.git for inclusion.

OK..
OPNsense 24.7 - Qotom Q355G4 - ISP - Squirrel 1Gbps.

Team Rebellion Member

PR posted.
OPNsense 24.7 - Qotom Q355G4 - ISP - Squirrel 1Gbps.

Team Rebellion Member

January 17, 2018, 03:57:26 PM #20 Last Edit: January 17, 2018, 04:06:03 PM by NilsS
can't you use !important in css to overwrite the color attributes?

Nice work btw.

No, for example the widget issue the colours are defined within the widget php file, I cannot change them using the *.css.

The problem with the pie charts and other objects that use nv.d3 is there is a css file for those, but it lies outside the themes folder that's also the same issue with jquery.tokenize.css.

However, if you know how of a way to do it I'm always open to learning new tricks. Until last week I'd never touched a css file!
OPNsense 24.7 - Qotom Q355G4 - ISP - Squirrel 1Gbps.

Team Rebellion Member

No magic please, since is the first theme that is not branding colours only it will force cleanups for the benefit of future themes and lean styling everywhere.

I added minor review comments. So far so good.  8)


Cheers,
Franco

The first development version has been merged. :)

If anyone wants to try:

# opnsense-code plugins
# cd /usr/plugins/misc/theme-rebellion
# make upgrade

Go to System: Settings: General, select "rebellion" and save.


Cheers,
Franco
Modify message

Tried it, and like it. But I have three comments:

1: In the screenshot you can kinda see I have my mouse cursor in the CPU graph.
The balloon is very dark, but perhaps that is not a problem when it actually shows the percentage ;-)
Looks like that text is still in black and therefore barely visible?

2: I have a feeling that the lines separating the lighter en darker coloured bars is unnecessary in the dark theme.
If you look on the left side, the menu doesn't have the lines either, and that looks much more calm to the eyes.
In my opinion of course.

I would like to see a version that doesn't have those lines.

3: Not too fond on the blue buttons. I can understand the green, and red if not running, but perhaps in style with the OPNsense logo, that orange colour would suite better?
It's not bright, so I don't think it will distract too much.


Other then that, I love it.
Hobbyist at home, sysadmin at work. Sometimes the first is mixed with the second.

Thanks weust.

I know about the cpu graph, it's one of the issues I posted about in an earlier message and Franco does not wan't me attempting to overwrite stuff that's not part of the theme. :)

I quite liked the blue buttons ;D, but as we move forward with it perhaps we can have different variations.

It's a first shot, there are a couple of other dodgy colours, but we need to resolve getting all of the other scripts to follow the css AND/or get the dv css to follow or get it moved to the themes folder.
OPNsense 24.7 - Qotom Q355G4 - ISP - Squirrel 1Gbps.

Team Rebellion Member

Hmm, so we need to kick Franco harder then ;-)

Variations is nice, but I think it would be a bad thing to have too many variations.
I mean, it's a firewall after all...
Hobbyist at home, sysadmin at work. Sometimes the first is mixed with the second.

YOU can kick Franco if you wish, getting a stable 18.1 delivered is more important than the theme at the moment, but it allows him to find out where there are issues.

You'll find many of the issues will be gone once the CSS files are all in the same place.  We've just found another bunch that are related to a CSS file that's not in the themes folder.

OPNsense 24.7 - Qotom Q355G4 - ISP - Squirrel 1Gbps.

Team Rebellion Member

hehe I will :P But 18.1 out is indeed more important then fancy colours.

fun...
Hobbyist at home, sysadmin at work. Sometimes the first is mixed with the second.

:) I've just posted a new PR when Franco has time to pull it. It fixes the help text plus a couple of other slight colour changes.
OPNsense 24.7 - Qotom Q355G4 - ISP - Squirrel 1Gbps.

Team Rebellion Member