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

Issues Search
    My Issues | Starred     Open | Closed | All

Unified Diff: chrome/browser/resources/md_history/app.vulcanized.html

Issue 2549133003: [MD History] Color tweaks. (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 side-by-side diff with in-line comments
Download patch
« no previous file with comments | « chrome/browser/resources/md_history/app.html ('k') | chrome/browser/resources/md_history/grouped_list.html » ('j') | ui/webui/resources/css/md_colors.css » ('J')
Expand Comments ('e') | Collapse Comments ('c') | Show Comments Hide Comments ('s')
Index: chrome/browser/resources/md_history/app.vulcanized.html
diff --git a/chrome/browser/resources/md_history/app.vulcanized.html b/chrome/browser/resources/md_history/app.vulcanized.html
index 971bc5f59d49aab99dd9c1c737b37067de742c0f..9f122ab43c828f72a3cc583c79562a64c518e490 100644
--- a/chrome/browser/resources/md_history/app.vulcanized.html
+++ b/chrome/browser/resources/md_history/app.vulcanized.html
@@ -31,10 +31,11 @@ subject to an additional IP rights grant found at http://polymer.github.io/PATEN
:root {
/* This is a custom, Chrome-specific color that does not have a --paper or
* --google equivalent. */
- --md-background-color: rgb(241, 241, 241);
+ --md-background-color: #f1f1f1;
/* This is --google-blue-700, rewritten as a native custom property for speed.
*/
--md-toolbar-color: rgb(51, 103, 214);
+ --md-loading-message-color: #6e6e6e;
}
</style>
@@ -1896,7 +1897,7 @@ input[type='search']::-webkit-search-decoration, input[type='search']::-webkit-s
}
:host(:not([narrow]):not([showing-search])) #icon, :host(:not([narrow])) #prompt {
- opacity: 0.6;
+ opacity: 0.7;
}
:host([narrow]:not([showing-search])) #searchTerm {
@@ -2105,10 +2106,16 @@ h1 {
--card-padding-side: 24px;
--card-sizing_-_margin: 0 auto; --card-sizing_-_max-width: var(--card-max-width); --card-sizing_-_min-width: var(--card-min-width); --card-sizing_-_padding: 0 var(--card-padding-side); --card-sizing_-_width: calc(100% - 2 * var(--card-padding-side));;
--first-card-padding-top: 24px;
+ --history-item-time-color: #646464;
+ --interactive-color: var(--google-blue-500);
--item-height: 44px;
- --primary-text-color: #333;
- --secondary-text-color: #757575;
+ --link-color: var(--google-blue-700);
+ --primary-text-color: var(--paper-grey-800);
+ --secondary-text-color: var(--paper-grey-600);
+ --separator-color: rgba(0, 0, 0, 0.08);
--side-bar-width: 256px;
+ --sidebar-footer-text-color: #6e6e6e;
+ --sidebar-unselected-color: #5a5a5a;
--toolbar-grouped-height: 101px;
--toolbar-height: 56px;
}
@@ -2120,11 +2127,14 @@ h1 {
display: none !important;
}
+a {
+ color: var(--link-color);
+}
+
.card-title {
align-items: center;
border-bottom: 1px solid var(--card-border-color);
border-radius: 2px 2px 0 0;
- color: var(--primary-text-color);
display: flex;
font-size: 14px;
font-weight: 500;
@@ -2138,7 +2148,7 @@ h1 {
.centered-message {
align-items: center;
- color: #b4b4b4;
+ color: var(--md-loading-message-color);
display: flex;
flex: 1;
font-size: 14px;
@@ -2208,11 +2218,14 @@ button.more-vert-button div {
display: none !important;
}
+a {
+ color: var(--link-color);
+}
+
.card-title {
align-items: center;
border-bottom: 1px solid var(--card-border-color);
border-radius: 2px 2px 0 0;
- color: var(--primary-text-color);
display: flex;
font-size: 14px;
font-weight: 500;
@@ -2226,7 +2239,7 @@ button.more-vert-button div {
.centered-message {
align-items: center;
- color: #b4b4b4;
+ color: var(--md-loading-message-color);
display: flex;
flex: 1;
font-size: 14px;
@@ -2299,7 +2312,7 @@ cr-toolbar, #overlay-buttons, #overlay-wrapper, #toolbar-container {
}
:host([items-selected_]) {
- background: rgb(68, 136, 255);
+ background: var(--interactive-color);
}
#toolbar-container {
@@ -2348,7 +2361,7 @@ iron-dropdown {
box-shadow: var(--shadow-elevation-2dp_-_box-shadow);
background-color: white;
border-radius: 2px;
- color: var(--paper-grey-800);
+ color: var(--primary-text-color);
overflow: hidden;
padding: 12px 20px;
}
@@ -2697,11 +2710,14 @@ paper-tab {
display: none !important;
}
+a {
+ color: var(--link-color);
+}
+
.card-title {
align-items: center;
border-bottom: 1px solid var(--card-border-color);
border-radius: 2px 2px 0 0;
- color: var(--primary-text-color);
display: flex;
font-size: 14px;
font-weight: 500;
@@ -2715,7 +2731,7 @@ paper-tab {
.centered-message {
align-items: center;
- color: #b4b4b4;
+ color: var(--md-loading-message-color);
display: flex;
flex: 1;
font-size: 14px;
@@ -2775,8 +2791,7 @@ button.more-vert-button div {
}
:host {
- --checked-color: rgb(68, 136, 255);
- display: block;
+ display: block;
outline: none;
pointer-events: none;
}
@@ -2839,7 +2854,7 @@ button {
}
:host([selected]) #checkbox {
- color: var(--checked-color);
+ color: var(--interactive-color);
}
#checkmark {
@@ -2867,8 +2882,8 @@ button {
}
:host([selected]) #checkmark {
- background: var(--checked-color);
- border-color: var(--checked-color);
+ background: var(--interactive-color);
+ border-color: var(--interactive-color);
}
:host([selected]) #checkmark::after {
@@ -2879,7 +2894,7 @@ button {
}
#time-accessed {
- color: #646464;
+ color: var(--history-item-time-color);
min-width: 96px;
}
@@ -2900,7 +2915,7 @@ button {
}
#bookmark-star {
- color: var(--checked-color);
+ color: var(--interactive-color);
height: 32px;
width: 32px;
}
@@ -3007,11 +3022,14 @@ button {
display: none !important;
}
+a {
+ color: var(--link-color);
+}
+
.card-title {
align-items: center;
border-bottom: 1px solid var(--card-border-color);
border-radius: 2px 2px 0 0;
- color: var(--primary-text-color);
display: flex;
font-size: 14px;
font-weight: 500;
@@ -3025,7 +3043,7 @@ button {
.centered-message {
align-items: center;
- color: #b4b4b4;
+ color: var(--md-loading-message-color);
display: flex;
flex: 1;
font-size: 14px;
@@ -3117,11 +3135,14 @@ iron-list {
display: none !important;
}
+a {
+ color: var(--link-color);
+}
+
.card-title {
align-items: center;
border-bottom: 1px solid var(--card-border-color);
border-radius: 2px 2px 0 0;
- color: var(--primary-text-color);
display: flex;
font-size: 14px;
font-weight: 500;
@@ -3135,7 +3156,7 @@ iron-list {
.centered-message {
align-items: center;
- color: #b4b4b4;
+ color: var(--md-loading-message-color);
display: flex;
flex: 1;
font-size: 14px;
@@ -3399,11 +3420,14 @@ dialog .body {
display: none !important;
}
+a {
+ color: var(--link-color);
+}
+
.card-title {
align-items: center;
border-bottom: 1px solid var(--card-border-color);
border-radius: 2px 2px 0 0;
- color: var(--primary-text-color);
display: flex;
font-size: 14px;
font-weight: 500;
@@ -3417,7 +3441,7 @@ dialog .body {
.centered-message {
align-items: center;
- color: #b4b4b4;
+ color: var(--md-loading-message-color);
display: flex;
flex: 1;
font-size: 14px;
@@ -3489,7 +3513,7 @@ button.more-vert-button div {
}
div.separator {
- background-color: rgba(0, 0, 0, 0.08);
+ background-color: var(--separator-color);
flex-shrink: 0;
height: 1px;
margin: 8px 0;
@@ -3511,7 +3535,7 @@ div.separator {
iron-selector {
-webkit-user-select: none;
background-color: transparent;
- color: #5a5a5a;
+ color: var(--sidebar-unselected-color);
display: flex;
flex: 1;
flex-direction: column;
@@ -3536,7 +3560,7 @@ iron-selector > a {
}
iron-selector > a.iron-selected {
- color: var(--google-blue-500);
+ color: var(--link-color);
}
#spacer {
@@ -3544,7 +3568,7 @@ iron-selector > a.iron-selected {
}
#footer {
- color: var(--paper-grey-600);
+ color: var(--sidebar-footer-text-color);
width: var(--side-bar-width);
}
@@ -3556,8 +3580,7 @@ iron-selector > a.iron-selected {
}
#footer a {
- color: var(--google-blue-700);
- text-decoration: none;
+ text-decoration: none;
}
</style>
@@ -3591,11 +3614,14 @@ iron-selector > a.iron-selected {
display: none !important;
}
+a {
+ color: var(--link-color);
+}
+
.card-title {
align-items: center;
border-bottom: 1px solid var(--card-border-color);
border-radius: 2px 2px 0 0;
- color: var(--primary-text-color);
display: flex;
font-size: 14px;
font-weight: 500;
@@ -3609,7 +3635,7 @@ iron-selector > a.iron-selected {
.centered-message {
align-items: center;
- color: #b4b4b4;
+ color: var(--md-loading-message-color);
display: flex;
flex: 1;
font-size: 14px;
@@ -3669,7 +3695,8 @@ button.more-vert-button div {
}
:host {
- display: block;
+ color: var(--primary-text-color);
+ display: block;
height: 100%;
overflow: hidden;
z-index: 0;
@@ -3712,7 +3739,7 @@ history-toolbar {
#drawer-header {
align-items: center;
- border-bottom: 1px solid rgba(0, 0, 0, 0.08);
+ border-bottom: 1px solid var(--separator-color);
box-sizing: border-box;
display: flex;
height: var(--toolbar-height);
@@ -3720,7 +3747,7 @@ history-toolbar {
h1 {
-webkit-padding-start: 24px;
- color: rgb(66, 66, 66);
+ color: var(--primary-text-color);
font-size: 123%;
font-weight: 400;
}
« no previous file with comments | « chrome/browser/resources/md_history/app.html ('k') | chrome/browser/resources/md_history/grouped_list.html » ('j') | ui/webui/resources/css/md_colors.css » ('J')

Powered by Google App Engine
This is Rietveld 408576698