I want to change folders in treeview icon or color?

4 posts, 0 answers
  1. Robert
    Robert avatar
    16 posts
    Member since:
    Feb 2016

    Posted 24 Feb Link to this post

    Hi,

    How to get to underlying css of folder icon in treeview?

    This answer presented here doesn't help much:

    http://www.telerik.com/forums/icon-override

    The idea is to have different icon for differnt root folders.

    thanks

  2. Joana
    Admin
    Joana avatar
    70 posts

    Posted 29 Feb Link to this post

    Hello Robert,

    In Lightweight RenderMode, RadFileExplorer uses font icons which might be easily customized via css. You could write selectors that fit your scenario. For example, the following code shows a dummy how to select only the root elements and change the color of the folder icon to Red.

    <style type="text/css">
        .RadTreeView > ul > li > div >span
        {
            color: Red;
        }
        </style>
    <telerik:RadFileExplorer ID="RadFileExplorer1" runat="server" Height="600px" RenderMode="Lightweight">       
                <Configuration ViewPaths="~/, ~/FileExplorer" UploadPaths="~/"
                DeletePaths="~/"></Configuration>
            </telerik:RadFileExplorer>

    A similar approach based on background images could be made for Classic RenderMode

    Regards,
    Joana
    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
  3. UI for ASP.NET Ajax is Ready for VS 2017
  4. Robert
    Robert avatar
    16 posts
    Member since:
    Feb 2016

    Posted 01 Mar in reply to Joana Link to this post

    hi, I have tried your solution but I got red only an arrow used to expand folder.

    Any reference somewhere about all css styles etc?

    How to for instant second folder in tree make also a red ?

     

    thanks

  5. Joana
    Admin
    Joana avatar
    70 posts

    Posted 02 Mar Link to this post

    Hello Robert,

    My example was for root folders only. To modify the color for all TreeView arrows you could use the  following selector:

    <style type="text/css">
        .RadTreeView ul li > div >span
        {
            color: Red;
        }
        </style>

    In the developer toolbar of your browser you could inspect the treeview elements and apply css rules to any you want. Regarding css styles, here some articles that might be useful:


    Regards,
    Joana
    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
Back to Top