styles: add footer and header
This commit is contained in:
parent
138ec84d17
commit
88c9777c62
|
@ -3,46 +3,13 @@
|
||||||
{{- partial "head.html" . -}}
|
{{- partial "head.html" . -}}
|
||||||
|
|
||||||
<body class="bg:fade-90@dark font:fade-16@dark">
|
<body class="bg:fade-90@dark font:fade-16@dark">
|
||||||
<nav class="w:full h:90 fixed bg:fade-90/.95@dark bg:white z:1000">
|
{{ partial "header.html" . -}}
|
||||||
<div class="
|
<div class="d:flex flex:column@<=sm pt:90 px:32 jc:center gap:44">
|
||||||
h:full
|
{{- block "side" . }}{{- end }}
|
||||||
w:full
|
<div class="max-w:700 box:content-box">
|
||||||
max-w:1200
|
{{- block "main" . }}{{- end }}
|
||||||
mx:auto
|
{{- partial "footer.html" . -}}
|
||||||
px:32
|
|
||||||
d:flex
|
|
||||||
align-items:center
|
|
||||||
">
|
|
||||||
<div>
|
|
||||||
<a href="/" class="mr-3 font:extralight">Holy</a>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div class="ml:auto">
|
|
||||||
{{ $currentPage := . }}
|
|
||||||
{{ $active := "" }}
|
|
||||||
{{ range .Site.Menus.main }}
|
|
||||||
{{ if or ($currentPage.IsMenuCurrent "main" .) ($currentPage.HasMenuCurrent "main" .) }}
|
|
||||||
{{ $active = "active" }}
|
|
||||||
{{ end }}
|
|
||||||
<a class="
|
|
||||||
font:semibold
|
|
||||||
font:fade-70
|
|
||||||
font:fade-10:hover
|
|
||||||
font:fade-30.active
|
|
||||||
px:8
|
|
||||||
transition:150ms;ease-in
|
|
||||||
{{ $active }}
|
|
||||||
" href="{{ .URL }}" title="{{ .Title }}">
|
|
||||||
{{- .Name -}}
|
|
||||||
</a>
|
|
||||||
{{ end }}
|
|
||||||
</div>
|
|
||||||
</div>
|
</div>
|
||||||
</nav>
|
|
||||||
|
|
||||||
<div class="pt:90 px:32 max-w:700 box:content-box mx:auto">
|
|
||||||
{{- block "main" . }}{{- end }}
|
|
||||||
{{- partial "footer.html" . -}}
|
|
||||||
</div>
|
</div>
|
||||||
</body>
|
</body>
|
||||||
|
|
||||||
|
|
|
@ -1,5 +1,5 @@
|
||||||
{{ define "main" }}
|
{{ define "main" }}
|
||||||
<article class="box:border-box py:64 w:full">
|
<article class="box:border-box pt:32">
|
||||||
<header class="mb:32">
|
<header class="mb:32">
|
||||||
<div class="font:40 font:extrabold">{{ .Title }}</div>
|
<div class="font:40 font:extrabold">{{ .Title }}</div>
|
||||||
<div class="mt:16 f:fade-64">
|
<div class="mt:16 f:fade-64">
|
||||||
|
|
|
@ -0,0 +1,4 @@
|
||||||
|
<footer class="py:32">
|
||||||
|
<div class="f:fade-30 f:14 mb:8">{{ .Site.Params.copyright }}</div>
|
||||||
|
<div class="f:fade-60 f:12">Theme <a class="f:bold" href="https://github.com/serkodev/holy" _target="_blank">Holy</a></div>
|
||||||
|
</footer>
|
|
@ -0,0 +1,36 @@
|
||||||
|
<nav class="w:full h:90 fixed bg:fade-90/.95@dark bg:white z:1000">
|
||||||
|
<div class="
|
||||||
|
h:full
|
||||||
|
w:full
|
||||||
|
max-w:1200
|
||||||
|
mx:auto
|
||||||
|
px:32
|
||||||
|
d:flex
|
||||||
|
align-items:center
|
||||||
|
">
|
||||||
|
<div>
|
||||||
|
<a href="/" class="mr-3 font:extralight">{{ .Site.Title }}</a>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="ml:auto">
|
||||||
|
{{ $currentPage := . }}
|
||||||
|
{{ $active := "" }}
|
||||||
|
{{ range .Site.Menus.main }}
|
||||||
|
{{ if or ($currentPage.IsMenuCurrent "main" .) ($currentPage.HasMenuCurrent "main" .) }}
|
||||||
|
{{ $active = "active" }}
|
||||||
|
{{ end }}
|
||||||
|
<a class="
|
||||||
|
font:semibold
|
||||||
|
font:fade-70
|
||||||
|
font:fade-10:hover
|
||||||
|
font:fade-30.active
|
||||||
|
px:8
|
||||||
|
transition:150ms;ease-in
|
||||||
|
{{ $active }}
|
||||||
|
" href="{{ .URL }}" title="{{ .Title }}">
|
||||||
|
{{- .Name -}}
|
||||||
|
</a>
|
||||||
|
{{ end }}
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</nav>
|
Loading…
Reference in New Issue