<style include="cr-shared-style settings-shared">
:host {
padding: 0 var(--cr-section-padding);
}
.row-aligned {
align-items: center;
display: flex;
}
#toggleButton {
/** Use the minimum row height as the minimum click-target height. */
min-height: var(--cr-section-min-height);
}
.site-representation {
display: flex;
}
.second-line {
margin-top: 0.1em;
/* 1.54em is the same as the line-height of 154%. Ensures the line is
always present when iron-list is calculating item sizes. */
min-height: 1.54em;
}
/* Data units such as "0 KB" should always read left-to-right. */
.data-unit {
direction: ltr;
unicode-bidi: isolate;
}
.list-frame {
padding-inline-end: 0;
}
.origin-link {
overflow: hidden;
}
.spacing {
padding-inline-start: 1ch;
}
</style>
<div id="collapseParent" focus-row-container>
<div class$="list-item [[getClassForIndex_(listIndex)]]">
<div id="toggleButton" class="start row-aligned two-line text-elide"
on-click="onSiteEntryClick_" actionable aria-expanded="false">
<site-favicon url="[[getSiteGroupIcon_(siteGroup)]]"></site-favicon>
<div class="middle text-elide" id="displayName">
<div class="site-representation">
<span class="url-directionality text-elide">
[[displayName_]]
</span>
<span class="secondary"
hidden$="[[!siteGroupScheme_(siteGroup)]]">
$i18nPolymer{siteSettingsSiteRepresentationSeparator}
</span>
<span class="secondary"
hidden$="[[!siteGroupScheme_(siteGroup)]]">
[[siteGroupScheme_(siteGroup)]]
</span>
</div>
<div class="second-line secondary">
<span class="data-unit">[[overallUsageString_]]</span>
<span id="cookies" hidden$="[[!siteGroup.numCookies]]">
· [[cookieString_]]
</span>
<span id="rwsMembership"
hidden$="[[!isRwsMember_(siteGroup.rwsOwner)]]">
· [[rwsMembershipLabel_]]
</span>
<span id="extensionIdDescription"
hidden$="[[!isExtension_(siteGroup)]]">
· [[extensionIdDescription_(siteGroup)]]
</span>
</div>
</div>
<template is="dom-if" restamp if="[[shouldShowPolicyPrefIndicator_(
siteGroup.rwsEnterpriseManaged)]]">
<cr-policy-pref-indicator
id="rwsPolicy" pref="[[rwsEnterprisePref_]]"
icon-aria-label="[[label]]"
focus-row-control focus-type="policy">
</cr-policy-pref-indicator>
</template>
<cr-icon-button id="expandIcon" class="icon-expand-more"
hidden$="[[!grouped_(siteGroup)]]" aria-label$="[[displayName_]]"
aria-describedby="displayName" aria-expanded="false"
focus-row-control focus-type="expand"></cr-icon-button>
<cr-icon-button class="subpage-arrow"
hidden$="[[grouped_(siteGroup)]]"
aria-label$="[[getSubpageLabel_(siteGroup.displayName)]]"
aria-roledescription="$i18n{subpageArrowRoleDescription}"
focus-row-control focus-type="show-detail"></cr-icon-button>
</div>
<div class="row-aligned">
<template is="dom-if" if=
"[[shouldShowOverflowMenu(siteGroup.rwsOwner, isRwsFiltered)]]">
<div class="separator"></div>
<cr-icon-button class="icon-more-vert"
id="rwsOverflowMenuButton"
title="$i18n{moreActions}"
on-click="showOverflowMenu_"
focus-row-control focus-type="more-actions"
aria-label$="[[getMoreActionsLabel_(siteGroup)]]">
</cr-icon-button>
</template>
<template is="dom-if" if=
"[[!shouldShowOverflowMenu(siteGroup.rwsOwner, isRwsFiltered)]]">
<div class="separator"></div>
<cr-icon-button class="icon-delete-gray" id="removeSiteButton"
title$=
"[[i18n('siteSettingsCookieRemoveSite', displayName_)]]"
on-click="onRemove_" focus-row-control focus-type="remove">
</cr-icon-button>
</template>
</div>
</div>
<cr-lazy-render id="originList">
<template>
<cr-collapse id="collapseChild" no-animation>
<div class="list-frame">
<template is="dom-repeat" items="[[siteGroup.origins]]">
<div class="list-item hr">
<div class="start row-aligned list-item origin-link"
on-click="onOriginClick_"
actionable$="[[!item.isPartitioned]]">
<site-favicon url="[[item.origin]]"></site-favicon>
<div class="site-representation middle text-elide">
<span id="originSiteRepresentation"
class="url-directionality text-elide">
[[originRepresentation(item.origin)]]
</span>
<span class="secondary"
hidden$="[[!originScheme_(item)]]">
$i18nPolymer{siteSettingsSiteRepresentationSeparator}
</span>
<span class="secondary"
hidden$="[[!originScheme_(item)]]">
[[originScheme_(item)]]
</span>
<!--Define a spacing span so that when the direction is
rtl, the spacing is still showing correctly. This is
because the data-unit class is set to be ltr so the
padding will be in wrong place if we put padding in
that span.-->
<span class="spacing" hidden$="[[!item.usage]]"></span>
<span class="secondary data-unit"
hidden$="[[!item.usage]]">
[[originUsagesItem_(originUsages_.*, index)]]
</span>
<span class="secondary" hidden$="[[!item.numCookies]]">
·
[[originCookiesItem_(cookiesNum_.*, index)]]
</span>
<span class="secondary" hidden$="[[!item.isPartitioned]]">
·
$i18n{siteSettingsSiteEntryPartitionedLabel}
</span>
</div>
<cr-icon-button class="subpage-arrow"
hidden$="[[item.isPartitioned]]"
aria-label$="[[getSubpageLabel_(item.origin)]]"
aria-roledescription=
"$i18n{subpageArrowRoleDescription}"
focus-row-control focus-type="detailed-sites">
</cr-icon-button>
</div>
<div class="row-aligned">
<div class="separator"></div>
<cr-icon-button class="icon-delete-gray"
id="removeOriginButton"
title$="[[getRemoveOriginButtonTitle_(item.origin)]]"
data-origin$="[[item.origin]]" data-context="origin"
data-partitioned$="[[item.isPartitioned]]"
on-click="onRemove_" focus-row-control
focus-type="remove">
</cr-icon-button>
</div>
</div>
</template>
</div>
</cr-collapse>
</template>
</cr-lazy-render>
</div>
Codebase Browser
chromium