117 lines
2.7 KiB
Vue
117 lines
2.7 KiB
Vue
<template>
|
|
<nav class="site-nav">
|
|
<div class="site-nav-left">
|
|
<div v-if="logo">
|
|
<a v-if="$static.metadata.ghost.logo"
|
|
class="site-nav-logo"
|
|
:href="$static.metadata.siteUrl||$static.metadata.ghost.url">
|
|
<img :src="$static.metadata.ghost.logo"
|
|
:alt="$static.metadata.siteName||$static.metadata.ghost.title">
|
|
</a>
|
|
<a v-else class="site-nav-logo"
|
|
:href="$static.metadata.siteUrl||$static.metadata.ghost.url">
|
|
{{ $static.metadata.siteName.title||$static.metadata.ghost.title }}
|
|
</a>
|
|
</div>
|
|
<Navigation v-if="$static.metadata.ghost.navigation"/>
|
|
</div>
|
|
<div class="site-nav-right">
|
|
<div class="social-links">
|
|
<a
|
|
v-if="Admin.social_media.patreon"
|
|
class="social-link social-link-p"
|
|
:href="'https://www.patreon.com/' + Admin.social_media.patreon"
|
|
title="Become My Patron"
|
|
target="_blank"
|
|
rel="noopener"
|
|
>
|
|
<Patreon/>
|
|
</a>
|
|
|
|
<a
|
|
v-if="Admin.social_media.facebook"
|
|
class="social-link social-link-fb"
|
|
:href="'https://facebook.com/' + Admin.social_media.facebook"
|
|
title="Facebook"
|
|
target="_blank"
|
|
rel="noopener"
|
|
>
|
|
<Facebook/>
|
|
</a>
|
|
|
|
<a
|
|
v-if="Admin.social_media.twitter"
|
|
class="social-link social-link-tw"
|
|
:href="'https://twitter.com/' + Admin.social_media.twitter"
|
|
title="Twitter"
|
|
target="_blank"
|
|
rel="noopener"
|
|
>
|
|
<Twitter/>
|
|
</a>
|
|
</div>
|
|
<a v-if="Admin.site.subscribers" class="subscribe-button" href="#subscribe">Subscribe</a>
|
|
<a v-else class="rss-button" href="/feed.xml" title="RSS" target="_blank" rel="noopener">
|
|
<RSS/>
|
|
</a>
|
|
</div>
|
|
</nav>
|
|
</template>
|
|
|
|
<script>
|
|
import Admin from "../../data/admin.yml";
|
|
import Navigation from "./Navigation";
|
|
|
|
// Icons
|
|
import Facebook from "./icons/Facebook";
|
|
import Twitter from "./icons/Twitter";
|
|
import Patreon from "./icons/Patreon";
|
|
import RSS from "./icons/RSS";
|
|
|
|
export default {
|
|
props: {
|
|
logo: {
|
|
type: Boolean,
|
|
default: false
|
|
}
|
|
},
|
|
components: {
|
|
Navigation,
|
|
Patreon,
|
|
Facebook,
|
|
Twitter,
|
|
RSS
|
|
},
|
|
computed: {
|
|
Admin() {
|
|
return Admin;
|
|
}
|
|
}
|
|
};
|
|
</script>
|
|
|
|
<style lang="sass">
|
|
.social-link > svg
|
|
width: 1.8rem
|
|
</style>
|
|
|
|
<static-query>
|
|
query Admin {
|
|
metadata {
|
|
siteName
|
|
siteDescription
|
|
siteUrl
|
|
ghost {
|
|
title
|
|
url
|
|
logo
|
|
description
|
|
navigation {
|
|
url
|
|
label
|
|
}
|
|
}
|
|
}
|
|
}
|
|
</static-query>
|