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

Side by Side Diff: chrome/browser/resources/chromeos/login/oobe_buttons.html

Issue 2756863002: ChromeOS: Powerwash UI update (Closed)
Patch Set: merge Created 3 years, 8 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 <!-- Copyright 2016 The Chromium Authors. All rights reserved. 1 <!-- Copyright 2016 The Chromium Authors. All rights reserved.
2 Use of this source code is governed by a BSD-style license that can be 2 Use of this source code is governed by a BSD-style license that can be
3 found in the LICENSE file. --> 3 found in the LICENSE file. -->
4 4
5 <link rel="import" href="chrome://resources/polymer/v1_0/paper-styles/color.html ">
5 <link rel="import" href="chrome://resources/polymer/v1_0/iron-icon/iron-icon.htm l"> 6 <link rel="import" href="chrome://resources/polymer/v1_0/iron-icon/iron-icon.htm l">
6 <link rel="import" href="chrome://resources/polymer/v1_0/iron-iconset-svg/iron-i conset-svg.html"> 7 <link rel="import" href="chrome://resources/polymer/v1_0/iron-iconset-svg/iron-i conset-svg.html">
7 <link rel="import" href="chrome://resources/polymer/v1_0/paper-button/paper-butt on.html"> 8 <link rel="import" href="chrome://resources/polymer/v1_0/paper-button/paper-butt on.html">
8 <link rel="import" href="chrome://resources/polymer/v1_0/paper-fab/paper-fab.htm l"> 9 <link rel="import" href="chrome://resources/polymer/v1_0/paper-fab/paper-fab.htm l">
9 <link rel="import" href="chrome://resources/polymer/v1_0/paper-styles/color.html ">
10 10
11 <iron-iconset-svg name="oobe-buttons" size="24"> 11 <iron-iconset-svg name="oobe-buttons" size="24">
12 <svg> 12 <svg>
13 <defs> 13 <defs>
14 <g id="arrow-back"> 14 <g id="arrow-back">
15 <path d="M20 11H7.83l5.59-5.59L12 4l-8 8 8 8 1.41-1.41L7.83 13H20v-2z"> 15 <path d="M20 11H7.83l5.59-5.59L12 4l-8 8 8 8 1.41-1.41L7.83 13H20v-2z">
16 </path> 16 </path>
17 </g> 17 </g>
18 <g id="arrow-forward"> 18 <g id="arrow-forward">
19 <path d="M12 4l-1.41 1.41L16.17 11H4v2h12.17l-5.58 5.59L12 20l8-8z"> 19 <path d="M12 4l-1.41 1.41L16.17 11H4v2h12.17l-5.58 5.59L12 20l8-8z">
20 </path> 20 </path>
21 </g> 21 </g>
22 </defs> 22 </defs>
23 </svg> 23 </svg>
24 </iron-iconset-svg> 24 </iron-iconset-svg>
25 25
26 <!-- 26 <!--
27 Material design square button for text-labelled buttons. 27 Material design square button for text-labelled buttons.
28 By default, text is blue, background is white. 28 By default, text is blue, background is white.
29 |inverse| makes text white on a blue background. 29 |inverse| makes text white on a blue background.
30 Note, that content must have separate DOM node (i.e. a separate div). 30 Note, that content must have separate DOM node (i.e. a separate div).
31 31
32 Example: 32 Example:
33 <oobe-icon-button inverse> 33 <oobe-icon-button inverse>
34 <div i18n-content="oobeOKButtonText"></div> 34 <div i18n-content="oobeOKButtonText"></div>
35 </oobe-icon-button> 35 </oobe-icon-button>
36 36
37 Attributes: 37 Attributes:
38 'disabled' - button is disabled when the attribute is set. 38 'disabled' - button is disabled when the attribute is set.
39 'inverse' - makes text white and background blue 39 'inverse' - makes text white and background blue.
40 'label-for-aria' - accessibility label. 40 'label-for-aria' - accessibility label.
41 'border' - adds border to the button.
41 --> 42 -->
42 <dom-module id="oobe-text-button"> 43 <dom-module id="oobe-text-button">
43 <link rel="stylesheet" href="oobe_text_button.css"> 44 <link rel="stylesheet" href="oobe_text_button.css">
44 <template> 45 <template>
45 <style> 46 <style>
46 :root { 47 :root {
47 --paper-button-flat-keyboard-focus: { 48 --paper-button-flat-keyboard-focus: {
48 border-color: var(--oobe-text-button-focused-border-color); 49 border-color: var(--oobe-text-button-focused-border-color);
49 border-radius: 2px; 50 border-radius: 2px;
50 border-style: solid; 51 border-style: solid;
51 border-width: 2px; 52 border-width: 2px;
52 }; 53 };
53 } 54 }
54 </style> 55 </style>
55 <paper-button id="textButton" on-tap="onClick_" disabled="[[disabled]]" 56 <paper-button id="textButton" on-tap="onClick_" disabled="[[disabled]]"
56 inverse$="[[inverse]]" aria-label$="[[labelForAria]]"> 57 inverse$="[[inverse]]" aria-label$="[[labelForAria]]"
58 border$="[[border]]">
57 <div id="container" 59 <div id="container"
58 class="flex layout horizontal center center-justified self-stretch"> 60 class="flex layout horizontal center center-justified self-stretch">
59 <content></content> 61 <content></content>
60 </div> 62 </div>
61 </paper-button> 63 </paper-button>
62 </template> 64 </template>
63 </dom-module> 65 </dom-module>
64 66
65 <!-- 67 <!--
66 Material design square "<- Back" and "Next ->" buttons. 68 Material design square "<- Back" and "Next ->" buttons.
(...skipping 55 matching lines...) Expand 10 before | Expand all | Expand 10 after
122 class="flex layout horizontal center self-stretch"> 124 class="flex layout horizontal center self-stretch">
123 <hd-iron-icon icon1x="[[icon1x]]" icon2x="[[icon2x]]" 125 <hd-iron-icon icon1x="[[icon1x]]" icon2x="[[icon2x]]"
124 class="oobe-icon"> 126 class="oobe-icon">
125 </hd-iron-icon> 127 </hd-iron-icon>
126 <content></content> 128 <content></content>
127 </div> 129 </div>
128 </div> 130 </div>
129 </paper-button> 131 </paper-button>
130 </template> 132 </template>
131 </dom-module> 133 </dom-module>
OLDNEW

Powered by Google App Engine
This is Rietveld 408576698