[MD settings] layout of buttons inside toggles and iron-lists

chrome/browser/resources/settings/settings_shared_css.html

Index: chrome/browser/resources/settings/settings_shared_css.html
diff --git a/chrome/browser/resources/settings/settings_shared_css.html b/chrome/browser/resources/settings/settings_shared_css.html
index 54203fafb937c5958a58f118490de9e0235fc9f0..917ba17c694d3ce4fc7ec5d1caaee591a327dae1 100644
--- a/chrome/browser/resources/settings/settings_shared_css.html
+++ b/chrome/browser/resources/settings/settings_shared_css.html
@@ -39,6 +39,13 @@
         -webkit-margin-start: var(--cr-icon-ripple-margin));
       }
 
+      .list-item paper-icon-button {
+        /* Workaround iron-list cutting off ripples on paper-icon-buttons.
+         * TODO(dschuyler): Can the end margin be done differently to allow for
+         * ripples to look like they are overlapping the margin. */
+        -webkit-margin-end: 0;
+      }
+
       /* See notes in .primary-button.
        * TODO(dschuyler): Remove unnecessary .secondary-button references. */
       paper-button {
@@ -68,6 +75,11 @@
         -webkit-margin-end: calc(var(--settings-button-edge-spacing) * -1);
       }
 
+      /* Special case for buttons inside of toggle-buttons. */
+      .settings-box settings-toggle-button paper-button:last-of-type {
+        -webkit-margin-end: 16px;
+      }
+
       /* Space out multiple buttons in the same row. */
       .settings-box paper-button + paper-button {
         -webkit-margin-start: 16px;