Bug 1579252 - Bring metadata treatment into spec alignment. r=sfoster

I confirmed using the built-in accessibility tools that there is enough contrast in regular and dark mode.

Differential Revision: https://phabricator.services.mozilla.com/D45917

--HG--
extra : moz-landing-system : lando

browser/components/aboutlogins/content/components/login-footer.css

@@ -12,6 +12,7 @@ footer {
   display: flex;
   flex-wrap: wrap;
   align-items: center;
+  margin-top: 20px;
 }
 
 footer > p {

browser/components/aboutlogins/content/components/login-item.css

@@ -14,6 +14,13 @@
   --edit-delete-button-color: #4a4a4f;
 }
 
+/* Only overwrite the deemphasized text color in non-dark mode. */
+@media not all and (prefers-color-scheme: dark) {
+  :host {
+    --in-content-deemphasized-text: #737373;
+  }
+}
+
 form {
   flex-grow: 1;
 }
@@ -192,7 +199,10 @@ input[type="url"][readOnly]:hover:active {
 
 .meta-info {
   font-size: smaller;
+  font-weight: 300;
   color: var(--in-content-deemphasized-text);
+  margin-top: 0;
+  margin-bottom: 8px;
 }
 
 .meta-info:first-of-type::before {