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

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

Issue 2390053002: [MD settings] use arrow-forward to switch direction in rtl (Closed)
Patch Set: in person changes Created 4 years, 2 months 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-card-max-width: 640px; 18 --settings-card-max-width: 640px;
19 --settings-disabled-opacity: .65; 19 --settings-disabled-opacity: .65;
20 --settings-error-color: var(--paper-red-700); 20 --settings-error-color: var(--paper-red-700);
21 21
22 --settings-icon-ripple-size: 36px;
23 --settings-icon-size: 20px;
24
22 --settings-list-frame-padding: { 25 --settings-list-frame-padding: {
23 -webkit-padding-end: var(--settings-box-row-padding); 26 -webkit-padding-end: var(--settings-box-row-padding);
24 -webkit-padding-start: 56px; 27 -webkit-padding-start: 56px;
25 padding-bottom: 0; 28 padding-bottom: 0;
26 padding-top: 0; 29 padding-top: 0;
27 } 30 }
28 31
29 --settings-nav-grey: rgb(90, 90, 90); 32 --settings-nav-grey: rgb(90, 90, 90);
30 33
31 --settings-page-vertical-margin: 21px; 34 --settings-page-vertical-margin: 21px;
32 35
36
Dan Beam 2016/10/04 01:01:00 nit: revert \n\n
dschuyler 2016/10/04 01:13:58 Done.
33 --settings-row-min-height: 44px; 37 --settings-row-min-height: 44px;
34 --settings-row-two-line-min-height: 56px; 38 --settings-row-two-line-min-height: 56px;
35 --settings-secondary: { 39 --settings-secondary: {
36 color: var(--paper-grey-600); 40 color: var(--paper-grey-600);
37 font-weight: 400; 41 font-weight: 400;
38 margin-top: 4px; 42 margin-top: 4px;
39 }; 43 };
40 --settings-separator-line: var(--cr-separator-line); 44 --settings-separator-line: var(--cr-separator-line);
41 45
42 --settings-title-bar-background-color: var(--google-blue-700); 46 --settings-title-bar-background-color: var(--google-blue-700);
(...skipping 11 matching lines...) Expand all
54 width: 16px; 58 width: 16px;
55 }; 59 };
56 --settings-toggle-color: var(--google-blue-500); 60 --settings-toggle-color: var(--google-blue-500);
57 } 61 }
58 62
59 :root { 63 :root {
60 --checkbox-margin-start: 2px; 64 --checkbox-margin-start: 2px;
61 --checkbox-size: 16px; 65 --checkbox-size: 16px;
62 --checkbox-spacing: 18px; 66 --checkbox-spacing: 18px;
63 --iron-icon-fill-color: var(--paper-grey-600); 67 --iron-icon-fill-color: var(--paper-grey-600);
64 --iron-icon-height: 20px; 68 --iron-icon-height: var(--settings-icon-size);
65 --iron-icon-width: 20px; 69 --iron-icon-width: var(--settings-icon-size);
66 --paper-checkbox-label-color: inherit; 70 --paper-checkbox-label-color: inherit;
67 --paper-dialog-color: inherit; 71 --paper-dialog-color: inherit;
68 --paper-icon-button: { 72 --paper-icon-button: {
69 height: 36px; 73 height: var(--settings-icon-ripple-size);
70 width: 36px; 74 width: var(--settings-icon-ripple-size);
71 }; 75 };
72 --paper-input-max-width: 264px; 76 --paper-input-max-width: 264px;
73 --paper-item: { 77 --paper-item: {
74 font-size: inherit; 78 font-size: inherit;
75 }; 79 };
76 --paper-radio-button-label-color: inherit; 80 --paper-radio-button-label-color: inherit;
77 --paper-radio-group-item-padding: 0; 81 --paper-radio-group-item-padding: 0;
78 82
79 --paper-toggle-button-checked-bar: var(--settings-toggle-bar-size); 83 --paper-toggle-button-checked-bar: var(--settings-toggle-bar-size);
80 --paper-toggle-button-checked-bar-color: var(--settings-toggle-color); 84 --paper-toggle-button-checked-bar-color: var(--settings-toggle-color);
81 --paper-toggle-button-checked-button: { 85 --paper-toggle-button-checked-button: {
82 @apply(--settings-toggle-button-size); 86 @apply(--settings-toggle-button-size);
83 transform: translate(14px, 0); 87 transform: translate(14px, 0);
84 }; 88 };
85 --paper-toggle-button-checked-button-color: var(--settings-toggle-color); 89 --paper-toggle-button-checked-button-color: var(--settings-toggle-color);
86 --paper-toggle-button-label-spacing: 0; 90 --paper-toggle-button-label-spacing: 0;
87 --paper-toggle-button-unchecked-bar: var(--settings-toggle-bar-size); 91 --paper-toggle-button-unchecked-bar: var(--settings-toggle-bar-size);
88 --paper-toggle-button-unchecked-button: var(--settings-toggle-button-size); 92 --paper-toggle-button-unchecked-button: var(--settings-toggle-button-size);
89 } 93 }
90 </style> 94 </style>
OLDNEW

Powered by Google App Engine
This is Rietveld 408576698