Lesion Tracker Redesign so far

Packages/viewerbase/client/components/studyBrowser/imageThumbnail/imageThumbnail.html

@@ -1,5 +1,6 @@
 <template name="imageThumbnail">
     <div class="imageThumbnail">
+        <div class="imageThumbnailCanvas"></div>
         <div class="imageThumbnailLoadingIndicator thumbnailLoadingIndicator">
             <p>Loading {{percentComplete}}</p>
         </div>
@@ -7,4 +8,4 @@
             <p>Error</p>
         </div>
     </div>
-</template>
+</template>

Packages/viewerbase/client/components/studyBrowser/imageThumbnail/imageThumbnail.js

@@ -1,6 +1,6 @@
 Template.imageThumbnail.onRendered(function() {
     var instance = this.data.stack.instances[0];
-    var element = this.find('.imageThumbnail');
+    var element = this.find('.imageThumbnailCanvas');
 
     cornerstone.disable(element);
     $(element).find('canvas').remove();
@@ -12,7 +12,7 @@ Template.imageThumbnail.onRendered(function() {
     var elem = $(element);
     elem.find('.imageThumbnailLoadingIndicator').css('display', 'block');
 
-    var thumbnailIndex = $('.imageThumbnail').index(element);
+    var thumbnailIndex = $('.imageThumbnailCanvas').index(element);
     ThumbnailLoading[thumbnailIndex] = imageId;
 
     this.data.thumbnailIndex = thumbnailIndex;

Packages/viewerbase/client/components/studyBrowser/imageThumbnail/imageThumbnail.styl

@@ -1,10 +1,30 @@
+@import "{design}/app"
+
+.thumbnailEntry.active .imageThumbnail
+  border-color: $activeColor
+  box-shadow: none
+  transition($sidebarTransition)
+
 .imageThumbnail
-  width: 90px
-  height: 90px
-  background-color: black
+  background-color: $primaryBackgroundColor
+  border: 5px solid transparent
+  border-radius: 12px
+  box-shadow: inset 0 0 0 1px $uiBorderColorDark
+  height: 135px
   margin: 0 auto
+  padding 1px 7px
   position: relative
-  
+  transition($sidebarTransition)
+  width: 217px
+
+  &:hover
+    border-color: $hoverColor
+    box-shadow: none
+
+.imageThumbnailCanvas
+  height: 100%
+  overflow: hidden
+
 .thumbnailLoadingIndicator
   display: none
   pointer-events: none
@@ -17,7 +37,7 @@
   bottom: 0
   margin: auto
   position: absolute
-  
+
   p
     text-align: center
-    font-size: 10pt
+    font-size: 10pt