Now display character 'portraits' on the menu.

3 files changed, 23 insertions, 1 deletions

diff --git a/src/asset/template/character_icon_entry.css b/src/asset/template/character_icon_entry.css
index d75b550..ab0594b 100644
--- a/src/asset/template/character_icon_entry.css
+++ b/src/asset/template/character_icon_entry.css
@@ -1 +1,2 @@
 .asset-character-icon-$ID${background-color: #$COLOR$;}
+.asset-character-portrait-$ID${background-color: #$COLOR$;}
diff --git a/src/battlemap/src/View/SideBar/TabMenu/Characters.elm b/src/battlemap/src/View/SideBar/TabMenu/Characters.elm
index cb2e53f..2907988 100644
--- a/src/battlemap/src/View/SideBar/TabMenu/Characters.elm
+++ b/src/battlemap/src/View/SideBar/TabMenu/Characters.elm
@@ -23,7 +23,10 @@ get_character_portrait_html char =
       [
          (Html.Attributes.class "battlemap-character-portrait"),
          (Html.Attributes.class
-            ("asset-char-portrait-" ++ (Struct.Character.get_portrait_id char))
+            (
+               "asset-character-portrait-"
+               ++ (Struct.Character.get_portrait_id char)
+            )
          )
       ]
       [
diff --git a/src/battlemap/www/style.css b/src/battlemap/www/style.css
index adac354..c8d8fab 100644
--- a/src/battlemap/www/style.css
+++ b/src/battlemap/www/style.css
@@ -197,3 +197,21 @@
 {
    flex: initial;
 }
+
+/******************************************************************************/
+.battlemap-character-portrait
+{
+   margin: 0.5em;
+   box-sizing: border-box;
+   border: 2px solid rgba(0,0,0,0.5);
+   border-radius: 25px 25px 0 25px;
+   width: 128px;
+   height: 128px;
+}
+
+.battlemap-tabmenu-characters-tab
+{
+   display: flex;
+   flex-direction: row;
+   flex-wrap: wrap;
+}