* Works, but lots of cleanup/questions. * Fixed comment. * Only want the search script to load once with InstantClick active. * Removed unnecessary DOMContentLoaded from copy paste. * 🔧 Enabled (P)React Devtools. * Updated comment about reactToEvent. * Removed unnecessary server-side generated JS for search. * <Search /> component now has component state. * Search functions are in there own module now. * 👷Refactor * Render propped it up. * Fixed issue with encoding of search term. * Removed data-no-instant attr from script. * 👷Refactor * Now flash of search loading is avoided.. * Moved search under components folder. * ✅Tests * fixedEncodeURIComponent does not need to be exported. * ✅Tests * Folders to ignore from the VS Code Local History extension. * ✅Tests * Snapshot test for <Search /> component. * ✅Tests * Now the <SearchContainer /> handles the '/' key shortcut. * Made the search box ID a prop defaulting to 'nav-search' * Excluded barrel files from code coverage. * Componentized search CSS. * Storybook stories for <Search /> component. * Removed extension folders to ignore. * Fixed logic for "/" key triggering search. * updated jest snapshot for <Search /> component. * updated package.json lock file. * Disabled the import/prefer-default-export rule. * Now search term clears if not on a non-search results page. * removed comment that is no longer valid. * No longer using render prop for Search. Doesn't make sense as it's not stuff that is reused. * Added preact-render-spy do dev deps.
35 lines
1.6 KiB
Text
35 lines
1.6 KiB
Text
<div class="navigation-progress" id="navigation-progress">
|
|
</div>
|
|
<div class="top-bar" id="top-bar">
|
|
<nav>
|
|
<a href="/" class="logo-link" id="logo-link" aria-label="DEV Home"><%= inline_svg("devplain.svg", class: "logo", size: '20% * 20%') %></a>
|
|
<div id="nav-search-form-root">
|
|
<div class="nav-search-form">
|
|
<form acceptCharset="UTF-8" method="get">
|
|
<input class="nav-search-form__input" type="text" name="q" id="nav-search" placeholder="search" autoComplete="off" />
|
|
</form>
|
|
</div>
|
|
</div>
|
|
<a href="/new" id="write-link" class="cta nav-link write">WRITE A POST</a>
|
|
<a href="/connect" id="connect-link" class="nav-link connect-icon" aria-label="Connect">
|
|
<%=inline_svg("connect.svg", size: '100% * 100%')%>
|
|
<div class="connect-number" id="connect-number"></div>
|
|
</a>
|
|
<a href="/notifications" id="notifications-link" class="nav-link notifications-icon" aria-label="Notifications">
|
|
<%=inline_svg("bell.svg", size: '100% * 100%')%>
|
|
<div class="notifications-number" id="notifications-number"></div>
|
|
</a>
|
|
<div class="navbar-menu-wrapper" id="navbar-menu-wrapper">
|
|
<button class="navigation-butt" id="navigation-butt" aria-label="Navigation">
|
|
<% if user_signed_in? %>
|
|
<div class="nav-profile-image-wrapper"><img class="nav-profile-image" id="nav-profile-image"/>
|
|
<% else %>
|
|
<%= inline_svg("menu.svg", class: "bars", size: '20% * 20%') %>
|
|
<% end %>
|
|
</button>
|
|
<div class="menubg" id="menubg"></div>
|
|
<%= render "layouts/nav_menu" %>
|
|
</div>
|
|
</a>
|
|
</nav>
|
|
</div>
|