[Passwords][Leak Check] Scale spinner with font size

With larger (or smaller font) the absolute pixel sizes for the spinner
change the relative center of the animation which leads to an uneven
rotation.
To prevent this, the spinner now has a size relative to the font size
which is identical for the current size on normal scaling but scales
with larger/smaller sizes to keep the animation intact.

Since a large/small spinner looks wrong for a static status icon, the
icons also scale with the font size to match the spinner (which is not
a problem for the vector graphics).

Bug: 1096397
Change-Id: Ice9300cafdd2ef4877f28dd08c0a5b432588ddfb
Reviewed-on: https://chromium-review.googlesource.com/c/chromium/src/+/2250203Reviewed-by: Vasilii Sukhanov <vasilii@chromium.org>
Commit-Queue: Friedrich [CET] <fhorschig@chromium.org>
Cr-Commit-Position: refs/heads/master@{#779771}

chrome/browser/resources/settings/autofill_page/password_check.html

@@ -2,22 +2,22 @@
       iron-icon,
       #progressSpinner {
         --paper-spinner-stroke-width: 2px;
-        height: 16px;
+        height: 1.6em;
         padding-inline-end: 20px;
-        width: 16px;
+        width: 1.6em;
       }
 
       iron-icon.has-leaks {
         --iron-icon-fill-color: var(--google-red-600);
-        background: radial-gradient(circle 12px at 12px,
+        background: radial-gradient(circle 0.9em at 0.9em,
                                     #FCE8E6 100%,
                                     transparent 100%);
         margin-inline-end: 16px;
         margin-inline-start: -4px;
-        padding-bottom: 4px;
-        padding-inline-end: 4px;
-        padding-inline-start: 4px;
-        padding-top: 4px;
+        padding-bottom: 0.2em;
+        padding-inline-end: 0.2em;
+        padding-inline-start: 0.2em;
+        padding-top: 0.1em;
       }
 
       @media (prefers-color-scheme: dark) {