corecoding
Showing net up/down with one label
Has this issue been covered in the Wiki?
- [X] I have read the Wiki and my issue is not covered.
Is there an existing issue reported already?
- [X] I have searched the existing issues, it does not exist.
Describe the new feature you would like
Hi there,
Thanks for your work on this extension, I think it is easily the best resource monitor out there. I was wondering if it is possible to show both the upload and download speeds together under one icon label. For instance, something like this:
[network icon] ↑ 12 MB/s ↓ 13 B/s or simply ↑↓ 12MB/s | 13 B/s
I have tried to make it work myself, but I am not super familiar with JS and not having much luck.
I have also done some work messing with the styling as in the attached screenshot. I also have another version that is just a solid color block for each sensor. It involved a little bit of fiddling with the stylesheet as well as a slight modification of the extension file. I am not super familiar with how to use Github, but I will learn how to suggest a merge if you are OK with this.
It looks like you have colors, separators, and did you change some of the icons too?
I would love to see a PR for these changes!
If you don't know how to create a PR, you can also link me to your repo housing these changes. Or, if you have no repo, you can zip up your directory and attach it here.
I changed a few lines in extension.js and I have a few half-finished variants for style. Apologies, I'm not much of a programmer. The CSS is very hacky, it relies on the height of the panel being 28px exactly to create the bottom border effect.
I have created a branch here and pushed your code. It is pretty cool! It will need some more tweaks before it can be merged, as you said the height of the panel has to be perfect for the underlines to show.
I am curious though, what do others think about the colors?
There is almost certainly a better way to do it, but I just started using CSS so I am unfamiliar with conventions. There is also a way to list colors as global variables at the top of the .css file that I have in my current setup to facilitate easy swapping. I can set up a list of themes, like Nord, Catppuccin, Dracula, etc, as an alternative to the default top bar panel item color. I don't know if you tried the blocks version of the .css file, it is somewhat more portable in that it doesn't depend on bar size. Apologies on not being more prompt, I'm in grad school and it's a busy time for me right now.