zoriya/RaccoonWebsite
1
0
Fork 0
mirror of https://github.com/zoriya/RaccoonWebsite.git synced 2025-12-05 23:46:09 +00:00
Code Issues Packages Projects Releases Wiki Activity

Making the toolbar using absolute positions.

Browse Source
This commit is contained in:
Tristan Roux
2019-01-12 22:11:05 +01:00
parent c7cf4a9f8c
commit fffea87f45
1 changed files with 19 additions and 21 deletions
Download Patch File Download Diff File Expand all files Collapse all files

40
fragments/navBar.html
View File

@@ -1,25 +1,23 @@
<nav class="navbar sticky-top navbar-expand-md navbar-dark bg-primary" >
<button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#content">
<nav class="navbar sticky-top navbar-expand-s navbar-dark bg-primary" >
<button class="navbar-toggler" type="button" data-toggle="collapse" data-target=".nav-content">
<span class="navbar-toggler-icon"></span>
</button>
<div class="collapse navbar-collapse justify-content-center" id="content">
<ul class="navbar-nav">
<li class="navbar-item active">
<a href="\" class="nav-link">MusicApp</a>
</li>
<li class="navbar-item">
<a href="magical-garden" class="nav-link">Magical Garden</a>
</li>
<li class="navbar-item active" style="overflow: auto; width: 40px;">
<img src="drawables\raccoon.svg" />
</li>
<li class="navbar-item">
<a href="switching-personalities" class="nav-link">Switching Personalities</a>
</li>
<li class="navbar-item">
<a href="other" class="nav-link">Other</a>
</li>
</ul>
</div>
<img width="40px" src="drawables\raccoon.svg" style="left: 0; right: 0; top: 0; bottom: 0; margin: auto;"/>
<ul class="navbar-nav nav-content" style="position: absolute; right: 50%;">
<li class="navbar-item active">
<a href="\" class="nav-link" style="text-align: center;">MusicApp</a>
</li>
<li class="navbar-item" style="margin-right: 50px">
<a href="magical-garden" class="nav-link" style="text-align: center;">Magical Garden</a>
</li>
</ul>
<ul class="navbar-nav nav-content" style="position: absolute; left: 50%;">
<li class="navbar-item" style="margin-left: 50px">
<a href="switching-personalities" class="nav-link" style="text-align: center;">Switching Personalities</a>
</li>
<li class="navbar-item">
<a href="other" class="nav-link" style="text-align: center;">Other</a>
</li>
</ul>
</nav>