Merge "Add expander icons to messages"
This commit is contained in:
@@ -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>
|
||||
|
||||
@@ -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);
|
||||
},
|
||||
});
|
||||
})();
|
||||
|
||||
Reference in New Issue
Block a user