Added icons to vertical menu

Author: adokseo

popup.css

@@ -39,14 +39,14 @@ html
 body
 {
     font-family: 'Open Sans', sans-serif;
-    font-size: .875rem;
+    font-size: 14px;
 
     display: flex;
     overflow: hidden;
     flex-direction: column;
 
-    width: 18.75rem;
-    height: 31.25rem;
+    width: 300px;
+    height: 500px;
     margin: 0;
 }
 

popup.js

@@ -293,6 +293,7 @@ var Menu = {
                     export: {
                         type: 'button',
                         label: 'Export',
+                        before: '<svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M21 15v4a2 2 0 01-2 2H5a2 2 0 01-2-2v-4M17 8l-5-5-5 5M12 3v12"/></svg>',
                         onclick: function() {
                             chrome.runtime.sendMessage({
                                 name: 'download',
@@ -304,6 +305,7 @@ var Menu = {
                     import: {
                         type: 'button',
                         label: 'Import',
+                        before: '<svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M21 15v4a2 2 0 01-2 2H5a2 2 0 01-2-2v-4M7 10l5 5 5-5M12 15V3"/></svg>',
                         onclick: function() {
                             try {
                                 var input = document.createElement('input');
@@ -377,7 +379,8 @@ var Menu = {
             }
         }
     }
-};
+};
+
 Menu.main = {
     type: 'main',
     appearanceKey: 'home',

src/css/basic.css

@@ -33,13 +33,13 @@
 body
 {
     font-family: 'Open Sans', sans-serif;
-    font-size: .875rem;
+    font-size: 14px;
 
     display: flex;
     overflow: hidden;
     flex-direction: column;
 
-    width: 18.75rem;
-    height: 31.25rem;
+    width: 300px;
+    height: 500px;
     margin: 0;
 }

src/js/header.js

@@ -38,6 +38,7 @@ var Menu = {
                     export: {
                         type: 'button',
                         label: 'Export',
+                        before: '<svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M21 15v4a2 2 0 01-2 2H5a2 2 0 01-2-2v-4M17 8l-5-5-5 5M12 3v12"/></svg>',
                         onclick: function() {
                             chrome.runtime.sendMessage({
                                 name: 'download',
@@ -49,6 +50,7 @@ var Menu = {
                     import: {
                         type: 'button',
                         label: 'Import',
+                        before: '<svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M21 15v4a2 2 0 01-2 2H5a2 2 0 01-2-2v-4M7 10l5 5 5-5M12 15V3"/></svg>',
                         onclick: function() {
                             try {
                                 var input = document.createElement('input');
@@ -122,4 +124,4 @@ var Menu = {
             }
         }
     }
-};
+};