mdh34 / elementary-indicators

An unofficial guide to restore indicator functionality on elementary OS

Geek Repo:Geek Repo

Github PK Tool:Github PK Tool

Big gap between icons

junocomp opened this issue · comments

I've been trying to find a solution to this for a while but I can't seem to find one.

In Loki the icons are well spaced

loki_a

In Juno, the legacy icons have a big gap in between icons.

screenshot from 2018-08-10 16 29 34

Does anyone know how to fix it?

commented

Hi,

Try setting the padding to '0 2px' in your theme -> apps.css

In my case I use https://github.com/surajmandalcell/elementary-x :
/usr/share/themes/elementary-x/gtk-3.22/apps.css

.composited-indicator {
    padding: 0 2px;
}

Then set your theme to something else and then back again to make sure the changes are refreshed(or restart/log out)

screenshot from 2018-08-13 22-27-36

@icex You are a genius, thank you!

@icex is there a way to add the apps.css to ~./themes? I am afraid that every update elementary-themes gets will break go back to the default settings.

commented

I think you can copy /usr/share/themes/elementary to .themes/someothername , change the apps.css, then set the theme name to someothername

This could alternatively be fixed by shipping some css within the wingpanel indicator itself

This could alternatively be fixed by shipping some css within the wingpanel indicator itself

Yeah, please do so

However, editing .composited-indicator padding changes all indicators padding, including system ones which are fine. Can we edit only Ayatana indicators padding?

This could alternatively be fixed by shipping some css within the wingpanel indicator itself

Yeah, please do so

However, editing .composited-indicator padding changes all indicators padding, including system ones which are fine. Can we edit only Ayatana indicators padding?

Ayatna indicators having the same default padding. That would be great

Not worked to me...

Okay, I tried the community fork, and builded by myself, here is the git, and if you don't want build:
1 - Install the wingpanel indicator .deb here (the same deb in the link of this git)
2 - Download libayatana_compatibility.so.zip
3 - Go To (with sudo) /usr/lib/x86_64-linux-gnu/wingpanel/
4 - Backup your libayatana_compatibility.so
5 - Replace the libayatana_compatibility.so with the zipped one
6 - Reboot

Before:
image
After:
image

PS: I'm using the JUNO

Thank you @marcussacana for this fix, especially because it seems that the wingpanel from the version 2.2.6 is completely ignoring .composited-indicator selector.

Would you though reconsider leaving the size of ayatana indicator icons as they were before? I've noticed that they are smaller now but the height of the wingpanel is the same so there is no actual gain for having them smaller.

Once again, thank you for your time and effort with this fix.

Cheers.

@WebShapedBiz As you asked, I did a build that don't change the icon size, here:
libayatana_compatibility.so.zip
I think this time I don't need say how you install it.

Before:
image
After:
image

Just awesome @marcussacana, you're golden.

Hi,

Try setting the padding to '0 2px' in your theme -> apps.css

In my case I use https://github.com/surajmandalcell/elementary-x :
/usr/share/themes/elementary-x/gtk-3.22/apps.css

.composited-indicator {
    padding: 0 2px;
}

Then set your theme to something else and then back again to make sure the changes are refreshed(or restart/log out)

screenshot from 2018-08-13 22-27-36

Now it does not work. Maybe something has changed during the upgrade.

@mobdiz try my method

@mobdiz try my method

@marcussacana Thank you very much. Helped. It will not break after the upgrade?

we never know what a update will break.

Guys, isn't related with this issue, but since is a little dead the wingpanel community I want notify everyone about more one small trick, this time to make the wingpanel submenu works, I tested with SVP4 menu
https://github.com/eth-p/wingpanel-indicator-ayatana/issues/11#issuecomment-558350032

For what it's worth, creating a ~/.config/gtk-3.0/gtk.css with these contents worked fine for me on an up-to-date JunoHera system:

/* source: https://github.com/mdh34/elementary-indicators/issues/1 */
.composited-indicator {
    padding: 0 2px;
}

I'll try to remember to update this comment some future update breaks that, but for now, this is a straightforward enough solution that doesn't require re-editing the app.css associated with the theme (as root) every time the distro package gets updated and clobbers your CSS tweaks.

I do a comparation between @marcussacana method and @ernstki method.

@marcussacana
Solution for indicator icons big gaped

@ernstki
Screenshot from 2020-01-08 20-16-05ed

Both reduce the gap. BUT, @marcussacana method has a maintain icon size (that yellow sticky note icon), and @ernstki method not maintain the size (it look big, not the same as the other). Maybe you can try to add more content inside gtk.css ? @ernstki