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

Adding a search icon, and a faster transition.

Browse source
This commit is contained in:
Dessalines 2020-07-03 22:00:51 -04:00
parent b1b755713e
commit 69df9cecca
3 changed files with 17 additions and 16 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

4
ui/assets/css/main.css vendored
View file

@ -252,7 +252,7 @@ pre {
.form-control.search-input {
float: right !important;
transition: width 0.5s ease-out 0s !important;
transition: width 0.2s ease-out 0s !important;
}
.show-input {
@ -263,4 +263,4 @@ pre {
background: transparent !important;
width: 0px !important;
padding: 0 !important;
}
}

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

@ -245,21 +245,22 @@ export class Navbar extends Component<any, NavbarState> {
placeholder={i18n.t('search')}
onBlur={linkEvent(this, this.handleSearchBlur)}
></input>
<div class="mx-sm-2">
<button
name="search-btn"
onClick={linkEvent(this, this.handleSearchBtn)}
class="btn btn-secondary"
>
{i18n.t('search')}
</button>
</div>
<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 ml-2">
<ul class="navbar-nav my-2">
{this.canAdmin && (
<li className="nav-item mt-1">
<li className="nav-item">
<Link
class="nav-link"
to={`/admin`}
@ -273,7 +274,7 @@ export class Navbar extends Component<any, NavbarState> {
)}
{this.state.isLoggedIn ? (
<>
<li className="nav-item mt-1">
<li className="nav-item">
<Link class="nav-link" to="/inbox" title={i18n.t('inbox')}>
<svg class="icon">
<use xlinkHref="#icon-bell"></use>

4
ui/src/components/symbols.tsx vendored
View file

@ -159,8 +159,8 @@ export class Symbols extends Component<any, any> {
/>
</g>
</symbol>
<symbol id="icon-search" viewBox="0 0 32 32">
<path d="M31.008 27.231l-7.58-6.447c-0.784-0.705-1.622-1.029-2.299-0.998 1.789-2.096 2.87-4.815 2.87-7.787 0-6.627-5.373-12-12-12s-12 5.373-12 12 5.373 12 12 12c2.972 0 5.691-1.081 7.787-2.87-0.031 0.677 0.293 1.515 0.998 2.299l6.447 7.58c1.104 1.226 2.907 1.33 4.007 0.23s0.997-2.903-0.23-4.007zM12 20c-4.418 0-8-3.582-8-8s3.582-8 8-8 8 3.582 8 8-3.582 8-8 8z"></path>
<symbol id="icon-search" viewBox="0 0 24 24">
<path d="M16.041 15.856c-0.034 0.026-0.067 0.055-0.099 0.087s-0.060 0.064-0.087 0.099c-1.258 1.213-2.969 1.958-4.855 1.958-1.933 0-3.682-0.782-4.95-2.050s-2.050-3.017-2.050-4.95 0.782-3.682 2.050-4.95 3.017-2.050 4.95-2.050 3.682 0.782 4.95 2.050 2.050 3.017 2.050 4.95c0 1.886-0.745 3.597-1.959 4.856zM21.707 20.293l-3.675-3.675c1.231-1.54 1.968-3.493 1.968-5.618 0-2.485-1.008-4.736-2.636-6.364s-3.879-2.636-6.364-2.636-4.736 1.008-6.364 2.636-2.636 3.879-2.636 6.364 1.008 4.736 2.636 6.364 3.879 2.636 6.364 2.636c2.125 0 4.078-0.737 5.618-1.968l3.675 3.675c0.391 0.391 1.024 0.391 1.414 0s0.391-1.024 0-1.414z"></path>
</symbol>
<symbol id="icon-github" viewBox="0 0 32 32">
<path d="M16 0.395c-8.836 0-16 7.163-16 16 0 7.069 4.585 13.067 10.942 15.182 0.8 0.148 1.094-0.347 1.094-0.77 0-0.381-0.015-1.642-0.022-2.979-4.452 0.968-5.391-1.888-5.391-1.888-0.728-1.849-1.776-2.341-1.776-2.341-1.452-0.993 0.11-0.973 0.11-0.973 1.606 0.113 2.452 1.649 2.452 1.649 1.427 2.446 3.743 1.739 4.656 1.33 0.143-1.034 0.558-1.74 1.016-2.14-3.554-0.404-7.29-1.777-7.29-7.907 0-1.747 0.625-3.174 1.649-4.295-0.166-0.403-0.714-2.030 0.155-4.234 0 0 1.344-0.43 4.401 1.64 1.276-0.355 2.645-0.532 4.005-0.539 1.359 0.006 2.729 0.184 4.008 0.539 3.054-2.070 4.395-1.64 4.395-1.64 0.871 2.204 0.323 3.831 0.157 4.234 1.026 1.12 1.647 2.548 1.647 4.295 0 6.145-3.743 7.498-7.306 7.895 0.574 0.497 1.085 1.47 1.085 2.963 0 2.141-0.019 3.864-0.019 4.391 0 0.426 0.288 0.925 1.099 0.768 6.354-2.118 10.933-8.113 10.933-15.18 0-8.837-7.164-16-16-16z"></path>