<style include="common cr-shared-style cr-radio-button-style">
#container {
align-items: center;
display: flex;
flex: 1;
flex-flow: row nowrap;
height: 100%;
justify-content: space-between;
padding-inline-end: var(--cr-icon-ripple-padding);
padding-inline-start: 14px;
}
#labelWrapper {
margin-inline-start: var(--cr-radio-button-label-spacing, 20px);
}
.primary-text {
color: var(--cros-text-color-primary);
font: var(--cros-body-2-font);
}
iron-icon {
height: 20px;
width: 20px;
}
</style>
<div id="container">
<!-- This item behaves similar to a radio button and reuses disc and label
style in cr-radio-button-style. -->
<div class="disc-wrapper" aria-hidden="true">
<div class="disc-border"></div>
<div class="disc"></div>
</div>
<div id="labelWrapper" aria-hidden="true">
<div class="primary-text">[[getItemName_(topicSource)]]</div>
<div class="cr-secondary-text">
[[getItemDescription_(topicSource, hasGooglePhotosAlbums)]]
</div>
</div>
<iron-icon icon="cr:chevron-right" aria-hidden="true"></iron-icon>
</div>