<commit_before>Data tables

In a card or not
Nav or not


Text
    Content: Reg 13px 0.87 black
    Header: Med 12px 0.54 black
    Sorted header: Med 12px 0.87 black
    Placeholder text: Reg 13px 0.38 black //TODO Editable field
    
    Numeric column: Right aligned
    Text column: Left aligned


Interaction
    Hover: #eee
    Selected: #f5f5f5
    Selected checkbox: Secondary app color (Not accent color like I did)
    
Sort //TODO
    Sort icon: 16px 0.87 container (=> From spec they talk about the icon, not the touch area. How big is supposed to the touch area for 16px icons?)
    Sortable header (hover): Display 16px 0.38 sort icon
    
Edit dialog //TODO
Inline menu //TODO


If table nav and data manipulation tools -> inside a card 
    => Will create a specific table card first and then make it generic
    
    
Table card (header,body,footer)
    Title: Reg 20px 0.87
    Action icon (header/footer): 24px container 0.54
    Footer labels: Reg 12px 0.54
    Alternate header
        Persistant action: Borderless button
        On selection header
            0.5 of sec color
            Display number of selected items
            May change icons on selection (May be better to void confusion with disabled icons like I did)
            (I suppose that the text color is the same as for a button)
Sizes
    Card header height: 64px
    Footer: 56px
    Data row: 48px
    
    Padding of 24px at left:
        For data row, there is an icon so: 12 (24 - 12)
        For title: 24
    24px space between icons
        No need since they already have 12px of touch area on each side
    Padding right 14px
        Header: icons so, 2 (14 - 12)
        
        
        <commit_msg>2.0 refactoring<commit_after>Data tables

In a card or not
Nav or not


Text
    Content: Reg 13px 0.87 black
    Header: Med 12px 0.54 black
    Sorted header: Med 12px 0.87 black
    Placeholder text: Reg 13px 0.38 black //TODO Editable field
    
    Numeric column: Right aligned
    Text column: Left aligned


Interaction
    Hover: #eee
    Selected: #f5f5f5
    Selected checkbox: Secondary app color (Not accent color like I did)
    
Sort //TODO
    Sort icon: 16px 0.87 container (=> From spec they talk about the icon, not the touch area. How big is supposed to the touch area for 16px icons?)
    Sortable header (hover): Display 16px 0.38 sort icon
    
Edit dialog //TODO
Inline menu //TODO


If table nav and data manipulation tools -> inside a card 
    => Will create a specific table card first and then make it generic
    
    
Table card (header,body,footer)
    Title: Reg 20px 0.87
    Action icon (header/footer): 24px container 0.54
    Footer labels: Reg 12px 0.54
    Alternate header
        Persistant action: Borderless button
        On selection header
            0.5 of sec color
            Display number of selected items
            May change icons on selection (May be better to void confusion with disabled icons like I did)
            (I suppose that the text color is the same as for a button)

Icons   
    In other chapters, icons are said to be 24px (or 20px if dense) with a container of 48px.
    But here the container is 24px directly on the icon (Checkbox is 18 icon with 24px container).
    => Here, I think I will diverge from specs. THere is no reason to reduce the touch area for most of them. They all seem to have 12px of each side  
        => Adapt checkbox to have an icon of 18px
        => For the case of  rows/page icon, merge it with the text in a common component //TODO Later
        
    

Sizes
    Card header height: 64px
    Footer: 56px
    Data row: 48px
    
    Padding of 24px at left:
        For data row, there is an icon so: 12 (24 - 12)
        For title: 24
    24px space between icons
        No need since they already have 12px of touch area on each side
    Padding right 14px
        Header: icons so, 2 (14 - 12)
    Footer
        Between control set: 20px (32 - 12 of icon)
    Data rows
        Checkbox left/right margin: 9 (24 - 15)
        Column right margin (except last): 56px (last: 24px)
        
        
        

{'fraction_non_alphanumeric': 0.047007511509571116, 'fraction_numerical': 0.046280591228495274, 'mean_word_length': 2.2735923869944488, 'pattern_counts': {'":': 0, '<': 3, '<?xml version=': 0, '>': 12, 'https://': 0, 'lorem ipsum': 0, 'www.': 0, 'xml': 0}, 'pii_count': 0, 'substrings_counts': 0, 'word_list_counts': {'cursed_substrings.json': 0, 'profanity_word_list.json': 0, 'sexual_word_list.json': 0, 'zh_pornsignals.json': 0}}
{'dir': 'git-commits-cleaned', 'id': '5378789', 'n_tokens_mistral': 1328, 'n_tokens_neox': 1140, 'n_words': 609}