FA5 compatibility fixes

common/header.html

@@ -144,6 +144,8 @@ if (jQuery)
 
     
 <script type="text/discourse-plugin" version="0.8.23">
+const { iconHTML } = require("discourse-common/lib/icon-library");
+
 let sec = "",
   seg = "",
   rawMain = "",
@@ -161,6 +163,7 @@ if (rtl) {
 
 $.each(sec, function() {
   var sec = $.map(this.split(","), $.trim);
+  var icon = sec[1].length && sec[1] != 'none' ? iconHTML(sec[1]) : '';
   rawMain +=
     '<a data-d-dropdown="#' +
     sec[0] +
@@ -168,11 +171,11 @@ $.each(sec, function() {
     sec[3] +
     '" title="' +
     sec[2] +
-    '"><i class="fa d-icon fa-' +
-    sec[1] +
-    '"></i>' +
-    sec[0] +
-    '<i class="fa fa-caret-down d-icon d-icon-caret-down"></i></a><div id="' +
+    '">' +
+    icon +
+    sec[0] + 
+    iconHTML("caret-down") +
+    '</a><div id="' +
     sec[0] +
     '" class="d-dropdown ' +
     rtlClass +
@@ -198,6 +201,8 @@ $.each(sec, function() {
       if (seg[2] == null || seg[2] == " ") {
         seg[2] = "";
       }
+      
+      var icon = seg[2].length && seg[2] != 'none' ? iconHTML(seg[2]) : '';
 
       if (seg[4] == "blank") {
         seg[4] = "_blank";
@@ -219,9 +224,8 @@ $.each(sec, function() {
         seg[5] +
         '" class="submenu-link" href="' +
         seg[3] +
-        '"><i class="fa d-icon fa-' +
-        seg[2] +
-        '"></i>' +
+        '">' +
+        icon +
         seg[1] +
         "</li>";
       $("#" + sec[0] + " ul").html(mainUl);

settings.yml

@@ -8,6 +8,12 @@ Submenu_items:
   default: "Design, Galleries, th, #, blank, Cool galleries for you to look at.|Design, Design process, lightbulb-o, #, blank, Learn the basics.|Design, Blog design, columns, #, blank, What makes for a great blog?|Design, divider|Design, Freebies, gift, #, blank, Everyone likes freebies!|Design, Photoshop tutorials, book, #, blank, Photoshop for beginners.|Design, Design trends, bar-chart, #, blank, Stay on top of the current trends! |Code, Wordpress, wordpress, #, blank, Wordpress code examples|Code, Tools, wrench, #, blank, Tools that will make your life easier!|Code, Tutorials, leanpub, #, blank, Just starting out? We'll guide you through the basics|Business, Blogging, none, #, blank, Why not start a blog?|Business, Social media, none, #, blank, Learn how to leverage Social media and make it work for your business |Business, Make money, none, #, blank, Everyone like to be paid!|Business, Marketing, none, #, blank, No business will survive without customers...Here's how to get'em!|Shop, Vectors, none, #, blank,|Shop, Textures, none, #, blank,|Shop, Brushes, none, #, blank,|Shop, divider|Shop, UI kits, none, #, blank,|Shop, Templates , none, #, blank,|Shop, PSDs, none, #, blank,|More, About us, none, /about, self, Meet the gang!|More, Contact us, none, #, blank, Let's get in touch|More, Terms of Service, none, /tos, self, |More, Privacy policy, none, /privacy, self"
   description:
     en: 'Add submenu items. One item per line in this order: Parent, text, icon, URL, target, title.<br><b>Parent:</b> the name of the parent menu item which this submenu item show under. Use the `text` value from the list above<br><b>Text:</b> the text that shows for this submenu item.<br><b>Icon:</b> the icon for this submenu item, use `none` if no icon is needed<br><b>URL:</b> the path this menu item links to. You can use relative paths as well.<br><b>Target:</b> Choose whether this item will open in a new tab or in the same tab. Use `blank` to open the link in a new tab, or use `self` to open it in the same tab.<br><b>Title:</b> the text that shows when the item is hovered.<br><b>Dividers:</b> You can also add dividers between submenu items. To add a divider user `parent, divider`'
+Svg_icons: 
+  type: 'list'
+  list_type: 'compact'
+  default: 'fa-magic|fa-keyboard-o|fa-money|fa-shopping-cart|fa-lightbulb-o|fa-columns|fa-gift|fa-book|fa-bar-chart|fa-wordpress|fa-wrench|fa-leanpub'
+  description: 
+    en: "Include FontAwesome icon classes for each icon used in the lists above."
 Fixed_mode:
   default: false
   description: