broke top bar into two sections
This commit is contained in:
parent
3d4e31f2e1
commit
08e3680969
2 changed files with 47 additions and 16 deletions
|
@ -157,8 +157,31 @@ footer {
|
|||
|
||||
/* TOP BAR */
|
||||
|
||||
/* blocks */
|
||||
.nav-bar {
|
||||
|
||||
}
|
||||
|
||||
.nav-bar-title-section, .nav-bar-link-section {
|
||||
padding: 0px 1em 0px 1em;
|
||||
}
|
||||
|
||||
.nav-bar-title-section {
|
||||
overflow: hidden;
|
||||
border-bottom: 2px solid #eaeaea;
|
||||
position: relative;
|
||||
z-index: 2;
|
||||
}
|
||||
|
||||
.nav-bar-link-section {
|
||||
position: absolute;
|
||||
bottom: 0px;
|
||||
right: 0px;
|
||||
}
|
||||
|
||||
/* elements */
|
||||
.nav-bar-title, .nav-bar-link {
|
||||
padding: 1.5rem 0.5rem 1.5rem 0.5rem;
|
||||
}
|
||||
|
||||
.nav-bar-logo, .nav-bar-title, .nav-bar-link {
|
||||
|
@ -176,8 +199,14 @@ footer {
|
|||
}
|
||||
|
||||
.nav-bar-link {
|
||||
padding: 1em 0.5em 1em 0.5em;
|
||||
border-bottom: 1px solid #eaeaea;
|
||||
}
|
||||
.nav-bar-link:hover {
|
||||
background-color: yellow;
|
||||
border-bottom: 1px solid blue;
|
||||
}
|
||||
|
||||
|
||||
|
||||
/* LINKS */
|
||||
|
||||
|
|
|
@ -1,20 +1,22 @@
|
|||
<div class="row nav-bar">
|
||||
<div class="column column--3 align-content-left">
|
||||
<div class="row-wide nav-bar">
|
||||
<div class="nav-bar-title-section">
|
||||
<a href="/"><span class="nav-bar-title">Spee.ch</span></a><span class="nav-bar-title nav-bar-title--superscript">(beta)</span>
|
||||
</div><div class="column column--7 align-content-right">
|
||||
<a class="nav-bar-link" href="/popular">popular</a>
|
||||
<a class="nav-bar-link" href="https://github.com/lbryio/spee.ch" target="_blank">source</a>
|
||||
<a class="nav-bar-link" href="/about">about</a>
|
||||
{{#if user}}
|
||||
<select type="text" class="select nav-bar-link" onchange="toggleLogin(event)">
|
||||
<option value="none">@{{user.userName}}</option>
|
||||
<option value="view">view</option>
|
||||
<option value="logout">logout</option>
|
||||
</select>
|
||||
{{else}}
|
||||
<a class="nav-bar-link" href="/login">login</a>
|
||||
{{/if}}
|
||||
<div class="nav-bar-link-section">
|
||||
<a class="nav-bar-link" href="https://github.com/lbryio/spee.ch" target="_blank">source</a>
|
||||
<a class="nav-bar-link" href="/about">about</a>
|
||||
{{#if user}}
|
||||
<select type="text" class="select nav-bar-link" onchange="toggleLogin(event)">
|
||||
<option value="none">@{{user.userName}}</option>
|
||||
<option value="view">view</option>
|
||||
<option value="logout">logout</option>
|
||||
</select>
|
||||
{{else}}
|
||||
<a class="nav-bar-link" href="/login">login</a>
|
||||
{{/if}}
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
</div>
|
||||
|
||||
<script type="text/javascript">
|
||||
|
|
Loading…
Reference in a new issue