Update nav menu css
This commit is contained in:
parent
744819c90d
commit
6ad4e164af
10 changed files with 59 additions and 69 deletions
|
@ -74,14 +74,6 @@
|
|||
--br_violet: #825dc0;
|
||||
}
|
||||
|
||||
#themes {
|
||||
background-color: var(--bg-0);
|
||||
border: none;
|
||||
color: var(--fg-1);
|
||||
font-size: 0.9em;
|
||||
padding: 14px 16px;
|
||||
}
|
||||
|
||||
* {
|
||||
box-sizing: border-box;
|
||||
}
|
||||
|
@ -138,13 +130,6 @@ ul li {
|
|||
h1, h2, h3, h4, h5 {
|
||||
font-family: open, serif;
|
||||
}
|
||||
@media only screen and (min-width: 60rem) {
|
||||
body {
|
||||
max-width:60rem;
|
||||
margin-left: auto;
|
||||
margin-right: auto;
|
||||
}
|
||||
}
|
||||
.fullwidth {
|
||||
width: 100%;
|
||||
}
|
||||
|
@ -159,12 +144,10 @@ a {
|
|||
a:visited {
|
||||
color: var(--orange);
|
||||
}
|
||||
a:hover {
|
||||
color: var(--red);
|
||||
}
|
||||
h1,
|
||||
body header nav ul li a,
|
||||
body header nav ul li a:visited {
|
||||
body header nav ul li a:visited,
|
||||
a:hover {
|
||||
color: var(--red);
|
||||
}
|
||||
h2, h3, h4, h5, h6 {
|
||||
|
|
|
@ -1,40 +1,47 @@
|
|||
header {
|
||||
background-color: var(--bg-0);
|
||||
}
|
||||
header nav ul {
|
||||
header nav {
|
||||
align-items: center;
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
justify-content: space-between;
|
||||
}
|
||||
header nav ol {
|
||||
list-style-type: none;
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
overflow: hidden;
|
||||
font-size: 1.25rem;
|
||||
}
|
||||
header nav ul li {
|
||||
display: inline;
|
||||
float: right;
|
||||
margin-bottom: 0;
|
||||
}
|
||||
header nav ul li a {
|
||||
header nav ol li a {
|
||||
display: block;
|
||||
font-size: 1.25rem;
|
||||
padding: 4px 16px 14px 16px;
|
||||
text-align: center;
|
||||
padding: 14px 16px;
|
||||
text-decoration: none;
|
||||
}
|
||||
header nav ul li a:hover {
|
||||
header nav ol li a:hover {
|
||||
background-color: var(--bg-1);
|
||||
}
|
||||
#nav-menu {
|
||||
align-items: baseline;
|
||||
display: flex;
|
||||
flex-wrap: nowrap;
|
||||
}
|
||||
#nav-menu li {
|
||||
flex-direction: column;
|
||||
}
|
||||
.nav-menu-active {
|
||||
background-color: var(--bg-1);
|
||||
}
|
||||
.nav-menu-title {
|
||||
float: left;
|
||||
text-transform: uppercase;
|
||||
#title {
|
||||
font-weight: 700;
|
||||
margin-right: 4px;
|
||||
text-transform: uppercase;
|
||||
}
|
||||
.nav-menu-margin-left {
|
||||
margin-left: 4px;
|
||||
}
|
||||
.nav-menu-margins-left-and-right {
|
||||
margin-left: 4px;
|
||||
margin-right: 4px;
|
||||
#themes {
|
||||
background-color: var(--bg-0);
|
||||
border: none;
|
||||
color: var(--fg-1);
|
||||
font-size: 1.25rem;
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
}
|
||||
|
|
7
assets/responsive.css
Normal file
7
assets/responsive.css
Normal file
|
@ -0,0 +1,7 @@
|
|||
@media only screen and (min-width: 60rem) {
|
||||
body {
|
||||
max-width:60rem;
|
||||
margin-left: auto;
|
||||
margin-right: auto;
|
||||
}
|
||||
}
|
|
@ -2,7 +2,7 @@
|
|||
title: "Blog"
|
||||
menu:
|
||||
main:
|
||||
weight: 4
|
||||
weight: 1
|
||||
---
|
||||
|
||||
This is the blog section of this website. It is an heritage of the old wiki I maintained before switching to a static website generated with [hugo]({{< ref "hugo" >}}), so articles before 2021 can be a little short and are more like notes than regular articles.
|
||||
|
|
|
@ -2,7 +2,7 @@
|
|||
title: "Books"
|
||||
menu:
|
||||
main:
|
||||
weight: 3
|
||||
weight: 2
|
||||
---
|
||||
|
||||
I used to read a lot when I was younger and really liked it. I went through many great sagas like Asimov's Foundation and Robots cycles, all the Dune books by Franck Herbert... I really liked reading. Without knowing why, I stopped reading books when I started working in 2009... I guess I got caught up with grown-up life then.
|
||||
|
|
|
@ -2,7 +2,7 @@
|
|||
title: "Docs"
|
||||
menu:
|
||||
main:
|
||||
weight: 2
|
||||
weight: 3
|
||||
---
|
||||
|
||||
This is the Docs section of this website. It is an heritage of the old wiki I maintained before switching to a static website generated with [hugo]({{< ref "hugo" >}}), with information that does not really fit in a blog format.
|
||||
|
|
|
@ -2,7 +2,7 @@
|
|||
title: "Search"
|
||||
menu:
|
||||
main:
|
||||
weight: 1
|
||||
weight: 4
|
||||
layout: single
|
||||
---
|
||||
|
||||
|
|
|
@ -15,7 +15,8 @@
|
|||
{{- $header := resources.Get "header.css" -}}
|
||||
{{- $home := resources.Get "home.css" -}}
|
||||
{{- $pagination := resources.Get "pagination.css" -}}
|
||||
{{- $allCss := slice $base $code $footer $header $home $pagination | resources.Concat "static/all.css" | fingerprint | minify -}}
|
||||
{{- $responsive := resources.Get "responsive.css" -}}
|
||||
{{- $allCss := slice $base $code $footer $header $home $pagination $responsive | resources.Concat "static/all.css" | fingerprint | minify -}}
|
||||
<link rel="stylesheet" href="{{ $allCss.Permalink }}">
|
||||
|
||||
{{ range .AlternativeOutputFormats -}}
|
||||
|
|
|
@ -15,7 +15,8 @@
|
|||
{{- $header := resources.Get "header.css" -}}
|
||||
{{- $home := resources.Get "home.css" -}}
|
||||
{{- $pagination := resources.Get "pagination.css" -}}
|
||||
{{- $allCss := slice $base $code $footer $header $home $pagination | resources.Concat "static/all.css" | fingerprint | minify -}}
|
||||
{{- $responsive := resources.Get "responsive.css" -}}
|
||||
{{- $allCss := slice $base $code $footer $header $home $pagination $responsive | resources.Concat "static/all.css" | fingerprint | minify -}}
|
||||
<link rel="stylesheet" href="{{ $allCss.Permalink }}">
|
||||
|
||||
{{ range .AlternativeOutputFormats -}}
|
||||
|
|
|
@ -1,29 +1,13 @@
|
|||
<header>
|
||||
<nav>
|
||||
<ul>
|
||||
<li class="nav-menu-title{{if .IsHome}} nav-menu-active{{end}}"><a href="/">{{ .Site.Title }}</a></li>
|
||||
<li>
|
||||
<select id="themes" class="nav-menu-magin-left" onchange="setTheme()">
|
||||
<option value="black-theme">Black</option>
|
||||
<option value="dark-theme">Dark</option>
|
||||
<option value="light-theme">Light</option>
|
||||
</select>
|
||||
<ol>
|
||||
<li id="title"{{if .IsHome}} class="nav-menu-active"{{end}}>
|
||||
<a href="/">{{ .Site.Title }}</a>
|
||||
</li>
|
||||
</ol>
|
||||
<ol id="nav-menu">
|
||||
{{- $p := . -}}
|
||||
|
||||
{{- range first 1 .Site.Menus.main.ByWeight -}}
|
||||
{{- $active := or ($p.IsMenuCurrent "main" .) ($p.HasMenuCurrent "main" .) -}}
|
||||
{{- with .Page -}}
|
||||
{{- $active = or $active ( $.IsDescendant .) -}}
|
||||
{{- end -}}
|
||||
{{- $url := urls.Parse .URL -}}
|
||||
{{- $baseurl := urls.Parse $.Site.Params.Baseurl -}}
|
||||
<li class="nav-menu-margin-left{{if $active }} nav-menu-active{{end}}">
|
||||
<a href="{{ with .Page }}{{ .RelPermalink }}{{ else }}{{ .URL | relLangURL }}{{ end }}"{{ if ne $url.Host $baseurl.Host }}target="_blank" {{ end }}>{{ .Name }}</a>
|
||||
</li>
|
||||
{{ end }}
|
||||
|
||||
{{- range after 1 .Site.Menus.main.ByWeight -}}
|
||||
{{- range .Site.Menus.main.ByWeight -}}
|
||||
{{- $active := or ($p.IsMenuCurrent "main" .) ($p.HasMenuCurrent "main" .) -}}
|
||||
{{- with .Page -}}
|
||||
{{- $active = or $active ( $.IsDescendant .) -}}
|
||||
|
@ -34,6 +18,13 @@
|
|||
<a href="{{ with .Page }}{{ .RelPermalink }}{{ else }}{{ .URL | relLangURL }}{{ end }}"{{ if ne $url.Host $baseurl.Host }}target="_blank" {{ end }}>{{ .Name }}</a>
|
||||
</li>
|
||||
{{ end }}
|
||||
</ul>
|
||||
<li>
|
||||
<select id="themes" class="nav-menu-magin-left" onchange="setTheme()">
|
||||
<option value="black-theme">Black</option>
|
||||
<option value="dark-theme">Dark</option>
|
||||
<option value="light-theme">Light</option>
|
||||
</select>
|
||||
</li>
|
||||
</ol>
|
||||
</nav>
|
||||
</header>
|
||||
|
|
Loading…
Add table
Reference in a new issue