IKNINJA-1266 : restrict tab size for long file names and resize tabs on window resize

Signed-off-by: Ananya Sen <Ananya.Sen@motorola.com>

2 files changed, 17 insertions, 7 deletions

diff --git a/js/components/layout/document-entry.reel/document-entry.css b/js/components/layout/document-entry.reel/document-entry.css
index 52d08d72..d723c45f 100755
--- a/js/components/layout/document-entry.reel/document-entry.css
+++ b/js/components/layout/document-entry.reel/document-entry.css
@@ -4,19 +4,26 @@
  (c) Copyright 2011 Motorola Mobility, Inc.  All Rights Reserved.
  </copyright> */
 
+.documentEntry{
+    white-space: nowrap;
+}
+
 .documentEntry span
 {
-    /*display: inline-block;*/
+    display: inline-block;
     white-space: nowrap;
     overflow: hidden;
-    text-overflow: ellipsis; /* Causes ... to appear ?? */
+    text-overflow: ellipsis;
     max-width:100px;
+    width:85%;
+    min-width:0px;
 }
 
 .documentEntry img {
     opacity: 0.5; /* 50% */
-    padding-left: 5px;
     width: 12px;
+    max-width:12px;
+    min-width:5px;
     height: 12px;
     -webkit-transition: opacity 0.2s ease;
     transition: opacity 0.2s ease;
diff --git a/js/components/layout/documents-tab.reel/documents-tab.css b/js/components/layout/documents-tab.reel/documents-tab.css
index 689eb777..da00f727 100755
--- a/js/components/layout/documents-tab.reel/documents-tab.css
+++ b/js/components/layout/documents-tab.reel/documents-tab.css
@@ -12,7 +12,6 @@
 }
 
 .openDocuments {
-    float: left;
     height: 25px;
     width: 100%;
     font-size: 12px;
@@ -21,16 +20,20 @@
     padding: 0;
     position: relative;
     text-decoration: none;
+    display: -webkit-box;
+    -webkit-box-orient: horizontal;
+    -webkit-box-pack:start;
+    -webkit-box-align:start;
 }
 
 .openDocuments li {
     border-right: 1px solid black;
     cursor: pointer;
-    display: inline;
-    float: left;
     padding: 0.5em 1em;
-    text-shadow: 1px 1px 1px #000000;
     vertical-align: middle;
+    text-shadow: 1px 1px 1px #000000;
+    -webkit-box-flex: 1;
+    max-width: 115px;
 }
 
 .openDocuments li:hover,