navbar: Improve structure & styling for top navbar.

This updates the logged-in top navbar to display the stream/message
name, number of users, and description. It also replaces the search
bar with a search icon that expands into a full-width search bar.

Co-authored-by: Max Nussenbaum <max@maxnuss.com>

Fixes: #164.
Fixes: #5198.
This commit is contained in:
YashRE42
2020-02-03 21:31:11 +05:30
committed by Tim Abbott
parent 5fdb8989e5
commit eb4a2b9d4e
11 changed files with 379 additions and 318 deletions

View File

@@ -251,9 +251,9 @@ expect_stream_subject();
casper.then(check_narrow_title('frontend test - Zulip Dev - Zulip'));
casper.then(function () {
// This time, un-narrow by hitting the search 'x'
// Un-narrow by clicking "Zulip"
casper.test.info('Un-narrowing');
casper.click('#search_exit');
casper.click('.brand');
});
expect_home();

View File

@@ -5,6 +5,7 @@ zrequire('search');
zrequire('search_pill');
zrequire('Filter', 'js/filter');
zrequire('search_pill_widget');
zrequire('tab_bar');
const noop = () => {};
const return_true = () => true;
@@ -38,13 +39,6 @@ run_test('update_button_visibility', () => {
const search_query = $('#search_query');
const search_button = $('.search_button');
search_query.is = return_false;
search_query.val('');
narrow_state.active = return_false;
search_button.prop('disabled', false);
search.update_button_visibility();
assert(search_button.prop('disabled'));
search_query.is = return_true;
search_query.val('');
narrow_state.active = return_false;
@@ -237,7 +231,6 @@ run_test('initizalize', () => {
search_query_box.is = return_true;
func(ev);
assert(is_blurred);
assert(search_button.prop('disabled'));
operators = [{
negated: false,
@@ -268,7 +261,7 @@ run_test('initizalize', () => {
search_query_box.val("test string");
narrow_state.search_string = () => 'ver';
callback();
assert.equal(search_query_box.val(), 'ver');
assert.equal(search_query_box.val(), 'test string');
}
};
@@ -284,17 +277,7 @@ run_test('initizalize', () => {
}
};
let is_deactivated;
narrow.deactivate = () => {
is_deactivated = true;
};
search.initialize();
const search_exit_callback = $('#search_exit').get_on_handler('click');
search_exit_callback();
assert(is_deactivated);
});
run_test('initiate_search', () => {

View File

@@ -2,6 +2,7 @@ set_global('page_params', {
search_pills_enabled: false,
});
zrequire('search');
zrequire('tab_bar');
const noop = () => {};
const return_true = () => true;
@@ -26,8 +27,6 @@ run_test('update_button_visibility', () => {
search_query.val('');
narrow_state.active = return_false;
search_button.prop('disabled', false);
search.update_button_visibility();
assert(search_button.prop('disabled'));
search_query.is = return_true;
search_query.val('');
@@ -213,7 +212,6 @@ run_test('initialize', () => {
search_query_box.is = return_true;
func(ev);
assert(is_blurred);
assert(search_button.prop('disabled'));
_setup('ver');
search.is_using_input_method = true;
@@ -239,7 +237,7 @@ run_test('initialize', () => {
search_query_box.val("test string");
narrow_state.search_string = () => 'ver';
callback();
assert.equal(search_query_box.val(), 'ver');
assert.equal(search_query_box.val(), 'test string');
}
};