Better view of example translations and add translation button.

res/main.less

@@ -160,10 +160,18 @@
         float: left;
       }
 
-      .example-arrow, .example-dot {
+      .example-dot {
         margin-right: 1em;
       }
 
+      .example-translation {
+        margin-left: 1em;
+        &:before {
+          content: '↪';
+          margin-right: 0.2em;
+        }
+      }
+
       .example-text {
         ._hoverable();
       }
@@ -199,6 +207,9 @@
 
 .add-button {
   padding: 0 .5em;
+  margin-left: .3em;
+  background-color: @aqua;
+  color: @black;
 }
 
 // if span left of input it is just too high, this is a fix

src/view/view.py

@@ -150,10 +150,7 @@ class View:
           h(example_tag, {}, [
             h("span.example-text", {"on": {"click": msg(ShowExampleMenu(example))} }, example_content),
             h("div.example-translation-list", {}, [
-                h("div.example-translation", {}, [
+              h("div.example-translation", {}, View.view_translations(example.translations, example, model))])])])
-                    h("span.example-arrow", {}, "↪"),
-                    vt
-                    ]) for vt in View.view_translations(example.translations, example, model)])])])
     
     @staticmethod
     def view_translations(translations, parent, model):