Milk uses FontAwesome CSS icons to differentiate between read / unread states. This allows faster loading times and lossless quality on all devices.
It is possible to use your own images as forum icons.
The icon values are defined in: yourforum.com/Milk_v2/theme/icons_forums_topics.css
Copy /* Set the icons */ /* Megaphone */
.global_read:before {content: "f0a1";}
.global_read_mine:before {content: "f0a1";}
.global_read_locked:before {content: "f0a1";}
.global_read_locked_mine:before {content: "f0a1";}
.global_unread:before {content: "f0a1";}
.global_unread_mine:before {content: "f0a1";}
.global_unread_locked:before {content: "f0a1";}
.global_unread_locked_mine:before {content: "f0a1";}
/* Megaphone */
.announce_read:before {content: "f0a1";}
.announce_read_mine:before {content: "f0a1";}
.announce_read_locked:before {content: "f0a1";}
.announce_read_locked_mine:before {content: "f0a1";}
.announce_unread:before {content: "f0a1";}
.announce_unread_mine:before {content: "f0a1";}
.announce_unread_locked:before {content: "f0a1";}
.announce_unread_locked_mine:before {content: "f0a1";}
/* External link */
.forum_link:before {content: "f08e";}
/* Speech Bubble */
.forum_read:before {content: "f068";}
.forum_read_subforum:before {content: "f068";}
/* Check */
.forum_unread:before {content: "f00c";}
.forum_unread_subforum:before {content: "f00c";}
/* Pin */
.sticky_read:before {content: "f08d";}
.sticky_read_mine:before {content: "f08d";}
.sticky_read_locked:before {content: "f08d";}
.sticky_read_locked_mine:before {content: "f08d";}
.sticky_unread:before {content: "f08d";}
.sticky_unread_mine:before {content: "f08d";}
.sticky_unread_locked:before {content: "f08d";}
.sticky_unread_locked_mine:before {content: "f08d";}
/* Right arrow */
.topic_moved:before {content: "f061";}
/* Envelope */
.pm_read:before {content: "f0e0";}
.pm_unread:before {content: "f0e0";}
/* Bar */
.topic_read:before {content: "f068";}
.topic_read_mine:before {content: "f068";}
.topic_read_hot:before {content: "f068";}
.topic_read_hot_mine:before {content: "f068";}
/* Tick */
.topic_unread:before {content: "f00c";}
.topic_unread_mine:before {content: "f00c";}
.topic_unread_hot:before {content: "f00c";}
.topic_unread_hot_mine:before {content: "f00c";}
/* Cross */
.forum_read_locked:before {content: "f00d";}
.forum_unread_locked:before {content: "f00d";}
.topic_read_locked:before {content: "f00d";}
.topic_read_locked_mine:before {content: "f00d";}
.topic_unread_locked:before {content: "f00d";}
.topic_unread_locked_mine:before {content: "f00d";} Replace the unicode value above as necessary.
Disabling the pulse animation
Copy /* Box shadow for unread pulse icons */
@keyframes UnreadPulse {
0% {
-moz-box-shadow: 0 0 0 0 rgba(132,189,0,0.4);
box-shadow: 0 0 0 0 rgba(132,189,0,0.4);
-webkit-box-shadow: 0 0 0 0 rgba(132,189,0,0.4);
}
70% {
-moz-box-shadow: 0 0 0 8px rgba(132,189,0,0);
box-shadow: 0 0 0 8px rgba(132,189,0, 0);
-webkit-box-shadow: 0 0 0 8px rgba(132,189,0,0);
}
100% {
-moz-box-shadow: 0 0 0 0 rgba(132,189,0,0);
box-shadow: 0 0 0 0 rgba(132,189,0,0);
-webkit-box-shadow: 0 0 0 0 rgba(132,189,0,0);
}
}
/* Box shadow for unread pulse icons */
@keyframes UnreadLockedPulse {
0% {
-moz-box-shadow: 0 0 0 0 rgba(189,0,0,0.4);
box-shadow: 0 0 0 0 rgba(189,0,0,0.4);
-webkit-box-shadow: 0 0 0 0 rgba(189,0,0,0.4);
}
70% {
-moz-box-shadow: 0 0 0 8px rgba(189,0,0,0);
box-shadow: 0 0 0 8px rgba(189,0,0, 0);
-webkit-box-shadow: 0 0 0 8px rgba(189,0,0,0);
}
100% {
-moz-box-shadow: 0 0 0 0 rgba(189,0,0,0);
box-shadow: 0 0 0 0 rgba(189,0,0,0);
-webkit-box-shadow: 0 0 0 0 rgba(189,0,0,0);
}
} You can delete this code to disable the animation.
