| <link rel="import" href="chrome://resources/html/polymer.html"> |
| |
| <link rel="import" href="browser_proxy.html"> |
| <link rel="import" href="shared_style.html"> |
| <link rel="import" href="shared_vars.html"> |
| <link rel="import" href="chrome://resources/cr_elements/cr_icons_css.html"> |
| <link rel="import" href="chrome://resources/cr_elements/cr_toggle/cr_toggle.html"> |
| <link rel="import" href="chrome://resources/cr_elements/paper_button_style_css.html"> |
| <link rel="import" href="chrome://resources/cr_elements/shared_vars_css.html"> |
| <link rel="import" href="chrome://resources/html/icon.html"> |
| <link rel="import" href="chrome://resources/polymer/v1_0/paper-button/paper-button.html"> |
| <link rel="import" href="chrome://resources/polymer/v1_0/paper-icon-button/paper-icon-button-light.html"> |
| <dom-module id="app-management-pwa-permission-view"> |
| <template> |
| <style include="app-management-shared-css cr-icons paper-button-style"> |
| #permission-header { |
| align-items: center; |
| border-top: var(--card-separator); |
| display: flex; |
| } |
| |
| #app-title { |
| flex: 1; |
| font-size: 16px; |
| overflow: hidden; |
| text-overflow: ellipsis; |
| } |
| |
| #site-settings-button { |
| color: var(--secondary-text-color); |
| font-size: 12px; |
| } |
| |
| #site-settings-icon { |
| display: flex; |
| margin-inline-end: 24px; |
| } |
| |
| #permission-list { |
| display: flex; |
| flex-direction: column; |
| } |
| |
| .permission-row { |
| align-items: center; |
| border-top: var(--card-separator); |
| display: inline-flex; |
| height: 62px; |
| justify-content: space-between; |
| padding: 0 24px; |
| } |
| |
| .permission-row:first-child { |
| border-style: none; |
| } |
| |
| .permission-row-controls { |
| align-items: center; |
| display: inline-flex; |
| } |
| |
| .control-divider { |
| background: var(--control-separator-color); |
| height: 24px; |
| margin: 0 24px; |
| width: 1px; |
| } |
| </style> |
| |
| <div id="permission-header"> |
| <paper-icon-button-light class="icon-arrow-back"> |
| <button id="closeButton" aria-label="$i18n{back}"> |
| <paper-ripple class="circle"></paper-ripple> |
| </button> |
| </paper-icon-button-light> |
| <img class="permission-view-header-icon" src="[[iconUrlFromId_(app_)]]"> |
| <div id="app-title">[[app_.title]]</div> |
| <div id="site-settings-button">$i18n{openSiteSettings}</div> |
| <paper-icon-button-light id="site-settings-icon" class="icon-external"> |
| <button aria-label="$i18n{openSiteSettings}"></button> |
| </paper-icon-button-light> |
| <paper-button class="secondary-button" role="button" |
| tabindex="0" aria-disabled="false" elevation="0"> |
| $i18n{uninstall} |
| </paper-button> |
| </div> |
| |
| <div id="permission-list" class="card-container"> |
| <span class="permission-row"> |
| <div class="header-text">$i18n{notifications}</div> |
| <cr-toggle aria-pressed="false" role="button" tabindex="0"> |
| </cr-toggle> |
| </span> |
| <span class="permission-row" |
| on-click="toggleListExpanded_"> |
| <span class="header-text">$i18n{permissions}</span> |
| <span class="permission-row-controls"> |
| <paper-icon-button-light> |
| <button> |
| <iron-icon icon="[[getCollapsedIcon_(listExpanded_)]]"> |
| </iron-icon> |
| </button> |
| </paper-icon-button-light> |
| <div class="control-divider"></div> |
| <cr-toggle aria-pressed="false" role="button" tabindex="0" |
| class="left-separated-control"> |
| </cr-toggle> |
| </span> |
| </span> |
| </div> |
| </template> |
| <script src="pwa_permission_view.js"></script> |
| </dom-module> |