自定义社交图片需要修改显示位置和显示颜色

[rocona]

Please follow this Issue template to provide relevant information, such as source code repository, website URL and screenshots, which will help us investigate.
请按照此 Issue 模版提供相关信息，例如源码仓库、网站链接和屏幕截图，这将有助于我们进行调查。

Issue Checklist

• I am using NexT version 8.0 or later.
• I have already read the relevant documents of Hexo and NexT.
• I have already searched for current issues, which does not help me.

---

Expected behavior

自定义社交图片需要修改显示位置和显示颜色，并根据暗黑模式切换显示颜色.

Actual behavior

位置布局中，颜色也无法修改，暗黑模式颜色也不切换。

• Links to demo site with this issue:
• Links to repository or source code of the blog:
• Screenshots:
  

Steps to reproduce the behavior

在source/_data/styles.styl中

.fa-bilibili {  
background: url(/images/leetcode.svg);  
background-position: 50% 75%;  
background-repeat: no-repeat;  
height: 1rem;  
width: 1rem;}

Other Information

[ljcbaby]

@font-face {font-family: "iconfont";
  src: url('iconfont.eot?t=1585832822220'); /* IE9 */
  src: url('iconfont.eot?t=1585832822220#iefix') format('embedded-opentype'), /* IE6-IE8 */
  url('data:application/x-font-woff2;charset=utf-8;base64,d09GMgABAAAAAAM8AAsAAAAABvgAAALwAAEAAAAAAAAAAAAAAAAAAAAAAAAAAAAAHEIGVgCCcAqBfIFzATYCJAMICwYABCAFhG0HNxsgBsi+QRxjO4JUIRVShaOn293eZtbzHhOyuTX1IX9hSIkgoHE1i9NLyGADM9zYzMhq1M/MUGhw0tGcXtox2BvJshsgyMB99g1/buRqh44lCzc1IadXVaXHA8/NfhMsgcQDDKNJCeSbD+xeIidwG3T1wILDhQQIAEkIgPokqnnPClTWfFDsbTY9TFTJ8uVegP//czm9FVAg8wPlMsfko16A8dZAxxoUYGAFFAA3jN1E8AAPQwArfmKIYn51F+poYJQAYpC2DnUFP007KTPB2LAwRuwkzOGo/AVM8++Lj3x1IBkiQEVhP2fB5D+YoUr/VBRBsJwVcJaBAjFAQ5SN8XxJwqEqVvEqQThWqcBz/6kRcdQ/D5ECim0A+Oj8ZxJg4aMWSwBa7y4D1E16M9A529b2+9Fls/H69D3C63W3v/s+5ceB2w+nhY2VJde9+6zx0f3gcSqzu1r1SJTWQr2vwzv5sl4xfkbPY+tC692wzcVaHFuedzdLeP3ZkH/mooBJbeboaEbrQRxm1GYKE/PN2VH4Pp5vapodukyd1S/457vHXZeenwxPSH9TXbnIK71heZrKDnLZ9uXV5+6K64BJIKgO1fqff8MBHzN6nRqA2/Up12rDnGC+G4fAXxUMrNKxCKjk4/ENh1SW8yKhc10X/4DbyeNUtesrpAUz1xdxmvhmoJiFoJoSAwbWUsDILA2sRMtbbs1ZiyQRW4AogxoIDnZAsnMCioNLVFMewMDNExg5lAQr5UHnhtbCkg0zinQmC40LlGbgC2TiBlG6TfaJq6u8iNP2ScUyhLm4hHJqgXxSS0yJT+08s0ChAg/ntePIdQMMVVAkk9PHzOFwJr6u6UVpM/CgQRaF6BixoCoXUCNTwCdofdZQ+fw2Yjvh0qkO0oh9H1FisneUKE7CAHRB7g8iPcozrU7Z8towAdVRAh6Uq/UjLlcANTX3KyImltYwIRoaFg9r1Q2Vp7dXen+3AbACNDKAuQrbWroSa1KC2FwA') format('woff2'),
  url('iconfont.woff?t=1585832822220') format('woff'),
  url('iconfont.ttf?t=1585832822220') format('truetype'), /* chrome, firefox, opera, Safari, Android, iOS 4.2+ */
  url('iconfont.svg?t=1585832822220#iconfont') format('svg'); /* iOS 4.1- */
}

.fa-custom {
  font-family:"iconfont" !important;
  -moz-osx-font-smoothing: grayscale;
  -webkit-font-smoothing: antialiased;
  display: inline-block;
  font-style: normal;
  font-variant: normal;
  text-rendering: auto;
  line-height: 1
}

.bilibili:before { content: "\eea8"; }

这是我Custom Bilibili的，没有你说的问题，你自己再看看

[rocona]

感谢！原来是用这种方式，已经解决。
上面问题是我按照文档方式来写的，所以有问题。
非常感谢！