style improvements for spin buttons

[walterbender]

I am not sure at what point this occurred, but as seen in the attached image, the font colors used in spin buttons (white on light gray) are very difficult to read. Presumably this can be fixed in the css style for spin buttons:

https://github.com/sugarlabs/sugar-artwork/blob/master/gtk3/theme/gtk-widgets.css.em#L181

Also, the white border when a spinner is selected is really ugly. Something more subtle would be more in keeping with the toolkit.

[sanatankc]

@walterbender, is there any way to reload styles? I made changes in /home/user/sugar-artwork but it doesn't seem to reflect.

[walterbender]

Hmm. I've usually done this sort of thing using sugar-build, so the changes are applied each time. Maybe @quozl would know?

[quozl]

As the styles are additions to GTK+, and do not cover all attributes, any underlying change to GTK+ defaults breaks our themes. Bit rot.

You can test changes to sugar-artwork by running make and make install, or by learning the exact steps done by those commands and reproducing them by hand. sugar-build when it worked repeated both steps every time, but sugar-build isn't working well at the moment.

[sanatankc]

I have added PR #101, though I couldn't able to test them locally, I ran autogen.sh looks like some dependencies are missing in my case. I am using sugar in Ubuntu in a Virtualbox.

[i5o]

@sanatankc if you are in Ubuntu >= 17.04 you may want to use sugar-build using my branch https://github.com/i5o/sugar-build branch ubuntu

you need to install nodejs first following: https://www.metachris.com/2017/01/how-to-install-nodejs-7-on-ubuntu-and-centos/

then

./osbuild pull mkdir -p build/out/install/etc/gconf/ ./osbuild build

this one may fail, just run it few times :) (trust me, it works)

and then ./osbuild run

[i5o]

btw here's the before patch: http://people.sugarlabs.org/ignacio/pi/sx9xhij052.png

after patch applied: http://people.sugarlabs.org/ignacio/pi/qfZ1u2y9Q8.png

[sanatankc]

@i5o Thanks. I will install sugar-build and then try to solve this. Unsurprisingly, patch didn't worked, as i couldn't able to test it and was just making blind changes.

[quozl]

Possibly a typo in e516c90.

[quozl]

couldn't able to test them locally, I ran autogen.sh looks like some dependencies are missing in my case. I am using sugar in Ubuntu in a Virtualbox.

See how to resolve build dependencies on Ubuntu.

See how to use Sugar Live Build instead, where you may boot this in a VM and apply your changes by pulling from your GitHub repository and then doing a make install. Dependencies are already installed.

[sanatankc]

Thanks, I build deps and all commands seem to work. But changes are still not reflecting, I tried to delete all lines from files from and ran make and sudo make install. Still styles are same as before, it doesn't seem to work. There is also a folder called 3.20 in gtk3, not sure if it is importing styles from there.

[quozl]

Thanks. You might use atime of files to see if they have been referenced.

Also, you're trying to test two things at once; your intended change, and the test method. Try changing something really obvious in the styles unrelated to your intended change.

[sanatankc]

I actually tried to change something obvious. But nope.

Are they referenced every time I open the app or at the time I run make, make install?

[quozl]

Should be referenced every time you run an activity. You might try using strace -e open of sugar-activity . to find out which files are opened. I'll give that a go myself.

[sanatankc]

Thanks @quozl, will try it.

[quozl]

I've just tried the strace method, and I don't see any evidence that the CSS is referenced by the toolkit during activity start and stop. The activity was Polari, a GTK+ 3 activity. GTK+ 3.22.26, on Ubuntu 18.04.

The sugar-themes package has the CSS files.

Now I'm puzzled as to how this is meant to work.

[sanatankc]

Yeah, precisely that. I don't how it is referencing or working?

[quozl]

This is troubling. Perhaps it isn't referencing the files at all. There are only files for gtk-3.0 and gtk-3.20, and we're on gtk-3.22 now.

[sanatankc]

There is also a folder of called 3.20 in gtk3 folder.

[quozl]

As consequence of make install, the sugar-themes package which is derived from the sugar-artwork source package, contains these files;

/usr/share/themes/sugar-100/gtk-3.20/gtk-widgets.css
/usr/share/themes/sugar-100/gtk-3.0/gtk-widgets.css
/usr/share/themes/sugar-72/gtk-3.20/gtk-widgets.css
/usr/share/themes/sugar-72/gtk-3.0/gtk-widgets.css

Yet they aren't opened by Polari. I'll try another activity.

[quozl]

No change with HelloWorld. strace doesn't touch these files at all. Perhaps GTK+ 3.22 doesn't use them any more, or needs to be convinced to use them in a different way.

[quozl]

I've tested by remounting my root filesystem with strictatime, that starting HelloWorld or restarting the Sugar desktop does read a gtk-widgets.css file.

mount -o remount,strictatime /
service gdm3 restart
stat /usr/share/themes/sugar-72/gtk-3.20/gtk-widgets.css

So I can't trust strace. :frowning_face:

[sanatankc]

So, I it is using 3.20 version, thanks a lot @quozl.

[quozl]

Yes, and that version doesn't look like the file you changed in https://github.com/sugarlabs/sugar-artwork/pull/101, and if I add what you added to the 3.20 file, there's no visible change. Test case is Abacus.

From memory, changing the gtk-widgets.css file directly is a way to learn what to change in the source file.

[sanatankc]

So how changes of sugar-artwork will reflect in /usr/share/themes?

[quozl]

Should happen as a result of autogen of sugar-artwork source, then configure, build (make), and install (make install). For packaged systems, this is handled by the packager.

[quozl]

See the gtk3/theme/Makefile.am execution targets.

[sanatankc]

packaged systems?

[quozl]

For GNU standard software installs, the steps are configure, make, and make install.

For packaging into .rpm or .deb format, the steps are done in a build root and the result saved into an archive which is unpacked when the package is installed. A packaged system is one that uses packages, like .rpm or .deb.

[sanatankc]

Got it, thanks @quozl

[quozl]

Fixed by https://github.com/sugarlabs/sugar-artwork/commit/6ff7aad6dde8f31a591e6a21d57578d1a7043cc6