Add items to view character page.

src/frontend/templates/characters/view_character.html.tera

@@ -111,31 +111,31 @@
          margin: 0;
      }
 
-     #merits {
+     #merits, #items {
          padding: 4px;
-     }
-
-     #merit-list {
          display: inline-flex;
          flex-direction: column;
      }
 
-     .merit {
+     #merit-list, #item-list {
-         /* margin: 0;
+         display: inline-flex;
-            padding: 0; */
+         flex-direction: column;
+     }
+
+     .merit, .item {
          display: flex;
          border: 1px solid gray;
          margin-top: -1px;
      }
 
-     .merit span {
+     .merit span, .item span {
          width: 3em;
          text-align: left;
          padding: 8px;
          margin: 0;
      }
 
-     .merit .merit-name {
+     .merit .merit-name, .item .item-name {
          width: 10em;
          white-space: nowrap;
          overflow: auto;
@@ -153,16 +153,6 @@
          background-color: lightgray;
          margin: 0;
      }
-
-     .merit .remove-merit {
-         max-width: 4em;
-         padding: 0;
-         padding: 3px;
-         padding-left: 6px;
-         padding-right:6px;
-         margin: 3px;
-         background-color: lightgray;
-     }
     </style>
 
     <div>
@@ -262,5 +252,16 @@
                 {% endfor %}
             </div>
         </div>
+
+        <div id="items">
+            <h2>Items</h2>
+            <div id="item-list">
+                {% for item in sheet.items %}
+                    <div class="item">
+                        <span class="item-name">{{item.name}}</span>
+                    </div>
+                {% endfor %}
+            </div>
+        </div>
     </div>
 {% endblock content %}