[GNC] Change text color

Adrien Monteleone adrien.monteleone at lusfiber.net
Tue Jul 31 23:20:06 EDT 2018


‘column-header' is a pseudo selector? It looks like a Css node in GtkInspector. I’ll give it a try.

Regards,
Adrien

> On Jul 31, 2018, at 9:59 PM, John Ralls <jralls at ceridwen.us> wrote:
> 
> It’s missing the colon (‘:’) between account_tree and column-header. That could be a typo in the email rather than in gtk.css, of course.
> 
> Regards,
> John Ralls
> 
> 
>> On Jul 31, 2018, at 12:42 PM, GT-I9070 H <gti9070h at gmail.com> wrote:
>> 
>> Hi Adrien,
>> 
>> This does not work:
>> 
>> #account_tree column-header {
>> color: lime;
>> }
>> 
>> Am I writing something wrong?
>> 
>> Regards
>> GTI
>> 
>> Em ter, 31 de jul de 2018 às 14:38, Adrien Monteleone <
>> adrien.monteleone at lusfiber.net> escreveu:
>> 
>>> GTI,
>>> 
>>> You could test the font-family rule by changing it to something obviously
>>> different, like serif, monospaced, or say ‘Comic Sans’. (I suppose it’s
>>> useful at least for this) I just revamped my css from the old gtkrc method
>>> from 2.6.x and it picked up the font rules just fine.
>>> 
>>> I found the header selectors.
>>> 
>>> So here is the hierarchy:
>>> 
>>> GncTreeViewAccount (id=“account_tree”) > column-header > GtkButton
>>> (class=“button”) > GtkBox > GtkAlignment > GtkLabel (class=“label”)
>>> 
>>> GncTreeViewAccount affect the entire tab contents.
>>> column-header affects the entire header.
>>> GtkButton affects each section of the header.
>>> GtkBox affects only the portion of the header cell that contains text and
>>> white space. (Does not include separators or margins)
>>> GtkAlignment affects only the portion of GtkBox that contains actual text
>>> characters. (GtkBox minus padding)
>>> GtkLabel is the text itself.
>>> 
>>> Thus if you want to style the entire header bar you could use:
>>> 
>>> #account_tree column-header
>>> 
>>> #account_tree column-header GtkButton/button will target only the first
>>> header. (you can use the :x-child pseudo selectors for the others)
>>> 
>>> #account_tree column-header .button targets all header buttons seems to
>>> have the same effect as if you hadn’t specified the class as in the first
>>> instance.
>>> 
>>> #account_tree column-header GtkLabel/label targets only the first header
>>> label. (same as button)
>>> 
>>> #account_tree column-header .label targets all header labels.
>>> 
>>> 
>>> Note, ‘column-header’ for some reason doesn’t appear to be specifically
>>> necessary at least in gtk-3.18, but it’s probably a good idea to include
>>> it. It seems all of the accounts are also GtkButton nodes with GtkLabels,
>>> but they don’t seem to change on the declarations when I don’t include
>>> column-header for some reason. Perhaps this is a code issue as noted in a
>>> previous reply. Since this might change, I’d say it’s safer to specify
>>> buttons/labels as children of column-header for future durability.
>>> 
>>> Since including column-header is more specific, it shouldn’t matter the
>>> cascade order as it will take precedence over plain #account_tree rules.
>>> 
>>> Regards,
>>> Adrien
>>> 
>>> 
>>>> On Jul 31, 2018, at 12:17 PM, GT-I9070 H <gti9070h at gmail.com> wrote:
>>>> 
>>>> Thanks  Adrien ,
>>>> 
>>>> I'm with my smartphone bricked and I stopped Flash it to test GnuCash.
>>>> 
>>>> I tested this on Windos 10:
>>>> 
>>>> /* Account sheet font settings */
>>>> #account_tree {
>>>> font-family: Arial;
>>>> font-size: 15;
>>>> color: blue;
>>>> background-color: #1C2833;
>>>> padding: 1px;
>>>> letter-spacing: 5px;
>>>> }
>>>> 
>>>> #account_tree:selected {
>>>> color: white;
>>>> }
>>>> 
>>>> /* Tab font color */
>>>> notebook tab label {
>>>> color: blue;
>>>> }
>>>> 
>>>> and it worked the first time. I'm not sure if "font-family: Arial;"
>>> worked, but I'm sure it did not block the .css.
>>>> 
>>>> Only "letter-spacing: 5px;" changed the column header.
>>>> 
>>>> Now we just need to customize the column header.
>>>> 
>>>> Regards
>>>> GTI
>>>> 
>>>> Em ter, 31 de jul de 2018 às 02:25, Adrien Monteleone <
>>> adrien.monteleone at lusfiber.net> escreveu:
>>>> Follow-up:
>>>> 
>>>> I’m not sure what was wrong the first time, but the following does work
>>> for all text on the CoA tab but does not change the header row:
>>>> 
>>>> #account_tree {
>>>> color: *your-color-here*;
>>>> }
>>>> 
>>>> #account_tree:selected {
>>>> color: *other-color-here*;
>>>> }
>>>> 
>>>> If there was a need to address the GtkLabels directly, that doesn’t seem
>>> possible. According to the spec, it should be to style the node by type,
>>> but it isn’t working. (at least in 3.18)
>>>> 
>>>> The class ‘label’ is also not working properly. It seems to only apply
>>> to toolbar button labels and the header row of the CoA table.
>>>> 
>>>> Using the GtkInspector, I added the label class to the
>>> GtkTreeViewAccountView widget and it worked properly though. So perhaps the
>>> code needs to somehow include this for it to work. (my reading of the
>>> Gtk-css reference doesn’t seem to make this clear, with the impression that
>>> one can specify a node or a label regardless)
>>>> 
>>>> There should probably be something on the wiki documenting this, as well
>>> as all the relevant selectors. (some are documented on Git as part of a
>>> sample css file) If I have page permissions I’ll start one, but if not I’ll
>>> have to file a wiki bug and wait for it to be created.
>>>> 
>>>> Regards,
>>>> Adrien
>>>> 
>>>> 
>>>>> On Jul 30, 2018, at 5:04 PM, Adrien Monteleone <
>>> adrien.monteleone at lusfiber.net> wrote:
>>>>> 
>>>>> This is proving to be more difficult than it probably should be.
>>> Unfortunately, there is very little documentation on using GtkInspector,
>>> and it seems the tool was designed for people who are doing the coding of
>>> the app and are ‘inyoursleep’ familiar with the GUI elements and objects
>>> used.
>>>>> 
>>>>> However, I’ve managed something that might be useful.
>>>>> 
>>>>> Try:
>>>>> 
>>>>> #account_tree {
>>>>> color: *your-color-here*;
>>>>> }
>>>>> 
>>>>> This should change the base color of the text for the entire tree,
>>> including the column headers.
>>>>> 
>>>>> You can use other common css rules here such as background-color,
>>> font-family, font-size, letter-spacing, padding, etc.
>>>>> 
>>>>> The account names themselves (and their related text in sibling
>>> columns) are likely either class “label” or “GtkLabel” (depending on Gtk
>>> version, 3.20 is the former, 3.18 the latter) but specifying this class
>>> instead of the ID for the entire tree doesn’t seem to do anything. (I’m on
>>> 3.18 using Ubuntu 16.04, but I tried both with no result) You might have
>>> better luck. Ideally, I’d rather style classes than IDs, especially since
>>> in this case, the ID includes the column headers.
>>>>> 
>>>>> An additional complication is that the tree-view has identical nodes
>>> for pretty much everything under it and the inspector doesn’t seem to let
>>> me select any particular account label with any specificity or figure out
>>> which node in the tree is which one I’m looking at on screen. (I understand
>>> specificity for the web, but building a unique selector seems a little
>>> different in GTK) I can only select the entire tree at once.
>>>>> 
>>>>> The above might also pose an issue because a selected account would
>>> need different background and font colors. The inspector is supposed to
>>> show a ’selected’ node that might be useful here, but since I can't figure
>>> out which child GtkLabel belongs to what, I’m not seeing that particular
>>> ’selected’ node.  I’ll keep trying and poking around though.
>>>>> 
>>>>> Hope that helps.
>>>>> 
>>>>> Regards,
>>>>> Adrien
>>>>> 
>>>>>> On Jul 26, 2018, at 7:27 PM, GT-I9070 H <gti9070h at gmail.com> wrote:
>>>>>> 
>>>>>> One file for everything is better.
>>>>>> 
>>>>>> In my .ini file there is only one section and one line to change the
>>> text size of the accounts page because it was the only method I found and
>>> worked, the .css method for this fails. For everything else I use .css,
>>> I've customized the registry with .css.
>>>>>> 
>>>>>> For tabs I already got change color and font.
>>>>>> 
>>>>>> I had already done searches on the list and I was not lucky.
>>>>>> 
>>>>>> Of course we can wait, without problems, meanwhile I'll keep trying.
>>>>>> 
>>>>>> 
>>>>>> Regards
>>>>>> GTI
>>>>>> 
>>>>> 
>>>> 
>>>> 
>>>> _______________________________________________
>>>> 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