2017-10-23 22:07:05 +02:00
|
|
|
<div class="row row--wide nav-bar">
|
2017-10-25 01:09:04 +02:00
|
|
|
<div class="row row--padded row--short flex-container flex-container--row flex-container--align-center">
|
2017-10-25 07:04:23 +02:00
|
|
|
<svg version="1.1" id="Layer_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px" height="24px" viewBox="0 0 80 31" enable-background="new 0 0 80 31" xml:space="preserve" class="nav-bar-logo">
|
|
|
|
|
<a href="/">
|
|
|
|
|
<title>Logo</title>
|
|
|
|
|
<desc>Spee.ch logo</desc>
|
|
|
|
|
<g id="About">
|
|
|
|
|
<g id="Publish-Form-V2-_x28_filled_x29_" transform="translate(-42.000000, -23.000000)">
|
|
|
|
|
<g id="Group-17" transform="translate(42.000000, 22.000000)">
|
|
|
|
|
<text transform="matrix(1 0 0 1 0 20)" font-size="27">Spee<h</text>
|
|
|
|
|
<g id="Group-16" transform="translate(0.000000, 30.000000)">
|
|
|
|
|
<path id="Line-8" fill="none" stroke="#09F911" stroke-linecap="square" d="M0.5,1.5h15"/>
|
|
|
|
|
<path id="Line-8-Copy" fill="none" stroke="#029D74" stroke-linecap="square" d="M16.5,1.5h15"/>
|
|
|
|
|
<path id="Line-8-Copy-2" fill="none" stroke="#E35BD8" stroke-linecap="square" d="M32.5,1.5h15"/>
|
|
|
|
|
<path id="Line-8-Copy-3" fill="none" stroke="#4156C5" stroke-linecap="square" d="M48.5,1.5h15"/>
|
|
|
|
|
<path id="Line-8-Copy-4" fill="none" stroke="#635688" stroke-linecap="square" d="M64.5,1.5h15"/>
|
|
|
|
|
</g>
|
|
|
|
|
</g>
|
|
|
|
|
</g>
|
|
|
|
|
</g>
|
|
|
|
|
</a>
|
|
|
|
|
</svg>
|
2017-10-25 01:09:04 +02:00
|
|
|
<div class="nav-bar--center">
|
|
|
|
|
<span class="nav-bar-tagline">Open-source, decentralized image and video sharing.</span>
|
|
|
|
|
</div>
|
|
|
|
|
<div class="nav-bar--right">
|
2017-10-18 22:54:42 +02:00
|
|
|
<a class="nav-bar-link" href="/">Upload</a>
|
2017-09-29 23:11:00 +02:00
|
|
|
<a class="nav-bar-link" href="/popular">Popular</a>
|
|
|
|
|
<a class="nav-bar-link" href="/about">About</a>
|
2017-10-25 00:34:05 +02:00
|
|
|
<select type="text" id="nav-bar-channel-select" class="select select--arrow nav-bar-link" onchange="toggleNavBarSelection(event.target.selectedOptions[0].value)" {{#unless user}}style="display:none"{{/unless}}>
|
2017-10-11 01:51:07 +02:00
|
|
|
<option id="nav-bar-channel-select-channel-option">@{{user.userName}}</option>
|
|
|
|
|
<option value="VIEW">View</option>
|
|
|
|
|
<option value="LOGOUT">Logout</option>
|
|
|
|
|
</select>
|
2017-10-25 07:04:23 +02:00
|
|
|
<a id="nav-bar-login-link" class="nav-bar-link nav-bar-link--last" href="/login" {{#if user}}style="display:none"{{/if}}>Channel</a>
|
2017-09-29 21:40:02 +02:00
|
|
|
</div>
|
2017-09-29 20:59:53 +02:00
|
|
|
</div>
|
2017-10-11 03:05:47 +02:00
|
|
|
</div>
|
|
|
|
|
|
|
|
|
|
<script type="text/javascript">
|
|
|
|
|
// highlight the link for the current page
|
|
|
|
|
const navBarLinks = document.getElementsByClassName('nav-bar-link');
|
|
|
|
|
for (let i = 0; i < navBarLinks.length; i++){
|
|
|
|
|
const link = navBarLinks[i];
|
|
|
|
|
if (link.href == window.location.href) {
|
|
|
|
|
link.setAttribute('class', 'nav-bar-link nav-bar-link--active');
|
|
|
|
|
} else if (`/${link.value}` === window.location.pathname) {
|
|
|
|
|
link.setAttribute('class', 'select select--no-arrow nav-bar-link nav-bar-link--active');
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
</script>
|
