commit e1683bb43eba8376799f67d2d695ba3cf4121dc9
author Tao Zhou <taoalpha@google.com> Thu Jul 09 15:10:27 2020 +0200
committer Tao Zhou <taoalpha@google.com> Thu Jul 09 13:20:51 2020 +0000
tree 52061326428c0d16f979d3d4c6deabc96650620a
parent 709c082bc9335f1abf4671175d723e381d280f2d

Move border-radius for gr-account-label to a css variable

The 'overlay' should always have same border-radius with the label.

Change-Id: Ia0aa8b2faad75ab00b2714b79e222920c786fdf8

polygerrit-ui/app/elements/change/gr-reply-dialog/gr-reply-dialog_html.js

diff --git a/polygerrit-ui/app/elements/change/gr-reply-dialog/gr-reply-dialog_html.js b/polygerrit-ui/app/elements/change/gr-reply-dialog/gr-reply-dialog_html.js
index b611e41..dc20c0d 100644
--- a/polygerrit-ui/app/elements/change/gr-reply-dialog/gr-reply-dialog_html.js
+++ b/polygerrit-ui/app/elements/change/gr-reply-dialog/gr-reply-dialog_html.js
@@ -155,10 +155,10 @@
     }
     .attention-detail gr-account-label {
       background-color: var(--background-color-tertiary);
-      border-radius: 10px;
       padding: 0 var(--spacing-m) 0 var(--spacing-s);
       margin-right: var(--spacing-m);
       user-select: none;
+      --label-border-radius: 10px;
     }
     .attention-detail gr-account-label:focus {
       outline: none;

polygerrit-ui/app/elements/shared/gr-account-label/gr-account-label_html.js

diff --git a/polygerrit-ui/app/elements/shared/gr-account-label/gr-account-label_html.js b/polygerrit-ui/app/elements/shared/gr-account-label/gr-account-label_html.js
index 9e7807a..c090416 100644
--- a/polygerrit-ui/app/elements/shared/gr-account-label/gr-account-label_html.js
+++ b/polygerrit-ui/app/elements/shared/gr-account-label/gr-account-label_html.js
@@ -21,6 +21,7 @@
     :host {
       display: inline;
       position: relative;
+      border-radius: var(--label-border-radius);
     }
     :host::after {
       content: var(--account-label-suffix);
@@ -36,6 +37,7 @@
       left: 0;
       background-color: var(--background-color-primary);
       opacity: 0.5;
+      border-radius: var(--label-border-radius);
     }
     gr-avatar {
       height: var(--line-height-normal);