Mirror
/
zulip
mirror of https://github.com/zulip/zulip.git
1
0
Fork 0
Code Issues Projects Releases Wiki Activity
zulip/web/templates/navbar.hbs

64 lines
3.6 KiB
Handlebars
Raw Normal View History

Switch to fixed sidebar layout and remove bootstrap layout hooks. (imported from commit 060340a2febb7b8df6477a3419e7588a8503e377)
2013-08-13 12:52:26 +02:00
<div class="header">
navbar: Remove top_navbar_full_width now that scrollbar is on html.
2023-06-01 21:11:37 +02:00
<nav class="header-main" id="top_navbar">
<div class="column-left">
<a href="" class="brand no-style">
<img id="realm-logo" src="" alt="" class="nav-logo no-drag"/>
</a>
</div>
<div class="column-middle" id="navbar-middle">
<div class="column-middle-inner">
<div id="streamlist-toggle" class="tippy-zulip-delayed-tooltip {{#if embedded}}hide-streamlist-toggle-visibility{{/if}}" data-tooltip-template-id="streamlist-toggle-tooltip-template">
<a id="streamlist-toggle-button" role="button" tabindex="0"><i class="fa fa-reorder" aria-hidden="true"></i>
<span id="streamlist-toggle-unreadcount">0</span>
</a>
search: Duplicate HTML template content for search area. This is preparation for being able to work on the search pills feature without making any user-facing changes until we're ready to enable it.
2018-07-14 11:39:33 +02:00
</div>
search: Redesign search box. Fixes #21798.
2022-05-16 19:24:49 +02:00
<div class="top-navbar-container">
navbar: Remove top_navbar_full_width now that scrollbar is on html.
2023-06-01 21:11:37 +02:00
<div id="message_view_header" class="notdisplayed">
navbar: Widen navbar to fill the full screen on large screens. Now that the navbar is a different color, we want it to also take up the full width of the screen. Because the navbar has margin, this commit adds a new div. To not have to add a new div, the scrollbar would need to be moved to the `html` element, which is a bigger project. This commit also moves the zulip logo to be left-justified instead of centered, since it looks strange centered with the full width navbar.
2023-03-25 22:23:04 +01:00
</div>
navbar: Remove top_navbar_full_width now that scrollbar is on html.
2023-06-01 21:11:37 +02:00
<div id="searchbox">
<form id="searchbox_form" class="navbar-search">
search: Rename search_arrows to searchbox_container. The terminology "arrows" comes from historical functionality that is no longer relevant, so searchbox_container is a more clear and accurate name. It would be nice in the future to see if we can remove some of the nesting of HTML (#searchbox, #searchbox_form, and #searchbox_container).
2023-07-18 18:06:24 +02:00
<div id="searchbox-input-container" class="input-append">
search: Redesign search box. Fixes #21798.
2022-05-16 19:24:49 +02:00
<i class="search_icon zulip-icon zulip-icon-search"></i>
search: Rename class to search-input to avoid bootstrap. The class `search-query` is a bootstrap classname, and using a name unique from that both lets us rely on bootstrap less and also not have to override some boostrap styles.
2023-06-17 07:00:32 +02:00
<input class="search-input input-block-level home-page-input" id="search_query" type="text" placeholder="{{t 'Search' }}"
navbar: Remove top_navbar_full_width now that scrollbar is on html.
2023-06-01 21:11:37 +02:00
autocomplete="off"/>
search: Redesign search box. Fixes #21798.
2022-05-16 19:24:49 +02:00
<button class="search_close_button tippy-zulip-delayed-tooltip" type="button" id="search_exit" aria-label="{{t 'Exit search' }}" data-tippy-content="Close"><i class="zulip-icon zulip-icon-close" aria-hidden="true"></i></button>
navbar: Remove top_navbar_full_width now that scrollbar is on html.
2023-06-01 21:11:37 +02:00
</div>
</form>
navbar: Widen navbar to fill the full screen on large screens. Now that the navbar is a different color, we want it to also take up the full width of the screen. Because the navbar has margin, this commit adds a new div. To not have to add a new div, the scrollbar would need to be moved to the `html` element, which is a bigger project. This commit also moves the zulip logo to be left-justified instead of centered, since it looks strange centered with the full width navbar.
2023-03-25 22:23:04 +01:00
</div>
navbar: Add login and signup buttons for spectators. Remove login buttons from right sidebar and add them to navbar so that the user instantly notices them.
2022-10-14 19:52:42 +02:00
</div>
navbar: Remove top_navbar_full_width now that scrollbar is on html.
2023-06-01 21:11:37 +02:00
</div>
</div>
<div class="column-right">
<div class="only-visible-for-spectators">
<div class="spectator_login_buttons hide-xl">
<a href="/register/" class="signup_button">
<span>{{t 'Sign up' }}</span>
</a>
<div class="divider">|</div>
<a class="login_button">
<span>{{t 'Log in' }}</span>
navbar: Add login and signup buttons for spectators. Remove login buttons from right sidebar and add them to navbar so that the user instantly notices them.
2022-10-14 19:52:42 +02:00
</a>
</div>
navbar: Remove top_navbar_full_width now that scrollbar is on html.
2023-06-01 21:11:37 +02:00
<div class="spectator_narrow_login_button hide show-xl" data-tippy-content="{{t 'Log in' }}" data-tippy-placement="bottom">
navbar: Add user avatar icon for personal_menu dropdown. This commit adds user avatar icon in navbar. This new avatar icon will be used as dropdown toggle button. Made `.column-right` a flex, every element in right-side navbar is in this div now rather than all elements positioned absolutely with hardcoded values like before. Fixed some CSS as per new flex layout if `.column-right`. Fixes part of #22802
2023-07-17 17:26:24 +02:00
<a class="header-button login_button">
navbar: Remove top_navbar_full_width now that scrollbar is on html.
2023-06-01 21:11:37 +02:00
<i class="fa fa-sign-in"></i>
</a>
navbar: Widen navbar to fill the full screen on large screens. Now that the navbar is a different color, we want it to also take up the full width of the screen. Because the navbar has margin, this commit adds a new div. To not have to add a new div, the scrollbar would need to be moved to the `html` element, which is a bigger project. This commit also moves the zulip logo to be left-justified instead of centered, since it looks strange centered with the full width navbar.
2023-03-25 22:23:04 +01:00
</div>
navbar: Add login and signup buttons for spectators. Remove login buttons from right sidebar and add them to navbar so that the user instantly notices them.
2022-10-14 19:52:42 +02:00
</div>
navbar: Remove top_navbar_full_width now that scrollbar is on html.
2023-06-01 21:11:37 +02:00
<div id="userlist-toggle" class="hidden-for-spectators tippy-zulip-delayed-tooltip" data-tooltip-template-id="userlist-tooltip-template">
navbar: Add user avatar icon for personal_menu dropdown. This commit adds user avatar icon in navbar. This new avatar icon will be used as dropdown toggle button. Made `.column-right` a flex, every element in right-side navbar is in this div now rather than all elements positioned absolutely with hardcoded values like before. Fixed some CSS as per new flex layout if `.column-right`. Fixes part of #22802
2023-07-17 17:26:24 +02:00
<a id="userlist-toggle-button" role="button" class="header-button" tabindex="0"><i class="fa fa-group" aria-hidden="true"></i>
navbar: Remove top_navbar_full_width now that scrollbar is on html.
2023-06-01 21:11:37 +02:00
<span id="userlist-toggle-unreadcount">0</span>
</a>
</div>
navbar: Add user avatar icon for personal_menu dropdown. This commit adds user avatar icon in navbar. This new avatar icon will be used as dropdown toggle button. Made `.column-right` a flex, every element in right-side navbar is in this div now rather than all elements positioned absolutely with hardcoded values like before. Fixed some CSS as per new flex layout if `.column-right`. Fixes part of #22802
2023-07-17 17:26:24 +02:00
<div id="navbar-buttons" class="no-auto-hide-sidebar-overlays header-button" {{#if embedded}}class="hide-navbar-buttons-visibility"{{/if}}>
</div>
<div id="personal-menu" class="hidden-for-spectators">
<a class="header-button tippy-zulip-delayed-tooltip" tabindex="0" role="button" data-tippy-content="{{t 'Personal menu' }}">
<img class="header-button-avatar" src="{{user_avatar}}"/>
</a>
personal_menu: Add tippy personal_menu dropdown. Add a personal menu dropdown that opens on clicking user avatar icon in navbar added in previous commit. The args passed to render_personal_menu() in onShow() are returned by get_personal_menu_content_context() in popover_menus_data.js so that they can be unit tested. Additionally, added CSS to get a custom arrow for dropdown menu. Added a `?` hotkey in keyboard shortcuts option in personal_menu dropdown in a style similar to our tooltip's hotkey by adding ? in a span with class .tooltip-hotkey-hint and adding some CSS. Fixes part of #22802.
2023-07-17 18:01:16 +02:00
<span tabindex="0" class="focus-dropdown"></span>
navbar: Remove top_navbar_full_width now that scrollbar is on html.
2023-06-01 21:11:37 +02:00
</div>
</div>
</nav>
Switch to fixed sidebar layout and remove bootstrap layout hooks. (imported from commit 060340a2febb7b8df6477a3419e7588a8503e377)
2013-08-13 12:52:26 +02:00
</div>