• 欢迎 游客 您的光临,下载之前请先阅读 积分规则(暂行) 。任何技术问题请在论坛提问,本站定制插件、模板主题售前、售后问题请联系QQ:5916171

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

小关_

打酱油的路过~~
管理成员
注册
2019/01/25
消息
453
反馈评分
1,401
点数
93
所在地
湖北孝感
主页
pixelmc.cn
黄金
6,232.4G
    Windows 10 Chrome 76.0.3809.100
  • #1
这是一个DIY教程来实现这一目标:

2019-04-18_20-40-55-gif.5498



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

打开extra.less模板并添加代码:
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');。
 
最后编辑:
顶部 底部