Style links and buttons similarly in menu

Signed-off-by: RMidhunSuresh <rmidhunsuresh@gmail.com>

src/platform/web/ui/css/layout.css

@@ -195,6 +195,11 @@ the layout viewport up without resizing it when the keyboard shows */
     z-index: 2;
 }
 
+.menu .menu-item{
+    box-sizing: border-box;
+    width: 100%;
+}
+
 .Settings {
     display: flex;
     flex-direction: column;

src/platform/web/ui/css/themes/element/theme.css

@@ -684,14 +684,17 @@ button.link {
     margin: 0;
 }
 
-.menu button {
+.menu li{
+    margin-bottom: 10px;
+}
+
+.menu .menu-item{
     border-radius: 4px;
-    display: block;
     border: none;
-    width: 100%;
     background-color: transparent;
     text-align: left;
     padding: 8px 32px 8px 8px;
+    text-decoration: none;
 }
 
 .menu .destructive button {

src/platform/web/ui/general/Menu.js

@@ -37,10 +37,10 @@ export class Menu extends TemplateView {
 
     _convertToDOM(option) {
         if (option.callback) {
-            return tag.button({ onClick: option.callback }, option.label);
+            return tag.button({ className: "menu-item", onClick: option.callback }, option.label);
         }
         else if (option.link) {
-            return tag.a({ href: option.link }, option.label);
+            return tag.a({ className: "menu-item", href: option.link }, option.label);
         }
     }