วิธีทำ Move thread status icons

admin

Administrator
Staff Member
Would you like to have thread status icons on the left side before thread title?

chrome_2019-02-08_22-09-59-png.png

Add this to your extra.less template:
Less:
/* Move thread status icons */
@media (min-width: @xf-responsiveMedium) {
[data-template="forum_view"], &[data-template="whats_new"], &[data-template="whats_new_posts"] {
    .structItem-statuses {
        float: none;
        &>li {
            margin-left: 0;
            padding-right: 5px;
            padding-top: 1px;
        }
    }
}
}
/*****/
*this will work on thread list, what's new and new posts page, on mobile view there will be no difference


Would you like to move only some of the thread status icons?

Examples:


chrome_2019-02-08_21-59-34-png.png



chrome_2019-02-08_22-01-38-png.png



chrome_2019-02-08_22-02-26-png.png


Add this to your extra.less template:
Less:
/* Move thread status icons */
@media (min-width: @xf-responsiveMedium) {
[data-template="forum_view"], &[data-template="whats_new"], &[data-template="whats_new_posts"] {
    .structItem-statuses {
        float: none;
        >li {
            float: none;
            margin-left: 0px;
            .structItem-status--sticky {
                float: left;
                padding-left: 5px;
                padding-top: 1px;
            }
            .structItem-status--watched {
                float: right;
                padding-left: 5px;
                padding-top: 1px;
            }
            .structItem-status--poll {
                float: right;
                padding-left: 5px;
                padding-top: 1px;
            }
            .structItem-status--locked {
                float: right;
                padding-left: 5px;
                padding-top: 1px;
            }
            .structItem-status--deleted {
                float: right;
                padding-left: 5px;
                padding-top: 1px;
            }
            .structItem-status--moderated {
                float: right;
                padding-left: 5px;
                padding-top: 1px;
            }
        }
    }
}
}
/*****/
To change the icon side edit float class for each icon and choose left or right.

Note: make sure you always have these combinations: if you have float: left, make sure you have padding-right OR if you have float: right, make sure you have padding-left.

*this will work on thread list, what's new and new posts page, on mobile view there will be no difference
 


ด้านบน