lp1855931 eg-grid column headers user/mrisher/lp1855931-eg-grid-column-wrap
authorMike Risher <mrisher@catalyte.io>
Tue, 10 Dec 2019 23:15:35 +0000 (23:15 +0000)
committerMike Risher <mrisher@catalyte.io>
Tue, 10 Dec 2019 23:15:35 +0000 (23:15 +0000)
Make column headers text wrap so that you can fully read the header even if
it's several words long.  This will help when there are multiple headers
that start with the same word and they show up identically.

Signed-off-by: Mike Risher <mrisher@catalyte.io>
Open-ILS/src/eg2/src/app/share/grid/grid.component.css

index de4894d..4c9575f 100644 (file)
   border-color: #b8daff;
 }
 
-.eg-grid-header-cell {
-    font-weight: bold;
-}
-
-.eg-grid-header-cell.dragover {
-    background-color: #cce5ff;
-    border-color: #b8daff;
-}
-
-.eg-grid-header-cell-sort-label {
-  cursor: pointer;
-  text-decoration: underline;
-}
-
-.eg-grid-header-cell-sort-arrow {
-  font-size: 14px;
-}
-
 .eg-grid-cell {
     flex: 2; /* applied per column */
     padding: 6px;
 .eg-grid-body-cell {
 }
 
+.eg-grid-header-cell {
+  font-weight: bold;
+  white-space: normal;
+}
+
+.eg-grid-header-cell.dragover {
+    background-color: #cce5ff;
+    border-color: #b8daff;
+}
+
+.eg-grid-header-cell-sort-label {
+  cursor: pointer;
+  text-decoration: underline;
+}
+
+.eg-grid-header-cell-sort-arrow {
+  font-size: 14px;
+}
+
 .eg-grid-toolbar {
   display: flex;
 }