Use different colors for usernames in messages

Related to #53. This already improves UX a lot, but I still think we
should omit the username if it doesn't change between messages. Thinking
about it, we could even omit the time if it doesn't change.

The color used is Briar's primary "Lime" color, as per
* https://briar-styleguide.netlify.app/brand/
* https://code.briarproject.org/briar/briar-styleguide/-/blob/2e8fa50a2628ce685ad2a3c88337388b29f496ba/layouts/partials/brand/colors.html#L15

briar-gtk/briar_gtk/widgets/private_message.py

@@ -22,10 +22,13 @@ class PrivateMessageWidget(Gtk.ListBoxRow):
         self.set_margin_top(12)
 
         username = contact_name
+        username_style_class = "username"
         if message["local"]:
             username = _("Myself")
+            username_style_class = "username-self"
 
-        username_info = PrivateMessageWidget._create_username_info(username)
+        username_info = PrivateMessageWidget._create_username_info(
+            username, username_style_class)
         date_info = PrivateMessageWidget._create_date_info(
             message["timestamp"] / 1000)
         info = PrivateMessageWidget._create_info(username_info, date_info)
@@ -44,11 +47,11 @@ class PrivateMessageWidget(Gtk.ListBoxRow):
         self.show_all()
 
     @staticmethod
-    def _create_username_info(username):
+    def _create_username_info(username, username_style_class):
         username_label = Gtk.Label.new(username)
         username_label.set_justify(Gtk.Justification.LEFT)
         username_label.set_halign(Gtk.Align.START)
-        username_label.get_style_context().add_class("username")
+        username_label.get_style_context().add_class(username_style_class)
 
         username_event_box = Gtk.EventBox()
         username_event_box.add(username_label)

briar-gtk/data/ui/application.css

@@ -61,12 +61,18 @@
   opacity: 0.5;
 }
 
+row .username-self {
+  font-weight: bold;
+  font-size: small;
+  color: @theme_selected_bg_color;
+}
+
 row .username {
   font-weight: bold;
   font-size: small;
+  color: #74B816;
 }
 
-row .username,
 row.msg-emote,
 .divider {
   color: @theme_selected_bg_color;