[GNC] Preferences for latest version

Adrien Monteleone adrien.monteleone at lusfiber.net
Sun Oct 21 12:53:37 EDT 2018


David,

I’ll address the inspector first and then send another reply to the specific CSS questions.

The inspector most likely is opening (I use the same command) but it’s opening behind the GnuCash window. Do an Application Window spread and you’ll see it. (I have my top left hot corner set, but you can define a hotkey for it. you can also bring up Mission Control to see all windows on the workspace)

Now, using the inspector is going to be ‘fun’ as there is little to no documentation for it...

The top left icon you can use to ’target’ elements in the GC window by hovering and clicking. They will highlight as you hover. Clicking will ’set’ the element as targeted and the Inspector will then give you various info about it.

Once you’ve targeted the element you want take a good look at the element tree. Many things will not be intuitive and you’ll be surprised how the window is laid out in some cases. Note any classes for the nodes as they can be targeted with CSS declarations. Then use the top left drop down to view ‘class hierarchy’ and ‘css nodes’ The latter will give you CSS element names useful for when you don’t have classes assigned (like the case of ‘treeview button’) and you can see the entirety of possible CSS properties and what they are currently set to. The hierarchy can sometimes be helpful with tricky nesting of nodes especially with nodes trees that are repeated on the page.

Then use the CSS tab at the top to write your own rules to test changes in real time. (there’s also a pause button there to turn your rules off and on in real time) When you find something that works, add it to your own gtk-3.0css file and reload GnuCash. Rinse, repeat...

There are a few other interesting tidbits about the inspector I’ve discovered, such as the ‘properties’ from the drop down allows you to alter some non-css stuff but this could only be useful in patching code. (that’s how I discovered the gird lines possibility for the CoA tab) Double-clicking values in the properties view brings up the ability to change/toggle them.

If you run into any problems, ping me back here and I’ll see what I can do to help. (or even learn more myself)

Regards,
Adrien

> On Oct 21, 2018, at 10:02 AM, David T. <sunfish62 at yahoo.com> wrote:
> 
> Adrien,
> 
> Further comments.
> 
> First, I’m learning that, for colors at least, the names used have no spaces in them.  So, “lightsteelgrey”, not “light steel grey”. I found a different site that noted the unspaced name forms after my initial attempts. My mistake. [This does not, however, rectify the multiword font name issue.]
> 
> Next, the #accounttree, .GncAccountPage command results in the background changing color, but it also affects every other part of the account window. This means that the highlighted account background stays the same lightgrey, but the highlighted font color switches to white, making this account practically invisible (kind of ironic, I’d say!). I’d alter the css, but… see below.
> 
> To alter the css, you need to know the elements involved, which is what GTK Inspector is supposed to do. However, the instructions say “GTK has a built in Inspector that you can enable by launching GnuCash from the command line with GTK_DEBUG=interactive path/to/gnucash”
> 
> That instruction is frustratingly incomplete, at least for me. Opening a Terminal window and entering:
> 
> GTK_DEBUG=interactive /Applications/Gnucash\ 3.3.app/Contents/MacOS/Gnucash
> 
> certainly gets GnuCash running, but there doesn’t seem to be any way to get element information from this point. Tried Ctrl-Shift-D (mentioned on GTK site), and various other meta key combinations. I have no way of knowing the element names, unless someone can tell me how this is supposed to work under MacOS. I will note that I see the following output after the above command:
> 
> Gtk-Message: 20:22:13.449: Failed to open display (null)
> Gtk-Message: 20:22:13.449: Failed to separate connection to default display
> 
> Guidance is welcome.
> 
> Cheers,
> David
> 
>> On Oct 21, 2018, at 1:26 PM, David T. via gnucash-user <gnucash-user at gnucash.org> wrote:
>> 
>> Adrien,
>> 
>> I’ve been following this thread, and decided to try some of it out. I’d like to report that my results have been less than stellar, and just a little bit confusing.
>> 
>> I will begin by saying that I am a long time MacOS user, and I am running both 2.6.19 and 3.3 on MacOS Mojave (which just installed). I have been switching back and forth because I had some troubles with the typeahead in 3.x, but wanted to be able to import commodity prices using csv files.
>> 
>> I will skip the version 2 styling in the interest of staying on topic here with 3.0 styling.
>> 
>> My gtk-3.0.css (in ~/Library/Application Support/Gnucash) reads:
>> * {
>>  font-size: 12px;
>>  font-family: Times, serif; 
>> }
>> #account_tree, .GncAccountPage {
>> background-color: lightgrey;
>> }
>> 
>> treeview button {
>> background-color: lightgrey;
>> color: black;
>> }
>> notebook tab {
>>  min-height: 0px;
>>  margin-top: 0px;
>>  margin-bottom: 0px;
>>  padding-left: 0px;
>>  padding-right: 0px;
>> }
>> notebook tab box {
>>  padding-top: 2px;
>>  padding-bottom: 2px;
>> }
>> 
>> These entries are copied from your example and another example for the tab padding. I have some notes:
>> 
>> * First off, it appears that if there is ANY error in your css, then none of your modifications will appear. So, if you have an error with your color name, the font specification will not apply either.
>> 
>> * I changed the font to “Big Caslon” as a test, since I can’t tell the difference between the various sans-serif fonts that are available at my advanced age. What I found was that the ONLY place I saw a change to a serif font was in my reports. All other fonts remained sans serif. Using single quotes or double quotes or even no quotes made no difference in the results. However, if I used a single word font name (“Braggadocio”, “Century”, “Helvetica”), the results appeared everywhere. I’m not sure what the authorized GTK3 method is for handling multiword font names; I couldn’t find any information out there for this.
>> 
>> * For yucks, I changed the px setting to 32, and Wow! that worked on everything.
>> 
>> * Initially, I omitted the ‘#’ before ‘account_tree’, assuming it was a typo. Not so! Again, single word values (“lightgrey”, “purple”) worked, while multiword (“Light Steel Grey”, from wikipedia liisting) values didn’t.
>> 
>> * While trudging through the Internet, I found a page that suggested that css allowed variable definitions. My attempt to copy that example, however, went down in flames. It might be nice to be able to set variables up and then change a single entry at the top to reset the look throughout, if anyone has advice for this.
>> 
>> Cheers,
>> David T.
>> 
>> 
>>> On Oct 20, 2018, at 12:18 AM, Adrien Monteleone <adrien.monteleone at lusfiber.net> wrote:
>>> 
>>> Jill,
>>> 
>>> Try this:
>>> 
>>> Close GnuCash.
>>> 
>>> Using a text editor (such as ’TextEdit.app’) create a file named gtk-3.0.css and place it in /yourusername/Library/Application Support/Gnucash
>>> 
>>> have it contain the following three CSS declarations:
>>> 
>>> * {
>>> font-size: 12px;
>>> font-family: Helvetica, sans-serif;
>>> }
>>> 
>>> #account_tree, .GncAccountPage {
>>> background-color: lightgrey;
>>> }
>>> 
>>> treeview button {
>>> background-color: lightgrey;
>>> color: black;
>>> }
>>> 
>>> Save the file as ‘Plain Text’. (Format > Make Plain Text)
>>> 
>>> Start GnuCash to see your changes.
>>> 
>>> ----------
>>> Here’s what this code does:
>>> 
>>> 	* {
>>> 	  font-size: 12px;
>>> 	  font-family: Helvetica, sans-serif;
>>> 	}
>>> 
>>> 
>>> “font-size: 12px;” sets the font size for all (*) elements in the windows for the entire application. Set to the size you find appropriate. 12px (pixels) is a readably small size on most displays.
>>> 
>>> “font-family: Helvetica, sans-serif;” sets the font family to be ‘Helvetica’ or the closest generic system sans-serif font available if Helvetica is not on your system. You can use any font here you like. I just included Helvetica as an example. The default (‘San Francisco’ on a Mac) is pretty good, so you don’t need to even include this line if you like it as is, just use the font-size rule.
>>> 
>>> ----------
>>> 
>>> 	#account_tree, .GncAccountPage {
>>> 	  background-color: lightgrey;
>>> 	}
>>> 
>>> 
>>> “#account_tree” targets the main part of the Account page window, “.GncAccountPage” targets the small background behind the Totals bar which appears to be part of the page. You can put them together as I have done here in a list to apply the same rule to both, or write separate declarations for each with their own rules if you want the colors to be different. 
>>> 
>>> You can also set specified font-sizes and font-families here as well if you want them different than the rest of the window. Just add those rules into those declarations. I’ve included a background color rule here because that is what you asked for, with the ‘lightgrey’ example. Depending on what you are looking for, or what color you choose, you may need to also set a foreground (text) color to balance properly. See the next declaration for an example.
>>> 
>>> ----------
>>> 
>>> 	treeview button {
>>> 	  background-color: lightgrey;
>>> 	  color: black;
>>> 	}
>>> 
>>> 
>>> “treeview button” targets the header bar at the top of the Account table. Again, you might need to include a foreground color rule here as this particular background color makes the header labels harder to read. (simply “color”)
>>> 
>>> For colors you can specify a ‘named websafe color’ (do a search on that term for possible color names) or you can use RGB integer or hex values if you want to specify a non-named color. (you don’t have to use names either, you can use the actual color value for ‘lightgrey’ if you want)
>>> 
>>> For example, if you wanted to match the background color of the tabs area, you’d use:
>>> 
>>> 	background-color: rgb(207,207,205);
>>> 
>>> or
>>> 
>>> 	background-color: #cfcfcd;
>>> 
>>> If you wanted to match the background area of the icon toolbar, you’d use rgb(232,232,231) or #e8e8e7.
>>> 
>>> If you want to know the color of a particular screen element, use the “Digital Color Meter.app". It will give you the color value of the item you point to as three separate integers for Red, Green & Blue (RGB) in the interval 0-255. If you want the hex value instead, you can then use a site like rgbtohex.net to convert it. It is important to always enter the RGB values in that R,G,B order to get the correct color.
>>> 
>>> ----------
>>> You can make changes to the CSS file while GnuCash is open, but you’ll have to restart (after saving the CSS file) to see them take effect.
>>> 
>>> Let me know if you have any questions.
>>> 
>>> Regards,
>>> Adrien
>>> 
>>> 
>>>> On Oct 17, 2018, at 8:53 AM, Jill Terry <jill at babrees.co.uk> wrote:
>>>> 
>>>> Thanks folks.
>>>> 
>>>> The location of the css file given in the wiki is given for a mac, I cannot locate a folder for Gnucash under Application Support.  Besides which I have no idea how to find the correct .class to adjust.
>>>> 
>>>> I love GnuCash and so appreciate the program. But (yep always a but LOL!)  I hate with a vengeance the way there are no simple links to things.  I have no idea how to get to the online version of these emails to search older posts!
>>>> 
>>>> I am old and tired (and grumpy LOL!) and really struggle to learn new things. Why oh why did they remove the alternate line shading and change the font????
>>>> 
>>>> Cheers
>>>> (a very tired) Jill
>>>> 
>>>> 
>>>> 
>>>> On 17/10/2018 12:45, Adrien Monteleone wrote:
>>>>> Jill,
>>>>> 
>>>>> Look at the wiki FAQ, you’ll see links to pages about GTK3 styling. There are some basics there, otherwise, a few months back, myself and a few others spent some time experimenting with various settings here on the list, so check the archives. I believe the thread title had something to do with font size. If you do a restricted search of the list use ‘css’ as a search term.
>>>>> 
>>>>> If you need to fine tune things like spacings, padding and such, you will greatly benefit by using the gtk-inspector. I don’t think it works on Windows though, Mac and Linux only. (you won’t need to install it separately)
>>>>> 
>>>>> I’m heading out of town for a few days, but if you are still stuck after trying the above, report back and I’ll help where I can. Others on the list can certainly assist as well.
>>>>> 
>>>>> Regards,
>>>>> Adrien
>>>>> 
>>>>>> On Oct 17, 2018, at 5:19 AM, Jill Terry <jill at babrees.co.uk> wrote:
>>>>>> 
>>>>>> Hi All.
>>>>>> 
>>>>>> I'm on the mac version and I have just updated to v.3.3.
>>>>>> 
>>>>>> I absolutely hate the fact that the opening window, showing all accounts, is now a bland, bright, white.  I also dislike the change in the font and size.   With these updates it hurts my eyes.
>>>>>> 
>>>>>> The accounts are fine, still the same yellow/green (although I dislike the font now used).
>>>>>> 
>>>>>> But I cannot see anywhere where you can change the view of the Accounts tab, nor font style/size.
>>>>>> 
>>>>>> I don't know what other changes were made in the upgrade, but if I can't change how the accounts tab looks then I shall have to revert back to older version.
>>>>>> 
>>>>>> Jill
>>>>>> 
>>>>>> _______________________________________________
>>>>>> gnucash-user mailing list
>>>>>> gnucash-user at gnucash.org
>>>>>> To update your subscription preferences or to unsubscribe:
>>>>>> https://lists.gnucash.org/mailman/listinfo/gnucash-user
>>>>>> If you are using Nabble or Gmane, please see https://wiki.gnucash.org/wiki/Mailing_Lists for more information.
>>>>>> -----
>>>>>> Please remember to CC this list on all your replies.
>>>>>> You can do this by using Reply-To-List or Reply-All.
>>>>> 
>>>>> _______________________________________________
>>>>> gnucash-user mailing list
>>>>> gnucash-user at gnucash.org
>>>>> To update your subscription preferences or to unsubscribe:
>>>>> https://lists.gnucash.org/mailman/listinfo/gnucash-user
>>>>> If you are using Nabble or Gmane, please see https://wiki.gnucash.org/wiki/Mailing_Lists for more information.
>>>>> -----
>>>>> Please remember to CC this list on all your replies.
>>>>> You can do this by using Reply-To-List or Reply-All.
>>>> 
>>> 
>>> 
>>> _______________________________________________
>>> gnucash-user mailing list
>>> gnucash-user at gnucash.org
>>> To update your subscription preferences or to unsubscribe:
>>> https://lists.gnucash.org/mailman/listinfo/gnucash-user
>>> If you are using Nabble or Gmane, please see https://wiki.gnucash.org/wiki/Mailing_Lists for more information.
>>> -----
>>> Please remember to CC this list on all your replies.
>>> You can do this by using Reply-To-List or Reply-All.
>> 
>> _______________________________________________
>> gnucash-user mailing list
>> gnucash-user at gnucash.org
>> To update your subscription preferences or to unsubscribe:
>> https://lists.gnucash.org/mailman/listinfo/gnucash-user
>> If you are using Nabble or Gmane, please see https://wiki.gnucash.org/wiki/Mailing_Lists for more information.
>> -----
>> Please remember to CC this list on all your replies.
>> You can do this by using Reply-To-List or Reply-All.
> 




More information about the gnucash-user mailing list