From 5e1aa6289f42325af9f1c034694e68359d9c43d9 Mon Sep 17 00:00:00 2001
From: Steve Goodwin <sgoodwin@redhat.com>
Date: Tue, 17 Jan 2017 16:49:17 -0500
Subject: [PATCH] Prevent mobile table td collapsing issue Fixes
 https://github.com/openshift/origin-web-console/issues/1128

---
 app/styles/_tables.less    | 8 +++++---
 app/styles/_variables.less | 2 ++
 dist/styles/main.css       | 4 ++--
 3 files changed, 9 insertions(+), 5 deletions(-)

diff --git a/app/styles/_tables.less b/app/styles/_tables.less
index eb959950fc..3295a4baf4 100644
--- a/app/styles/_tables.less
+++ b/app/styles/_tables.less
@@ -8,8 +8,8 @@
     > thead >tr > th, > tbody > tr > td {
       border-left: 0;
       border-right: 0;
-      padding-bottom: 8px;
-      padding-top: 8px;
+      padding-bottom: @table-cell-padding-bottom;
+      padding-top: @table-cell-padding-top;
       vertical-align: middle;
     }
 
@@ -123,7 +123,9 @@
            /* Behave like a row */
           border: none;
           border-bottom: 1px solid lighten(@table-border-color, 5%);
-          padding: 3px 6px 2px 35%;
+          // prevent empty td from collapsing
+          min-height:  (@table-cell-padding-top + @table-cell-padding-bottom) + (@line-height-base * @font-size-base);
+          padding-left: 35%;
           position: relative;
           &:last-child {
             border-bottom: none;
diff --git a/app/styles/_variables.less b/app/styles/_variables.less
index ce223326af..359dfbac23 100644
--- a/app/styles/_variables.less
+++ b/app/styles/_variables.less
@@ -16,6 +16,8 @@
 @navbar-pf-alt-navbar-brand-padding: 20px 0;
 @navbar-pf-bg-color: @navbar-os-bg-color;
 @sidebar-pf-bg: @body-bg;
+@table-cell-padding-bottom: 8px;
+@table-cell-padding-top: 8px;
 
 
 // OpenShift Console specific
diff --git a/dist/styles/main.css b/dist/styles/main.css
index 98ed6454f5..55443df578 100644
--- a/dist/styles/main.css
+++ b/dist/styles/main.css
@@ -2220,7 +2220,7 @@ td>.progress:first-child:last-child{margin-bottom:0;margin-top:3px}
 .progress-description .fa,.progress-description .pficon{font-size:14px;margin-right:3px}
 .progress-description-left .progress-description{left:0;margin-bottom:0;max-width:85px;position:absolute;top:0}
 .progress-description .tooltip{white-space:normal}
-.table>tbody>tr>td,.table>tbody>tr>th,.table>tfoot>tr>td,.table>tfoot>tr>th,.table>thead>tr>td,.table>thead>tr>th{padding:2px 10px 3px}
+.table>tbody>tr>td,.table>tbody>tr>th,.table>tfoot>tr>td,.table>tfoot>tr>th,.table>thead>tr>td,.table>thead>tr>th{padding:8px 10px}
 .nav-tabs+.nav-tabs-pf>li:first-child>a,.nav-tabs-pf.nav-justified>li:first-child>a{padding-left:15px}
 .table>tbody>tr>td>a:hover,.table>tbody>tr>th>a:hover,.table>tfoot>tr>td>a:hover,.table>tfoot>tr>th>a:hover,.table>thead>tr>td>a:hover,.table>thead>tr>th>a:hover{text-decoration:none}
 .table>tbody>tr>th,.table>tfoot>tr>th,.table>thead>tr>th{font-family:"Open Sans";font-style:normal;font-weight:600}
@@ -4961,7 +4961,7 @@ body,html{margin:0;padding:0}
 .table-mobile.table-empty{border:0}
 .table-mobile.table-empty>tbody>tr>td{border:0;padding-left:0}
 .table-mobile>tbody>tr{border-top:2px solid #d1d1d1}
-.table-mobile>tbody>tr>td{border:none;border-bottom:1px solid #dedede;padding:3px 6px 2px 35%;position:relative}
+.table-mobile>tbody>tr>td{border:none;border-bottom:1px solid #dedede;min-height:37.67px;padding-left:35%;position:relative}
 .table-mobile>tbody>tr>td:last-child{border-bottom:none}
 .table-mobile>tbody>tr>td:before{content:attr(data-title);position:absolute;top:8px;left:6px;width:35%;padding-right:10px;white-space:nowrap}
 }