Announcement

Collapse
No announcement yet.

Child Channel

Collapse
X
 
  • Filter
  • Time
  • Show
Clear All
new posts

  • Hectorsky
    replied
    It's fine Thanks

    Leave a comment:


  • Glenn Vergara
    replied
    What's the problem with the size? I saw you changed the image path that has the correct 16x11 size.

    Leave a comment:


  • Hectorsky
    replied
    Fixed , no worries Thanks

    Leave a comment:


  • Hectorsky
    replied
    Originally posted by Glenn Vergara View Post
    Change

    Code:
    background-image: url('/flags/Flag_of_Switzerland.svg.png');
    to:

    Code:
    background: url('/flags/Flag_of_Switzerland.svg.png');
    Btw, the actual flag size is 16x16 but you are setting it in CSS to 16x11 which cuts off the image. And also you don't have to specify the width and height in the repeating blocks for each flag. The width and height are already set once in the non-repeating block.

    Ok work , but now , there is a problem with size of icon ,...

    Leave a comment:


  • Glenn Vergara
    replied
    Change

    Code:
    background-image: url('/flags/Flag_of_Switzerland.svg.png');
    to:

    Code:
    background: url('/flags/Flag_of_Switzerland.svg.png');
    Btw, the actual flag size is 16x16 but you are setting it in CSS to 16x11 which cuts off the image. And also you don't have to specify the width and height in the repeating blocks for each flag. The width and height are already set once in the non-repeating block.

    Leave a comment:


  • Hectorsky
    replied
    Originally posted by Glenn Vergara View Post
    You didn't add this block correctly.

    Code:
    [COLOR=#008000]/* Repeat this block for [I][B]every [/B][/I]subforum specifying appropriate image path and nodeid ([/COLOR][COLOR=#FF0000]29[/COLOR][COLOR=#008000] is used in this sample) */[/COLOR]
    .forum-list-container .subforum-list .subforum-item[data-channel-id="[COLOR=#FF0000]29[/COLOR]"] .icon,
    #forum[COLOR=#FF0000]29[/COLOR].sub .cell-forum .icon {
    background-image: url('/flags/[COLOR=#FF0000]Flag_of_Switzerland.svg.png[/COLOR]');
    }
    You have to add that block for each subforum id and specify the appropriate image path for the flag and nodeid. If you have 30 different flags, then you have to add that block 30 times with different image paths and nodeids.

    Same issue :

    HTML Code:
    /* Add this block only once */
    .forum-list-container .subforum-list .subforum-item .icon.new,
    .forum-list-container .forum-item.sub.new .cell-forum .icon {
    -webkit-filter: grayscale(0);
    filter: grayscale(0);
    }
    .forum-list-container .subforum-list .subforum-item .icon,
    .forum-list-container .forum-item.sub .cell-forum .icon {
    width: 16px;
    height: 11px;
    -webkit-filter: grayscale(100%);
    filter: grayscale(100%);
    }
    
    
    /* Repeat this block for every subforum specifying appropriate image path and nodeid (29 is used in this sample) */
    .forum-list-container .subforum-list .subforum-item[data-channel-id="29"] .icon,
    #forum29.sub .cell-forum .icon {
        background-image: url('/flags/Flag_of_Switzerland.svg.png');
        width: 16px; /* icon width */
    height: 11px; /* icon height */
    }

    Leave a comment:


  • Glenn Vergara
    replied
    You didn't add this block correctly.

    Code:
    [COLOR=#008000]/* Repeat this block for [I][B]every [/B][/I]subforum specifying appropriate image path and nodeid ([/COLOR][COLOR=#FF0000]29[/COLOR][COLOR=#008000] is used in this sample) */[/COLOR]
    .forum-list-container .subforum-list .subforum-item[data-channel-id="[COLOR=#FF0000]29[/COLOR]"] .icon,
    #forum[COLOR=#FF0000]29[/COLOR].sub .cell-forum .icon {
        background-image: url('/flags/[COLOR=#FF0000]Flag_of_Switzerland.svg.png[/COLOR]');
    }
    You have to add that block for each subforum id and specify the appropriate image path for the flag and nodeid. If you have 30 different flags, then you have to add that block 30 times with different image paths and nodeids.

    Leave a comment:


  • Hectorsky
    replied
    Originally posted by Glenn Vergara View Post
    I changed something. Here's the updated code. Remove all your old CSS for the subforum icons and then add these:

    Code:
    [COLOR=#008000]/* Add this block only once */[/COLOR]
    .forum-list-container .subforum-list .subforum-item .icon.new,
    .forum-list-container .forum-item.sub.new .cell-forum .icon {
    -webkit-filter: grayscale(0);
    filter: grayscale(0);
    }
    .forum-list-container .subforum-list .subforum-item .icon,
    .forum-list-container .forum-item.sub .cell-forum .icon {
    width: 16px;
    height: 11px;
    -webkit-filter: grayscale(100%);
    filter: grayscale(100%);
    }
    
    [COLOR=#008000]/* Repeat this block for [I][B]every [/B][/I]subforum specifying appropriate image path and nodeid ([/COLOR][COLOR=#FF0000]29[/COLOR][COLOR=#008000] is used in this sample) */[/COLOR]
    .forum-list-container .subforum-list .subforum-item[data-channel-id="[COLOR=#FF0000]29[/COLOR]"] .icon,
    #forum[COLOR=#FF0000]29[/COLOR].sub .cell-forum .icon {
    background-image: url('/flags/[COLOR=#FF0000]Flag_of_Switzerland.svg.png[/COLOR]');
    }

    Doesn'w show icon now ,,,

    Leave a comment:


  • Glenn Vergara
    replied
    I changed something. Here's the updated code. Remove all your old CSS for the subforum icons and then add these:

    Code:
    [COLOR=#008000]/* Add this block only once */[/COLOR]
    .forum-list-container .subforum-list .subforum-item .icon.new,
    .forum-list-container .forum-item.sub.new .cell-forum .icon {
        -webkit-filter: grayscale(0);
        filter: grayscale(0);
    }
    .forum-list-container .subforum-list .subforum-item .icon,
    .forum-list-container .forum-item.sub .cell-forum .icon {
        width: 16px;
        height: 11px;
        -webkit-filter: grayscale(100%);
        filter: grayscale(100%);
    }
    
    [COLOR=#008000]/* Repeat this block for [I][B]every [/B][/I]subforum specifying appropriate image path and nodeid ([/COLOR][COLOR=#FF0000]29[/COLOR][COLOR=#008000] is used in this sample) */[/COLOR]
    .forum-list-container .subforum-list .subforum-item[data-channel-id="[COLOR=#FF0000]29[/COLOR]"] .icon,
    #forum[COLOR=#FF0000]29[/COLOR].sub .cell-forum .icon {
        background-image: url('/flags/[COLOR=#FF0000]Flag_of_Switzerland.svg.png[/COLOR]');
    }

    Leave a comment:


  • Hectorsky
    replied
    Originally posted by Glenn Vergara View Post
    Ok, do this:

    Code:
    [COLOR=#008000]/* Add this to remove grayscale for subforums with new posts. Add this only once */[/COLOR]
    .forum-list-container .subforum-list .subforum-item .icon.new,
    .forum-list-container .forum-item.sub.new .cell-forum .icon {
    -webkit-filter: grayscale(0) !important;
    filter: grayscale(0) !important;
    }
    
    /* [COLOR=#008000]Do these for [B][I]every[/I] [/B]subforum specifying appropriate image path and nodeid ([/COLOR][COLOR=#FF0000]29[/COLOR][COLOR=#008000] is used in this sample) */[/COLOR]
    .forum-list-container .subforum-list .subforum-item[data-channel-id="[COLOR=#FF0000]29[/COLOR]"] .icon,
    #forum[COLOR=#FF0000]29[/COLOR].sub .cell-forum .icon {
    background: transparent url('/flags/Flag_of_Switzerland.svg.png') no-repeat;
    width: 16px;
    height: 11px;
    -webkit-filter: grayscale(100%);
    filter: grayscale(100%);
    }
    I added grayscale to differentiate icons for subforums with new and old posts. If there is no new post, the icon will be in graycale, otherwise the icon will be in full color. It is still using one image for each subforum. It just turns it into grayscale via CSS.


    Ok so I which ones I need to add?

    Leave a comment:


  • Glenn Vergara
    replied
    Ok, do this:

    Code:
    [COLOR=#008000]/* Add this to remove grayscale for subforums with new posts. Add this only once */[/COLOR]
    .forum-list-container .subforum-list .subforum-item .icon.new,
    .forum-list-container .forum-item.sub.new .cell-forum .icon {
        -webkit-filter: grayscale(0) !important;
        filter: grayscale(0) !important;
    }
    
    /* [COLOR=#008000]Do these for [B][I]every[/I] [/B]subforum specifying appropriate image path and nodeid ([/COLOR][COLOR=#FF0000]29[/COLOR][COLOR=#008000] is used in this sample) */[/COLOR]
    .forum-list-container .subforum-list .subforum-item[data-channel-id="[COLOR=#FF0000]29[/COLOR]"] .icon,
    #forum[COLOR=#FF0000]29[/COLOR].sub .cell-forum .icon {
        background: transparent url('/flags/Flag_of_Switzerland.svg.png') no-repeat;
        width: 16px;
        height: 11px;
        -webkit-filter: grayscale(100%);
        filter: grayscale(100%);
    }
    I added grayscale to differentiate icons for subforums with new and old posts. If there is no new post, the icon will be in graycale, otherwise the icon will be in full color. It is still using one image for each subforum. It just turns it into grayscale via CSS.
    Last edited by Glenn Vergara; Fri 29 Jan '16, 11:29am.

    Leave a comment:


  • Hectorsky
    replied
    http://republicamd.com/

    Leave a comment:


  • Glenn Vergara
    replied
    Link?

    Leave a comment:


  • Hectorsky
    replied
    Originally posted by Glenn Vergara View Post
    Code:
    .forum-list-container .subforum-list .subforum-item[COLOR=#FF0000][data-channel-id="xxxxx"][/COLOR] .icon {
    background: transparent url('path/to/icon.png') no-repeat;
    }
    Replace xxxxx with the nodeid of the subforum

    If subforum has new posts, you can also put a different icon.
    Code:
    .forum-list-container .subforum-list .subforum-item[COLOR=#FF0000][data-channel-id="xxxxx"][/COLOR] .icon[COLOR=#FF0000].new[/COLOR] {
    background: transparent url('path/to/icon.png') no-repeat;
    }

    It doesn't work properly , Let me explain , I was added some child channels , (Countries) So for each country I want to add them FLAG , do you understand what do I mean?
    I tried to add width and height , and it doesn't work , and the icon is just appear on main forum , but when I press on forum , the icon is standart one,

    Leave a comment:


  • Glenn Vergara
    replied
    Code:
    .forum-list-container .subforum-list .subforum-item[COLOR=#FF0000][data-channel-id="xxxxx"][/COLOR] .icon {
        background: transparent url('path/to/icon.png') no-repeat;
    }
    Replace xxxxx with the nodeid of the subforum

    If subforum has new posts, you can also put a different icon.
    Code:
    .forum-list-container .subforum-list .subforum-item[COLOR=#FF0000][data-channel-id="xxxxx"][/COLOR] .icon[COLOR=#FF0000].new[/COLOR] {
        background: transparent url('path/to/icon.png') no-repeat;
    }

    Leave a comment:

Related Topics

Collapse

Working...
X