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

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

Issue 2715863002: MD Settings: make input label and error font size relative. (Closed)
Patch Set: overflowing error message so large fonts dont ellipsis Created 3 years, 10 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 {
(...skipping 85 matching lines...) Expand 10 before | Expand all | Expand 10 after
96 * 40px"), since paper-icon-button>iron-icon width and height are 96 * 40px"), since paper-icon-button>iron-icon width and height are
97 * hardcoded to 100%. 97 * hardcoded to 100%.
98 */ 98 */
99 padding: 10px; 99 padding: 10px;
100 }; 100 };
101 --paper-input-container-focus-color: var(--google-blue-500); 101 --paper-input-container-focus-color: var(--google-blue-500);
102 --paper-input-container-input: { 102 --paper-input-container-input: {
103 color: inherit; 103 color: inherit;
104 font-size: inherit; 104 font-size: inherit;
105 font-weight: inherit; 105 font-weight: inherit;
106 line-height: inherit;
106 vertical-align: baseline; 107 vertical-align: baseline;
107 }; 108 };
109 --paper-input-container-label: {
110 font-size: inherit;
111 line-height: inherit;
112 }
113 --paper-input-error: {
114 font-size: 92.31%; /* Should be 12px when 100% is 13px. */
115 line-height: inherit;
116 overflow: visible; /* Half-visible error message is not useful at all. */
117 }
108 --paper-input-max-width: 264px; 118 --paper-input-max-width: 264px;
109 --paper-radio-button-ink-size: 40px; 119 --paper-radio-button-ink-size: 40px;
110 --paper-radio-button-label-color: inherit; 120 --paper-radio-button-label-color: inherit;
111 --paper-radio-button-size: 16px; 121 --paper-radio-button-size: 16px;
112 --paper-radio-group-item-padding: 0; 122 --paper-radio-group-item-padding: 0;
113 123
114 --paper-toggle-button-checked-bar: var(--settings-toggle-bar-size); 124 --paper-toggle-button-checked-bar: var(--settings-toggle-bar-size);
115 --paper-toggle-button-checked-bar-color: var(--settings-toggle-color); 125 --paper-toggle-button-checked-bar-color: var(--settings-toggle-color);
116 --paper-toggle-button-checked-button: { 126 --paper-toggle-button-checked-button: {
117 @apply(--settings-toggle-button-size); 127 @apply(--settings-toggle-button-size);
118 transform: translate(18px, 0); 128 transform: translate(18px, 0);
119 }; 129 };
120 --paper-toggle-button-checked-button-color: var(--settings-toggle-color); 130 --paper-toggle-button-checked-button-color: var(--settings-toggle-color);
121 --paper-toggle-button-label-spacing: 0; 131 --paper-toggle-button-label-spacing: 0;
122 --paper-toggle-button-unchecked-bar: var(--settings-toggle-bar-size); 132 --paper-toggle-button-unchecked-bar: var(--settings-toggle-bar-size);
123 --paper-toggle-button-unchecked-button: var(--settings-toggle-button-size); 133 --paper-toggle-button-unchecked-button: var(--settings-toggle-button-size);
124 --paper-toggle-button-unchecked-ink: var(--settings-toggle-ink-size); 134 --paper-toggle-button-unchecked-ink: var(--settings-toggle-ink-size);
125 135
126 --settings-input-underline: { 136 --settings-input-underline: {
127 border-color: var(--paper-grey-300); 137 border-color: var(--paper-grey-300);
128 } 138 }
129 139
130 --paper-input-container-underline: var(--settings-input-underline); 140 --paper-input-container-underline: var(--settings-input-underline);
131 } 141 }
132 </style> 142 </style>
OLDNEW

Powered by Google App Engine
This is Rietveld 408576698