styling corpus example components in main view

res/main.less

@@ -238,6 +238,18 @@
         border: 1px @gray solid;
       }
     }
+
+    .comp-text {
+      margin-left: 0.5ch; // half width of '0'
+    }
+
+    .comp-role {
+      color: @red;
+    }
+
+    .comp-role-headword {
+      font-weight: bold;
+    }
   }
 }
 

src/message/simple_edits.py

@@ -118,6 +118,5 @@ class ExampleClusterAdd(NoReset):
                 if cnum is not None:
                     max_example_cluster_num = max(max_example_cluster_num, cnum)
                 
-        console.log(max_example_cluster_num, example.text())
         example.set_cluster(max_example_cluster_num + 1)
         

src/model/example.py

@@ -1,6 +1,7 @@
 from model.editable import Editable
 from model.translation import from_container_list
 from model.example_clusters import ExampleClusters
+from lib.snabbdom import h
 
 
 class Example(Editable):
@@ -29,8 +30,8 @@ class Example(Editable):
         result.appendChild(inner)
         return result
     
-    def text(self):
-        return " ".join([comp.text for comp in self.components])
+    def view(self):
+        return self.inner.view(self.components)
         
     def get_cluster(self):
         return self.inner.get_cluster()
@@ -79,6 +80,9 @@ class CorpusExample:
     def get_structure(self):
         return None
     
+    def view(self, components):
+        return [h("span" + comp.view_style(), {}, comp.text) for comp in components]
+    
 
 class MultiwordExample:
     def __init__(self, example_xml):
@@ -124,6 +128,9 @@ class MultiwordExample:
             return self.other_attributes["structureName"]
         else:
             return None
+    
+    def view(self, components):
+        return " ".join([comp.text for comp in components])
 
 
 class ComponentLexeme(Editable):
@@ -159,4 +166,13 @@ class ComponentLexeme(Editable):
         
         return result
     
+    def view_style(self):
+        result = ".comp-text"
+        if self.role is not None:
+            result += ".comp-role"
+            if self.role == "headword":
+                result += ".comp-role-headword"
+                
+        return result
+        
 

src/view/view.py

@@ -129,7 +129,7 @@ class View:
             example_content.append(h("span.example-cluster", {}, str(cluster + 1)))
         
         example_text_inner_tag = "span.example-text-{}".format(example.get_view_type())
-        example_content.append(h(example_text_inner_tag, {}, example.text()))
+        example_content.append(h(example_text_inner_tag, {}, example.view()))
         
         other_attributes = example.get_other_attributes()
         if "frequency" in other_attributes: