65 lines
No EOL
1 KiB
Vue
65 lines
No EOL
1 KiB
Vue
<template>
|
|
<div class="author">
|
|
|
|
<g-image class="author__image" src="~/assets/images/author.jpg" width="180" height="180" blur="5" />
|
|
|
|
<h1 v-if="showTitle" class="author__site-title">
|
|
{{ $static.metaData.siteName }}
|
|
</h1>
|
|
|
|
<p class="author__intro">
|
|
A simple, hackable & minimalistic starter for Gridsome that uses Markdown for content.
|
|
</p>
|
|
|
|
<p class="author__links">
|
|
<a href="//twitter.com/gridsome">Follow on Twitter</a>
|
|
<a href="//github.com/gridsome/gridsome-starter-blog">GitHub</a>
|
|
</p>
|
|
|
|
</div>
|
|
</template>
|
|
|
|
<static-query>
|
|
query {
|
|
metaData {
|
|
siteName
|
|
}
|
|
}
|
|
</static-query>
|
|
|
|
<script>
|
|
export default {
|
|
props: ['showTitle']
|
|
}
|
|
</script>
|
|
|
|
<style lang="scss">
|
|
.author {
|
|
margin: 0 auto;
|
|
max-width: 500px;
|
|
text-align: center;
|
|
padding: calc(var(--space) / 2) 0;
|
|
|
|
&__image {
|
|
border-radius: 100%;
|
|
width: 90px;
|
|
height: 90px;
|
|
margin-bottom: 1em;
|
|
}
|
|
|
|
&__intro {
|
|
opacity: .8;
|
|
}
|
|
|
|
&__site-title {
|
|
font-size: 1.5em;
|
|
}
|
|
|
|
&__links {
|
|
margin-top: -.5em;
|
|
a {
|
|
margin: 0 .5em;
|
|
}
|
|
}
|
|
}
|
|
</style> |