From c942fad19930a96f458105152b1d19b3e4d4d3de Mon Sep 17 00:00:00 2001
From: Hui Ling Shi <huilingshi@google.com>
Date: Fri, 17 Jun 2022 08:38:21 +0000
Subject: [PATCH] Limit scope of PropertiesTableView styling

Previously in [1], the style in PropertiesTableView component is applied
directly to common Vue components like <md-table-cell />. This may
create confusion in the future if <md-table-cell /> is used in other
components, as the style configuration of <md-table-cell /> would not
be the default Vue one, and would instead follow PropertiesTableView's.
This commit fixes this issue by limiting the scope of the CSS styling
in PropertiesTableView.vue.

CL[1]: I39fe382ffb50d71e67cace912452a33ca49de3f9

Test: manual on local build of Winscope
Bug: 235313782
Change-Id: I44d9afb8f49cc21748807c0b8b7e912db6f37a52
---
 tools/winscope/src/PropertiesTableView.vue | 12 ++++++------
 1 file changed, 6 insertions(+), 6 deletions(-)

diff --git a/tools/winscope/src/PropertiesTableView.vue b/tools/winscope/src/PropertiesTableView.vue
index bb001c6f4..ac399e694 100644
--- a/tools/winscope/src/PropertiesTableView.vue
+++ b/tools/winscope/src/PropertiesTableView.vue
@@ -48,28 +48,28 @@ export default {
   margin-bottom: 10px;
 }
 
-.table-heading {
+.properties-table-wrapper .table-heading {
   padding: 10px 16px;
 }
 
-.table-key-cell {
+.properties-table-wrapper .table-key-cell {
   background-color: rgba(158, 192, 200, 0.281);
 }
 
-.table-key-value {
+.properties-table-wrapper .table-key-value {
   overflow-wrap: anywhere;
   border-left: 1px solid rgba(0, 0, 0, 0.12);
 }
 
-.md-table-cell {
+.properties-table-wrapper .md-table-cell {
   height: auto;
 }
 
-.md-table-cell-container {
+.properties-table-wrapper .md-table-cell-container {
   padding: 8px 16px;
 }
 
-.md-table-cell:last-child .md-table-cell-container {
+.properties-table-wrapper .md-table-cell:last-child .md-table-cell-container {
   padding-right: 16px;
 }
 </style>