OPNsense Forum
English Forums => Development and Code Review => Topic started by: marjohn56 on January 16, 2018, 12:02:40 pm
-
Well I like it. :)
-
Looks good. But all those white separation lines could be a bit more grey-ish, perhaps?
To make the white stand out less more.
-
It's pretty dark... hehe
Thanks for doing this! A plugin for this was requested a couple of times already. <3
Cheers,
Franco
-
@marjohn56 looks good but I would suggest to use a lighter green in the status column for a better contrast.
-
It's getting there, I have toned down the white and changed the bar backgrounds from white to darker grey.
Yes, the status greens do need to be changed. I'll do that later tonight and post a new snapshot.
-
I'm really liking what I see! Keep it up!
-
Very nice, hope to see this on my box soon :)
-
Just to keep you updated.... Toned down the whites and have ALMOST finished the d3 stuff, just a couple of items I'm struggling to find...
-
Good improvement.
-
OK, I think it's done. However there is an issue.
There's a couple of changes I had to make that are not actually in the themes folder, this may be an oversight when the GUI was created and the colours are hard coded into other files. As a result of this I cannot just post the theme.
What I suggest until that is resolved, if anyone wants to try it is that I zip up what's needed and post it here. I'll include instructions as to what needs to be replaced. But first, I need to check that this will not break something between different versions of Opnsense.
Watch this space later today.
-
There is no problem with having a -devel plugin for others to try anyway and we mop up the rest in 18.1.x and then release the plugin finally?
Cheers,
Franco
-
OK, where are the instructions for creating a plugin? :)
The offending items are
gateways.widget.php
status_gateways.php
jquery.tokenize.css
-
OK found it, I'll see if I can create something. :)
Best users backup those three files first though.
-
Please don't overwrite these files from the plugin, it won't work ;)
Looks like low priority items to fix the theme. There will likely be more in the static pages. Having the theme wrapped as a plugin will make it easier to flush those as anyone can confirm what you're seeing.
Cheers,
Franco
-
OK, I'll blame you. :P
Might take a while, I thought my PC was fast but it's taking quite a while to compile all the tools!
-
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 ...?
-
Post GitHub branch URL or do a PR against plugins.git for inclusion.
-
OK..
-
PR posted.
-
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!
-
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.
-
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.
-
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...
-
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.
-
hehe I will :P But 18.1 out is indeed more important then fancy colours.
fun...
-
:) 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.
-
Several PRs later, the change has been landed. :)
-
Yes Yes... Github confuses me. Especially at daft o'clock when I should be asleep. :P
-
Update PR just issued. Fixes CPU tooltip issue and many others. Need feedback on this as there were a LOT of corrections.
Just wait for Franco to do his bit...
-
I'm already using it ;D
Thank you for your work!
-
Moved the topic to this section as it fits better to "Development and Code Review". New Plugins should be discussed here because "General Discussion" is for discussing network setups, configuration etc. while this section is for discussing new features, code, and new plugins.
-
One thing I need to mention is that SCSS should be updated as well and CSS compiled from it, it could create a nightmare later on if that's not done prior to a real release when the original theme changes and requires updates to the dark theme...
Cheers,
Franco
-
OK, I have re-done the whole thing but this time used the scss and less files and then compiled them to create the new theme. I'll issue a PR shortly and see what you think.
-
Yay, thanks. I'm wrapping up plugins for 18.1 today so we can get that into the 18.1 build as a development package. \o/
-
Still some oddities there, but I'll issue fixes as I find and resolve them.
-
With a bit of a push here and there I've fixed all of the external theme issues except the gateways status bits. The fixes may not make it to 18.1 as they involve moving most of the existing *.css files to the opnsense theme folder and altering a couple of files to correct the paths. As a result it needs to be thoroughly checked before I can issue a PR.
Looking good though.
-
Very nice.
With the changes you need to make, does that help the default theme too?
-
What's broken in the default theme? ( Apart from the colour scheme :P )
-
It looks awesome! I like it a lot!
-
What's broken in the default theme? ( Apart from the colour scheme :P )
Maybe I understood it wrong, but didn't you change/move parts of the theme files to places where they actually should be? And shouldn't the default theme be modified in that way too?
That's what I mean with helping the default theme too.
-
I have, but that has not made it through yet.
You are correct in that there is an issue with some of the CSS files in that they live outside of the themes folder. The PR I have issued in core resolves that and so both rebellion and opnsense themes work properly. I think Franco is waiting for Ad to take a look at it - as whilst working in that area there are other bits that could do with changing.
-
It looks awesome! I like it a lot!
Thanks... appreciated. :)
-
Alright, good that you and other are looking at the complete picture here.
-
Awesome work Martin
Just one word BLUE :-)
-
Blue is cool.🐦
-
Needs the widget-sort-handle class.
Is having complete independent css for each theme the way to go? Seems like extra maintenance for unrelated layout stuff rather than just theme specific styling overrides?
-
I would say mostly yes. Drop-in independence at a certain level of maintenance cost.
The changes are usually few. The work both of you do will set standards for a couple of years even if that means a little more work now for all of us. :)
Cheers,
Franco
-
Anyone doing a fresh install of 18.1 or above you will still not have the rebellion theme, although it appears that most of the background fixes, if not all, are now in place.
If you wish to try the theme it can be manually installed using the instructions Franco gave earlier in this thread.
# opnsense-code plugins
# cd /usr/plugins/misc/theme-rebellion
# make upgrade
For those of you who have already got it, it's an idea to update it if you have not done so as there are a few changes.
-
I've been waiting for 18.1 to test this theme and now I have - I like it, a lot. Thanks for your work on the theme. :)
-
I've been waiting for 18.1 to test this theme and now I have - I like it, a lot. Thanks for your work on the theme. :)
Same here :)
It got updated with the version 18.1.1, do I need to take further actions?
-
I've been waiting for 18.1 to test this theme and now I have - I like it, a lot. Thanks for your work on the theme. :)
Same here :)
It got updated with the version 18.1.1, do I need to take further actions?
Not as far as I know, it should be the same as the one you have but I don't suppose it would do any harm to re-install it.
-
Can I get some feedback on the following. On the dashboard, my testers are reporting the CPU graph text as being black. On a fresh install of 18.1.1 and installing rebellion from the shell I am seeing white.
What are you all seeing?
-
On my clean install of the theme the CPU test is white, the only colour is blue for the CPU usage graph obviously orange for the update 'check' and the bar graphs at the bottom and all the other text is white.
-
Can I get some feedback on the following. On the dashboard, my testers are reporting the CPU graph text as being black. On a fresh install of 18.1.1 and installing rebellion from the shell I am seeing white.
What are you all seeing?
After the update to 18.1.1 and even after reexecuting the commands to upgrade the theme and switching to standard and back, the cpu graph text is still black
-
Which suggests to me that something is not updating when moving from 18.1 or RC to 18.1.1 but works fine on a fresh install of 18.1 to 18.1.1
Baffled, but its not the theme itself as I have deleted my themes rebellion folder, re-installed the theme and it's whilte :)
-
I tried it in my test vm (where I didn't installed the theme yet), updated to 18.1.1 and installed the theme, graph text is black too..
Anyway, beside some minor lookings I love it :)
-
was that an rc install update or a clean 18.1?
if poss, can u do a quick fresh install of 18.1 to 18.1.1 install rebellion and see what you get?
-
was that an rc install update or a clean 18.1?
if poss, can u do a quick fresh install of 18.1 to 18.1.1 install rebellion and see what you get?
Was an rc install if I remember right, I can do that :)
-
Thanks muchly.
-
Thanks muchly.
Freshly installed 18.1 VM, updated to 18.1.1 and installed theme, still black text on cpu graph..
Edit:
I imported the configuration from the other VM, resettimg to factory defaults now and retrying..
-
This is daft :)
I'll look at after lunch and I'll do another fresh install.
-
ok... still works for me.
take a look at /usr/local/opnsense/www/themes/rebellion/build/css/nv.d3.css
Line 276 should be lightgrey
is it?
-
ok... still works for me.
take a look at /usr/local/opnsense/www/themes/rebellion/build/css/nv.d3.css
Line 276 should be lightgrey
is it?
It is indeed..
-
Note that 18.1.1 does not have the theme-or-not file selector yet.
Once the plugin was installed manually, the firmware update will take care of updating it if a new version was published. Rerunning the commands will fetch the latest code from git and install it, too. Both work interchangeably, with the exception of the "make upgrade" forcefully upgrading it every time (but the latest version so that doesn't matter).
There is a slight complication when the theme is released as a stable version, although it won't matter much: there will be two packages, os-theme-rebellion and os-theme-rebellion-devel. Users of the development version can see and use both, mainly for staging reasons of larger changes the -devel version could differ... Users of the production release will only see os-theme-rebellion, but can use either version safely.
;D
Cheers,
Franco
-
OK, so why does mine show white text and not black and the same for pheonix? ???
-
So who's on opnsense-devel (18.7.a_11) and who is on opnsense (18.1.1) ?
-
Ah... I switched to devel branch then back again to 18.1.1, that would explain things. 8)
-
Not entirely, behaviour should be consistent as there is no wiggle-room for leaking the wrong css, unless the browsers tries to outsmart us.
-
Just took a look in the browser (vivaldi) with developer tools, fill isn't populated in .nvd3 text (adding it manually changes the color)
Same thing in firefox..
-
Installing the theme directly by ”pgk install os-theme-rebellion-devel" results in white cpu usage text :)
-
Installing the theme directly by ”pgk install os-theme-rebellion-devel" results in white cpu usage text :)
Ooerr...that's definitely one for Franco then. :)
-
Installing the theme directly by ”pgk install os-theme-rebellion-devel" results in white cpu usage text :)
Ooerr...that's definitely one for Franco then. :)
Noticed it after reinstallation and also removed the theme on test vm to replace it with the mentioned command, the fill css property is now populated :)
-
after upgrading to 18.1.2_2 from 18.1.1_1 mine now white as well
No idea why but eh its working
-
I have installed it on 18.1.6, but nothing changes:
***GOT REQUEST TO INSTALL: os-theme-rebellion***
Updating OPNsense repository catalogue...
OPNsense repository is up to date.
All repositories are up to date.
Checking integrity... done (0 conflicting)
The following 1 package(s) will be affected (of 0 checked):
New packages to be INSTALLED:
os-theme-rebellion: 1.0
Number of packages to be installed: 1
The process will require 5 MiB more space.
[1/1] Installing os-theme-rebellion-1.0...
[1/1] Extracting os-theme-rebellion-1.0: .......... done
Checking integrity... done (0 conflicting)
Nothing to do.
***DONE***
is there something i need to change or configure?
-
Have you selected the theme in System->Settings->General ?
-
Have you selected the theme in System->Settings->General ?
No... I couldn't find it. But now it works, thanks.
-
Thanks for rebellion really like this dark theme.
I have a request: can the background for 'OTP QR code' found on the users page be made a color scanable by phones?
If I want to scan a new QR code I first have change to the default theme, scan the QR code, change back to rebellion.
Thanks mark
-
I'll see what I can do. It may require the QR image to have a white border around it.
-
Thanks for your reply marjohn56 very kind of you to look into it.
It may be so yes, I have done a little research and found a pdf saying just that, it's called 'Quiet Zone' see 7.3 on https://web.archive.org/web/20110812190511/http://raidenii.net/files/datasheets/misc/qr_code.pdf (https://web.archive.org/web/20110812190511/http://raidenii.net/files/datasheets/misc/qr_code.pdf)
-
I'll put a shout out for @franco to look at this thread, not sure who authored that bit of code.
I've raised an issue for this on Gihub #2430
-
Oh well it's done with the best of intentions I guess and if there would not have been a dark theme in the first place no one would have noticed anyway :P
-
This is true... :)
I suspect it isn't a major problem and I could go hunt for it and probably fix it, but the original author will know where to look straight away.
-
No stress until then I'm okay the way it is ;D
But I dug a little deeper into that pfd, section 10.1 dimensions says:
minimum quiet zone: equal to 4X on all four sides
Not knowing exactly how big that is, but it's a starter, you should probably read it yourself as there is more to it.
-
Yes, I read it before I raised the issue on Github... It'll be fixed before you know it. :)
-
It's fixed, will be pulled into a release shortly, thanks to Ad for fixing it so quickly.
https://github.com/opnsense/core/issues/2430 (https://github.com/opnsense/core/issues/2430)
What's that then, less than twelve hours from report to fix, and that includes sleep time too. :)
Opnsense is good isn't it. 8)
-
Or patch directly from the console, but don't forget to clear the browser cache. ;)
# opnsense-patch 2f247f2
also see
https://github.com/opnsense/core/commit/2f247f2
Cheers,
Franco
-
Hello friends
1. do I have to do anything to correct the problem in tukan and cicada?
by the way...
2. The scheduler fixes are integrated in all three themes, but the correction of fabian is not yet available in the current version.
can this be ?
greetings rené
-
Hi René,
Yes, Fabians schedule change is waiting for merge in 18.1.10 due to the volume of the change.
Cheers,
Franco
-
Thank you team, Patched and working ;D
@marjohn56, this makes me like Opnsense even more than I already did, thanks for the quick response very 8)
-
:-)
-
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
New to OPNsense. Came from the other side. Had an issue that appears to not be present with OPNsense. Missed the dark theme.
So, thank you, thank you, thank you, for this.
-
you're welcome, we missed them too when we left pf.
-
thx for the nice theme.
Can you maybe remove the background-color style in the ipsec widget. (i think it belongs to the widget and not to the theme, but you possibly know where to look for as it should be colored by css)
<div id="ipsec-Overview" class="ipsec-tab-content" style="display:block;background-color:#EEEEEE;">
and also change the font color for ul.tokens-container to a darker color (its almost not readable)
-
Hi... I'll raise an issue on that as the widget is not part of the theme, but should pick up the colour from the css file.
As for the second one, where do you see that?
-
its the ip selection, for example in
Services -> Web Proxy -> Administration: Ignore hosts in access.log / Use alternate DNS-servers
or
Services -> BIND: Listen IPs .....
EDIT: only the text when you enter it
-
OK, second issue is fixed, that WAS part of the theme. :)
Will be in a release shortly or you can patch it with #8a06937
-
thank you marjohn
works
-
thank you marjohn
works
OK, we've all been busy this morning. Fabian has fixed the widget and I've done a further update to rebellion. Here's the patch ID's.
Widget fix is #64bf125
Rebellion is #a48f757
Note, the Widget fix may not be in the next set of releases due to other themes needing to catch up, so you might need to apply the patch for the widget in future updates. I'll try and keep you informed on that one.