How can I add new SVG icons?

1) To add new icons you need to create:

a) A new script file that includes the SVG code and include it in your theme "functions.php" (we recommend using the child theme as to not lose changes after a theme update).

You can use the theme script as an example, you will find it in the "vikinger/js/source/utils/svg-loader.js" file. You can copy it and replace the svgData constant value with the SVG icons you want to include.

Your SVG icons need to follow the same naming structure as existing ones, i.e:

<!-- SVG CUSTOM -->
<svg style="display: none;">
  <symbol id="svg-custom" viewBox="0 0 yourviewboxvalue yourviewboxvalue" preserveAspectRatio="xMinYMin meet">
    // your svg content
  </symbol>
</svg>
<!-- /SVG CUSTOM -->    

b) Create styles for your icons and add them to the style.css or add a new stylesheet and include it in the "functions.php" file, they must also follow the naming structure:

.icon-custom {
  // your icon styles
}    

c) You can then use the part after the icon-* name to use that icon in the theme. In this case, you can use "custom" to assign this icon to a menu item.

The "vikinger/style.css" file contains all theme styles that are not related to third-party plugins, you will find the .icon-* CSS declarations in that file.