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

Issues Search
    My Issues | Starred     Open | Closed | All

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

Issue 2583353003: MD History: Replace last usage of cr-shared-menu with cr-action-menu. (Closed)
Patch Set: Fix more 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.crisper.js ('k') | chrome/browser/resources/md_history/compiled_resources2.gyp » ('j') | chrome/browser/resources/md_history/list_container.html » ('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 08b740a70fde3f45690f0769598d84b35c543208..9fda2fbd1ade14ae57546373dac02552b1b7caa9 100644
--- a/chrome/browser/resources/md_history/app.vulcanized.html
+++ b/chrome/browser/resources/md_history/app.vulcanized.html
@@ -22,27 +22,9 @@ The complete set of authors may be found at http://polymer.github.io/AUTHORS.txt
The complete set of contributors may be found at http://polymer.github.io/CONTRIBUTORS.txt
Code distributed by Google as part of the polymer project is also
subject to an additional IP rights grant found at http://polymer.github.io/PATENTS.txt
---><meta charset="UTF-8"><link rel="import" href="chrome://resources/html/polymer.html">
-<style>
-/* Copyright 2016 The Chromium Authors. All rights reserved.
- * Use of this source code is governed by a BSD-style license that can be
- * found in the LICENSE file. */
+--><meta charset="UTF-8">
-:root {
- /* This is a custom, Chrome-specific color that does not have a --paper or
- * --google equivalent. */
- --md-background-color: #f1f1f1;
- --md-loading-message-color: #6e6e6e;
- /* This is --google-blue-700, rewritten as a native custom property for speed.
- */
- --md-toolbar-color: rgb(51, 103, 214);
-}
-
-</style>
-
-
-
-</head><body><div hidden="" by-vulcanize=""><dom-module id="iron-pages" assetpath="chrome://resources/polymer/v1_0/iron-pages/" css-build="shadow">
+</head><body><div hidden="" by-vulcanize=""><link rel="import" href="chrome://resources/html/polymer.html"><dom-module id="iron-pages" assetpath="chrome://resources/polymer/v1_0/iron-pages/" css-build="shadow">
<template>
<style scope="iron-pages">:host {
@@ -185,8 +167,6 @@ subject to an additional IP rights grant found at http://polymer.github.io/PATEN
}
</style>
-
-
<dom-module id="iron-icon" assetpath="chrome://resources/polymer/v1_0/iron-icon/" css-build="shadow">
<template>
<style scope="iron-icon">:host {
@@ -299,6 +279,46 @@ subject to an additional IP rights grant found at http://polymer.github.io/PATEN
</template>
</dom-module>
<style is="custom-style" css-build="shadow">html {
+ --primary-text-color: var(--light-theme-text-color);
+ --primary-background-color: var(--light-theme-background-color);
+ --secondary-text-color: var(--light-theme-secondary-color);
+ --disabled-text-color: var(--light-theme-disabled-color);
+ --divider-color: var(--light-theme-divider-color);
+ --error-color: var(--paper-deep-orange-a700);
+
+
+ --primary-color: var(--paper-indigo-500);
+ --light-primary-color: var(--paper-indigo-100);
+ --dark-primary-color: var(--paper-indigo-700);
+
+ --accent-color: var(--paper-pink-a200);
+ --light-accent-color: var(--paper-pink-a100);
+ --dark-accent-color: var(--paper-pink-a400);
+
+
+
+ --light-theme-background-color: #ffffff;
+ --light-theme-base-color: #000000;
+ --light-theme-text-color: var(--paper-grey-900);
+ --light-theme-secondary-color: #737373;
+ --light-theme-disabled-color: #9b9b9b;
+ --light-theme-divider-color: #dbdbdb;
+
+
+ --dark-theme-background-color: var(--paper-grey-900);
+ --dark-theme-base-color: #ffffff;
+ --dark-theme-text-color: #ffffff;
+ --dark-theme-secondary-color: #bcbcbc;
+ --dark-theme-disabled-color: #646464;
+ --dark-theme-divider-color: #3c3c3c;
+
+
+ --text-primary-color: var(--dark-theme-text-color);
+ --default-primary-color: var(--primary-color);
+}
+
+</style>
+<style is="custom-style" css-build="shadow">html {
--google-red-100: #f4c7c3;
--google-red-300: #e67c73;
--google-red-500: #db4437;
@@ -613,50 +633,6 @@ subject to an additional IP rights grant found at http://polymer.github.io/PATEN
}
</style>
-
-
-<style is="custom-style" css-build="shadow">html {
- --primary-text-color: var(--light-theme-text-color);
- --primary-background-color: var(--light-theme-background-color);
- --secondary-text-color: var(--light-theme-secondary-color);
- --disabled-text-color: var(--light-theme-disabled-color);
- --divider-color: var(--light-theme-divider-color);
- --error-color: var(--paper-deep-orange-a700);
-
-
- --primary-color: var(--paper-indigo-500);
- --light-primary-color: var(--paper-indigo-100);
- --dark-primary-color: var(--paper-indigo-700);
-
- --accent-color: var(--paper-pink-a200);
- --light-accent-color: var(--paper-pink-a100);
- --dark-accent-color: var(--paper-pink-a400);
-
-
-
- --light-theme-background-color: #ffffff;
- --light-theme-base-color: #000000;
- --light-theme-text-color: var(--paper-grey-900);
- --light-theme-secondary-color: #737373;
- --light-theme-disabled-color: #9b9b9b;
- --light-theme-divider-color: #dbdbdb;
-
-
- --dark-theme-background-color: var(--paper-grey-900);
- --dark-theme-base-color: #ffffff;
- --dark-theme-text-color: #ffffff;
- --dark-theme-secondary-color: #bcbcbc;
- --dark-theme-disabled-color: #646464;
- --dark-theme-divider-color: #3c3c3c;
-
-
- --text-primary-color: var(--dark-theme-text-color);
- --default-primary-color: var(--primary-color);
-}
-
-</style>
-
-
<dom-module id="paper-icon-button" assetpath="chrome://resources/polymer/v1_0/paper-icon-button/" css-build="shadow">
<template strip-whitespace="">
<style scope="paper-icon-button">:host {
@@ -686,12 +662,12 @@ subject to an additional IP rights grant found at http://polymer.github.io/PATEN
}
:host #ink {
- color: var(--paper-icon-button-ink-color,var(--primary-text-color));;
+ color: var(--paper-icon-button-ink-color,var(--primary-text-color));
opacity: 0.6;
}
:host([disabled]) {
- color: var(--paper-icon-button-disabled-text,var(--disabled-text-color));;
+ color: var(--paper-icon-button-disabled-text,var(--disabled-text-color));
pointer-events: none;
cursor: auto;
@@ -767,23 +743,23 @@ to {
height: 100%;
opacity: 0;
white-space: nowrap;
- border-color: var(--paper-spinner-color,var(--google-blue-500));;
+ border-color: var(--paper-spinner-color,var(--google-blue-500));
}
.layer-1 {
- border-color: var(--paper-spinner-layer-1-color,var(--google-blue-500));;
+ border-color: var(--paper-spinner-layer-1-color,var(--google-blue-500));
}
.layer-2 {
- border-color: var(--paper-spinner-layer-2-color,var(--google-red-500));;
+ border-color: var(--paper-spinner-layer-2-color,var(--google-red-500));
}
.layer-3 {
- border-color: var(--paper-spinner-layer-3-color,var(--google-yellow-500));;
+ border-color: var(--paper-spinner-layer-3-color,var(--google-yellow-500));
}
.layer-4 {
- border-color: var(--paper-spinner-layer-4-color,var(--google-green-500));;
+ border-color: var(--paper-spinner-layer-4-color,var(--google-green-500));
}
.active .spinner-layer {
@@ -1251,8 +1227,6 @@ to {
</style>
</template>
</dom-module>
-
-
<dom-module id="paper-spinner-lite" assetpath="chrome://resources/polymer/v1_0/paper-spinner/" css-build="shadow">
<template strip-whitespace="">
<style scope="paper-spinner-lite">:host {
@@ -1307,23 +1281,23 @@ to {
height: 100%;
opacity: 0;
white-space: nowrap;
- border-color: var(--paper-spinner-color,var(--google-blue-500));;
+ border-color: var(--paper-spinner-color,var(--google-blue-500));
}
.layer-1 {
- border-color: var(--paper-spinner-layer-1-color,var(--google-blue-500));;
+ border-color: var(--paper-spinner-layer-1-color,var(--google-blue-500));
}
.layer-2 {
- border-color: var(--paper-spinner-layer-2-color,var(--google-red-500));;
+ border-color: var(--paper-spinner-layer-2-color,var(--google-red-500));
}
.layer-3 {
- border-color: var(--paper-spinner-layer-3-color,var(--google-yellow-500));;
+ border-color: var(--paper-spinner-layer-3-color,var(--google-yellow-500));
}
.layer-4 {
- border-color: var(--paper-spinner-layer-4-color,var(--google-green-500));;
+ border-color: var(--paper-spinner-layer-4-color,var(--google-green-500));
}
.active .spinner-layer {
@@ -1832,13 +1806,12 @@ paper-icon-button {
}
paper-spinner-lite {
- --paper-spinner-color: white;
- height: 20px;
+ height: var(--cr-icon-size_-_height); width: var(--cr-icon-size_-_width);
+ --paper-spinner-color: white;
margin: 0 6px;
opacity: 0;
padding: 6px;
position: absolute;
- width: 20px;
}
paper-spinner-lite[active] {
@@ -2086,8 +2059,7 @@ h1 {
</div>
</template>
</dom-module>
-<link rel="import" href="chrome://history/constants.html">
-<iron-iconset-svg size="24" name="history">
+<link rel="import" href="chrome://history/constants.html"><iron-iconset-svg size="24" name="history">
<svg>
<defs>
@@ -2157,11 +2129,19 @@ a {
justify-content: center;
}
-.menu-item {
- -webkit-user-select: none;
+.dropdown-item {
+ align-items: center;
+ background: none;
+ border: none;
+ box-sizing: border-box;
+ color: var(--paper-grey-800);
cursor: pointer;
+ display: flex;
font: inherit;
- white-space: nowrap;
+ min-height: 32px;
+ padding: 0 24px;
+ text-align: start;
+ width: 100%;
}
.website-icon {
@@ -2210,8 +2190,6 @@ button.more-vert-button div {
</style>
</template>
</dom-module>
-
-
<dom-module id="history-toolbar" assetpath="chrome://history/" css-build="shadow">
<template>
<style scope="history-toolbar">[hidden] {
@@ -2248,11 +2226,19 @@ a {
justify-content: center;
}
-.menu-item {
- -webkit-user-select: none;
+.dropdown-item {
+ align-items: center;
+ background: none;
+ border: none;
+ box-sizing: border-box;
+ color: var(--paper-grey-800);
cursor: pointer;
+ display: flex;
font: inherit;
- white-space: nowrap;
+ min-height: 32px;
+ padding: 0 24px;
+ text-align: start;
+ width: 100%;
}
.website-icon {
@@ -2507,18 +2493,21 @@ paper-tab {
</template>
</dom-module>
+
+
+
<style is="custom-style" css-build="shadow">html {
--cr-actionable_-_cursor: pointer;;
--cr-focused-item-color: var(--google-grey-300);
--cr-icon-padding: 8px;
+ --cr-icon-size_-_height: 20px; --cr-icon-size_-_width: 20px;
--cr-selectable-focus_-_background-color: var(--cr-focused-item-color); --cr-selectable-focus_-_outline: none;
--cr-separator-line: 1px solid rgba(0, 0, 0, 0.06);
--paper-checkbox-ink-size: 40px;
}
</style>
-
<dom-module id="cr-shared-style" assetpath="chrome://resources/cr_elements/" css-build="shadow">
<template>
<style scope="cr-shared-style">paper-spinner {
@@ -2550,6 +2539,22 @@ paper-tab {
cursor: var(--cr-actionable_-_cursor);
}
+button[is='paper-icon-button-light'].subpage-arrow {
+ background-image: url("chrome://resources/images/arrow_right.svg");
+}
+
+button[is='paper-icon-button-light'].icon-external {
+ background-image: url("chrome://resources/images/open_in_new.svg");
+}
+
+.subpage-arrow, .icon-external {
+ display: none;
+}
+
+[actionable] :-webkit-any(.subpage-arrow, .icon-external), [actionable]:-webkit-any(.subpage-arrow, .icon-external) {
+ display: block;
+}
+
[scrollable] {
border-color: transparent;
border-style: solid;
@@ -2591,6 +2596,30 @@ paper-tab {
</style>
</template>
</dom-module>
+<dom-module id="cr-action-menu" assetpath="chrome://resources/cr_elements/cr_action_menu/" css-build="shadow">
+ <template>
+ <style scope="cr-action-menu">:host {
+ background-color: white;
+ border: none;
+ box-shadow: 0 2px 6px var(--paper-grey-500);
+ margin: 0;
+ outline: none;
+ padding: 8px 0;
+}
+
+:host::backdrop {
+ background-color: transparent;
+}
+
+:host ::content .dropdown-item:focus {
+ background-color: var(--paper-grey-300);
+ outline: none;
+}
+
+</style>
+ <content select=".dropdown-item,hr"></content>
+ </template>
+ </dom-module>
<dom-module id="iron-a11y-announcer" assetpath="chrome://resources/polymer/v1_0/iron-a11y-announcer/" css-build="shadow">
@@ -2699,12 +2728,9 @@ paper-tab {
}
</style>
-<link rel="import" href="chrome://resources/html/util.html">
-<dom-module id="history-searched-label" assetpath="chrome://history/" css-build="shadow">
+<link rel="import" href="chrome://resources/html/util.html"><dom-module id="history-searched-label" assetpath="/" css-build="shadow">
</dom-module>
-
-
-<dom-module id="history-item" assetpath="chrome://history/" css-build="shadow">
+<dom-module id="history-item" assetpath="/" css-build="shadow">
<template>
<style scope="history-item">[hidden] {
display: none !important;
@@ -2740,11 +2766,19 @@ a {
justify-content: center;
}
-.menu-item {
- -webkit-user-select: none;
+.dropdown-item {
+ align-items: center;
+ background: none;
+ border: none;
+ box-sizing: border-box;
+ color: var(--paper-grey-800);
cursor: pointer;
+ display: flex;
font: inherit;
- white-space: nowrap;
+ min-height: 32px;
+ padding: 0 24px;
+ text-align: start;
+ width: 100%;
}
.website-icon {
@@ -3052,11 +3086,19 @@ a {
justify-content: center;
}
-.menu-item {
- -webkit-user-select: none;
+.dropdown-item {
+ align-items: center;
+ background: none;
+ border: none;
+ box-sizing: border-box;
+ color: var(--paper-grey-800);
cursor: pointer;
+ display: flex;
font: inherit;
- white-space: nowrap;
+ min-height: 32px;
+ padding: 0 24px;
+ text-align: start;
+ width: 100%;
}
.website-icon {
@@ -3127,8 +3169,6 @@ iron-list {
</iron-scroll-threshold>
</template>
</dom-module>
-
-
<dom-module id="history-list-container" assetpath="chrome://history/" css-build="shadow">
<template>
<style scope="history-list-container">[hidden] {
@@ -3165,11 +3205,19 @@ a {
justify-content: center;
}
-.menu-item {
- -webkit-user-select: none;
+.dropdown-item {
+ align-items: center;
+ background: none;
+ border: none;
+ box-sizing: border-box;
+ color: var(--paper-grey-800);
cursor: pointer;
+ display: flex;
font: inherit;
- white-space: nowrap;
+ min-height: 32px;
+ padding: 0 24px;
+ text-align: start;
+ width: 100%;
}
.website-icon {
@@ -3244,6 +3292,22 @@ paper-spinner {
cursor: var(--cr-actionable_-_cursor);
}
+button[is='paper-icon-button-light'].subpage-arrow {
+ background-image: url("chrome://resources/images/arrow_right.svg");
+}
+
+button[is='paper-icon-button-light'].icon-external {
+ background-image: url("chrome://resources/images/open_in_new.svg");
+}
+
+.subpage-arrow, .icon-external {
+ display: none;
+}
+
+[actionable] :-webkit-any(.subpage-arrow, .icon-external), [actionable]:-webkit-any(.subpage-arrow, .icon-external) {
+ display: block;
+}
+
[scrollable] {
border-color: transparent;
border-style: solid;
@@ -3322,14 +3386,14 @@ dialog .body {
</template>
<template is="cr-lazy-render" id="sharedMenu">
- <cr-shared-menu>
- <paper-item id="menuMoreButton" class="menu-item" on-tap="onMoreFromSiteTap_">
+ <dialog is="cr-action-menu">
+ <button id="menuMoreButton" class="dropdown-item" on-tap="onMoreFromSiteTap_">
$i18n{moreFromSite}
- </paper-item>
- <paper-item id="menuRemoveButton" class="menu-item" disabled="[[!canDeleteHistory_()]]" on-tap="onRemoveFromHistoryTap_">
+ </button>
+ <button id="menuRemoveButton" class="dropdown-item" disabled="[[!canDeleteHistory_()]]" on-tap="onRemoveFromHistoryTap_">
$i18n{removeFromHistory}
- </paper-item>
- </cr-shared-menu>
+ </button>
+ </dialog>
</template>
</template>
</dom-module>
@@ -3341,38 +3405,6 @@ dialog .body {
</iron-query-params>
</template>
</dom-module>
-<style>
-/* Copyright 2015 The Chromium Authors. All rights reserved.
- * Use of this source code is governed by a BSD-style license that can be
- * found in the LICENSE file. */
-
-<if expr="not chromeos and not is_android">
-@font-face {
- font-family: 'Roboto';
- font-style: normal;
- font-weight: 400;
- src: local('Roboto'), local('Roboto-Regular'),
- url("chrome://resources/roboto/roboto-regular.woff2") format('woff2');
-}
-
-@font-face {
- font-family: 'Roboto';
- font-style: normal;
- font-weight: 500;
- src: local('Roboto Medium'), local('Roboto-Medium'),
- url("chrome://resources/roboto/roboto-medium.woff2") format('woff2');
-}
-
-@font-face {
- font-family: 'Roboto';
- font-style: normal;
- font-weight: 700;
- src: local('Roboto Bold'), local('Roboto-Bold'),
- url("chrome://resources/roboto/roboto-bold.woff2") format('woff2');
-}
-</if>
-
-</style>
<style is="custom-style" css-build="shadow">html {
--paper-font-common-base_-_font-family: 'Roboto', 'Noto', sans-serif; --paper-font-common-base_-_-webkit-font-smoothing: antialiased;;
@@ -3414,7 +3446,38 @@ dialog .body {
}
</style>
-<dom-module id="history-side-bar" assetpath="chrome://history/" css-build="shadow">
+<style>
+/* Copyright 2015 The Chromium Authors. All rights reserved.
+ * Use of this source code is governed by a BSD-style license that can be
+ * found in the LICENSE file. */
+
+<if expr="not chromeos and not is_android">
+@font-face {
+ font-family: 'Roboto';
+ font-style: normal;
+ font-weight: 400;
+ src: local('Roboto'), local('Roboto-Regular'),
+ url("chrome://resources/roboto/roboto-regular.woff2") format('woff2');
+}
+
+@font-face {
+ font-family: 'Roboto';
+ font-style: normal;
+ font-weight: 500;
+ src: local('Roboto Medium'), local('Roboto-Medium'),
+ url("chrome://resources/roboto/roboto-medium.woff2") format('woff2');
+}
+
+@font-face {
+ font-family: 'Roboto';
+ font-style: normal;
+ font-weight: 700;
+ src: local('Roboto Bold'), local('Roboto-Bold'),
+ url("chrome://resources/roboto/roboto-bold.woff2") format('woff2');
+}
+</if>
+
+</style><dom-module id="history-side-bar" assetpath="chrome://history/" css-build="shadow">
<template>
<style scope="history-side-bar">[hidden] {
display: none !important;
@@ -3450,11 +3513,19 @@ a {
justify-content: center;
}
-.menu-item {
- -webkit-user-select: none;
+.dropdown-item {
+ align-items: center;
+ background: none;
+ border: none;
+ box-sizing: border-box;
+ color: var(--paper-grey-800);
cursor: pointer;
+ display: flex;
font: inherit;
- white-space: nowrap;
+ min-height: 32px;
+ padding: 0 24px;
+ text-align: start;
+ width: 100%;
}
.website-icon {
@@ -3608,7 +3679,22 @@ iron-selector > a.iron-selected {
</iron-selector>
</template>
</dom-module>
-</div><dom-module id="history-app" css-build="shadow">
+<style>
+/* Copyright 2016 The Chromium Authors. All rights reserved.
+ * Use of this source code is governed by a BSD-style license that can be
+ * found in the LICENSE file. */
+
+:root {
+ /* This is a custom, Chrome-specific color that does not have a --paper or
+ * --google equivalent. */
+ --md-background-color: #f1f1f1;
+ --md-loading-message-color: #6e6e6e;
+ /* This is --google-blue-700, rewritten as a native custom property for speed.
+ */
+ --md-toolbar-color: rgb(51, 103, 214);
+}
+
+</style></div><dom-module id="history-app" css-build="shadow">
<template>
<style scope="history-app">[hidden] {
display: none !important;
@@ -3644,11 +3730,19 @@ a {
justify-content: center;
}
-.menu-item {
- -webkit-user-select: none;
+.dropdown-item {
+ align-items: center;
+ background: none;
+ border: none;
+ box-sizing: border-box;
+ color: var(--paper-grey-800);
cursor: pointer;
+ display: flex;
font: inherit;
- white-space: nowrap;
+ min-height: 32px;
+ padding: 0 24px;
+ text-align: start;
+ width: 100%;
}
.website-icon {
« no previous file with comments | « chrome/browser/resources/md_history/app.crisper.js ('k') | chrome/browser/resources/md_history/compiled_resources2.gyp » ('j') | chrome/browser/resources/md_history/list_container.html » ('J')

Powered by Google App Engine
This is Rietveld 408576698