RadTreeView: Vertical lines appear when root node expanded

16 posts, 0 answers
  1. Lee
    Lee avatar
    16 posts
    Member since:
    Oct 2012

    Posted 02 Feb Link to this post

    When the root (1st) node in a RadTreeView are expanded, the background of the child nodes have black vertical lines behind them. (See screenshot attached).

    What can I do about this or is this a bug?

     Thank you,

    Lee

  2. Lee
    Lee avatar
    16 posts
    Member since:
    Oct 2012

    Posted 02 Feb in reply to Lee Link to this post

    This is a larger picture of the issue.
  3. UI for ASP.NET Ajax is Ready for VS 2017
  4. Viktor Tachev
    Admin
    Viktor Tachev avatar
    1488 posts

    Posted 04 Feb Link to this post

    Hi Lee,

    Would you ensure that you are using the latest version of the controls? The current release is 2016.1.113.

    Give the new version of the controls a try and see how it works for you.

    Regards,
    Viktor Tachev
    Telerik
    Do you want to have your say when we set our development plans? Do you want to know when a feature you care about is added or when a bug fixed? Explore the Telerik Feedback Portal and vote to affect the priority of the items
  5. Lee
    Lee avatar
    16 posts
    Member since:
    Oct 2012

    Posted 22 Mar in reply to Viktor Tachev Link to this post

    Viktor,

    We have updated to the latest version and the lines are still there. Weird! Any suggestions?

    Thank you,

    Lee

  6. Ivan Danchev
    Admin
    Ivan Danchev avatar
    829 posts

    Posted 25 Mar Link to this post

    Hello Lee,

    I am afraid we were unable to reproduce this appearance issue in version 2016.1.113 or the latest version (2016.1.225) of the controls. If you are applying custom CSS to the TreeView could you please post it so we can test how it affects the TreeView and whether any of the styles is responsible for the undesirable multiplication of the connection lines?

    Regards,
    Ivan Danchev
    Telerik
    Do you need help with upgrading your ASP.NET AJAX, WPF or WinForms projects? Check the Telerik API Analyzer and share your thoughts.
  7. Lee
    Lee avatar
    16 posts
    Member since:
    Oct 2012

    Posted 25 Mar Link to this post

    How do I attach a .css file? Here is the text:

    /********************** Default Theme **********************/


    /* Basic Elements
    ----------------------------------------------------------*/
    body {
     background-color:#EBECED;
        color: black;
    }


    a, a:link, a:visited, a:hover, a:active {
     /**/color: rgb(0,100,175);
     text-decoration: underline;
    }


    input[type="text"]:focus,
    input[type="password"]:focus,
    select:focus,
    textarea:focus {
        border-color: rgba(82, 168, 236, 0.8);
        outline: 0;
        outline: thin dotted \9;
        -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075), 0 0 8px rgba(82, 168, 236, 0.6);
        -moz-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075), 0 0 8px rgba(82, 168, 236, 0.6);
        box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075), 0 0 8px rgba(82, 168, 236, 0.6);
    }


    fieldset, legend {
        color: black;
    }


    /* BUTTONS
    ----------------------------------------------------------*/
    /*.Button, .button, input[type="button"] {*/
    .Button, .button {
     background: #f9f9f9;
        background: -moz-linear-gradient(top, #f9f9f9 0%, #f7f7f7 50%, #f3f3f3 100%);
        background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#f9f9f9), color-stop(50%,#f7f7f7), color-stop(100%,#f3f3f3));
        background: -webkit-linear-gradient(top, #f9f9f9 0%,#f7f7f7 50%,#f3f3f3 100%);
        background: -o-linear-gradient(top, #f9f9f9 0%,#f7f7f7 50%,#f3f3f3 100%);
        background: -ms-linear-gradient(top, #f9f9f9 0%,#f7f7f7 50%,#f3f3f3 100%);
        background: linear-gradient(to bottom, #f9f9f9 0%,#f7f7f7 50%,#f3f3f3 100%);
        filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#f9f9f9', endColorstr='#f3f3f3',GradientType=0 );
     
     -moz-border-radius:6px;
     -webkit-border-radius:6px;
     border-radius:6px;
     border:1px solid #6d747c;
        -moz-box-shadow:inset 0px 1px 0px 0px #FFF;
     -webkit-box-shadow:inset 0px 1px 0px 0px #FFF;
     box-shadow:inset 0px 1px 0px 0px #FFF;
     color: rgb(31, 28, 26);
     font-family:Arial, Helvetica, sans-serif;
     
     padding:4px 15px;
     text-decoration:none;
     text-shadow: 0px 1px 0px rgba(255,255,255, 0.8);
    }
    .Button:hover, .button:hover {
     background: #ffffff;
        background: -moz-linear-gradient(top, #ffffff 0%, #e5e5e5 100%);
        background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#ffffff), color-stop(100%,#e5e5e5));
        background: -webkit-linear-gradient(top, #ffffff 0%,#e5e5e5 100%);
        background: -o-linear-gradient(top, #ffffff 0%,#e5e5e5 100%);
        background: -ms-linear-gradient(top, #ffffff 0%,#e5e5e5 100%);
        background: linear-gradient(to bottom, #ffffff 0%,#e5e5e5 100%);
        filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#e5e5e5',GradientType=0 );


        border:1px solid #333333;
    }
    .Button:active, .button:active {
     background: #dddddd;
        background: -moz-linear-gradient(top, #dddddd 0%, #f7f7f7 100%);
        background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#dddddd), color-stop(100%,#f7f7f7));
        background: -webkit-linear-gradient(top, #dddddd 0%,#f7f7f7 100%);
        background: -o-linear-gradient(top, #dddddd 0%,#f7f7f7 100%);
        background: -ms-linear-gradient(top, #dddddd 0%,#f7f7f7 100%);
        background: linear-gradient(to bottom, #dddddd 0%,#f7f7f7 100%);
        filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#dddddd', endColorstr='#f7f7f7',GradientType=0 );
     
     -moz-box-shadow: inset, 0 0px 3px rgba(0,0,0,.3); 
     -webkit-box-shadow: inset 0px 0px 3px rgba(0,0,0,.3);   
     box-shadow: inset 0px 0px 3px rgba(0,0,0,.3);
     position:relative;
     top:1px;
    }


    .Button:disabled, .button:disabled,
    #divMsgControlBar .button:disabled, #divMsgControlBar .Button:disabled {
     background: #F0F0F0;
        color: silver;
     -moz-border-radius:6px;
     -webkit-border-radius:6px;
     border-radius:6px;
     border:1px solid #6d747c;
        -moz-box-shadow:inset 0px 1px 0px 0px #bbdaf7;
     -webkit-box-shadow:inset 0px 1px 0px 0px #bbdaf7;
     box-shadow:inset 0px 1px 0px 0px #bbdaf7;
     display:inline-block;
     font-family:arial;
     font-weight:bold;
     padding:4px 15px;
     text-decoration:none;
     text-shadow:1px 1px 0px #528ecc;
        top: 0;
    }



    #divMsgControlBar .button, #divMsgControlBar .Button {
     background: #f9f9f9;
        background: -moz-linear-gradient(top, #f9f9f9 0%, #f7f7f7 50%, #f3f3f3 100%);
        background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#f9f9f9), color-stop(50%,#f7f7f7), color-stop(100%,#f3f3f3));
        background: -webkit-linear-gradient(top, #f9f9f9 0%,#f7f7f7 50%,#f3f3f3 100%);
        background: -o-linear-gradient(top, #f9f9f9 0%,#f7f7f7 50%,#f3f3f3 100%);
        background: -ms-linear-gradient(top, #f9f9f9 0%,#f7f7f7 50%,#f3f3f3 100%);
        background: linear-gradient(to bottom, #f9f9f9 0%,#f7f7f7 50%,#f3f3f3 100%);
        filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#f9f9f9', endColorstr='#f3f3f3',GradientType=0 );
     
     -moz-border-radius:6px;
     -webkit-border-radius:6px;
     border-radius:6px;
     border:1px solid #6d747c;
        -moz-box-shadow:inset 0px 1px 0px 0px #FFF;
     -webkit-box-shadow:inset 0px 1px 0px 0px #FFF;
     box-shadow:inset 0px 1px 0px 0px #FFF;
     display:inline-block;
     color: rgb(31, 28, 26);
     font-family:Arial, Helvetica, sans-serif;
        font-size: 12px;
     padding: 3px 5px;
     text-decoration:none;
     text-shadow: 0px 1px 0px rgba(255,255,255, 0.8);
    }


    #divMsgControlBar .button:hover, #divMsgControlBar .Button:hover {
     background: #ffffff;
        background: -moz-linear-gradient(top, #ffffff 0%, #e5e5e5 100%);
        background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#ffffff), color-stop(100%,#e5e5e5));
        background: -webkit-linear-gradient(top, #ffffff 0%,#e5e5e5 100%);
        background: -o-linear-gradient(top, #ffffff 0%,#e5e5e5 100%);
        background: -ms-linear-gradient(top, #ffffff 0%,#e5e5e5 100%);
        background: linear-gradient(to bottom, #ffffff 0%,#e5e5e5 100%);
        filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#e5e5e5',GradientType=0 );


        border:1px solid #333333;
    }
     
    #divMsgControlBar .button:active, #divMsgControlBar .Button:active {
        background: #dddddd;
        background: -moz-linear-gradient(top, #dddddd 0%, #f7f7f7 100%);
        background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#dddddd), color-stop(100%,#f7f7f7));
        background: -webkit-linear-gradient(top, #dddddd 0%,#f7f7f7 100%);
        background: -o-linear-gradient(top, #dddddd 0%,#f7f7f7 100%);
        background: -ms-linear-gradient(top, #dddddd 0%,#f7f7f7 100%);
        background: linear-gradient(to bottom, #dddddd 0%,#f7f7f7 100%);
        filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#dddddd', endColorstr='#f7f7f7',GradientType=0 );
     
     -moz-box-shadow: inset, 0 0px 3px rgba(0,0,0,.3); 
     -webkit-box-shadow: inset 0px 0px 3px rgba(0,0,0,.3);   
     box-shadow: inset 0px 0px 3px rgba(0,0,0,.3);
     position:relative;
     top:1px;
    }


    .messageSeparator {
        border-bottom: 1px solid #0c96ff;
    }


    /* Dashboard message area
    ----------------------------------------------------------*/


    #divMsgControlBar{
     background-color:#EBECED;
        color: #000000;
        padding: 4px 8px 4px 8px;
        text-shadow: 0 1px 0 rgba(255, 255, 255, 0.8);
        vertical-align: top;
     border-bottom: 1px solid #999999;
        -moz-box-shadow: 0px 0px 5px rgba(0, 0, 0, 0.07);
     -webkit-box-shadow: 0px 0px 5px rgba(0, 0, 0, 0.07);
     box-shadow: 0px 0px 5px rgba(0, 0, 0, 0.07);
    }


    #divMsgContent .a {
     font-size:10px;
    }


    /* main layout
    ----------------------------------------------------------*/
    .header {
        color: #FFFFFF;
        margin: 0;
        background: #1c6ac9;
        background: -moz-linear-gradient(top, #1c6ac9 0%, #164f99 100%);
        background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#1c6ac9), color-stop(100%,#164f99));
        background: -webkit-linear-gradient(top, #1c6ac9 0%,#164f99 100%);
        background: -o-linear-gradient(top, #1c6ac9 0%,#164f99 100%);
        background: -ms-linear-gradient(top, #1c6ac9 0%,#164f99 100%);
        background: linear-gradient(to bottom, #1c6ac9 0%,#164f99 100%);
        filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#1c6ac9', endColorstr='#164f99',GradientType=0 );
     -moz-box-shadow: 0px 0px 5px rgba(0, 0, 0, 0.07);
     -webkit-box-shadow: 0px 0px 5px rgba(0, 0, 0, 0.07);
     box-shadow: 0px 0px 5px rgba(0, 0, 0, 0.07);
    }


    .title {
        color:#FFFFFF;
     text-shadow: 0px 1px 0px rgba(0, 0, 0, .8);
        font-weight: normal;
        font-size: 31.5px;
     line-height: 1.4em;
        padding-left: 15px;
        padding-top: 8px;
     padding-bottom: 10px;
    }


    .reportTitle {
        color: #FFFFFF;
     text-shadow: -1px 1px 0px rgba(0, 0, 0, .8);
        font-weight: normal;
        font-size: 31.5px;
        padding: 15px 0px 0px 15px;
        display: inline-block;
    }


    .errorTitle {
        color: white;
        font-weight: bold;
        font-size: 22px;
        padding-left: 15px;
        padding-top: 10px;
        margin-left: 24px;
    }


    .reportNumber {
     color: #FFFFFF;
        padding-left: 15px;
     font-size:17.5px;
     font-style:italic;
     line-height:1.4em;
     text-shadow: -1px 1px 0px rgba(0, 0, 0, .8);
    }


    .offlineMobileNumber {
     color: #FFFFFF;
        display: block;
        padding-left: 15px;
     font-size:16px;
     font-style:italic;
     line-height:1.4em;
     text-shadow: -1px 1px 0px rgba(0, 0, 0, .8);
    }


    #Grids {
        height: auto;
        overflow: auto;
    }


    #Notifications {
        border-collapse: separate;
        border-spacing: 4px;
        display: table;
        width: 100%;
    }
    #Notifications div.divNotifications {
        padding-right: 8px;
    }#Notifications div.divNotifications:last-child {
        padding-right: 0;
    }


    .divNotifications {
        display: table-cell;
        height: inherit;
        width: 33%;
    }


    .notificationsHeader {
        background: #0c96ff;
        background: -moz-linear-gradient(top, #0c96ff 0%, #0064c8 100%);
        background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#0c96ff), color-stop(100%,#0064c8));
        background: -webkit-linear-gradient(top, #0c96ff 0%,#0064c8 100%);
        background: -o-linear-gradient(top, #0c96ff 0%,#0064c8 100%);
        background: -ms-linear-gradient(top, #0c96ff 0%,#0064c8 100%);
        background: linear-gradient(to bottom, #0c96ff 0%,#0064c8 100%);
        filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#0c96ff', endColorstr='#0064c8',GradientType=0 );


     -moz-box-shadow: 0px 0px 5px rgba(0, 0, 0, 0.07);
     -webkit-box-shadow: 0px 0px 5px rgba(0, 0, 0, 0.07);
     box-shadow: 0px 0px 5px rgba(0, 0, 0, 0.07);
        -webkit-border-top-right-radius: 8px;
        -webkit-border-top-left-radius: 8px;
        -moz-border-top-right-radius: 8px;
        -moz-border-top-left-radius: 8px;
        border-top-right-radius: 8px;
        border-top-left-radius: 8px;
     text-align:center;
        color: #FFF;
        display: block;
        padding: .7em 1.5em;
     font-size:16px;
     font-style:normal;
     text-shadow: 0px -1px 1px rgba(0, 0, 0, 0.5);
    }


    .gradientBorders {
      background:  #0064c8;
     
        -webkit-border-bottom-right-radius: 8px;
        -webkit-border-bottom-left-radius: 8px;
        -moz-border-bottom-right-radius: 8px;
        -moz-border-bottom-left-radius: 8px;
        border-bottom-right-radius: 8px;
        border-bottom-left-radius: 8px;
     
        margin: 0 4px 8px 4px;
     padding: 2px 2px 2px 2px;
     
     -moz-box-shadow: 0px 0px 5px rgba(0, 0, 0, 0.07);
     -webkit-box-shadow: 0px 0px 5px rgba(0, 0, 0, 0.07);
     box-shadow: 0px 0px 5px rgba(0, 0, 0, 0.07);
    }


    .notificationBorders {
      background:  #0064c8;
       
        -webkit-border-bottom-right-radius: 8px;
        -webkit-border-bottom-left-radius: 8px;
        -moz-border-bottom-right-radius: 8px;
        -moz-border-bottom-left-radius: 8px;
        border-bottom-right-radius: 8px;
        border-bottom-left-radius: 8px;
        padding: 0 2px 2px 2px;
     -moz-box-shadow: 0px 0px 5px rgba(0, 0, 0, 0.07);
     -webkit-box-shadow: 0px 0px 5px rgba(0, 0, 0, 0.07);
     box-shadow: 0px 0px 5px rgba(0, 0, 0, 0.07);
    }


    .innerGradientBorders {
         background: #ffffff;
     -webkit-border-top-right-radius: 0px;
        -webkit-border-top-left-radius: 0px;
        -moz-border-top-right-radius: 0px;
        -moz-border-top-left-radius: 0px;
        border-top-right-radius: 0px;
        border-top-left-radius: 0px;
        -webkit-border-bottom-right-radius: 8px;
        -webkit-border-bottom-left-radius: 8px;
        -moz-border-bottom-right-radius: 8px;
        -moz-border-bottom-left-radius: 8px;
        border-bottom-right-radius: 8px;
        border-bottom-left-radius: 8px;
     
        height: 100%;
        overflow-y: auto;
        padding: 0px;
    }


    #reportHeader a,
    .rtsReportToolBar a, .rtsReportToolBar a:hover {
        color: white;
        background-position: top;
    }


    .reportContentWrapper {
        margin-left: 165px;
        margin-top: 5px;
        height: 100%;
    }


    .reportContentWrapperNoLeftMargin {
        margin-top: 5px;
        height: 100%;
    }


    #reportContent, #moduleContent, .content {
        height: 100%;
    }


    #moduleContentWrapper, .contentWrapper {
        padding-left: 0px;
        padding-top: 10px;
    }
    /*#moduleHeader, #schedulingHeader {
        -webkit-border-top-left-radius:0.5em;
     -moz-border-top-left-radius:0.5em;
     border-top-left-radius:0.5em;
    }*/


    #main-content, .main-content {
        overflow-y: auto;
    }


    /* tabs
    ----------------------------------------------------------*/
    #tabs{
        background: #F0F0F0;
        overflow: hidden;
        margin: 4px 4px -5px 4px;
     /*-moz-box-shadow: 0px 0px 4px rgba(0,0,0,.5);
     -webkit-box-shadow: 0px 0px 4px rgba(0,0,0,.5);
     box-shadow: 0px 0px 4px rgba(0,0,0,.5);*/
     display:inline-block;
        list-style: none;
        padding: 0px 0px 0px 0px;
        white-space: nowrap;
     -webkit-border-radius: 10px 10px 0 0;
        -moz-border-radius: 10px 10px 0 0;
        border-radius: 10px 10px 0 0;
    }


    #tabs li{
        float: left;
        margin: 0 0 0 0;
     padding-bottom: 0px;
    }


    #tabs a {
     background: #0fa0ff;
     background: -moz-linear-gradient(top, #0fa0ff 0%, #0064c8 100%);
     background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#0fa0ff), color-stop(100%,#0064c8));
     background: -webkit-linear-gradient(top, #0fa0ff 0%,#0064c8 100%);
     background: -o-linear-gradient(top, #0fa0ff 0%,#0064c8 100%);
     background: -ms-linear-gradient(top, #0fa0ff 0%,#0064c8 100%);
     background: linear-gradient(to bottom, #0fa0ff 0%,#0064c8 100%);
     filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#0fa0ff', endColorstr='#0064c8',GradientType=0 );
     position: relative;
     padding: 10px;
        float: left;
     display:inline-block;
        text-decoration: none;
     font-weight: normal;
     font-size: 16px;
     border-right: solid 1px #0c96ff;
     border-left: solid 1px #003399;
     color: #FFFFFF;
    }


    #tabs a:hover,
    #tabs a:hover::after,
    #tabs a:focus,
    #tabs a:focus::after{
        background: #50c6fc;
        background: -moz-linear-gradient(top, #50c6fc 0%, #0674ce 100%);
        background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#50c6fc), color-stop(100%,#0674ce));
        background: -webkit-linear-gradient(top, #50c6fc 0%,#0674ce 100%);
        background: -o-linear-gradient(top, #50c6fc 0%,#0674ce 100%);
        background: -ms-linear-gradient(top, #50c6fc 0%,#0674ce 100%);
        background: linear-gradient(to bottom, #50c6fc 0%,#0674ce 100%);
        filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#50c6fc', endColorstr='#0674ce',GradientType=0 );
        color: #FFFFFF;
        border-right: solid 1px #0c96ff;
        border-left: solid 1px #164f99;
    }


    #tabs a:focus{
        outline: 0;
    }


    #tabs .current a{
        background: #1c6ac9;
        background: -moz-linear-gradient(top, #1c6ac9 0%, #164f99 100%);
        background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#1c6ac9), color-stop(100%,#164f99));
        background: -webkit-linear-gradient(top, #1c6ac9 0%,#164f99 100%);
        background: -o-linear-gradient(top, #1c6ac9 0%,#164f99 100%);
        background: -ms-linear-gradient(top, #1c6ac9 0%,#164f99 100%);
        background: linear-gradient(to bottom, #1c6ac9 0%,#164f99 100%);
        filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#1c6ac9', endColorstr='#164f99',GradientType=0 );
     
        color: #FFF;
     border-right: solid 1px #1c6ac9;
     border-left: solid 1px #164f99;
        text-shadow: 0 1px 0 rgba(0, 0, 0, 0.5);
        z-index: 3;
    }


    /* ComponentArt tabs
    ----------------------------------------------------------*/
    .DefaultTab, .SubDefaultTab {
        /*position: relative;*/
        /* commented out this was overriding the gradient in IE8 and IE9
            background: rgb(187,187,187);*/
        background-image: -webkit-gradient(linear, left top, left bottom, from(#bbb), to(#6d6e71));
        background-image: -webkit-linear-gradient(top, #bbb, #6d6e71);
        background-image: -moz-linear-gradient(top, #bbb, #6d6e71);
        background-image: -ms-linear-gradient(top, #bbb, #6d6e71);
        background-image: -o-linear-gradient(top, #bbb, #6d6e71);
        background-image: linear-gradient(to bottom, #bbb, #6d6e71); 
        filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#bbbbbb', endColorstr='#6d6e71',GradientType=0 );
        float: left;
        text-decoration: none;
        color: #fff;
        text-shadow: 0 1px 0 rgba(0, 0, 0, 0.8);
        -webkit-border-radius: 5px 5px 0 0;
        -moz-border-radius: 5px 5px 0 0;
        border-radius: 5px 5px 0 0;
     border-bottom:#666 1px solid;
        cursor:pointer;
    }


    .DefaultTabHover, .DefaultTab:hover,
    .SubDefaultTabHover, .SubDefaultTab:hover
    {
        background: rgb(187,187,187);
        background: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/Pgo8c3ZnIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgd2lkdGg9IjEwMCUiIGhlaWdodD0iMTAwJSIgdmlld0JveD0iMCAwIDEgMSIgcHJlc2VydmVBc3BlY3RSYXRpbz0ibm9uZSI+CiAgPGxpbmVhckdyYWRpZW50IGlkPSJncmFkLXVjZ2ctZ2VuZXJhdGVkIiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgeDE9IjAlIiB5MT0iMCUiIHgyPSIwJSIgeTI9IjEwMCUiPgogICAgPHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iI2JiYmJiYiIgc3RvcC1vcGFjaXR5PSIxIi8+CiAgICA8c3RvcCBvZmZzZXQ9IjEwMCUiIHN0b3AtY29sb3I9IiM5ZTlmYTEiIHN0b3Atb3BhY2l0eT0iMSIvPgogIDwvbGluZWFyR3JhZGllbnQ+CiAgPHJlY3QgeD0iMCIgeT0iMCIgd2lkdGg9IjEiIGhlaWdodD0iMSIgZmlsbD0idXJsKCNncmFkLXVjZ2ctZ2VuZXJhdGVkKSIgLz4KPC9zdmc+);
        background: -moz-linear-gradient(top, rgba(187,187,187,1) 0%, rgba(158,159,161,1) 100%);
        background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(187,187,187,1)), color-stop(100%,rgba(158,159,161,1)));
        background: -webkit-linear-gradient(top, rgba(187,187,187,1) 0%,rgba(158,159,161,1) 100%);
        background: -o-linear-gradient(top, rgba(187,187,187,1) 0%,rgba(158,159,161,1) 100%);
        background: -ms-linear-gradient(top, rgba(187,187,187,1) 0%,rgba(158,159,161,1) 100%);
        background: linear-gradient(to bottom, rgba(187,187,187,1) 0%,rgba(158,159,161,1) 100%);
        filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#bbbbbb', endColorstr='#9e9fa1',GradientType=0 );
        float: left;
     color: #fff;
        text-shadow: 0 1px 0 rgba(0, 0, 0, 0.8);
        text-decoration: none;
        -webkit-border-radius: 5px 5px 0 0;
        -moz-border-radius: 5px 5px 0 0;
        border-radius: 5px 5px 0 0;
     border-bottom:#666 1px solid;
        cursor:pointer;
    }


    .SelectedTab, .DefaultTab:active,
    .SubSelectedTab, .SubDefaultTab:active
    {
        color:#000;
        text-shadow: 0 1px 0 rgba(255, 255, 255, 0.8);
        float: left;
        text-decoration: none;
        -webkit-border-radius: 5px 5px 0 0;
        -moz-border-radius: 5px 5px 0 0;
        border-radius: 5px 5px 0 0;
        background-color:none;
        font-family: Arial;
        font-size: 14px;
        line-height:20px;
        cursor:pointer;
        text-align: center;
        border-top:#666 1px solid;
        border-right:#666 1px solid;
        border-left:#666 1px solid;
        border-bottom:solid 1px transparent;
    }


    /* data tables
    ----------------------------------------------------------*/
    .dashboardDataGrid {
        background-color:#bebebe;
        -webkit-border-radius: 0px;
        -moz-border-radius: 0px;
        border-radius: 0px;
        border-spacing: 1px;
        border-collapse: separate;
        width: 100%;
    }
    .dashboardDataGrid tr.dataGridRow:hover td,
    .dashboardDataGrid tr.dataGridAlternateRow:hover td,
    .dashboardDataGrid tr.dataListRow:hover td,
    .dashboardDataGrid tr.dataListAlternateRow:hover td,
    .dataGridHighlight
     {
       background: #dde9ff;
        background: -moz-linear-gradient(top, #dde9ff 0%, #c9e1ff 0%, #e0eeff 0%, #c9e1ff 100%);
        background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#dde9ff), color-stop(0%,#c9e1ff), color-stop(0%,#e0eeff), color-stop(100%,#c9e1ff));
        background: -webkit-linear-gradient(top, #dde9ff 0%,#c9e1ff 0%,#e0eeff 0%,#c9e1ff 100%);
        background: -o-linear-gradient(top, #dde9ff 0%,#c9e1ff 0%,#e0eeff 0%,#c9e1ff 100%);
        background: -ms-linear-gradient(top, #dde9ff 0%,#c9e1ff 0%,#e0eeff 0%,#c9e1ff 100%);
        background: linear-gradient(to bottom, #dde9ff 0%,#c9e1ff 0%,#e0eeff 0%,#c9e1ff 100%);
        filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#dde9ff', endColorstr='#c9e1ff',GradientType=0 );
        cursor: pointer;
    }
    .dashboardDataGrid tr td{
     padding: 3px 4px;
    }


    .dataGrid {
        background-color:#bebebe;
        -webkit-border-radius: 5px;
        -moz-border-radius: 5px;
        border-radius: 5px;
        border-spacing: 1px;
        border-collapse: separate;
    }
    .dataGrid tr td {
        padding: 4px 5px;
    }


    .dataGridHeader td, .dataGridHeader th, .dataGridHeader {
        background: #f2f2f2;
        background: -moz-linear-gradient(top, #f2f2f2 0%, #cedbe8 100%);
        background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#f2f2f2), color-stop(100%,#cedbe8));
        background: -webkit-linear-gradient(top, #f2f2f2 0%,#cedbe8 100%);
        background: -o-linear-gradient(top, #f2f2f2 0%,#cedbe8 100%);
        background: -ms-linear-gradient(top, #f2f2f2 0%,#cedbe8 100%);
        background: linear-gradient(to bottom, #f2f2f2 0%,#cedbe8 100%);
        filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#f2f2f2', endColorstr='#cedbe8',GradientType=0 );
        color: rgb(0, 100, 200);
        padding: 8px;
        text-shadow: 0 -1px 0 rgba(255, 255, 255, 0.5);
        text-align: left;
    }
    #taskInnerWrapper .dataGridRow a,
    #taskInnerWrapper .dataGridAlternateRow a {
        color: black;
        text-decoration: none;
        font-weight: normal;
    }


    tr.dataGridHeader td a, tr.dataGridHeader th a {
        color: rgb(0, 100, 200);
     text-decoration:none;
     font-weight: normal;
    }
    tr.dataGridHeader td a:hover, tr.dataGridHeader th a:hover {
        color: rgb(0, 100, 200);
     text-decoration:underline;
     font-weight: normal;
    }


    .dataGridHeader td:first-child, .dataGridHeader th:first-child {
        -webkit-border-top-left-radius: 5px;
        -moz-border-top-left-radius: 5px;
        border-top-left-radius: 5px;
    }


    .dataGridHeader td:last-child, .dataGridHeader th:last-child {
        -webkit-border-top-right-radius: 5px;
        -moz-border-top-right-radius: 5px;
        border-top-right-radius: 5px;
    }


    .dataGridFooter, tr.dataGridFooter td {
        background: #f2f2f2;
        background: -moz-linear-gradient(top, #f2f2f2 0%, #cedbe8 100%);
        background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#f2f2f2), color-stop(100%,#cedbe8));
        background: -webkit-linear-gradient(top, #f2f2f2 0%,#cedbe8 100%);
        background: -o-linear-gradient(top, #f2f2f2 0%,#cedbe8 100%);
        background: -ms-linear-gradient(top, #f2f2f2 0%,#cedbe8 100%);
        background: linear-gradient(to bottom, #f2f2f2 0%,#cedbe8 100%);
        filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#f2f2f2', endColorstr='#cedbe8',GradientType=0 );
        color: rgb(0, 100, 200);
        text-shadow: 0 -1px 0 rgba(255, 255, 255, 0.5);
        padding: 0;
    }
    .dataGridFooter td:first-child {
        -webkit-border-bottom-left-radius: 5px;
        -moz-border-bottom-left-radius: 5px;
        border-bottom-left-radius: 5px;
    }


    .dataGridFooter td:last-child {
        -webkit-border-bottom-right-radius: 5px;
        -moz-border-bottom-right-radius: 5px;
        border-bottom-right-radius: 5px;
    }


    .dataGridRow, .dataListRow {
        background-color: white;
    }
    .dataListAlternateSolidRow {
        background-color: #efefef;
    }


    .dataGridAlternateRow td, .dataListAlternateRow,
    .rgAltRow {
        background: #F0F0F0;
    }


    .dataGridPaging {
        background-color: transparent;
     font-family: verdana;
     font-weight: bold;
     font-size: 9pt;
        height: 5px;
    }


    .dataGridPaging a {
        color: #00ACFC;
        text-decoration: none;
    }
    a.selectedPageLink, .dataGridPaging a:hover,
    .dataGridPaging span {
        color: #1d1e21;
        text-decoration: none;
    }


    td.dataGridHeaderSortedUp, th.dataGridHeaderSortedUp, .dataGridHeaderSortedUp {
     background: url(Images/arrow_blue_up.png) no-repeat right 50%;
        padding-right: 15px;
    }


    td.dataGridHeaderSortedDown, th.dataGridHeaderSortedDown, .dataGridHeaderSortedDown {
     background: url(Images/arrow_blue_down.png) no-repeat right 50%;
        padding-right: 15px;
    }


    .topLeftRounded {
        -webkit-border-top-left-radius:0.5em;
     -moz-border-top-left-radius:0.5em;
     border-top-left-radius:0.5em;
    }



    /* forms
    ----------------------------------------------------------*/
    .sectionHeader {
        display: block;
        padding: 0;
        margin-bottom: 10px;
        color: #333333;
        border: 0;
        font-size: 21px;
        line-height: 40px;
        text-shadow: 0 1px 0 rgba(255, 255, 255, 0.8);
    }


    .sectionSubHeader {
        display: block;
        padding: 0;
        margin-bottom: 5px;
        margin-top: 5px;
        color: #333333;
        border: 0;
        font-size: 18px;
        line-height: 30px;
        text-shadow: 0 1px 0 rgba(255, 255, 255, 0.8);
    }


    /* misc
    ----------------------------------------------------------*/
    .close {
        cursor: pointer;
        padding-right: 5px;
        text-decoration: underline;
    }



    .vsMaster {
        color: Red;
        background-color: Yellow;
        text-align: center;
        font-weight: bold;
        z-index: 1000;
        position: absolute;
        width: 600px;
        margin-left: 240px;
        margin-top: -12px;
        -webkit-box-shadow: -2px 2px 6px 0px #000;
        box-shadow: -2px 2px 6px 0px #000;
        padding: 5px;
        -webkit-border-radius: 4px;
        border-radius: 4px;
    }


    .divLine {
        background-color: rgb(0,100,210);
        padding-bottom: 5px;
    }


    #divCautionAlert {
        background-color: #efefef;
        border: 2px solid #bebebe;
        border-radius: 5px;
        position: absolute;
        z-index: 100;
    }


    .informLabel {
        color: rgb(192, 152, 83);
        display: block;
        padding: 8px 35px 8px 14px;
        margin-bottom: 20px;
        text-shadow: 0px 1px 0px rgba(255, 255, 255, 0.5);
        background-color: rgb(252, 248, 227);
        border: 1px solid rgb(251, 238, 213);
        border-radius: 4px 4px 4px 4px;
        margin-bottom: 5px;
    }


    .ReadOnlyFlat {
     display: inline;
     border: solid 1px #ccccdd;
     background-color: #f9f9f9;
     color: #000033;
     cursor:default;
     
    }


    .ReadOnlyFlatNew {
     display: inline;
     border: solid 1px #ccccdd;
     background-color: #f9f9f9;
     color: #000033;
     cursor:default;
     border-right-width: 0px;
    }


    .visitorTrackingLegend {
        background-color: #939393;
        color: white;
        text-shadow: 0 1px 0 rgba(0, 0, 0, 0.8);
    }


    .border-gray {
        border: 1px solid gray;
    }
     
    .errormessage
    {
     color: RED;
     font-weight:bold;
    }


    .controlsBgdColor {
        background-color: #c0c0c0;
    }


    .printPrepBorder {
        border-radius: 10px;
        border: 3px solid black;
        margin: 10px;
    }


    .instructions {
        position: absolute;
        display: none;
        width: 250px;
        overflow: auto;
        border-style: solid;
        border-width: thin;
        height: 220px;
        background-color: white;
        padding: 5px;
        z-index: 100;
    }


    .keyRingCheckOutBorderBottom {
        border-bottom: 1px solid black;
    }
    .keyRingCheckOutBorderRight {
        border-right: 1px solid black;
    }


    .success {
        font-weight: bold;
        color: green;
    }


    tr.TrespassCautionBoloHighlight {
        background-color: #0fe020;
        color: black;
    }
    tr.LateCheckOutHighlight {
        background-color: #ff9966;
        color: black;
    }
    tr.FrequentVisitor {
        background-color: #d5ed9c;
        color: black;
    }
    tr.TrespassCautionBoloHighlight td a,
    tr.TrespassCautionBoloHighlight td a:link,
    tr.TrespassCautionBoloHighlight td a:visited,
    tr.TrespassCautionBoloHighlight td a:hover,
    tr.TrespassCautionBoloHighlight td a:active,
    tr.LateCheckOutHighlight td a,
    tr.LateCheckOutHighlight td a:link,
    tr.LateCheckOutHighlight td a:visited,
    tr.LateCheckOutHighlight td a:hover,
    tr.LateCheckOutHighlight td a:active,
    tr.FrequentVisitor td a,
    tr.FrequentVisitor td a:link,
    tr.FrequentVisitor td a:visited,
    tr.FrequentVisitor td a:hover,
    tr.FrequentVisitor td a:active {
        color: black;
    }



    tr td.StatusNew {
        background: white;
    }


    .dashboardDataGrid tr.dataGridRow:hover td.StatusNew,
    .dashboardDataGrid tr.dataGridAlternateRow:hover td.StatusNew,
    .dashboardDataGrid tr.dataListRow:hover td.StatusNew,
    .dashboardDataGrid tr.dataListAlternateRow:hover td.StatusNew {
        background: #f0f0f0;
    }


    tr td.StatusInProgress {
        background: #ffff97;
    }


    .dashboardDataGrid tr.dataGridRow:hover td.StatusInProgress,
    .dashboardDataGrid tr.dataGridAlternateRow:hover td.StatusInProgress,
    .dashboardDataGrid tr.dataListRow:hover td.StatusInProgress,
    .dashboardDataGrid tr.dataListAlternateRow:hover td.StatusInProgress {
        background: #ffff53;
    }


    tr td.StatusReady {
        background: #a0ffae;
    }


    .dashboardDataGrid tr.dataGridRow:hover td.StatusReady,
    .dashboardDataGrid tr.dataGridAlternateRow:hover td.StatusReady,
    .dashboardDataGrid tr.dataListRow:hover td.StatusReady,
    .dashboardDataGrid tr.dataListAlternateRow:hover td.StatusReady {
        background: #77FF8B ;
    }


    .entityTrespass {
        background-color: #0fe020;
        color: black;
    }
    .entityTrespass a, .entityTrespass a:link, .entityTrespass a:hover, .entityTrespass a:active, .entityTrespass a:visited,
    .entityCaution a, .entityCaution a:link, .entityCaution a:hover, .entityCaution a:active, .entityCaution a:visited {
        color: black;
    }


    .entityCaution {
        background-color: red;
        color: black;
    }


    .radAjaxLoadingPanel {
        background-color: lightblue;
        background: lightblue;
    }


    #global-application-overlay {
        z-index: 9999999;
        position: absolute;
        height: 100%;
        width: 100%;
        background-color: rgba(255,255,255, 0.5);
        top: 0;
        left: 0;
        display: none;
    }
    .global-application-overlay-spinner-wrapper {
        width: 173px;
        height: 173px;
        position: fixed;
        left: 50%;
        top: 50%;
        margin: -86px 0 0 -86px;
        background-image: url(Images/loading-spinner.gif);
        background-repeat: no-repeat;
    }


    .k-filter-menu label {
        margin-right: 15px !important;
    }
    input[type=radio], input[type=checkbox] {
        margin: 4px 4px 0 0 !important;
    }
    .k-filter-menu .k-combobox,
    .k-filter-menu .k-datepicker,
    .k-filter-menu .k-timepicker,
    .k-filter-menu .k-datetimepicker,
    .k-filter-menu .k-numerictextbox,
    .k-filter-menu .k-dropdown,
    .k-filter-menu .k-textbox {
        width: 15.8em;
    }
    #reportDynamicColumnList label{
        color: #164f99;
        display: block;
        font-weight: normal;
        line-height: 20px;
        margin-bottom: 5px;
        cursor: pointer;
    }
    #gridFilterDisplayer {
        padding: 8px;
        -ms-border-radius: 7px;
        border-radius: 7px;
    }
    dashboardDataGrid.table {
        background-color: transparent !important;
        -webkit-border-radius: 0px;
        -moz-border-radius: 0px;
        border-radius: 0px;
        border-spacing: 0px;
        border-collapse: separate;
        width: 100%;
    }
    .dataGridHeader td, .dataGridHeader th, .dataGridHeader {
        background-color: transparent !important;
    }


    .dashboardDataGrid.table > thead > tr > th,
    .dashboardDataGrid.table > thead > tr > td,
    .dashboardDataGrid.table > tbody > tr > td {
        border: inherit !important;
    }
    .dashboardDataGrid.table > tbody > tr > td {
        border-top: 1px solid #bebebe !important;
    }
    .filterDisplayerInput {
        border: 1px solid #ccc;
        background-color: #528eca;
        padding: 10px 3px 10px 8px;
        -ms-border-radius: 5px;
        border-radius: 5px;
        width: auto;
        max-height: 300px;
        overflow-y: auto;
        font-family: Helvetica;
        text-align: center;
        color: #fff;
        display: inline-block;
        max-width: 100%;
        float: left;
        margin: 10px;
        line-height: 100%;
    }
    .filterDisplayerInput .close{
        float: right;
        margin-left: 5px;
        cursor: pointer;
        font-size: 14px !important;
        text-decoration: none !important;
    }
    .filterDisplayerInput .close:hover, .filterDisplayerInput .close:focus {
        text-shadow: 1px 1px #000000;
    }
    .ms-res-ctn {
        min-height: 150px !important;
    }
    .panel-group{
        margin-bottom: 0px;
    }
    #searchPagesTemplateWrapper{
        padding-left: 10px;
        padding-right: 10px;
        padding-top: 5px;
        margin: 0 auto;
        max-width: 100%;
        background-color: white;
    }
    .dynamicColumnsTitle{
        font-weight: bold;
    }
    #gridDisplayerPanel #toggleIcon {
        font-size: 14px !important;
    }   
    .column-options-title-top{
        border-bottom: 1px dashed #ccc;
    }
    .column-options-title-top h3{
        color: #164f99;
        margin: 0px;
        padding-top: 10px;
        padding-bottom: 10px;
        font-size: 21px;
    }
    .column-options-title{
        border-bottom: 1px dashed #ccc;
        border-top: 1px dashed #ccc;
    }
    .column-options-title h3{
        color: #164f99;
        margin: 0px;
        padding-top: 10px;
        padding-bottom: 10px;
        font-size: 21px;
    }
    .gridTotalDisplayer{
        height: 32px;
        min-height: 32px;
        display: none;
        background-color: #fff;
    }
    #gridWrapper{
        padding-left: 10px;
        padding-right: 10px;
        padding-top: 5px;
        margin: 0 auto;
        max-width: 100%;
        background-color: white;
    }
    .panel-body {
        padding: 0px 15px 0px 15px;
    }
    span.contact-column-template{
        color: gray;
        font-style: italic;
    }

     

  8. Ivan Danchev
    Admin
    Ivan Danchev avatar
    829 posts

    Posted 25 Mar Link to this post

    Hello Lee,

    The forum does not allow attachments.

    I tested your CSS and with it applied no issue with the connection lines was observed, therefore I attached a sample runnable project. Please, modify it so that the problem is reproduced and post your modifications for further review.

    Regards,
    Ivan Danchev
    Telerik
    Do you need help with upgrading your ASP.NET AJAX, WPF or WinForms projects? Check the Telerik API Analyzer and share your thoughts.
  9. Lee
    Lee avatar
    16 posts
    Member since:
    Oct 2012

    Posted 31 Mar in reply to Ivan Danchev Link to this post

    I have found that if I use a built in skin, the vertical lines do not appear. But the font changes and the expand and collapse buttons disappear; only the lines appear. (There were small arrows before; see screen shots above) What's the easiest way to change those?

     

  10. Lee
    Lee avatar
    16 posts
    Member since:
    Oct 2012

    Posted 01 Apr in reply to Lee Link to this post

    Ivan,

    I found the local css file that has the markup for the RadTreeView and with the help of the tutorial on creating a custom skin, found the errant markrup.

    Thank you for your time and responses!

    Lee

  11. Ivan Danchev
    Admin
    Ivan Danchev avatar
    829 posts

    Posted 01 Apr Link to this post

    Hello Lee,

    Thank you for getting back to us. I am glad you managed to find what was causing the incorrect lines appearance and the issue is fixed.

    Regards,
    Ivan Danchev
    Telerik
    Do you need help with upgrading your ASP.NET AJAX, WPF or WinForms projects? Check the Telerik API Analyzer and share your thoughts.
  12. Bijender
    Bijender avatar
    4 posts
    Member since:
    Sep 2016

    Posted 08 Sep in reply to Lee Link to this post

    Hey Lee,

    I am facing same issue, can you please your solution

  13. Lee
    Lee avatar
    16 posts
    Member since:
    Oct 2012

    Posted 09 Sep in reply to Bijender Link to this post

    I found the local css file that controls the RadTreeView control and with the assistance of Telerik's tutorial, I figured out that there were duplicate lines in the css file and a background defined for the first line in error.
    (http://docs.telerik.com/devtools/aspnet-ajax/controls/treeview/appearance-and-styling/tutorial-on-creating-a-custom-skin)

    /*      ENTDEV-7215 LMK 4.1.2016    Duplicates with vertical lines in error    */
    /*.RadTreeView_ReportExecEnterprise .rtLines .rtFirst .rtUL { background-image: url('TreeView/NodeSpan.png'); }
    .RadTreeView_ReportExecEnterprise_rtl .rtLines .rtFirst .rtUL { background-image:url('TreeView/NodeSpan_rtl.png'); }*/
    .RadTreeView_ReportExecEnterprise .rtLines .rtFirst,

  14. Bijender
    Bijender avatar
    4 posts
    Member since:
    Sep 2016

    Posted 09 Sep in reply to Lee Link to this post

    Thanks Lee, any clue why all checkbox are coming check in actually the are unchecked in the backend. any hint will do.

    see the attachment, actual checked are little darker in color.

     

    Houston is checked rest should be uncheck, css is correct why image is not changing for unchecked.

  15. Lee
    Lee avatar
    16 posts
    Member since:
    Oct 2012

    Posted 09 Sep in reply to Bijender Link to this post

    Sorry, can't help you there. Good luck.

     

  16. Bijender
    Bijender avatar
    4 posts
    Member since:
    Sep 2016

    Posted 09 Sep in reply to Lee Link to this post

    thanks
  17. Ivan Danchev
    Admin
    Ivan Danchev avatar
    829 posts

    Posted 13 Sep Link to this post

    Hello Bijender,

    Since the issue you are experiencing is not related to this thread's subject, please open a separate one and provide all the necessary information that can help reproduce the problem including: controls version used, TreeView markup declaration, custom CSS, your logic for checking/unchecking the nodes.

    Regards,
    Ivan Danchev
    Telerik by Progress
    Do you need help with upgrading your ASP.NET AJAX, WPF or WinForms projects? Check the Telerik API Analyzer and share your thoughts.
Back to Top
UI for ASP.NET Ajax is Ready for VS 2017