[OPEN] [#812] GridPanel Grouping cosmetic issue

  1. #1

    [OPEN] [#812] GridPanel Grouping cosmetic issue

    Hi,

    It is only tiny cosmetic issue but would be nice to fix it.

    Please, use the example to reproduce it:

    http://examples.ext.net/#/GridPanel/...oupingSummary/

    When first row in the grid is selected (focused) then above first group (it happens only with the first group) header we can see "1 pixel height" selection/focus border line.

    See attached pictures:

    Click image for larger version. 

Name:	grouping-cosmetic-problem.png 
Views:	5 
Size:	53.8 KB 
ID:	24030


    Click image for larger version. 

Name:	grouping-cosmetic-problem2.png 
Views:	6 
Size:	57.1 KB 
ID:	24031


    Thank you,

    Matt
    Last edited by Daniil; Jun 25, 2015 at 9:59 AM. Reason: [OPEN] [#812]
  2. #2
    Hi @Matt,

    Apologize for the delay in answering.

    Agree, a small but quite annoying issue. Logged in GitHub.
    https://github.com/extnet/Ext.NET/issues/812

    I found out that it happens with the first row of each group, not just the first group.

    This is the override that appears to help for four themes: Neptune, NeptuneTouch, Crisp and CrispTouch.
    <style>
        .x-theme-crisptouch .x-grid-with-row-lines .x-grid-item:first-child,
        .x-theme-crisp .x-grid-with-row-lines .x-grid-item:first-child,
        .x-theme-neptunetouch .x-grid-with-row-lines .x-grid-item:first-child,
        .x-theme-neptune .x-grid-with-row-lines .x-grid-item:first-child {
            border-top-color: white !important;
        }
    
        .x-theme-crisptouch .x-grid-with-row-lines .x-grid-item.x-grid-item-selected,
        .x-theme-crisp .x-grid-with-row-lines .x-grid-item.x-grid-item-selected {
            border-color: #cecece;
        }
    
        .x-theme-crisptouch .x-grid-with-row-lines .x-grid-item.x-grid-item-over,
        .x-theme-crisp .x-grid-with-row-lines .x-grid-item.x-grid-item-over {
            border-color: #cecece;
        }
    
        .x-theme-neptunetouch .x-grid-with-row-lines .x-grid-item.x-grid-item-selected,
        .x-theme-neptune .x-grid-with-row-lines .x-grid-item.x-grid-item-selected {
            border-color: #ededed;
        }
    
        .x-theme-neptunetouch .x-grid-with-row-lines .x-grid-item.x-grid-item-over,
        .x-theme-neptune .x-grid-with-row-lines .x-grid-item.x-grid-item-over {
            border-color: #ededed;
        }
    </style>
  3. #3
    The CSS patch works! Thank you.

    Based on your patch a I have added the same for Default (Gray) and Blue themes.

    
    .x-grid-with-row-lines .x-grid-item:first-child,
    .x-theme-blue .x-grid-with-row-lines .x-grid-item:first-child {
    	border-top-color: #ededed !important;	
    }
    
    .x-grid-with-row-lines .x-grid-item.x-grid-item-selected,
    .x-theme-blue .x-grid-with-row-lines .x-grid-item.x-grid-item-selected {
    	border-color: #ededed;
    	border-top-style: solid;
    }
    
    .x-grid-with-row-lines .x-grid-item.x-grid-item-over,
    .x-theme-blue .x-grid-with-row-lines .x-grid-item.x-grid-item-over {
    	border-color: #ededed;
    }

    Best Regards,

Similar Threads

  1. [CLOSED] TextField validation - cosmetic issue
    By matt in forum 3.x Premium Help
    Replies: 6
    Last Post: Jan 15, 2015, 12:57 PM
  2. Replies: 5
    Last Post: May 12, 2014, 3:05 PM
  3. [CLOSED] Cosmetic issue :-)
    By xtoolz in forum 2.x Premium Help
    Replies: 2
    Last Post: Jul 23, 2013, 12:11 PM
  4. Issue with GridPanel grouping Column
    By rishu in forum 2.x Help
    Replies: 0
    Last Post: Jun 11, 2013, 11:19 AM
  5. GridPanel grouping issue
    By milenios in forum 2.x Help
    Replies: 2
    Last Post: Aug 07, 2012, 6:58 PM

Tags for this Thread

Posting Permissions