fix(ui): match icons and order to Settings

src/components/Icons/18/general.vue

@@ -1,14 +1,27 @@
 <template>
-  <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 18 18">
+  <svg
+    width="18"
+    height="18"
+    viewBox="0 0 18 18"
+    fill="none"
+    xmlns="http://www.w3.org/2000/svg"
+  >
     <path
-      fill="#9F9FA8"
+      fill-rule="evenodd"
-      d="M6.44965908,7.76773908 L3.81096,5.12904 L2.88,6.06 L9.9309005e-13,3.18 L2.88,0.3 L5.76,3.18 L4.82904,4.11096 L7.57513324,6.85705324 L8.82,5.84976 C8.70408,5.45952 8.64,5.04768 8.64,4.62 C8.64,2.23392 10.57392,0.3 12.96,0.3 C13.58568,0.3 14.17824,0.43608 14.71464,0.67512 L12.40488,2.98488 L14.59512,5.17512 L16.90488,2.86464 C17.14392,3.40176 17.28,3.99432 17.28,4.62 C17.28,7.00608 15.34608,8.94 12.96,8.94 C12.53232,8.94 12.12048,8.87592 11.73024,8.76 L5.44464,16.52808 C4.85424,17.19696 4.0032,17.58 3.11112,17.58 C2.28024,17.58 1.49904,17.25672 0.91152,16.66848 C0.30672,16.0644 -0.0252,15.22704 0.00144,14.37168 C0.02736,13.51704 0.4104,12.702 1.05192,12.13536 L6.44965908,7.76773908 Z M13.6368,10.3368 L16.5348,13.23408 C17.52912,14.2284 17.52912,15.83976 16.5348,16.83408 C15.54048,17.8284 13.92912,17.8284 12.9348,16.83408 L9.68184,13.58112 L12.30336,10.34184 C12.52224,10.36704 12.7404,10.38 12.96,10.38 C13.18896,10.38 13.41432,10.36272 13.6368,10.3368 Z"
+      clip-rule="evenodd"
+      d="M6.81398 5.75342L5.67204 6.73249L3.9698 5.03025L3.00005 6L5.09165e-05 3L3.00005 0L6.00005 3L5.0303 3.96975L6.81398 5.75342ZM14.2051 10.455L17.2238 13.473C18.2596 14.5088 18.2596 16.1873 17.2238 17.223C16.1881 18.2588 14.5096 18.2588 13.4738 17.223L10.0853 13.8345L12.8161 10.4602C13.0441 10.4865 13.2713 10.5 13.5001 10.5C13.7386 10.5 13.9733 10.482 14.2051 10.455Z"
+      :fill="lightColor"
+    />
+    <path
+      d="M15.2033 5.07825L12.9218 2.79675L15.3278 0.39075C14.7691 0.14175 14.1518 0 13.5001 0C11.0146 0 9.00005 2.0145 9.00005 4.5C9.00005 4.9455 9.0668 5.3745 9.18755 5.781L1.0958 12.3285C0.427551 12.9187 0.0285509 13.7678 0.00155092 14.658C-0.0261991 15.549 0.319551 16.4212 0.949551 17.0505C1.56155 17.6632 2.3753 18 3.2408 18C4.17005 18 5.05655 17.601 5.67155 16.9042L12.2191 8.8125C12.6256 8.93325 13.0546 9 13.5001 9C15.9856 9 18.0001 6.9855 18.0001 4.5C18.0001 3.84825 17.8583 3.231 17.6093 2.6715L15.2033 5.07825Z"
+      :fill="lightColor"
     />
   </svg>
 </template>
 <script>
 import Base from '../base';
 export default {
-  extends: Base
+  name: 'IconGeneral',
+  extends: Base,
 };
 </script>

src/components/Icons/18/invoice.vue

@@ -1,15 +1,27 @@
 <template>
-  <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 18 18">
+  <svg
+    width="18"
+    height="18"
+    viewBox="0 0 18 18"
+    fill="none"
+    xmlns="http://www.w3.org/2000/svg"
+  >
     <path
-      fill="#B3D94A"
+      fill-rule="evenodd"
-      d="M0,0.75 L0,17.25 C0,17.6642136 0.335786438,18 0.75,18 L14.25,18 C14.6642136,18 15,17.6642136 15,17.25 L15,0.75 C15,0.335786438 14.6642136,2.53632657e-17 14.25,0 L0.75,0 C0.335786438,-2.53632657e-17 0,0.335786438 0,0.75 Z M2.25,3.75 L6.75,3.75 L6.75,8.25 L2.25,8.25 L2.25,3.75 Z M12.75,14.25 L2.25,14.25 L2.25,12.75 L12.75,12.75 L12.75,14.25 Z M12.75,11.25 L2.25,11.25 L2.25,9.75 L12.75,9.75 L12.75,11.25 Z M12.75,8.25 L8.25,8.25 L8.25,6.75 L12.75,6.75 L12.75,8.25 Z M12.75,5.25 L8.25,5.25 L8.25,3.75 L12.75,3.75 L12.75,5.25 Z"
+      clip-rule="evenodd"
-      transform="translate(2)"
+      d="M2.475 6.3L0.3375 4.1625C-0.1125 3.7125 -0.1125 3.0375 0.3375 2.5875L2.5875 0.3375C3.0375 -0.1125 3.7125 -0.1125 4.1625 0.3375L6.3 2.475L2.475 6.3ZM15.525 11.7L17.6625 13.8375C17.8875 14.0625 18 14.2875 18 14.625V18H14.625C14.2875 18 14.0625 17.8875 13.8375 17.6625L11.7 15.525L15.525 11.7Z"
+      :fill="lightColor"
+    />
+    <path
+      d="M17.6625 4.8375L13.1625 0.3375C12.7125 -0.1125 12.0375 -0.1125 11.5875 0.3375L10.125 1.8L12.0375 3.7125L10.4625 5.2875L8.55 3.375L6.75 5.175L8.6625 7.0875L7.0875 8.6625L5.175 6.75L3.375 8.55L5.2875 10.4625L3.7125 12.0375L1.8 10.125L0.3375 11.5875C-0.1125 12.0375 -0.1125 12.7125 0.3375 13.1625L4.8375 17.6625C5.2875 18.1125 5.9625 18.1125 6.4125 17.6625L17.6625 6.4125C18.1125 5.9625 18.1125 5.2875 17.6625 4.8375Z"
+      :fill="lightColor"
     />
   </svg>
 </template>
 <script>
 import Base from '../base';
 export default {
-  extends: Base
+  name: 'IconInvoice',
+  extends: Base,
 };
 </script>

src/components/Icons/18/system.vue

@@ -0,0 +1,21 @@
+<template>
+  <svg
+    width="18"
+    height="18"
+    viewBox="0 0 18 18"
+    fill="none"
+    xmlns="http://www.w3.org/2000/svg"
+  >
+    <path
+      d="M15.654 10.0898C15.7153 9.72968 15.7474 9.36524 15.75 9C15.7474 8.63476 15.7153 8.27032 15.654 7.91025L17.229 6.3885C17.4761 6.1494 17.5289 5.7729 17.3572 5.475L16.2322 3.525C16.0583 3.22835 15.7061 3.08632 15.375 3.17925L13.275 3.77925C12.7064 3.31615 12.0663 2.9486 11.3797 2.691L10.8525 0.5685C10.7692 0.234504 10.4692 9.5096e-05 10.125 0H7.87499C7.53076 9.5096e-05 7.2308 0.234504 7.14749 0.5685L6.61724 2.691C5.93172 2.94889 5.29265 3.31643 4.72499 3.77925L2.62499 3.17925C2.29389 3.0866 1.94191 3.22856 1.76774 3.525L0.642742 5.475C0.470644 5.77308 0.523523 6.15003 0.770992 6.38925L2.34599 7.911C2.28471 8.27082 2.2526 8.63501 2.24999 9C2.25256 9.36524 2.28467 9.72968 2.34599 10.0898L0.770992 11.6115C0.523898 11.8506 0.47104 12.2271 0.642742 12.525L1.76774 14.475C1.90185 14.7073 2.14978 14.8503 2.41799 14.85C2.4877 14.8497 2.55706 14.8401 2.62424 14.8215L4.72424 14.2215C5.29281 14.6846 5.93292 15.0522 6.61949 15.3098L7.14974 17.4323C7.23313 17.7651 7.53182 17.999 7.87499 18H10.125C10.4692 17.9999 10.7692 17.7655 10.8525 17.4315L11.3827 15.309C12.0683 15.0511 12.7073 14.6836 13.275 14.2208L15.375 14.8207C15.4422 14.8394 15.5115 14.8489 15.5812 14.8492C15.8495 14.8495 16.0974 14.7065 16.2315 14.4742L17.3565 12.5242C17.5286 12.2262 17.4757 11.8492 17.2282 11.61L15.654 10.0898ZM8.99999 12C7.34314 12 5.99999 10.6569 5.99999 9C5.99999 7.34315 7.34314 6 8.99999 6C10.6568 6 12 7.34315 12 9C12 9.79565 11.6839 10.5587 11.1213 11.1213C10.5587 11.6839 9.79564 12 8.99999 12Z"
+      :fill="lightColor"
+    />
+  </svg>
+</template>
+<script>
+import Base from '../base';
+export default {
+  name: 'IconSystem',
+  extends: Base,
+};
+</script>

src/pages/GetStarted.vue

@@ -107,6 +107,17 @@ export default {
           label: _('Organisation'),
 
           items: [
+            {
+              key: 'Invoice',
+              label: _('Invoice'),
+              icon: 'invoice',
+              description:
+                'Customize your invoices by adding a logo and address details',
+              fieldname: 'invoiceSetup',
+              action() {
+                openSettings('Invoice');
+              },
+            },
             {
               key: 'General',
               label: _('General'),
@@ -121,7 +132,7 @@ export default {
             {
               key: 'System',
               label: _('System'),
-              icon: 'general',
+              icon: 'system',
               description:
                 'Setup system defaults like date format and currency precision',
               fieldname: 'systemSetup',
@@ -129,17 +140,6 @@ export default {
                 openSettings('System');
               },
             },
-            {
-              key: 'Invoice',
-              label: _('Invoice'),
-              icon: 'invoice',
-              description:
-                'Customize your invoices by adding a logo and address details',
-              fieldname: 'invoiceSetup',
-              action() {
-                openSettings('Invoice');
-              },
-            },
           ],
         },
         {