Refactor/fontawesome (#1230)

* refactor: replace all plaintext fontawesome icons

* fix: spinner

* feat: replace all the remaining fontawesome icons

* feat: add fa-icon shortcode

* refactor: replace everything with fa-icon shortcode

* feat(docs): add fa-icon docs

* feat: add deprecated warnings and remove old docs

* fix: remove debug

* feat: remove all remainings

* refactor: remove all.min.css

* refactor: reduce layout shift

* chore: use local avatar

assets/css/_partial/_header.scss

@@ -175,11 +175,11 @@ header {
   }
 }
 
-.theme-switch i {
+.theme-switch svg {
   @include transform(rotate(225deg));
 }
 
-.theme-select i {
+.theme-select svg {
   @include transform(rotate(225deg));
 }
 

assets/css/_partial/_icon.scss

@@ -17,20 +17,20 @@ img.emoji {
   display: inline-block !important;
 }
 
-svg.fontawesome-icon {
+svg.icon {
   display: inline-block;
   height: 1em;
   width: 1.25em;
   vertical-align: -0.125em;
-  color: $global-font-color;
+  color: $global-font-color default;
   [theme=dark] & {
-    color: $global-font-color-dark;
+    color: $global-font-color-dark default;
   }
   [theme=black] & {
-    color: $global-font-color-black;
+    color: $global-font-color-black default;
   }
 }
 
-svg.fontawesome-icon > path {
+svg.icon > path {
   fill: currentColor;
 }

assets/css/main.css

@@ -605,6 +605,16 @@ ul {
   transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
 }
 
+@keyframes tw-spin {
+  to {
+    transform: rotate(360deg);
+  }
+}
+
+.tw-animate-spin {
+  animation: tw-spin 1s linear infinite;
+}
+
 .tw-rounded-full {
   border-radius: 9999px;
 }

assets/data/cdn/jsdelivr.yml

@@ -20,8 +20,6 @@ libFiles:
   # echarts@5.2.2 https://github.com/apache/echarts
   echartsJS: echarts@5.2.2/dist/echarts.min.js
   echartsMacaronsJS: echarts@5.2.2/theme/macarons.min.js
-  # fontawesome-free@5.15.4 https://github.com/FortAwesome/Font-Awesome
-  fontawesomeFreeCSS: '@fortawesome/fontawesome-free@5.15.4/css/all.min.css'
   # fusejs@6.4.6 https://github.com/krisk/fuse
   fuseJS: fuse.js@6.4.6/dist/fuse.min.js
   # gitalk@1.7.2 https://github.com/gitalk/gitalk