Merge "Add expander icons to messages"

This commit is contained in:
Wyatt Allen
2018-06-05 23:55:02 +00:00
committed by Gerrit Code Review
2 changed files with 41 additions and 19 deletions

View File

@@ -16,6 +16,7 @@ limitations under the License.
-->
<link rel="import" href="../../../bower_components/polymer/polymer.html">
<link rel="import" href="../../../bower_components/iron-icon/iron-icon.html">
<link rel="import" href="../../shared/gr-account-label/gr-account-label.html">
<link rel="import" href="../../shared/gr-button/gr-button.html">
<link rel="import" href="../../shared/gr-date-formatter/gr-date-formatter.html">
@@ -115,7 +116,7 @@ limitations under the License.
overflow: hidden;
text-overflow: ellipsis;
}
.collapsed .date {
.collapsed .dateContainer {
position: static;
}
.collapsed .author {
@@ -126,12 +127,17 @@ limitations under the License.
cursor: pointer;
margin-bottom: .4em;
}
.date {
color: var(--deemphasized-text-color);
.dateContainer {
position: absolute;
right: var(--default-horizontal-margin);
top: 10px;
}
.date {
color: var(--deemphasized-text-color);
}
.dateContainer iron-icon {
cursor: pointer;
}
.replyContainer {
padding: .5em 0 0 0;
}
@@ -211,22 +217,29 @@ limitations under the License.
</template>
</div>
</template>
<template is="dom-if" if="[[!message.id]]">
<span class="date">
<gr-date-formatter
has-tooltip
show-date-and-time
date-str="[[message.date]]"></gr-date-formatter>
</span>
</template>
<template is="dom-if" if="[[message.id]]">
<a class="date" href$="[[_computeMessageHash(message)]]" on-tap="_handleLinkTap">
<gr-date-formatter
has-tooltip
show-date-and-time
date-str="[[message.date]]"></gr-date-formatter>
</a>
</template>
<span class="dateContainer">
<template is="dom-if" if="[[!message.id]]">
<span class="date">
<gr-date-formatter
has-tooltip
show-date-and-time
date-str="[[message.date]]"></gr-date-formatter>
</span>
</template>
<template is="dom-if" if="[[message.id]]">
<a class="date" href$="[[_computeMessageHash(message)]]" on-tap="_handleLinkTap">
<gr-date-formatter
has-tooltip
show-date-and-time
date-str="[[message.date]]"></gr-date-formatter>
</a>
</template>
<iron-icon
id="expandToggle"
on-tap="_toggleExpanded"
title="Toggle expanded state"
icon="[[_computeExpandToggleIcon(_expanded)]]">
</span>
</div>
</div>
<gr-rest-api-interface id="restAPI"></gr-rest-api-interface>

View File

@@ -251,5 +251,14 @@
this._projectConfig = config;
});
},
_computeExpandToggleIcon(expanded) {
return expanded ? 'gr-icons:expand-less' : 'gr-icons:expand-more';
},
_toggleExpanded(e) {
e.stopPropagation();
this.set('message.expanded', !this.message.expanded);
},
});
})();