add github icon

This commit is contained in:
Philipp Kühn
2020-04-18 22:35:29 +02:00
parent 53d20a454a
commit 10fd993f44
7 changed files with 179 additions and 35 deletions

View File

@@ -21,6 +21,7 @@
},
"devDependencies": {
"@babel/preset-react": "^7.9.4",
"html-loader": "^1.1.0",
"node-sass": "^4.13.1",
"sass-loader": "^8.0.2",
"style-resources-loader": "^1.3.3",

View File

@@ -0,0 +1 @@
<svg viewBox="0 0 24 24"><path d="M11.999.5C5.649.5.5 5.648.5 12c0 5.082 3.294 9.392 7.865 10.914.574.103.756-.236.756-.541 0-.274.006-1.037 0-1.997-3.198.694-3.861-1.515-3.861-1.515-.523-1.329-1.275-1.682-1.275-1.682-1.045-.714.077-.699.077-.699 1.153.08 1.762 1.184 1.762 1.184 1.026 1.758 2.691 1.25 3.346.956.106-.742.402-1.251.731-1.536-2.554-.292-5.238-1.277-5.238-5.686 0-1.255.448-2.281 1.184-3.086-.118-.289-.514-1.46.112-3.043 0 0 .967-.309 3.162 1.18a11.011 11.011 0 012.88-.388c.976.005 1.96.132 2.88.388 2.195-1.488 3.159-1.18 3.159-1.18.627 1.583.232 2.754.114 3.043.736.805 1.183 1.831 1.183 3.086 0 4.42-2.689 5.391-5.251 5.674.412.357.787 1.047.787 2.12v3.184c0 .308.186.647.77.536C20.209 21.389 23.5 17.08 23.5 12 23.5 5.648 18.352.5 11.999.5z"></path></svg>

After

Width:  |  Height:  |  Size: 776 B

View File

@@ -0,0 +1,38 @@
<script>
export default {
name: 'Icon',
props: {
name: {
type: String,
default: '',
},
size: {
type: String,
default: 'normal',
},
},
render(createElement) {
let svgHTML = ''
try {
svgHTML = require(`!html-loader!@/assets/icons/${this.name}.svg`)
} catch (e) {
// eslint-disable-next-line
console.warn(`Unable to load "${this.name}.svg" icon. Verify it exists in the icons directory.`, e)
}
return createElement(
'div',
{
class: `icon icon--${this.size}`,
domProps: {
innerHTML: svgHTML,
},
},
)
},
}
</script>
<style lang="scss" src="./style.scss" scoped></style>

View File

@@ -0,0 +1,15 @@
.icon {
display: inline-flex;
width: 1.3rem;
height: 1.3rem;
&::v-deep > svg {
width: 100%;
height: 100%;
fill: currentColor;
* {
fill: inherit;
}
}
}

View File

@@ -1,15 +1,14 @@
<template>
<div class="app">
<header class="app__header">
<div class="app__inner">
<g-link class="app__logo" to="/">
{{ $static.metadata.siteName }}
</g-link>
</div>
<g-link to="https://github.com/scrumpy/tiptap">
<icon name="github" />
</g-link>
</header>
<div class="app__content">
<div class="app__inner">
<div class="app__content-inner">
<nav class="app__sidebar">
<div class="app__link-group" v-for="(linkGroup, i) in linkGroups" :key="i">
<div class="app__link-group-title">
@@ -30,8 +29,6 @@
</main>
</div>
</div>
</div>
</div>
</template>
<static-query>
@@ -44,10 +41,12 @@ query {
<script>
import linkGroups from '@/data/links.yaml'
import Icon from '@/components/Icon'
import PageNavigation from '@/components/PageNavigation'
export default {
components: {
Icon,
PageNavigation,
},

View File

@@ -37,19 +37,28 @@
}
}
&__header,
&__content {
display: flex;
width: 100%;
max-width: 62rem;
margin: 0 auto;
padding-left: 2rem;
padding-right: 2rem;
}
&__header {
flex: 0 0 auto;
padding: 2rem 0;
align-items: center;
justify-content: space-between;
padding-top: 2rem;
padding-bottom: 2rem;
}
&__content {
flex: 1 1 auto;
}
&__content-inner {
display: flex;
}
&__sidebar {
flex: 0 0 auto;
width: 18rem;

View File

@@ -3552,6 +3552,14 @@ camel-case@3.0.x:
no-case "^2.2.0"
upper-case "^1.1.1"
camel-case@^4.1.1:
version "4.1.1"
resolved "https://registry.yarnpkg.com/camel-case/-/camel-case-4.1.1.tgz#1fc41c854f00e2f7d0139dfeba1542d6896fe547"
integrity sha512-7fa2WcG4fYFkclIvEmxBbTvmibwF2/agfEBc6q3lOpVu0A13ltLsA+Hr/8Hp6kp5f+G7hKi6t8lys6XxP+1K6Q==
dependencies:
pascal-case "^3.1.1"
tslib "^1.10.0"
camelcase-keys@^2.0.0:
version "2.1.0"
resolved "https://registry.yarnpkg.com/camelcase-keys/-/camelcase-keys-2.1.0.tgz#308beeaffdf28119051efa1d932213c91b8f92e7"
@@ -3755,7 +3763,7 @@ class-utils@^0.3.5:
isobject "^3.0.0"
static-extend "^0.1.1"
clean-css@4.2.x:
clean-css@4.2.x, clean-css@^4.2.3:
version "4.2.3"
resolved "https://registry.yarnpkg.com/clean-css/-/clean-css-4.2.3.tgz#507b5de7d97b48ee53d84adb0160ff6216380f78"
integrity sha512-VcMWDN54ZN/DS+g58HYL5/n4Zrqe8vHJpGA8KdgUXFU4fuP/aHNw8eld9SyEIyabIMJX/0RaY/fplOo5hYLSFA==
@@ -3994,6 +4002,11 @@ commander@^2.15.1, commander@^2.19.0, commander@^2.20.0, commander@~2.20.3:
resolved "https://registry.yarnpkg.com/commander/-/commander-2.20.3.tgz#fd485e84c03eb4881c20722ba48035e8531aeb33"
integrity sha512-GpVkmM8vF2vQUkj2LvZmD35JxeJOLCwJ9cUkugyk2nuhbv3+mJvpLYYt+0+USMxE+oj+ey/lJEnhZw75x/OMcQ==
commander@^4.1.1:
version "4.1.1"
resolved "https://registry.yarnpkg.com/commander/-/commander-4.1.1.tgz#9fd602bd936294e9e9ef46a3f4d6964044b18068"
integrity sha512-NOKm8xhkzAjzFx8B2v5OAHT+u5pRQc2UCa2Vq9jYL/31o2wi9mxBA7LIFs3sV5VSC49z6pEhfbMULvShKj26WA==
commander@~2.19.0:
version "2.19.0"
resolved "https://registry.yarnpkg.com/commander/-/commander-2.19.0.tgz#f6198aa84e5b83c46054b94ddedbfed5ee9ff12a"
@@ -5075,6 +5088,14 @@ domutils@^2.0.0:
domelementtype "^2.0.1"
domhandler "^3.0.0"
dot-case@^3.0.3:
version "3.0.3"
resolved "https://registry.yarnpkg.com/dot-case/-/dot-case-3.0.3.tgz#21d3b52efaaba2ea5fda875bb1aa8124521cf4aa"
integrity sha512-7hwEmg6RiSQfm/GwPL4AAWXKy3YNNZA3oFv2Pdiey0mwkRCPZ9x6SZbkLcn8Ma5PYeVokzoD4Twv2n7LKp5WeA==
dependencies:
no-case "^3.0.3"
tslib "^1.10.0"
dot-prop@^3.0.0:
version "3.0.0"
resolved "https://registry.yarnpkg.com/dot-prop/-/dot-prop-3.0.0.tgz#1b708af094a49c9a0e7dbcad790aba539dac1177"
@@ -6884,6 +6905,30 @@ html-entities@^1.2.0:
resolved "https://registry.yarnpkg.com/html-entities/-/html-entities-1.3.1.tgz#fb9a1a4b5b14c5daba82d3e34c6ae4fe701a0e44"
integrity sha512-rhE/4Z3hIhzHAUKbW8jVcCyuT5oJCXXqhN/6mXXVCpzTmvJnoH2HL/bt3EZ6p55jbFJBeAe1ZNpL5BugLujxNA==
html-loader@^1.1.0:
version "1.1.0"
resolved "https://registry.yarnpkg.com/html-loader/-/html-loader-1.1.0.tgz#91915f4d274caa9d46d1c3dc847cd82bfc037dbd"
integrity sha512-zwLbEgy+i7sgIYTlxI9M7jwkn29IvdsV6f1y7a2aLv/w8l1RigVk0PFijBZLLFsdi2gvL8sf2VJhTjLlfnK8sA==
dependencies:
html-minifier-terser "^5.0.5"
htmlparser2 "^4.1.0"
loader-utils "^2.0.0"
parse-srcset "^1.0.2"
schema-utils "^2.6.5"
html-minifier-terser@^5.0.5:
version "5.0.5"
resolved "https://registry.yarnpkg.com/html-minifier-terser/-/html-minifier-terser-5.0.5.tgz#8f12f639789f04faa9f5cf2ff9b9f65607f21f8b"
integrity sha512-cBSFFghQh/uHcfSiL42KxxIRMF7A144+3E44xdlctIjxEmkEfCvouxNyFH2wysXk1fCGBPwtcr3hDWlGTfkDew==
dependencies:
camel-case "^4.1.1"
clean-css "^4.2.3"
commander "^4.1.1"
he "^1.2.0"
param-case "^3.0.3"
relateurl "^0.2.7"
terser "^4.6.3"
html-minifier@^3.2.3:
version "3.5.21"
resolved "https://registry.yarnpkg.com/html-minifier/-/html-minifier-3.5.21.tgz#d0040e054730e354db008463593194015212d20c"
@@ -8341,6 +8386,13 @@ lower-case@^1.1.1:
resolved "https://registry.yarnpkg.com/lower-case/-/lower-case-1.1.4.tgz#9a2cabd1b9e8e0ae993a4bf7d5875c39c42e8eac"
integrity sha1-miyr0bno4K6ZOkv31YdcOcQujqw=
lower-case@^2.0.1:
version "2.0.1"
resolved "https://registry.yarnpkg.com/lower-case/-/lower-case-2.0.1.tgz#39eeb36e396115cc05e29422eaea9e692c9408c7"
integrity sha512-LiWgfDLLb1dwbFQZsSglpRj+1ctGnayXz3Uv0/WO8n558JycT5fg6zkNcnW0G68Nn0aEldTFeEfmjCfmqry/rQ==
dependencies:
tslib "^1.10.0"
lowercase-keys@1.0.0:
version "1.0.0"
resolved "https://registry.yarnpkg.com/lowercase-keys/-/lowercase-keys-1.0.0.tgz#4e3366b39e7f5457e35f1324bdf6f88d0bfc7306"
@@ -9068,6 +9120,14 @@ no-case@^2.2.0:
dependencies:
lower-case "^1.1.1"
no-case@^3.0.3:
version "3.0.3"
resolved "https://registry.yarnpkg.com/no-case/-/no-case-3.0.3.tgz#c21b434c1ffe48b39087e86cfb4d2582e9df18f8"
integrity sha512-ehY/mVQCf9BL0gKfsJBvFJen+1V//U+0HQMPrWct40ixE4jnv0bfvxDbWtAHL9EcaPEOJHVVYKoQn1TlZUB8Tw==
dependencies:
lower-case "^2.0.1"
tslib "^1.10.0"
node-abi@^2.7.0:
version "2.15.0"
resolved "https://registry.yarnpkg.com/node-abi/-/node-abi-2.15.0.tgz#51d55cc711bd9e4a24a572ace13b9231945ccb10"
@@ -9743,6 +9803,14 @@ param-case@2.1.x:
dependencies:
no-case "^2.2.0"
param-case@^3.0.3:
version "3.0.3"
resolved "https://registry.yarnpkg.com/param-case/-/param-case-3.0.3.tgz#4be41f8399eff621c56eebb829a5e451d9801238"
integrity sha512-VWBVyimc1+QrzappRs7waeN2YmoZFCGXWASRYX1/rGHtXqEcrGEIDm+jqIwFa2fRXNgQEwrxaYuIrX0WcAguTA==
dependencies:
dot-case "^3.0.3"
tslib "^1.10.0"
parse-asn1@^5.0.0:
version "5.1.5"
resolved "https://registry.yarnpkg.com/parse-asn1/-/parse-asn1-5.1.5.tgz#003271343da58dc94cace494faef3d2147ecea0e"
@@ -9805,6 +9873,11 @@ parse-path@^4.0.0:
is-ssh "^1.3.0"
protocols "^1.4.0"
parse-srcset@^1.0.2:
version "1.0.2"
resolved "https://registry.yarnpkg.com/parse-srcset/-/parse-srcset-1.0.2.tgz#f2bd221f6cc970a938d88556abc589caaaa2bde1"
integrity sha1-8r0iH2zJcKk42IVWq8WJyqqiveE=
parse-url@^5.0.0:
version "5.0.1"
resolved "https://registry.yarnpkg.com/parse-url/-/parse-url-5.0.1.tgz#99c4084fc11be14141efa41b3d117a96fcb9527f"
@@ -9820,6 +9893,14 @@ parseurl@~1.3.3:
resolved "https://registry.yarnpkg.com/parseurl/-/parseurl-1.3.3.tgz#9da19e7bee8d12dff0513ed5b76957793bc2e8d4"
integrity sha512-CiyeOxFT/JZyN5m0z9PfXw4SCBJ6Sygz1Dpl0wqjlhDEGGBP1GnsUVEL0p63hoG1fcj3fHynXi9NYO4nWOL+qQ==
pascal-case@^3.1.1:
version "3.1.1"
resolved "https://registry.yarnpkg.com/pascal-case/-/pascal-case-3.1.1.tgz#5ac1975133ed619281e88920973d2cd1f279de5f"
integrity sha512-XIeHKqIrsquVTQL2crjq3NfJUxmdLasn3TYOU0VBM+UX2a6ztAWBlJQBePLGY7VHW8+2dRadeIPK5+KImwTxQA==
dependencies:
no-case "^3.0.3"
tslib "^1.10.0"
pascalcase@^0.1.1:
version "0.1.1"
resolved "https://registry.yarnpkg.com/pascalcase/-/pascalcase-0.1.1.tgz#b363e55e8006ca6fe21784d2db22bd15d7917f14"
@@ -11389,7 +11470,7 @@ regjsparser@^0.6.4:
dependencies:
jsesc "~0.5.0"
relateurl@0.2.x:
relateurl@0.2.x, relateurl@^0.2.7:
version "0.2.7"
resolved "https://registry.yarnpkg.com/relateurl/-/relateurl-0.2.7.tgz#54dbf377e51440aca90a4cd274600d3ff2d888a9"
integrity sha1-VNvzd+UUQKypCkzSdGANP/LYiKk=
@@ -13008,7 +13089,7 @@ terser@^3.8.2:
source-map "~0.6.1"
source-map-support "~0.5.10"
terser@^4.1.2:
terser@^4.1.2, terser@^4.6.3:
version "4.6.11"
resolved "https://registry.yarnpkg.com/terser/-/terser-4.6.11.tgz#12ff99fdd62a26de2a82f508515407eb6ccd8a9f"
integrity sha512-76Ynm7OXUG5xhOpblhytE7X58oeNSmC8xnNhjWVo8CksHit0U0kO4hfNbPrrYwowLWFgM2n9L176VNx2QaHmtA==
@@ -13247,7 +13328,7 @@ tslib@1.9.3:
resolved "https://registry.yarnpkg.com/tslib/-/tslib-1.9.3.tgz#d7e4dd79245d85428c4d7e4822a79917954ca286"
integrity sha512-4krF8scpejhaOgqzBEcGM7yDIEfi0/8+8zDRZhNZZ2kjmHJ4hv3zCbQWxoJGz1iw5U0Jl0nma13xzHXcncMavQ==
tslib@^1.9.0:
tslib@^1.10.0, tslib@^1.9.0:
version "1.11.1"
resolved "https://registry.yarnpkg.com/tslib/-/tslib-1.11.1.tgz#eb15d128827fbee2841549e171f45ed338ac7e35"
integrity sha512-aZW88SY8kQbU7gpV19lN24LtXh/yD4ZZg6qieAJDDg+YBsJcSmLGK9QpnUjAKVG/xefmvJGd1WUmfpT/g6AJGA==