directly include icons as svgs
This commit is contained in:
parent
56ce3fcba0
commit
d1ebe75f4e
14
README.md
14
README.md
@ -15,7 +15,7 @@ at the top of the file.
|
||||
|
||||
## Sidebar
|
||||
|
||||
Instead of the horizontal menu, a sidebar can be enabled with `sidebar: true`. See [here](https://niklasbuschmann.github.io/contrast/) for an example of the sidebar in action. Adding a `hidden` class to the icon tag will hide the icon on mobile devices.
|
||||
Instead of the horizontal menu, a sidebar can be enabled with `sidebar: true`. See [here](https://niklasbuschmann.github.io/contrast/) for an example of the sidebar in action.
|
||||
|
||||
An example `config.yaml` section could look like this:
|
||||
|
||||
@ -23,17 +23,17 @@ An example `config.yaml` section could look like this:
|
||||
params:
|
||||
sidebar: true
|
||||
show_excerpts: true
|
||||
fontawesome: true
|
||||
description: 'Made by <a href="">Blog Author</a>'
|
||||
|
||||
menu:
|
||||
main:
|
||||
- {name: "Home", url: "/", identifier: "home", weight: 1, pre: "<span class='fas fa-home hidden'></span>"}
|
||||
- {name: "About", url: "/about/", identifier: "address-card", weight: 2, pre: "<span class='fas fa-address-card hidden'></span>"}
|
||||
- {name: "Home", url: "/", identifier: "home", weight: 1}
|
||||
- {name: "About", url: "/about/", identifier: "address-card", weight: 2}
|
||||
remote:
|
||||
- {name: "Mail", url: "mailto:", identifier: "envelope", weight: 3, pre: "<span class='fas fa-envelope hidden'></span>"}
|
||||
- {name: "Github", url: "https://github.com/", identifier: "github", weight: 4, pre: "<span class='fab fa-github hidden'></span>"}
|
||||
- {name: "Subscribe", url: "/index.xml", identifier: "rss", weight: 5, pre: "<span class='fas fa-rss hidden'></span>"}
|
||||
- {name: "Mail", url: "mailto:", identifier: "envelope", weight: 3}
|
||||
- {name: "Github", url: "https://github.com/", identifier: "github", weight: 4}
|
||||
- {name: "Subscribe", url: "/index.xml", identifier: "rss", weight: 5}
|
||||
|
||||
```
|
||||
|
||||
## Features
|
||||
|
@ -7,9 +7,6 @@
|
||||
<meta name="description" content="{{ .Description | default .Site.Params.description }}">
|
||||
{{- end }}
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
{{- if .Site.Params.fontawesome }}
|
||||
{{ partial "font-awesome.html" . }}
|
||||
{{- end }}
|
||||
<link rel="stylesheet" href="{{ .Site.BaseURL }}css/index.css">
|
||||
<link rel="stylesheet" href="{{ .Site.BaseURL }}css/classes.css">
|
||||
{{- if .Site.Params.sidebar }}
|
||||
@ -21,16 +18,23 @@
|
||||
{{ partial "math.html" . }}
|
||||
{{- end }}
|
||||
|
||||
{{ $font_awesome := getJSON "themes/contrast-hugo/static/font-awesome/icons.json" }}
|
||||
|
||||
<body>
|
||||
|
||||
<header>
|
||||
<header class="icons">
|
||||
{{ if not (gt (len .Site.Menus) 1) }}
|
||||
<a href="{{ .Site.BaseURL }}">{{ .Site.Title }}</a>
|
||||
{{ end }}
|
||||
{{ range .Site.Menus }}
|
||||
{{ range $menu, $items := .Site.Menus }}
|
||||
<nav>
|
||||
{{ range . }}
|
||||
<a href="{{ .URL }}" {{ if (eq $.RelPermalink .URL) }}class="selected"{{ end }}>{{ .Pre }}{{ .Name }}{{ .Post }}</a>
|
||||
{{ range $items }}
|
||||
{{ $icon := index $font_awesome .Identifier }}
|
||||
{{ $svg := $icon.svg.solid | default $icon.svg.regular | default $icon.svg.brands }}
|
||||
<a href="{{ .URL }}" {{ if (eq $.RelPermalink .URL) }}class="selected"{{ end }}>
|
||||
<span {{ if eq $menu "main" }}class="hidden"{{ end }}>{{ safeHTML $svg.raw }}</span>
|
||||
<span {{ if not (eq $menu "main") }}class="hidden"{{ end }}>{{ .Name }}</span>
|
||||
</a>
|
||||
{{ end }}
|
||||
</nav>
|
||||
{{ end }}
|
||||
|
@ -1 +0,0 @@
|
||||
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.12.0/css/all.min.css">
|
@ -29,6 +29,11 @@
|
||||
text-decoration: inherit;
|
||||
}
|
||||
|
||||
.fa, .fab, .fad, .fal, .far, .fas {
|
||||
margin-right: 1.2em;
|
||||
.icons svg {
|
||||
height: 1em;
|
||||
width: 1em;
|
||||
fill: currentColor;
|
||||
transition: .2s color;
|
||||
vertical-align: middle;
|
||||
margin-bottom: .15em;
|
||||
}
|
||||
|
@ -51,6 +51,10 @@ article header h1 {
|
||||
font-size: 2em;
|
||||
}
|
||||
|
||||
.icons svg {
|
||||
margin-right: 1rem;
|
||||
}
|
||||
|
||||
.description {
|
||||
margin: 2em 0;
|
||||
}
|
||||
|
34
static/font-awesome/LICENSE.txt
Normal file
34
static/font-awesome/LICENSE.txt
Normal file
@ -0,0 +1,34 @@
|
||||
Font Awesome Free License
|
||||
-------------------------
|
||||
|
||||
Font Awesome Free is free, open source, and GPL friendly. You can use it for
|
||||
commercial projects, open source projects, or really almost whatever you want.
|
||||
Full Font Awesome Free license: https://fontawesome.com/license/free.
|
||||
|
||||
# Icons: CC BY 4.0 License (https://creativecommons.org/licenses/by/4.0/)
|
||||
In the Font Awesome Free download, the CC BY 4.0 license applies to all icons
|
||||
packaged as SVG and JS file types.
|
||||
|
||||
# Fonts: SIL OFL 1.1 License (https://scripts.sil.org/OFL)
|
||||
In the Font Awesome Free download, the SIL OFL license applies to all icons
|
||||
packaged as web and desktop font files.
|
||||
|
||||
# Code: MIT License (https://opensource.org/licenses/MIT)
|
||||
In the Font Awesome Free download, the MIT license applies to all non-font and
|
||||
non-icon files.
|
||||
|
||||
# Attribution
|
||||
Attribution is required by MIT, SIL OFL, and CC BY licenses. Downloaded Font
|
||||
Awesome Free files already contain embedded comments with sufficient
|
||||
attribution, so you shouldn't need to do anything additional when using these
|
||||
files normally.
|
||||
|
||||
We've kept attribution comments terse, so we ask that you do not actively work
|
||||
to remove them from files, especially code. They're a great way for folks to
|
||||
learn about Font Awesome.
|
||||
|
||||
# Brand Icons
|
||||
All brand icons are trademarks of their respective owners. The use of these
|
||||
trademarks does not indicate endorsement of the trademark holder by Font
|
||||
Awesome, nor vice versa. **Please do not use brand logos for any purpose except
|
||||
to represent the company, product, or service to which they refer.**
|
56376
static/font-awesome/icons.json
Normal file
56376
static/font-awesome/icons.json
Normal file
File diff suppressed because one or more lines are too long
Loading…
Reference in New Issue
Block a user