[GNC] GTK CSS 4.0-4.1

[Adrien Monteleone]

The short answer on Issue #1 (UI highlights) is you'd now have to delve 
into the GTK theme itself. (more reading and work!)

This is where the gtk.css file - for all of GTK comes into play, not 
just the gtk-3.0.css file that is specific to GnuCash.

The theme sets a highlight for all apps using it. GnuCash doesn't 
necessarily change that or expose it for styling.

As for the other items, I shall investigate and report back.

Regards,
Adrien

On 8/31/20 3:14 PM, GTI .H wrote:
> Hi Adrien,
> 
> Thanks for the reply!
> 
> Sorry for the delay, I am very involved with my trading operations in the
> financial markets ($$$). : )
> I hope we can sync our efforts.
> 
> 
> TESTS FOR WINDOWS OS:
> 
> Em sex., 14 de ago. de 2020 às 19:53, Adrien Monteleone <
> adrien.monteleone at lusfiber.net> escreveu:
> 
>> Finally got a chance to fire up the Inspector.
>>
>> See inline...
>>
>> Regards,
>> Adrien
>>
>> On 8/3/20 9:59 AM, GTI .H wrote:
>>> Em sex., 31 de jul. de 2020 às 22:36, Jimmy R via gnucash-user <
>>> gnucash-user at gnucash.org> escreveu:
>>>
>>>> Sorry I had a residual gtk.css from gnc 3.91 in linux
>>>> Above post is not true.
>>>>
>>>> I have a question though is thaer a setting in linux like in windows for
>>>>    gtk-application-prefer-dark-theme=true to use the dark theme
>>>>
>>>> I found nothing in the WIKI
>>>>
>>>
>>> See here https://wiki.gnucash.org/wiki/GTK3#Themes how to do this.
>>>
>>> Does anyone know which Selectors/Rules to modify the:
>>>
>>> Highlight Text
>>> Register Summary Bar
>>> Account Sheet (Headers, Total Bar, etc.)
>>>
>>> These do not work on Windows:
>>>
>>> .gnc-class-highlight
>> Where does this happen, that is, what in the UI are you targeting with
>> this?
> 
> 
> Issue 1:
> 
> I think that this should affect the selected texts.
> When we give 2 or 3 clicks on the text it is highlighted by two colors, the
> text color and the background color.
> We would really like to be able to change these colors.
> 
> Which Selectors/Rules can we change these colors with?
> 
> 
> The closest I can see is a highlighted text field in a register
>> like a memo. That gets a class:
>>
>> .gnc-class-register-foreground
> 
> 
> I tested this:
> 
> .gnc-class-register-foreground {
>    color:yellow;
> }
> 
> and it works with the same effect as this:
> 
> /* The cell containing the cursor */
> gnc-id-cursor entry {
>    color:yellow
> }
> 
> 
>> #gnc-id-summarybar
>> That still exists. It is a `box` node that is a child of another `box`
>> node that has #gnc-id-register-page if that helps any.
>>
> 
> This works well on the register page:
> 
> #gnc-id-summarybar {
>    color: red;
> }
> 
> 
> Issue 2:
> 
> Why doesn't it work for the font size?
> 
> #gnc-id-summarybar {
>    font-size: 18;
> }
> 
> Which Selectors/Rules can we change the font size of the register page
> summary bar with?
> 
> 
> This affected the entire register page:
> 
> #gnc-id-register-page{
>    color: red;
> }
> 
> 
> The 'Total Bar' on the Account page has:
>> #gnc-id-account-summary-bar
>>
> 
> I haven't found where it affects anything:
> 
> #gnc-id-account-summary-bar{
>    color: red;
> }
> 
> 
> (which is a child of #gnc-id-account-page if you find that useful)
>>
>>> #account_tree
>> #gnc-id-account-tree
>>
> 
> I haven't found where it affects anything:
> 
> #gnc-id-account-page{
>    color: red;
> }
> 
> or
> 
> #account_tree{
>    color: red;
> }
> 
> But this works like a charm:
> 
> #gnc-id-account-tree{
>    color: red;
> }
> 
> And we were looking forward to this skill !
> 
> 
> Under that is a `header` node which contains a `button` node for each
>> possible column header. (visible or not) Each of those contains `box`
>> node, which contains a `widget` and `image` nodes and the `widget`
>> contains a `label` node. None of them have classes or IDs so you'll have
>> to target the nodes directly if styling the parent doesn't work.
>>
>> Thus:
>>
>>   >header
>>      |
>>      >button
>>        |
>>        >box
>>          |
>>          >widget
>>          | |
>>          | >label
>>          >image
>>
>> The image node would be the arrow toggle used for sorting. (which is why
>> each column header is a `button`)
>>
> 
> Adrien, I am so pleased with the results that I forgive you for all the
> excesses of text you made me read before !!!
> hehehehehhe. . . !!!
> 
> To close the subject and to have a good styling CSS file again (I will
> publish the final result here), we just need to solve these two issues:
> 
> Issue 1: Look above
> Issue 2: Look above
> 
> 
> Thanks Adrien!
>