message_edit: Show stream color bar alongside stream select.

* Stream bar color logic is borrwoed from compose stream bar.
* Use flex containers to align elements and automatically set their
  height to be same, them automatically filling the stream color bar
  height to be the height of the select box.
* Use flex-wrap to wrap the propagate selector when out of space.

* To make sure stream select box and stream color box are closest possible,
  select box has been moved under stream color box.
This commit is contained in:
Aman Agrawal
2020-05-12 14:32:13 +05:30
committed by Tim Abbott
parent 9734bcc7cd
commit 7c502acb4c
7 changed files with 70 additions and 26 deletions

View File

@@ -46,9 +46,14 @@ function update_lock_icon_for_stream(stream_name) {
// color look like the stream being used.
// (In particular, if there's a color associated with it,
// have that color be reflected here too.)
exports.decorate_stream_bar = function (stream_name, element) {
exports.decorate_stream_bar = function (stream_name, element, is_compose) {
if (stream_name === undefined) {
return false;
}
const color = stream_data.get_color(stream_name);
update_lock_icon_for_stream(stream_name);
if (is_compose) {
update_lock_icon_for_stream(stream_name);
}
element.css('background-color', color)
.removeClass(stream_color.color_classes)
.addClass(stream_color.get_color_class(color));