Status icons show us a thread type or just if a thread is sticky, watched, etc. They can be useful
But we can expand the customization a bit more to have it like this:
To achieve this just add this code to your extra.less template:
Code:
Code:
To change the text to anything else, just font the content property and edit it. Yes, it is not ideal for multilanguage forums.
Continue reading...


But we can expand the customization a bit more to have it like this:

To achieve this just add this code to your extra.less template:
Code:
Code:
Code:
/* Status icon with text */
.structItem-statuses .fa-question-circle:before { /* icon */
color: #fff !important;
background: #007bff;
padding: 2px 0px 2px 4px;
border-bottom-left-radius: 4px;
border-top-left-radius: 4px;
line-height: ((@xf-lineHeightDefault) * .9);
}
.structItem-statuses .fa-question-circle:after { /* text after icon */
content: "Question";
color: #fff;
background: #007bff;
padding: 1px 4px 2px 2px;
border-bottom-right-radius: 4px;
border-top-right-radius: 4px;
font-family: @xf-fontFamilyUi;
}
/*********/
To change the text to anything else, just font the content property and edit it. Yes, it is not ideal for multilanguage forums.
Continue reading...