Styling elements and getting structure into data view

src/style.css

@@ -340,4 +340,28 @@ select {
 .tag-history-element {
     padding: 15px;
     margin: 5px;
+    max-width: 100%;
+}
+
+.tag-history-element > div {
+    padding: 10px;
+    min-width: 100px;
+}
+
+.tag-history-element .id {
+    position: absolute;
+    top: 15px;
+    right: 15px;
+}
+
+.tag-history-element .created {
+    position: absolute;
+    top: 70px;
+    right: 15px;
+}
+
+.tag-history-element .id span,
+.tag-history-element .container span,
+.tag-history-element .parent span{
+    font-size: 12px;
 }

src/tags/image-date.tag

@@ -32,7 +32,7 @@
           return Math.floor(diff / maxSeconds[i]) + ' ' + labels[i * 2 + 1];
         }
       }
-    }
+    };
     opts.image.on('creation-date', function(date) {
       self.date = date;
       self.localDate = date.toLocaleString()

src/tags/tag-history.tag

@@ -26,9 +26,9 @@ along with this program. If not, see <http://www.gnu.org/licenses/>.
         <div show="{ registryUI.taghistory.loadend }">
 
             <material-card each="{ guiElement in registryUI.taghistory.elements }" class="tag-history-element">
-                <p each="{ entry in guiElement }">
+                <div each="{ entry in guiElement }" class="{ entry.key }">
-                    { entry.key } { entry.value }
+                    <strong>{ entry.key }</strong><br> <span> { entry.value } </span>
-                </p>
+                </div>
 
             </material-card>
         </div>
@@ -38,6 +38,8 @@ along with this program. If not, see <http://www.gnu.org/licenses/>.
     <script type="text/javascript">
         console.log("taghistory script area");
 
+
+
         registryUI.taghistory.instance = this;
         registryUI.taghistory.display = function () {
             var oReq = new Http();
@@ -49,12 +51,16 @@ along with this program. If not, see <http://www.gnu.org/licenses/>.
                     var elements = JSON.parse(this.responseText).history || [];
                     for(var index in elements){
                         var parsedNestedElements = JSON.parse(elements[index].v1Compatibility || {});
-                        console.log(parsedNestedElements);
-
                         var guiElements = [];
                         var guiElement = {};
                         for(var attribute in parsedNestedElements){
                             if(parsedNestedElements.hasOwnProperty(attribute)){
+                                var value = parsedNestedElements[attribute];
+                                if(attribute == "created"){
+                                    // Todo this must be parsed correctly
+                                }else if(attribute == "container_config" || attribute == "config"){
+                                    console.log(value.cmd);
+                                }
                                 guiElement = {
                                     "key": attribute,
                                     "value": parsedNestedElements[attribute]
@@ -85,6 +91,7 @@ along with this program. If not, see <http://www.gnu.org/licenses/>.
             oReq.send();
         };
 
+
         registryUI.taghistory.display();
         registryUI.taghistory.instance.update();
     </script>