From: Tatu Lund <tatu@vaadin.com>
Date: Wed, 20 Oct 2021 14:34:58 +0000 (+0300)
Subject: fix: Do not allow border to grow row height (#12449)
X-Git-Tag: 8.15.0~25
X-Git-Url: https://source.dussan.org/?a=commitdiff_plain;h=d37f90ec97af506a32af58aae3442546e72fe1c8;p=vaadin-framework.git

fix: Do not allow border to grow row height (#12449)
---

diff --git a/themes/src/main/themes/VAADIN/themes/valo/components/_table.scss b/themes/src/main/themes/VAADIN/themes/valo/components/_table.scss
index 8443438fe2..8d3db80baa 100644
--- a/themes/src/main/themes/VAADIN/themes/valo/components/_table.scss
+++ b/themes/src/main/themes/VAADIN/themes/valo/components/_table.scss
@@ -2,13 +2,14 @@
  *
  * @group table
  */
-$v-table-row-height: $v-unit-size !default;
+$v-table-border-width: first-number($v-border) !default;
 
 /**
  *
  * @group table
  */
-$v-table-border-width: first-number($v-border) !default;
+$v-table-row-height: $v-unit-size !default;
+$v-table-body-row-height: round($v-table-row-height + $v-table-border-width) !default;
 
 /**
  *
@@ -229,7 +230,7 @@ $v-table-background-color: null !default;
   .#{$primary-stylename}-cell-content {
     border-left: $v-table-border-width solid $border-color;
     overflow: hidden;
-    height: $v-table-row-height;
+    height: $v-table-body-row-height;
     vertical-align: middle;
 
     &:first-child {
@@ -279,9 +280,11 @@ $v-table-background-color: null !default;
 
   .#{$primary-stylename}-table td {
     border-top: $v-table-border-width solid $border-color;
+    box-sizing: border-box;
   }
 
   .#{$primary-stylename}-table tr:first-child > td {
+    height: $v-table-row-height;
     border-top: none;
   }
 
@@ -522,7 +525,7 @@ $v-table-background-color: null !default;
 
   .#{$primary-stylename}-row-drag-bottom td.#{$primary-stylename}-cell-content {
     border-bottom: 2px solid $v-focus-color;
-    height: $v-table-row-height - 2px;
+    height: $v-table-body-row-height - 2px;
   }
 
   .#{$primary-stylename}-row-drag-bottom .#{$primary-stylename}-cell-wrapper {
@@ -531,7 +534,7 @@ $v-table-background-color: null !default;
 
   .#{$primary-stylename}-row-drag-top td.#{$primary-stylename}-cell-content {
     border-top: 2px solid $v-focus-color;
-    height: $v-table-row-height - 2px + $v-table-border-width;
+    height: $v-table-body-row-height - 2px + $v-table-border-width;
   }
 
   .#{$primary-stylename}-row-drag-top .#{$primary-stylename}-cell-wrapper {
@@ -679,7 +682,7 @@ $v-table-background-color: null !default;
 
   .#{$primary-stylename}-row-drag-top .#{$primary-stylename}-cell-content,
   .#{$primary-stylename}-row-drag-bottom .#{$primary-stylename}-cell-content {
-    height: $v-table-row-height - 1px;
+    height: $v-table-body-row-height - 1px;
   }
 }
 
diff --git a/uitest/reference-screenshots/chrome/TableDropIndicatorValoTest-indicator_ANY_Chrome__indicator.png b/uitest/reference-screenshots/chrome/TableDropIndicatorValoTest-indicator_ANY_Chrome__indicator.png
index 2612b14342..c18b85f162 100755
Binary files a/uitest/reference-screenshots/chrome/TableDropIndicatorValoTest-indicator_ANY_Chrome__indicator.png and b/uitest/reference-screenshots/chrome/TableDropIndicatorValoTest-indicator_ANY_Chrome__indicator.png differ