- Finished new image view

- Add the CoreOS icon font

static/partials/image-view.html

@@ -10,20 +10,41 @@
         </a>
       </span>
       <span class="cor-title-content">
-        <i class="fa fa-database fa-lg" style="margin-right: 10px"></i>
+        <i class="fa fa-archive fa-lg" style="margin-right: 10px"></i>
         {{ image.id.substr(0, 12) }}
       </span>
     </div>
 
-    <div class="co-main-content-panel">
-      <div class="image-view-header">
-        <div class="image-id section"><i class="fa fa-code section-icon" bs-tooltip="tooltip.title" data-title="Full Image ID"></i> {{ image.id }}</div>
-        <div class="created section"><i class="fa fa-calendar section-icon" bs-tooltip="tooltip.title" data-title="Full Image ID"></i> {{ image.created | amDateFormat:'dddd, MMMM Do YYYY, h:mm:ss a' }}</div>
-      </div>
 
-      <div class="image-view-layer" repository="repository" image="image" images="image.history"></div>
-      <div class="image-view-layer" repository="repository" image="parent" images="image.history"
-           ng-repeat="parent in reversedHistory"></div>
+    <div class="cor-tab-panel">
+      <div class="cor-tabs">
+        <span class="cor-tab" tab-active="true" tab-title="Layers" tab-target="#layers">
+          <i class="fa ci-layers"></i>
+        </span>
+        <span class="cor-tab" tab-title="Changes" tab-target="#changes"
+              tab-init="downloadChanges()">
+          <i class="fa fa-code-fork"></i>
+        </span>
+      </div> <!-- /cor-tabs -->
+
+      <div class="cor-tab-content">
+        <!-- Layers -->
+        <div id="layers" class="tab-pane active">
+          <h3>Image Layers</h3>
+          <div class="image-view-layer" repository="repository" image="image" images="image.history"></div>
+          <div class="image-view-layer" repository="repository" image="parent" images="image.history"
+               ng-repeat="parent in reversedHistory"></div>
+        </div>
+
+        <!-- Changes -->
+        <div id="changes" class="tab-pane">
+          <div class="resource-view" resource="changesResource" error-message="'Could not load image changes'">
+            <h3>Image File Changes</h3>
+            <div id="changes-tree-container" class="changes-container"
+                 onresize="tree && tree.notifyResized()"></div>
+          </div>
+        </div>
+     </div>
     </div>
   </div>
 </div>