paulmataruso/zulip
1
0
Fork 0
mirror of https://github.com/zulip/zulip.git synced 2025-11-16 03:41:58 +00:00
Code Issues Packages Projects Releases Wiki Activity

css: Narrow the gap between searchbox and searchbox_legacy.

Browse Source 
This is a prep commit which combines the previous `#searchbox`
block with the newly updated `#searchbox_legacy` block which
contains the modifications related to the new navbar display.

This only consists of changes to `#searchbox` and is still broken.
But it integrates the searchbox with the new tab_bar changes so that
only one searchbox is shown (instead of two, previously).
This commit is contained in:
Ryan Rehman
2020-05-15 13:14:31 +05:30
committed by Tim Abbott
parent e2417b5b37
commit 4cdd7aed2b
3 changed files with 40 additions and 22 deletions
Download Patch File Download Diff File Expand all files Collapse all files

2
static/js/stream_color.js
View File

@@ -72,9 +72,7 @@ exports.update_stream_color = function (sub, color, opts) {
update_historical_message_color(sub.name, color); update_historical_message_color(sub.name, color);
} }
update_stream_sidebar_swatch_color(stream_id, color); update_stream_sidebar_swatch_color(stream_id, color);
if (!page_params.search_pills_enabled) {
tab_bar.colorize_tab_bar(); tab_bar.colorize_tab_bar();
}
}; };
function picker_do_change_color(color) { function picker_do_change_color(color) {

2
static/js/ui_init.js
View File

@@ -445,9 +445,7 @@ exports.initialize_everything = function () {
overlays.initialize(); overlays.initialize();
invite.initialize(); invite.initialize();
timerender.initialize(); timerender.initialize();
if (!page_params.search_pills_enabled) {
tab_bar.initialize(); tab_bar.initialize();
}
server_events.initialize(); server_events.initialize();
user_status.initialize(user_status_params); user_status.initialize(user_status_params);
compose_pm_pill.initialize(); compose_pm_pill.initialize();

54
static/styles/zulip.scss
View File

@@ -1596,25 +1596,41 @@ div.focused_table {
} }
#searchbox { #searchbox {
display: flex;
width: 100%; width: 100%;
height: 40px; height: 40px;
.navbar-search { .navbar-search:not(.expanded) {
margin-top: 0px; display: none;
width: calc(100% - 66px); }
float: none;
.navbar-search.expanded {
overflow: hidden; overflow: hidden;
height: 100%; margin-top: 0px;
right: 2;
width: calc(100% - 2px);
position: absolute;
.search_button {
display: inline;
margin-right: 16px;
}
} }
.input-append { .input-append {
height: 100%;
align-items: center;
display: flex;
flex-wrap: nowrap;
position: relative; position: relative;
width: calc(100% - 28px); width: 100%;
.fa-search {
padding: 0px;
font-size: 20px;
position: absolute;
left: 10px;
top: 10px;
z-index: 5;
}
.fa-search:not(.deactivated) {
cursor: pointer;
}
} }
#search_query { #search_query {
@@ -1631,18 +1647,26 @@ div.focused_table {
line-height: 40px; line-height: 40px;
} }
#search_query:focus {
box-shadow: inset 0px 0px 0px 2px hsl(204, 20%, 74%);
}
.search_button, .search_button,
.search_button[disabled]:hover { .search_button[disabled]:hover {
position: relative; position: absolute;
right: 2px;
top: 6px;
background: none; background: none;
height: 40px; border-radius: 0px;
border: none;
height: 30px;
text-align: center;
padding: 4px; padding: 4px;
color: hsl(0, 0%, 80%); color: hsl(0, 0%, 80%);
font-size: 18px; font-size: 18px;
box-shadow: none; box-shadow: none;
text-shadow: none; text-shadow: none;
z-index: 5; z-index: 5;
float: right;
} }
.search_button:hover { .search_button:hover {
@@ -1677,8 +1701,6 @@ div.focused_table {
#search_arrows { #search_arrows {
font-size: 90%; font-size: 90%;
letter-spacing: normal; letter-spacing: normal;
border: none;
background-color: inherit;
} }
@media (min-width: 500px) { @media (min-width: 500px) {