| Index: chrome/browser/resources/settings/settings_vars_css.html
|
| diff --git a/chrome/browser/resources/settings/settings_vars_css.html b/chrome/browser/resources/settings/settings_vars_css.html
|
| index dd2d858cabb5f782962a5ec629dfcd2aab022393..d47877620690e1459412213834bf6ef87662bb88 100644
|
| --- a/chrome/browser/resources/settings/settings_vars_css.html
|
| +++ b/chrome/browser/resources/settings/settings_vars_css.html
|
| @@ -3,43 +3,45 @@
|
|
|
| <!-- Common css variables for Material Design settings. -->
|
| <style is="custom-style">
|
| - /* We keep our vars in sort order, though some vars must be defined prior to
|
| - * others. The --settings-* vars are defined explicitly prior to the --paper-*
|
| - * and --iron-* vars.
|
| - */
|
| + /* Vars are kept in sort order, but some must be defined prior to others. */
|
| +
|
| + /* Single attribute and other simple settings vars are defined first. */
|
| :root {
|
| /* Some colors use non-MD colors. These custom colors are specified by
|
| * UX design (bettes@). */
|
|
|
| --settings-actionable: var(--cr-actionable);
|
| -
|
| --settings-background-color: rgb(241, 241, 241);
|
| + --settings-box-row-padding: 20px;
|
| + --settings-checkbox-margin-start: 2px;
|
| + --settings-checkbox-size: 16px;
|
| + --settings-checkbox-spacing: 18px;
|
| --settings-disabled-opacity: .65;
|
| --settings-error-color: var(--paper-red-700);
|
| + --settings-nav-grey: rgb(90, 90, 90);
|
| + --settings-page-vertical-margin: 21px;
|
| + --settings-row-min-height: 44px;
|
| + --settings-row-two-line-min-height: 56px;
|
| + --settings-separator-line: var(--cr-separator-line);
|
| + --settings-title-bar-background-color: var(--google-blue-700);
|
| + --settings-title-bar-color: rgb(255, 255, 255);
|
| + --settings-title-search-color: rgb(192, 199, 205);
|
| + --settings-toggle-color: var(--google-blue-500);
|
| + }
|
|
|
| + /* Style blocks are defined after single attribute vars. */
|
| + :root {
|
| --settings-list-frame-padding: {
|
| - -webkit-padding-end: 20px;
|
| + -webkit-padding-end: var(--settings-box-row-padding);
|
| -webkit-padding-start: 56px;
|
| padding-bottom: 0;
|
| padding-top: 0;
|
| }
|
| -
|
| - --settings-nav-grey: rgb(90, 90, 90);
|
| -
|
| - --settings-page-vertical-margin: 21px;
|
| -
|
| - --settings-row-min-height: 44px;
|
| - --settings-row-two-line-min-height: 56px;
|
| --settings-secondary: {
|
| color: var(--paper-grey-600);
|
| font-weight: 400;
|
| margin-top: 4px;
|
| };
|
| - --settings-separator-line: var(--cr-separator-line);
|
| -
|
| - --settings-title-bar-background-color: var(--google-blue-700);
|
| - --settings-title-bar-color: rgb(255, 255, 255);
|
| - --settings-title-search-color: rgb(192, 199, 205);
|
| --settings-toggle-bar-size: {
|
| height: 12px;
|
| left: 4px;
|
| @@ -49,13 +51,10 @@
|
| height: 16px;
|
| width: 16px;
|
| };
|
| - --settings-toggle-color: var(--google-blue-500);
|
| }
|
|
|
| + /* Polymer vars are defined last. */
|
| :root {
|
| - --checkbox-margin-start: 2px;
|
| - --checkbox-size: 16px;
|
| - --checkbox-spacing: 18px;
|
| --iron-icon-fill-color: var(--paper-grey-600);
|
| --iron-icon-height: 20px;
|
| --iron-icon-spacing: 16px;
|
|
|