Chromium Code Reviews
chromiumcodereview-hr@appspot.gserviceaccount.com (chromiumcodereview-hr) | Please choose your nickname with Settings | Help | Chromium Project | Gerrit Changes | Sign out
(179)

Side by Side Diff: chrome/browser/resources/settings/settings_vars_css.html

Issue 2578793004: MD Settings: Fix size and padding of expand button (Closed)
Patch Set: Rebase Created 4 years ago
Use n/p to move between diff chunks; N/P to move between comments. Draft comments are only viewable by you.
Jump to:
View unified diff | Download patch
OLDNEW
1 <link rel="import" href="chrome://resources/cr_elements/shared_vars_css.html"> 1 <link rel="import" href="chrome://resources/cr_elements/shared_vars_css.html">
2 <link rel="import" href="chrome://resources/polymer/v1_0/paper-styles/color.html "> 2 <link rel="import" href="chrome://resources/polymer/v1_0/paper-styles/color.html ">
3 3
4 <!-- Common css variables for Material Design settings. --> 4 <!-- Common css variables for Material Design settings. -->
5 <style is="custom-style"> 5 <style is="custom-style">
6 /* We keep our vars in sort order, though some vars must be defined prior to 6 /* We keep our vars in sort order, though some vars must be defined prior to
7 * others. The --settings-* vars are defined explicitly prior to the --paper-* 7 * others. The --settings-* vars are defined explicitly prior to the --paper-*
8 * and --iron-* vars. 8 * and --iron-* vars.
9 */ 9 */
10 :root { 10 :root {
11 /* Some colors use non-MD colors. These custom colors are specified by 11 /* Some colors use non-MD colors. These custom colors are specified by
12 * UX design (bettes@). */ 12 * UX design (bettes@). */
13 13
14 --settings-actionable: var(--cr-actionable); 14 --settings-actionable: var(--cr-actionable);
15 15
16 --settings-background-color: rgb(241, 241, 241); 16 --settings-background-color: rgb(241, 241, 241);
17 --settings-box-row-padding: 20px; 17 --settings-box-row-padding: 20px;
18 --settings-indent-width: 36px; 18 --settings-indent-width: 36px;
19 --settings-card-max-width: 640px; 19 --settings-card-max-width: 640px;
20 --settings-disabled-opacity: .65; 20 --settings-disabled-opacity: .65;
21 --settings-error-color: var(--paper-red-700); 21 --settings-error-color: var(--paper-red-700);
22 22
23 /* The inner icon is 20px in size. paper-icon-button has 8px padding. */
24 --settings-icon-ripple-size: 36px;
25 --settings-icon-size: 20px;
26
27 --settings-list-frame-padding: { 23 --settings-list-frame-padding: {
28 -webkit-padding-end: var(--settings-box-row-padding); 24 -webkit-padding-end: var(--settings-box-row-padding);
29 -webkit-padding-start: calc( 25 -webkit-padding-start: calc(
30 var(--settings-box-row-padding) + var(--settings-indent-width)); 26 var(--settings-box-row-padding) + var(--settings-indent-width));
31 padding-bottom: 0; 27 padding-bottom: 0;
32 padding-top: 0; 28 padding-top: 0;
33 } 29 }
34 30
35 --settings-nav-grey: rgb(90, 90, 90); 31 --settings-nav-grey: rgb(90, 90, 90);
36 32
(...skipping 29 matching lines...) Expand all
66 height: 16px; 62 height: 16px;
67 top: -2px; 63 top: -2px;
68 width: 16px; 64 width: 16px;
69 }; 65 };
70 --settings-toggle-color: var(--google-blue-500); 66 --settings-toggle-color: var(--google-blue-500);
71 67
72 --checkbox-margin-start: 2px; 68 --checkbox-margin-start: 2px;
73 --checkbox-size: 16px; 69 --checkbox-size: 16px;
74 --checkbox-spacing: 18px; 70 --checkbox-spacing: 18px;
75 --iron-icon-fill-color: var(--paper-grey-600); 71 --iron-icon-fill-color: var(--paper-grey-600);
76 --iron-icon-height: var(--settings-icon-size); 72 --iron-icon-height: var(--cr-icon-size);
77 --iron-icon-width: var(--settings-icon-size); 73 --iron-icon-width: var(--cr-icon-size);
78 --paper-checkbox-label-color: inherit; 74 --paper-checkbox-label-color: inherit;
79 --paper-dialog-color: inherit; 75 --paper-dialog-color: inherit;
80 --paper-icon-button: { 76 --paper-icon-button: {
81 height: var(--settings-icon-ripple-size); 77 height: var(--cr-icon-ripple-size);
82 width: var(--settings-icon-ripple-size); 78 width: var(--cr-icon-ripple-size);
83 }; 79 };
84 --paper-input-container-focus-color: var(--google-blue-500); 80 --paper-input-container-focus-color: var(--google-blue-500);
85 --paper-input-container-input: { 81 --paper-input-container-input: {
86 color: inherit; 82 color: inherit;
87 font-size: inherit; 83 font-size: inherit;
88 font-weight: inherit; 84 font-weight: inherit;
89 vertical-align: baseline; 85 vertical-align: baseline;
90 }; 86 };
91 --paper-input-max-width: 264px; 87 --paper-input-max-width: 264px;
92 --paper-item: { 88 --paper-item: {
93 font-size: inherit; 89 font-size: inherit;
94 }; 90 };
95 --paper-radio-button-ink-size: 40px; 91 --paper-radio-button-ink-size: 40px;
96 --paper-radio-button-label-color: inherit; 92 --paper-radio-button-label-color: inherit;
97 --paper-radio-button-size: 16px; 93 --paper-radio-button-size: 16px;
98 --paper-radio-group-item-padding: 0; 94 --paper-radio-group-item-padding: 0;
99 95
100 --paper-toggle-button-checked-bar: var(--settings-toggle-bar-size); 96 --paper-toggle-button-checked-bar: var(--settings-toggle-bar-size);
101 --paper-toggle-button-checked-bar-color: var(--settings-toggle-color); 97 --paper-toggle-button-checked-bar-color: var(--settings-toggle-color);
102 --paper-toggle-button-checked-button: { 98 --paper-toggle-button-checked-button: {
103 @apply(--settings-toggle-button-size); 99 @apply(--settings-toggle-button-size);
104 transform: translate(14px, 0); 100 transform: translate(14px, 0);
105 }; 101 };
106 --paper-toggle-button-checked-button-color: var(--settings-toggle-color); 102 --paper-toggle-button-checked-button-color: var(--settings-toggle-color);
107 --paper-toggle-button-label-spacing: 0; 103 --paper-toggle-button-label-spacing: 0;
108 --paper-toggle-button-unchecked-bar: var(--settings-toggle-bar-size); 104 --paper-toggle-button-unchecked-bar: var(--settings-toggle-bar-size);
109 --paper-toggle-button-unchecked-button: var(--settings-toggle-button-size); 105 --paper-toggle-button-unchecked-button: var(--settings-toggle-button-size);
110 } 106 }
111 </style> 107 </style>
OLDNEW

Powered by Google App Engine
This is Rietveld 408576698