模板修改 突出显示新菜单项

[小关]

这是一个DIY教程来实现这一目标：

正如您所看到的，您可以获得一个仅在新项目上悬停时更改的图标，只是为了突出显示它们。

打开extra.less模板并添加代码：

/*** 突出显示新菜单项 ***/
.menu-row.menu-row--separated.menu-row--clickable.menu-row--highlighted {
    &:before {
        .m-faBase();
        .m-faContent(@fa-var-dot-circle);
        float: right;
        color: @xf-paletteAccent2;
    }
    &:hover:before {
        .m-faBase('Pro', @faWeight-solid);
        .m-faContent(@fa-var-dot-circle);
    }
}
/**********/

编辑图标检查类&:before。要更改Font Awesome图标dot-circle，请使用任何其他图标名称编辑单词（在上例中）。

要更改图标颜色，请编辑color属性。

在悬停检查类时编辑图标&:hover:before。


想要一个特定风格的Pro图标？

编辑.m-faBase();并将其更改为.m-faBase('Pro', @faWeight-solid);, .m-faBase('Pro', @faWeight-regular);或.m-faBase('Pro', @faWeight-light);。


想要一个品牌图标？

编辑.m-faBase();并将其更改为.m-faBase('Brands');。