fix: table header / footer styles

oocx · Nov 11, 2018 · e487891 · e487891
1 parent 49304bf
commit e487891
Show file tree

Hide file tree

Showing 2 changed files with 44 additions and 1 deletion.
diff --git a/projects/oocx-ng/src/lib/tables.less b/projects/oocx-ng/src/lib/tables.less
@@ -63,18 +63,23 @@ table.ox-table {
     }
 
     tr.groupHeader {
-        background-color: @table-background-color !important;
+        background-color: @table-background-color;
         border: none;
     }
 
     tr.groupHeader h3 {
         margin: 0;
     }
 
+    tr.groupFooter {
+        background-color: @table-background-color;
+    }
+
     tr.groupFooter > th {
         padding: 4px 4px 32px 4px;
         vertical-align: top;
         border: none;
+
     }
 
 

diff --git a/src/app/app.component.html b/src/app/app.component.html
@@ -137,6 +137,7 @@ <h3>Tables</h3>
 
 <h4>ox-table</h4>
 <table class="ox-table selectable">
+  <tr class="groupHeader"><th><h3>Sonntag, 01.07.2018</h3></th></tr>
   <tr class="header-row">
     <th>Datum</th>
     <th>Kennzeichen</th>
@@ -173,6 +174,43 @@ <h4>ox-table</h4>
     <td>EDXG</td>
     <td>0:55</td>
   </tr>
+  <tr>
+    <td>01.07.2018</td>
+    <td>D-1234</td>
+    <td>10:00</td>
+    <td>EDXG</td>
+    <td>10:55</td>
+    <td>EDXG</td>
+    <td>0:55</td>
+  </tr>
+  <tr class="groupFooter">
+    <td>3</td>
+    <td></td>
+    <td></td>
+    <td></td>
+    <td></td>
+    <td></td>
+    <td>2:55</td>
+  </tr>
+  <tr class="groupHeader"><th><h3>Montag, 02.07.2018</h3></th></tr>
+  <tr>
+    <td>02.07.2018</td>
+    <td>D-1234</td>
+    <td>10:00</td>
+    <td>EDXG</td>
+    <td>10:55</td>
+    <td>EDXG</td>
+    <td>0:55</td>
+  </tr>
+  <tr class="groupFooter">
+    <td>3</td>
+    <td></td>
+    <td></td>
+    <td></td>
+    <td></td>
+    <td></td>
+    <td>2:55</td>
+  </tr>
 </table>
 
 <h4>ox-table2</h4>