Commit 89941bf5 authored by Gordon Seto's avatar Gordon Seto Committed by Chromium LUCI CQ

[CrOS Settings] Create cellular setup iconset.

Create cellular setup iconset and move activation code page icons into
the iconset.

Bug: 1093185
Change-Id: I06fe411ecf059d180b3f999279052e87b888bbf3
Reviewed-on: https://chromium-review.googlesource.com/c/chromium/src/+/2566354
Commit-Queue: Gordon Seto <gordonseto@google.com>
Reviewed-by: default avatarKyle Horimoto <khorimoto@chromium.org>
Cr-Commit-Position: refs/heads/master@{#832499}
parent badc197b
......@@ -98,6 +98,7 @@ preprocess_grit("preprocess_generated") {
"chromeos/cellular_setup/base_page.m.js",
"chromeos/cellular_setup/button_bar.m.js",
"chromeos/cellular_setup/cellular_setup_delegate.m.js",
"chromeos/cellular_setup/cellular_setup_icons.m.js",
"chromeos/cellular_setup/cellular_setup.m.js",
"chromeos/cellular_setup/cellular_types.m.js",
"chromeos/cellular_setup/esim_flow_ui.m.js",
......@@ -205,6 +206,7 @@ preprocess_grit("preprocess_polymer2") {
"chromeos/cellular_setup/button_bar.js",
"chromeos/cellular_setup/cellular_setup_delegate.html",
"chromeos/cellular_setup/cellular_setup_delegate.js",
"chromeos/cellular_setup/cellular_setup_icons.html",
"chromeos/cellular_setup/cellular_setup.html",
"chromeos/cellular_setup/cellular_setup.js",
"chromeos/cellular_setup/cellular_types.html",
......
......@@ -366,6 +366,7 @@ group("polymer3_elements") {
":activation_code_page_module",
":base_page_module",
":button_bar_module",
":cellular_setup_icons_module",
":cellular_setup_module",
":esim_flow_ui_module",
":final_page_module",
......@@ -475,6 +476,12 @@ polymer_modulizer("cellular_setup") {
auto_imports = cr_components_chromeos_auto_imports
}
polymer_modulizer("cellular_setup_icons") {
js_file = "cellular_setup_icons.m.js"
html_file = "cellular_setup_icons.html"
html_type = "iron-iconset"
}
js_modulizer("modulize") {
input_files = [
"cellular_types.js",
......
<link rel="import" href="../../../html/polymer.html">
<link rel="import" href="chrome://resources/polymer/v1_0/iron-icon/iron-icon.html">
<link rel="import" href="../../../html/i18n_behavior.html">
<link rel="import" href="../../../cr_elements/cr_input/cr_input.html">
<link rel="import" href="base_page.html">
<link rel="import" href="cellular_setup_delegate.html">
<link rel="import" href="cellular_setup_icons.html">
<dom-module id="activation-code-page">
<template>
......@@ -47,15 +49,11 @@
}
.button-image {
height: 20px;
margin-inline-end: 8px;
width: 20px;
}
.scan-finish-image {
height: 20px;
position: absolute;
width: 20px;
}
.scan-finish-message {
......@@ -67,7 +65,12 @@
cursor: default;
}
#startScanningContainer {
--iron-icon-fill-color: #1A73E8;
}
#scanSuccessContainer {
--iron-icon-fill-color: #1E8E3E;
margin-bottom: 8px;
}
......@@ -77,6 +80,7 @@
}
#scanFailureContainer {
--iron-icon-fill-color: #D93025;
margin-bottom: 4px;
}
......@@ -101,8 +105,9 @@
z-index: 2;
}
#switchCameraButton img {
#switchCameraButton iron-icon {
filter: brightness(2.1);
--iron-icon-fill-color: #5F6368;
}
</style>
<base-page>
......@@ -115,9 +120,7 @@
on-click="onSwitchCameraButtonPressed_"
hidden$="[[isUiElementHidden_(UiElement.SWITCH_CAMERA, state_, hasMultipleCameras_)]]"
disabled="[[isUiElementDisabled_(UiElement.SWITCH_CAMERA, state_)]]">
<img class="button-image"
src="activation_code_page_switch_camera.svg"
aria-hidden="true">
<iron-icon class="button-image" icon="cellular-setup:switch-camera"></iron-icon>
[[i18n('switchCamera')]]
</cr-button>
<video id="video"
......@@ -129,9 +132,7 @@
id="startScanningButton"
on-click="startScanning_"
aria-describedby="scanQrCodeDescription">
<img class="button-image"
src="activation_code_page_camera.svg"
aria-hidden="true">
<iron-icon class="button-image" icon="cellular-setup:camera"></iron-icon>
[[i18n('useCamera')]]
</cr-button>
</div>
......@@ -140,16 +141,14 @@
<div>
<div id="scanSuccessContainer"
hidden$="[[isUiElementHidden_(UiElement.SCAN_SUCCESS, state_)]]">
<img class="scan-finish-image"
src="activation_code_page_checked.svg">
<iron-icon class="scan-finish-image" icon="cellular-setup:checked"></iron-icon>
<span class="label scan-finish-message" id="scanSuccessMessage">
[[i18n('scanQRCodeSuccess')]]
</span>
</div>
<div id="scanFailureContainer"
hidden$="[[isUiElementHidden_(UiElement.SCAN_FAILURE, state_)]]">
<img class="scan-finish-image"
src="activation_code_page_error.svg">
<iron-icon class="scan-finish-image" icon="cellular-setup:error"></iron-icon>
<span class="label scan-finish-message" id="scanFailureMessage">
[[i18n('scanQrCodeInvalid')]]
</span>
......
<svg width="20" height="20" viewBox="0 0 20 20" fill="none" xmlns="http://www.w3.org/2000/svg"><mask id="a" maskUnits="userSpaceOnUse" x="1" y="2" width="18" height="16"><path fill-rule="evenodd" clip-rule="evenodd" d="M16.667 4.167h-2.642L12.5 2.5h-5L5.975 4.167H3.334c-.917 0-1.667.75-1.667 1.666v10c0 .917.75 1.667 1.667 1.667h13.333c.917 0 1.667-.75 1.667-1.667v-10c0-.916-.75-1.666-1.667-1.666zm0 11.666H3.334v-10h13.333v10zm-10-5A3.332 3.332 0 1 1 10 14.166a3.332 3.332 0 0 1-3.333-3.333z" fill="#fff"/></mask><g mask="url(#a)"><path fill="#1A73E8" d="M0 0h20v20H0z"/></g></svg>
\ No newline at end of file
<svg width="20" height="20" viewBox="0 0 20 20" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M13.707 7.293a1 1 0 0 0-1.414 0L9 10.586 7.707 9.293a1 1 0 0 0-1.414 1.414l2 2a1 1 0 0 0 1.414 0l4-4a1 1 0 0 0 0-1.414z" fill="#1E8E3E"/><path fill-rule="evenodd" clip-rule="evenodd" d="M10 18a8 8 0 1 0 0-16 8 8 0 0 0 0 16zm0-2a6 6 0 1 0 0-12 6 6 0 0 0 0 12z" fill="#1E8E3E"/></svg>
\ No newline at end of file
<svg width="20" height="20" viewBox="0 0 20 20" fill="none" xmlns="http://www.w3.org/2000/svg"><path fill-rule="evenodd" clip-rule="evenodd" d="M9 10h2V6H9v4zm1-8c-4.416 0-8 3.584-8 8s3.584 8 8 8 8-3.584 8-8-3.584-8-8-8zm0 14c-3.308 0-6-2.693-6-6 0-3.308 2.692-6 6-6 3.307 0 6 2.692 6 6 0 3.307-2.693 6-6 6zm-1-2h2v-2H9v2z" fill="#D93025"/></svg>
\ No newline at end of file
<svg width="20" height="20" viewBox="0 0 20 20" fill="none" xmlns="http://www.w3.org/2000/svg"><path fill-rule="evenodd" clip-rule="evenodd" d="M7 9V7H4.802A5.996 5.996 0 0 1 10 4a6 6 0 0 1 5.917 5h2.021c-.491-3.945-3.853-7-7.93-7a7.992 7.992 0 0 0-6.009 2.712L4 3H2v6h5zm5.938 2v2h2.198a5.996 5.996 0 0 1-5.198 3 6 6 0 0 1-5.917-5H2c.492 3.945 3.853 7 7.93 7a7.992 7.992 0 0 0 6.009-2.712V17h2v-6h-5zM10 12a2 2 0 1 0 0-4 2 2 0 0 0 0 4z" fill="#5F6368"/></svg>
\ No newline at end of file
<link rel="import" href="chrome://resources/html/polymer.html">
<link rel="import" href="chrome://resources/polymer/v1_0/iron-iconset-svg/iron-iconset-svg.html">
<!-- These icons were converted from source .svg files. -->
<iron-iconset-svg name="cellular-setup" size="20">
<svg>
<defs>
<g id="camera" viewBox="0 0 20 20"><mask id="a" maskUnits="userSpaceOnUse" x="1" y="2" width="18" height="16"><path fill-rule="evenodd" clip-rule="evenodd" d="M16.667 4.167h-2.642L12.5 2.5h-5L5.975 4.167H3.334c-.917 0-1.667.75-1.667 1.666v10c0 .917.75 1.667 1.667 1.667h13.333c.917 0 1.667-.75 1.667-1.667v-10c0-.916-.75-1.666-1.667-1.666zm0 11.666H3.334v-10h13.333v10zm-10-5A3.332 3.332 0 1 1 10 14.166a3.332 3.332 0 0 1-3.333-3.333z" fill="#fff"></mask><g mask="url(#a)"><path d="M0 0h20v20H0z"></g></g>
<g id="checked" viewBox="0 0 20 20"><path d="M13.707 7.293a1 1 0 0 0-1.414 0L9 10.586 7.707 9.293a1 1 0 0 0-1.414 1.414l2 2a1 1 0 0 0 1.414 0l4-4a1 1 0 0 0 0-1.414z"></path><path fill-rule="evenodd" clip-rule="evenodd" d="M10 18a8 8 0 1 0 0-16 8 8 0 0 0 0 16zm0-2a6 6 0 1 0 0-12 6 6 0 0 0 0 12z"></path></g>
<g id="error" viewBox="0 0 20 20"><path fill-rule="evenodd" clip-rule="evenodd" d="M9 10h2V6H9v4zm1-8c-4.416 0-8 3.584-8 8s3.584 8 8 8 8-3.584 8-8-3.584-8-8-8zm0 14c-3.308 0-6-2.693-6-6 0-3.308 2.692-6 6-6 3.307 0 6 2.692 6 6 0 3.307-2.693 6-6 6zm-1-2h2v-2H9v2z"></g>
<g id="switch-camera" viewBox="0 0 20 20"><path fill-rule="evenodd" clip-rule="evenodd" d="M7 9V7H4.802A5.996 5.996 0 0 1 10 4a6 6 0 0 1 5.917 5h2.021c-.491-3.945-3.853-7-7.93-7a7.992 7.992 0 0 0-6.009 2.712L4 3H2v6h5zm5.938 2v2h2.198a5.996 5.996 0 0 1-5.198 3 6 6 0 0 1-5.917-5H2c.492 3.945 3.853 7 7.93 7a7.992 7.992 0 0 0 6.009-2.712V17h2v-6h-5zM10 12a2 2 0 1 0 0-4 2 2 0 0 0 0 4z"></g>
</defs>
</svg>
</iron-iconset-svg>
\ No newline at end of file
......@@ -3,6 +3,8 @@
<link rel="import" href="chrome://resources/cr_elements/shared_vars_css.html">
<link rel="import" href="chrome://resources/html/i18n_behavior.html">
<link rel="import" href="chrome://resources/polymer/v1_0/iron-flex-layout/iron-flex-layout-classes.html">
<link rel="import" href="chrome://resources/polymer/v1_0/iron-icon/iron-icon.html">
<link rel="import" href="cellular_setup_icons.html">
<dom-module id="profile-discovery-list-item">
<template>
......@@ -23,13 +25,9 @@
}
#checkmark {
-webkit-mask: url(activation_code_page_checked.svg) no-repeat center;
background-color: var(--google-blue-600);
height: 20px;
--iron-icon-fill-color: var(--google-blue-600);
margin-inline-end: 8px;
mask: url(activation_code_page_checked.svg) no-repeat center;
padding-inline-end: var(--cr-section-padding);
width: 20px;
}
</style>
<div class="two-line no-padding" selectable>
......@@ -47,8 +45,11 @@
</div>
</div>
</div>
<span id="checkmark" hidden$="[[!selected]]"
<iron-icon id="checkmark"
icon="cellular-setup:checked"
hidden$="[[!selected]]"
tabindex="-1">
</iron-icon>
</div>
</div>
</template>
......
......@@ -27,22 +27,6 @@
compress="gzip" />
<!-- CellularSetup Images -->
<include name="IDR_WEBUI_CHROMEOS_CELLULAR_SETUP_ACTIVATION_CODE_PAGE_CAMERA_SVG"
file="cr_components/chromeos/cellular_setup/activation_code_page_camera.svg"
type="BINDATA"
compress="gzip" />
<include name="IDR_WEBUI_CHROMEOS_CELLULAR_SETUP_ACTIVATION_CODE_PAGE_CHECKED_SVG"
file="cr_components/chromeos/cellular_setup/activation_code_page_checked.svg"
type="BINDATA"
compress="gzip" />
<include name="IDR_WEBUI_CHROMEOS_CELLULAR_SETUP_ACTIVATION_CODE_PAGE_SWITCH_CAMERA_SVG"
file="cr_components/chromeos/cellular_setup/activation_code_page_switch_camera.svg"
type="BINDATA"
compress="gzip" />
<include name="IDR_WEBUI_CHROMEOS_CELLULAR_SETUP_ACTIVATION_CODE_PAGE_ERROR_SVG"
file="cr_components/chromeos/cellular_setup/activation_code_page_error.svg"
type="BINDATA"
compress="gzip" />
<include name="IDR_WEBUI_CHROMEOS_CELLULAR_SETUP_ERROR_1X_PNG"
file="cr_components/chromeos/cellular_setup/error_1x.png"
type="BINDATA"
......
Markdown is supported
0%
or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment