2
0
mirror of https://github.com/offen/website.git synced 2024-10-18 12:10:25 +02:00

menu basic

This commit is contained in:
Hendrik Niefeld 2019-12-23 07:23:47 +01:00
parent f6c6e75a41
commit 0015bca088
2 changed files with 20 additions and 19 deletions

View File

@ -38,7 +38,7 @@ LAYOUT
----------------------------------------------------*/
.menu {
width: 100%;
height: 64px; /* mt5 */
height: 4rem; /* mt5 */
position: fixed;
z-index: 1;
top: 0;
@ -84,13 +84,13 @@ MENU
margin: 0 10px 40px 0;
}
.nav-bar {
height: 70px;
height: 4rem;
}
.icon {
position: absolute;
padding: 12px 0 0 20px;
float: left;
line-height: 70px;
line-height: 4rem;
}
body.index .icon {
opacity: 0;
@ -114,15 +114,15 @@ nav ul li a,
nav ul li a:visited {
display: block;
padding: 0 20px;
line-height: 70px;
line-height: 4rem;
text-decoration: none;
font-weight: 700;
background: $yellow-mid;
color: $black-mid;
background: #F7BF08;
color: #39352A;
}
nav ul li a:hover,
nav ul li a:visited:hover {
color: $black-mid;
color: #39352A;
}
nav ul li a:not(:only-child):after,
nav ul li a:visited:not(:only-child):after {
@ -146,9 +146,9 @@ nav ul li ul li a {
position: absolute;
top: 0;
right: 0;
background: $yellow-mid;
height: 70px;
width: 70px;
background: #F7BF08;
height: 4rem;
width: 4rem;
}
/* Mobile Styles */
@media only screen and (max-width: 960px) {
@ -160,7 +160,8 @@ nav ul li ul li a {
}
nav {
width: 100%;
padding: 70px 0 15px;
padding: 0 0 15px 0;
padding-top: 4rem;
}
nav ul {
display: none;
@ -206,7 +207,7 @@ nav ul li ul li a {
border-radius: 1px;
height: 2px;
width: 25px;
background: $black-mid;
background: #39352A;
position: absolute;
display: block;
content: '';

View File

@ -38,28 +38,28 @@
<section class="nav-bar">
<div class="nav-container">
<div class="icon">
<a href="/"><img src="/theme/images/offen-icon-white.svg" alt="Offen logo" width="42" height="46" class="logo"></a>
<a href="/"><img src="/theme/images/offen-icon-white.svg" alt="Offen logo" width="37" height="40" class="logo"></a>
</div>
<nav>
<div class="nav-mobile"><span id="nav-toggle"><span></span></span></div>
<ul class="nav-list">
<li>
<a href="/">Summary</a>
<a class="b link dim fnt-cclr-mid-black" href="/">Summary</a>
</li>
<li>
<a href="/deep-dive/">Deep dive</a>
<a class="b link dim fnt-cclr-mid-black" href="/deep-dive/">Deep dive</a>
</li>
<li>
<a href="/blog/">Status</a>
<a class="b link dim fnt-cclr-mid-black" href="/blog/">Status</a>
</li>
<li>
<a href="/about/">About</a>
<a class="b link dim fnt-cclr-mid-black" href="/about/">About</a>
</li>
<li>
<a href="{{ GITHUB_ORG }}" rel="noopener" target="_blank">GitHub</a>
<a class="b link dim fnt-cclr-mid-black" href="{{ GITHUB_ORG }}" rel="noopener" target="_blank">GitHub</a>
</li>
<li>
<a href="{{ PATREON_URL }}" rel="noopener" target="_blank">Patreon</a>
<a class="b link dim fnt-cclr-mid-black" href="{{ PATREON_URL }}" rel="noopener" target="_blank">Patreon</a>
</li>
</ul>
</nav>