Remove ::content and fix the `no-left` style for shift + a

added gr-hovercard test back, increased the transition time
for css animation to avoid opacity flaky.

Bug: Issue 11177
Change-Id: I51e4f0f39b4f558619bde660eb0ce9d30076b37e

polygerrit-ui/app/elements/diff/gr-diff/gr-diff.html

diff --git a/polygerrit-ui/app/elements/diff/gr-diff/gr-diff.html b/polygerrit-ui/app/elements/diff/gr-diff/gr-diff.html
index 374368c..7e8dd8a 100644
--- a/polygerrit-ui/app/elements/diff/gr-diff/gr-diff.html
+++ b/polygerrit-ui/app/elements/diff/gr-diff/gr-diff.html
@@ -31,10 +31,10 @@
 <dom-module id="gr-diff">
   <template>
     <style include="shared-styles">
-      :host(.no-left) .sideBySide ::content .left,
-      :host(.no-left) .sideBySide ::content .left + td,
-      :host(.no-left) .sideBySide ::content .right:not([data-value]),
-      :host(.no-left) .sideBySide ::content .right:not([data-value]) + td {
+      :host(.no-left) .sideBySide .left,
+      :host(.no-left) .sideBySide .left + td,
+      :host(.no-left) .sideBySide .right:not([data-value]),
+      :host(.no-left) .sideBySide .right:not([data-value]) + td {
         display: none;
       }
       ::slotted(*) .thread-group {

polygerrit-ui/app/elements/shared/gr-hovercard/gr-hovercard.html

diff --git a/polygerrit-ui/app/elements/shared/gr-hovercard/gr-hovercard.html b/polygerrit-ui/app/elements/shared/gr-hovercard/gr-hovercard.html
index bb6fbb5..cd14139 100644
--- a/polygerrit-ui/app/elements/shared/gr-hovercard/gr-hovercard.html
+++ b/polygerrit-ui/app/elements/shared/gr-hovercard/gr-hovercard.html
@@ -34,7 +34,7 @@
         visibility: visible;
         opacity: 1;
       }
-      :host ::content #hovercard {
+      #hovercard {
         background: var(--dialog-background-color);
         box-shadow: rgba(0, 0, 0, 0.3) 0 1px 3px;
         padding: 1em;

polygerrit-ui/app/elements/shared/gr-hovercard/gr-hovercard_test.html

diff --git a/polygerrit-ui/app/elements/shared/gr-hovercard/gr-hovercard_test.html b/polygerrit-ui/app/elements/shared/gr-hovercard/gr-hovercard_test.html
index aa13407..8e79f65 100644
--- a/polygerrit-ui/app/elements/shared/gr-hovercard/gr-hovercard_test.html
+++ b/polygerrit-ui/app/elements/shared/gr-hovercard/gr-hovercard_test.html
@@ -41,7 +41,8 @@
   suite('gr-hovercard tests', () => {
     let element;
     let sandbox;
-    const TRANSITION_TIME = 200;
+    // For css animations
+    const TRANSITION_TIME = 500;
 
     setup(() => {
       sandbox = sinon.sandbox.create();

polygerrit-ui/app/test/index.html

diff --git a/polygerrit-ui/app/test/index.html b/polygerrit-ui/app/test/index.html
index a0e85ef..d1a0eca 100644
--- a/polygerrit-ui/app/test/index.html
+++ b/polygerrit-ui/app/test/index.html
@@ -183,7 +183,7 @@
     'shared/gr-editable-label/gr-editable-label_test.html',
     'shared/gr-formatted-text/gr-formatted-text_test.html',
     // TODO: uncomment file & fix tests. The file was missed in this list for a long time.
-    // 'shared/gr-hovercard/gr-hovercard_test.html',
+    'shared/gr-hovercard/gr-hovercard_test.html',
     'shared/gr-js-api-interface/gr-annotation-actions-context_test.html',
     'shared/gr-js-api-interface/gr-annotation-actions-js-api_test.html',
     'shared/gr-js-api-interface/gr-change-actions-js-api_test.html',