add icons to navbar

This commit is contained in:
Henrique Dias 2018-07-17 14:55:34 +01:00
parent c3a6e11338
commit 34d654455d
9 changed files with 22 additions and 3 deletions

2
.gitignore vendored
View File

@ -21,6 +21,8 @@ yarn-debug.log*
yarn-error.log*
yarn.lock
glyph*.svg
stroke*.svg
public
dist
/src/resources

View File

@ -1,5 +1,6 @@
title: Apps
color: aqua
icon: stroke_marketing
description: Applications built with IPFS or with functionality that uses IPFS.
content:
- title: akasha

View File

@ -1,5 +1,6 @@
title: Articles
color: navy
icon: stroke_pencil
description: Articles about the decentralized web and IPFS.
content:
- title: Decentralized & Distributed Edge Computing Comes to Computes.io

View File

@ -1,5 +1,6 @@
title: Tools
color: yellow
icon: stroke_code
description: Tools built on the top of IPFS.
content:
- title: cachewarmer

View File

@ -1,6 +1,7 @@
title: Videos
color: red
description: Videos about IPFS.
icon: stroke_speaker
content:
- title: IPFS Alpha - Why we must redistribute the web
website: https://www.youtube.com/watch?v=skMTdSEaCtA

View File

@ -14,6 +14,7 @@
"build": "run-s build:*",
"build:readme": "node ./scripts/make-readme.js",
"build:fonts": "shx mkdir -p src/static/fonts && shx cp node_modules/ipfs-css/fonts/* src/static/fonts",
"build:icons": "shx cp node_modules/ipfs-css/icons/* src/layouts/partials/icons",
"build:css": "postcss --no-map --use postcss-import cssnano -o src/static/app.css src/css/*.css",
"build:js": "browserify -g uglifyify src/js/app.js -o src/static/app.js",
"build:data": "node ./scripts/make-data.js",

View File

@ -7,7 +7,13 @@ const cssPath = path.join(__dirname, '../src/css')
const jsPath = path.join(__dirname, '../src/js')
const http = require('http')
const runHugo = () => runAll(['build:hugo'])
const runHugo = () => {
console.log('Rebuilding...')
return runAll(['build:hugo'], {
stdout: process.stdout,
stderr: process.stderr
}).then(() => console.log('Done!')).catch(console.log)
}
const handler = (path) => {
if (path.startsWith(dataFolder)) {
@ -23,7 +29,7 @@ const handler = (path) => {
async function run () {
console.log('Preparing fonts, css, js and data...')
await runAll(['build:fonts', 'build:css', 'build:js', 'build:data'], {parallel: true})
await runAll(['build:fonts', 'build:css', 'build:js', 'build:css', 'build:data'], {parallel: true})
console.log('Running Hugo once...')
await runHugo()

View File

@ -33,3 +33,7 @@ body {
.fill-blue {
fill: #357edd;
}
.fill-white {
fill: white;
}

View File

@ -7,7 +7,7 @@
<body>
<div class="charcoal sans-serif w-90 mw8 center">
<nav class="mh2 montserrat mv4 fw6 flex-wrap ttu tracked sans-serif flex flex-between">
<a href="{{ .Site.BaseURL }}/" class="w-100 w-auto-l flex items-center pv3 pv0-l flex-grow-1 flex items-center justify-center justify-start-l no-underline" >
<a href="{{ .Site.BaseURL }}/" class="w-100 w-auto-l flex items-center pv3 pv0-l mr4 flex-grow-1 flex items-center justify-center justify-start-l no-underline" >
<img alt="IPFS" src="{{ .Site.BaseURL }}/images/logo.png" class="w3 h3 mr3">
<h1 class="f3 white">Awesome IPFS</h1>
</a>
@ -15,8 +15,10 @@
{{ $site := .Site }}
{{ range $name, $taxonomy := .Site.Taxonomies.categories }}
{{ $color := (index $site.Data.categories $name).color }}
{{ $icon := print (index $site.Data.categories $name).icon ".svg" }}
<a href="/categories/{{ $name | urlize }}"
class="flex-grow-1 flex items-center justify-center white no-underline pa3 bg-animate dib bg-{{ $color }}-muted hover-bg-{{ $color }}">
<span class="w2 h2 fill-white mr2">{{ partial (print "icons/" $icon ) }}</span>
{{ $name }}
</a>
{{ end }}