blob: 4342bcf2fe2ff0bf316680c5ee2003b00c66b979 [file] [log] [blame]
<link rel="import" href="chrome://resources/html/polymer.html">
<link rel="import" href="chrome://resources/cr_elements/icons.html">
<link rel="import" href="chrome://resources/cr_elements/shared_vars_css.html">
<link rel="import" href="chrome://resources/html/list_property_update_behavior.html">
<link rel="import" href="chrome://resources/html/web_ui_listener_behavior.html">
<link rel="import" href="chrome://resources/polymer/v1_0/paper-icon-button/paper-icon-button-light.html">
<link rel="import" href="../i18n_setup.html">
<link rel="import" href="../settings_shared_css.html">
<link rel="import" href="../site_favicon.html">
<link rel="import" href="site_settings_behavior.html">
<link rel="import" href="site_settings_prefs_browser_proxy.html">
<dom-module id="zoom-levels">
<template>
<style include="settings-shared">
:host {
display: block;
}
.zoom-label {
color: var(--cr-secondary-text-color);
margin-inline-end: 16px;
}
#empty {
margin-top: 15px;
}
.list-item site-favicon {
flex-shrink: 0;
}
.list-item .middle {
overflow-x: hidden;
text-overflow: ellipsis;
}
</style>
<div class="list-frame vertical-list" id="listContainer">
<iron-list id="list" preserve-focus items="[[sites_]]"
class="cr-separators" risk-selection>
<template>
<div class="list-item" first$="[[!index]]">
<site-favicon url="[[item.originForFavicon]]"></site-favicon>
<div class="middle">
<span class="url-directionality">[[item.displayName]]</span>
</div>
<div class="zoom-label">[[item.zoom]]</div>
<paper-icon-button-light class="icon-clear">
<button on-click="removeZoomLevel_"
title="$i18n{siteSettingsRemoveZoomLevel}"
tabindex$="[[tabIndex]]"></button>
</paper-icon-button-light>
</div>
</template>
</iron-list>
<div id="empty" hidden$="[[!showNoSites_]]">
$i18n{siteSettingsNoZoomedSites}
</div>
</div>
</template>
<script src="zoom_levels.js"></script>
</dom-module>