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

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

Issue 2004663002: [MD settings] change line heights and section widths (Closed) Base URL: https://chromium.googlesource.com/chromium/src.git@master
Patch Set: comments Created 4 years, 7 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
« no previous file with comments | « chrome/browser/resources/settings/settings_page.css ('k') | no next file » | no next file with comments »
Toggle Intra-line Diffs ('i') | Expand Comments ('e') | Collapse Comments ('c') | Show Comments Hide Comments ('s')
OLDNEW
1 <!-- Common styles for Material Design settings. --> 1 <!-- Common styles for Material Design settings. -->
2 <dom-module id="settings-shared"> 2 <dom-module id="settings-shared">
3 <template> 3 <template>
4 <style> 4 <style>
5 :root { 5 :root {
6 --checkbox-margin-start: 2px; 6 --checkbox-margin-start: 2px;
7 --checkbox-size: 16px; 7 --checkbox-size: 16px;
8 --checkbox-spacing: 18px; 8 --checkbox-spacing: 18px;
9 --iron-icon-fill-color: var(--paper-grey-600); 9 --iron-icon-fill-color: var(--paper-grey-600);
10 --iron-icon-height: 20px; 10 --iron-icon-height: 20px;
11 --iron-icon-spacing: 16px; 11 --iron-icon-spacing: 16px;
12 --iron-icon-width: 20px; 12 --iron-icon-width: 20px;
13 --paper-checkbox-label-color: inherit; 13 --paper-checkbox-label-color: inherit;
14 --paper-dialog-color: inherit; 14 --paper-dialog-color: inherit;
15 --paper-icon-button: { 15 --paper-icon-button: {
16 width: 36px; 16 width: 36px;
17 height: 36px; 17 height: 36px;
18 }; 18 };
19 --paper-input-max-width: 264px; 19 --paper-input-max-width: 264px;
20 --paper-item: { 20 --paper-item: {
21 font-size: inherit; 21 font-size: inherit;
22 }; 22 };
23 --paper-radio-button-label-color: inherit; 23 --paper-radio-button-label-color: inherit;
24 --paper-radio-group-item-padding: 0; 24 --paper-radio-group-item-padding: 0;
25 25
26 --settings-background-color: var(--paper-blue-grey-50); 26 /* Custom grey for Alan (bettes@). */
27 --settings-background-color: rgb(241, 241, 241);
27 --settings-secondary: { 28 --settings-secondary: {
28 color: var(--paper-grey-600); 29 color: var(--paper-grey-600);
29 font-weight: 400; 30 font-weight: 400;
30 margin-top: 4px; 31 margin-top: 4px;
31 }; 32 };
32 --settings-error-color: var(--paper-red-700); 33 --settings-error-color: var(--paper-red-700);
33 --settings-hover-color: var(--google-grey-300); 34 --settings-hover-color: var(--google-grey-300);
34 35
35 /* Some colors use non-MD colors. These custom colors are specified by 36 /* Some colors use non-MD colors. These custom colors are specified by
36 * UX design (bettes@). */ 37 * UX design (bettes@). */
37 --settings-nav-grey: rgb(90, 90, 90); 38 --settings-nav-grey: rgb(90, 90, 90);
38 39
39 --settings-row-min-height: 40px; 40 --settings-row-min-height: 44px;
40 --settings-separator-line: 1px solid rgba(0, 0, 0, 0.06); 41 --settings-separator-line: 1px solid rgba(0, 0, 0, 0.06);
41 42
42 --settings-title-bar-background-color: rgb(52, 73, 94); 43 --settings-title-bar-background-color: var(--google-blue-700);
43 --settings-title-bar-color: rgb(255, 255, 255); 44 --settings-title-bar-color: rgb(255, 255, 255);
44 --settings-title-search-color: rgb(192, 199, 205); 45 --settings-title-search-color: rgb(192, 199, 205);
45 } 46 }
46 47
47 h2 { 48 h2 {
48 @apply(--layout-center); 49 @apply(--layout-center);
49 display: flex; 50 display: flex;
50 font-size: 100%; 51 font-size: 100%;
51 font-weight: 500; 52 font-weight: 500;
52 margin: 0; 53 margin: 0;
(...skipping 174 matching lines...) Expand 10 before | Expand all | Expand 10 after
227 .settings-box.first, 228 .settings-box.first,
228 .settings-box.continuation { 229 .settings-box.continuation {
229 border-top: none; 230 border-top: none;
230 } 231 }
231 232
232 .settings-box.block { 233 .settings-box.block {
233 display: block; 234 display: block;
234 } 235 }
235 236
236 .settings-box.two-line { 237 .settings-box.two-line {
237 min-height: 52px; 238 min-height: 56px;
238 } 239 }
239 240
240 .settings-box .secondary { 241 .settings-box .secondary {
241 @apply(--settings-secondary); 242 @apply(--settings-secondary);
242 } 243 }
243 244
244 .settings-box .middle { 245 .settings-box .middle {
245 -webkit-margin-start: 16px; 246 -webkit-margin-start: 16px;
246 align-items: center; 247 align-items: center;
247 flex: auto; 248 flex: auto;
(...skipping 44 matching lines...) Expand 10 before | Expand all | Expand 10 after
292 293
293 .favicon-image { 294 .favicon-image {
294 background-repeat: no-repeat; 295 background-repeat: no-repeat;
295 background-size: contain; 296 background-size: contain;
296 height: 16px; 297 height: 16px;
297 width: 16px; 298 width: 16px;
298 } 299 }
299 </style> 300 </style>
300 </template> 301 </template>
301 </dom-module> 302 </dom-module>
OLDNEW
« no previous file with comments | « chrome/browser/resources/settings/settings_page.css ('k') | no next file » | no next file with comments »

Powered by Google App Engine
This is Rietveld 408576698