LemmyNet/lemmy
2
0
Fork 0
mirror of https://github.com/LemmyNet/lemmy.git synced 2024-11-30 00:01:25 +00:00
Code Issues Projects Releases Packages Wiki Activity Actions

Some navbar fixes.

Browse source
This commit is contained in:
Dessalines 2020-07-04 11:35:38 -04:00
parent fa0b0b68ca
commit de63ff6d2a
1 changed files with 47 additions and 43 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

90
ui/src/components/navbar.tsx vendored
View file

@ -12,7 +12,6 @@ import {
GetPrivateMessagesForm, GetPrivateMessagesForm,
PrivateMessagesResponse, PrivateMessagesResponse,
SortType, SortType,
SearchType,
GetSiteResponse, GetSiteResponse,
Comment, Comment,
CommentResponse, CommentResponse,
@ -20,7 +19,6 @@ import {
UserView, UserView,
PrivateMessageResponse, PrivateMessageResponse,
WebSocketJsonResponse, WebSocketJsonResponse,
SearchForm,
} from '../interfaces'; } from '../interfaces';
import { import {
wsJsonToRes, wsJsonToRes,
@ -183,7 +181,7 @@ export class Navbar extends Component<any, NavbarState> {
<div <div
className={`${!this.state.expanded && 'collapse'} navbar-collapse`} className={`${!this.state.expanded && 'collapse'} navbar-collapse`}
> >
<ul class="navbar-nav mr-auto"> <ul class="navbar-nav my-2 mr-auto">
<li class="nav-item"> <li class="nav-item">
<Link <Link
class="nav-link" class="nav-link"
@ -229,34 +227,32 @@ export class Navbar extends Component<any, NavbarState> {
{!this.context.router.history.location.pathname.match( {!this.context.router.history.location.pathname.match(
/^\/search/ /^\/search/
) && ( ) && (
<div class="nav-item my-2"> <form
<form class="form-inline"
class="form-inline" onSubmit={linkEvent(this, this.handleSearchSubmit)}
onSubmit={linkEvent(this, this.handleSearchSubmit)} >
<input
class={`form-control mr-0 search-input ${
this.state.toggleSearch ? 'show-input' : 'hide-input'
}`}
onInput={linkEvent(this, this.handleSearchParam)}
value={this.state.searchParam}
ref={this.searchTextField}
type="text"
placeholder={i18n.t('search')}
onBlur={linkEvent(this, this.handleSearchBlur)}
></input>
<button
name="search-btn"
onClick={linkEvent(this, this.handleSearchBtn)}
class="btn btn-link"
style="color: var(--gray)"
> >
<input <svg class="icon">
class={`form-control mr-0 search-input ${ <use xlinkHref="#icon-search"></use>
this.state.toggleSearch ? 'show-input' : 'hide-input' </svg>
}`} </button>
onInput={linkEvent(this, this.handleSearchParam)} </form>
value={this.state.searchParam}
ref={this.searchTextField}
type="text"
placeholder={i18n.t('search')}
onBlur={linkEvent(this, this.handleSearchBlur)}
></input>
<button
name="search-btn"
onClick={linkEvent(this, this.handleSearchBtn)}
class="btn btn-link"
style="color: var(--gray)"
>
<svg class="icon">
<use xlinkHref="#icon-search"></use>
</svg>
</button>
</form>
</div>
)} )}
<ul class="navbar-nav my-2"> <ul class="navbar-nav my-2">
{this.canAdmin && ( {this.canAdmin && (
@ -272,8 +268,10 @@ export class Navbar extends Component<any, NavbarState> {
</Link> </Link>
</li> </li>
)} )}
{this.state.isLoggedIn ? ( </ul>
<> {this.state.isLoggedIn ? (
<>
<ul class="navbar-nav my-2">
<li className="nav-item"> <li className="nav-item">
<Link class="nav-link" to="/inbox" title={i18n.t('inbox')}> <Link class="nav-link" to="/inbox" title={i18n.t('inbox')}>
<svg class="icon"> <svg class="icon">
@ -286,6 +284,8 @@ export class Navbar extends Component<any, NavbarState> {
)} )}
</Link> </Link>
</li> </li>
</ul>
<ul class="navbar-nav">
<li className="nav-item"> <li className="nav-item">
<Link <Link
class="nav-link" class="nav-link"
@ -307,17 +307,21 @@ export class Navbar extends Component<any, NavbarState> {
</span> </span>
</Link> </Link>
</li> </li>
</> </ul>
) : ( </>
<Link ) : (
class="nav-link" <ul class="navbar-nav my-2">
to="/login" <li className="nav-item">
title={i18n.t('login_sign_up')} <Link
> class="nav-link"
{i18n.t('login_sign_up')} to="/login"
</Link> title={i18n.t('login_sign_up')}
)} >
</ul> {i18n.t('login_sign_up')}
</Link>
</li>
</ul>
)}
</div> </div>
</nav> </nav>
); );