Skip to content

Instantly share code, notes, and snippets.

@smokeyfro

smokeyfro/Header.vue

Created October 11, 2019 10:01
Show Gist options
  • Save smokeyfro/8719b0392e39587d5600724ceb6704ec to your computer and use it in GitHub Desktop.
Save smokeyfro/8719b0392e39587d5600724ceb6704ec to your computer and use it in GitHub Desktop.
Download ZIP
Raw
Header.vue
<template>
<header class="header w-full flex items-center pt-10 px-20">
<a href="/" class="logo block z-50 flex items-center">
<span v-html="selectedImage" class="text-black inline-block items-flex-start" />
</a>
<PriorityPlus :list="menuItems">
<div slot-scope='{ mainItems, moreItems }'>
<g-link v-for='(item, index) in mainItems'
:key='index'
:href='item.link'
:title='item.label'
@click.prevent='clickItem($event, item)'>
{{ item.label }}
</g-link>
<div v-if='moreItems.length'>
<button type='button'>More +</button>
<div class='dropdown'>
<g-link v-for='(item, index) in moreItems'
:key='index'
:href='item.link'
:title='item.label'
@click.prevent='clickItem($event, item)'>
{{ item.label }}
</g-link>
</div>
</div>
</div>
</PriorityPlus>
<nav class="social flex ml-auto">
<g-link class="nav__link" to="/about"><g-image src="/instagram.svg" width="20" height="20" class="w-6" alt="" /></g-link>
<g-link class="nav__link" to="/work/"><g-image src="/twitter.svg" width="20" height="20" class="w-6" alt="" /></g-link>
<g-link class="nav__link" to="/work/"><g-image src="/youtube.svg" width="20" height="20" class="w-6" alt="" /></g-link>
<g-link class="nav__link" to="/work/"><g-image src="/linkedin.svg" width="20" height="20" class="w-6" alt="" /></g-link>
</nav>
</header>
</template>
<script>
import PriorityPlus from 'vue-priority-plus-navigation'
export default {
name: 'Header',
components: [ PriorityPlus ],
methods: {
clickItem (event, item) { console.log(item) }
},
data() {
return {
menuItems: [
{ label: 'About', link: '/about' },
{ label: 'Work', link: '/work' },
{ label: 'Tuts', link: '/tuts' },
{ label: 'Videos', link: '/videos' },
{ label: 'Themes', link: '/themes' },
{ label: 'Journal', link: '/journal' },
{ label: 'Contact', link: '/contact' },
],
logos: [
'<svg class="fill-current" width="80" height="80" viewBox="0 0 100 117" xmlns="http://www.w3.org/2000/svg" fill-rule="evenodd" clip-rule="evenodd" stroke-linejoin="round" stroke-miterlimit="2"><path d="M79.713 76.748c-.664 3.731-2.359 5.794-3.278 5.794a.601.601 0 0 1-.249-.058c1.037-4.042 1.607-8.142 1.656-12.122.218-.145.42-.22.594-.22.034 0 .068.003.102.009.928.165 1.848 2.818 1.175 6.597zm-24.614-9.994c-1.601.529-3.492 1.279-5.099 1.279-1.607 0-3.498-.75-5.099-1.279-3.812-1.258-12.743-2.12-19.525-.788.403-4.668 1.547-8.814 3.335-12.326.372-.11.729-.264 1.066-.46a4.796 4.796 0 0 0 7.838 2.854 4.797 4.797 0 0 0 8.215 1.449 4.794 4.794 0 0 0 8.34 0 4.796 4.796 0 0 0 8.215-1.449 4.794 4.794 0 0 0 7.838-2.854c.337.196.694.35 1.065.46 1.789 3.512 2.933 7.658 3.336 12.326-6.782-1.332-15.714-.47-19.525.788zm1.026 5.785v-1.205c0-1.127.914-2.042 2.042-2.042h4.707s-2.951.799-4.344 1.8a8.413 8.413 0 0 0-1.737 1.676.372.372 0 0 1-.668-.229zm-27.809 0v-1.205c0-1.127.915-2.042 2.043-2.042h4.707s-2.951.799-4.344 1.8a8.42 8.42 0 0 0-1.738 1.676.372.372 0 0 1-.668-.229zM72.25 85.062c-2.647 4.061-6.677 6.583-11.548 7.943-1.691-2.254-4.522-3.924-7.878-4.533-.49.862-1.568 1.463-2.824 1.463-1.256 0-2.335-.601-2.824-1.463-3.318.603-6.124 2.241-7.822 4.456-4.902-1.396-8.994-3.95-11.659-8.031a51.444 51.444 0 0 1-2.171-9.855c.53 2.086 1.275 4.495 2.282 5.768 2.182 2.757 6.876 2.863 10.052 2.728 4.274-.184 7.074-2.084 8.267-5.3 1.196-3.214 1.869-5.971 2.633-6.844.414-.472.88-.504 1.242-.504s.827.032 1.241.504c.765.873 1.438 3.63 2.634 6.844 1.193 3.216 3.992 5.116 8.267 5.3 3.176.135 7.87.029 10.052-2.728 1.007-1.272 1.751-3.682 2.282-5.767a51.524 51.524 0 0 1-2.226 10.019zM53.428 104.99s.555-2.677 0-3.51c-.556-.834-2.222-1.493-3.333-1.493-1.142 0-2.936.689-3.523 1.493-.587.804 0 3.331 0 3.331-2.158-.978-3.61-2.797-3.61-4.88 0-3.116 3.247-4.454 7.252-4.454 4.004 0 7.251 1.338 7.251 4.454 0 2.218-1.646 4.136-4.037 5.059zM23.667 82.532a.504.504 0 0 1-.102.01c-.919 0-2.614-2.064-3.278-5.794-.315-1.766-.308-3.466.019-4.787.256-1.035.699-1.728 1.156-1.81a.586.586 0 0 1 .102-.009c.174 0 .376.075.594.22.048 3.98.619 8.08 1.656 12.122a.601.601 0 0 1-.147.048zm73.911-36.694a4.79 4.79 0 0 0-1.446-8.199 4.784 4.784 0 0 0-2.849-7.823 4.784 4.784 0 0 0-4.164-7.207 4.784 4.784 0 0 0-5.351-6.377 4.783 4.783 0 0 0-6.377-5.351 4.784 4.784 0 0 0-7.207-4.164 4.787 4.787 0 0 0-7.823-2.849 4.787 4.787 0 0 0-8.199-1.446 4.786 4.786 0 0 0-8.325 0 4.788 4.788 0 0 0-8.198 1.446 4.788 4.788 0 0 0-7.824 2.849A4.785 4.785 0 0 0 25 6.698a4.784 4.784 0 0 0-2.391 4.183 4.781 4.781 0 0 0-6.377 5.351 4.783 4.783 0 0 0-5.351 6.377 4.784 4.784 0 0 0-4.164 7.207 4.787 4.787 0 0 0-2.849 7.823 4.785 4.785 0 0 0-3.109 3.679 4.79 4.79 0 0 0 1.662 4.52 4.787 4.787 0 0 0 0 8.325 4.79 4.79 0 0 0 1.447 8.198 4.788 4.788 0 0 0 2.849 7.824A4.785 4.785 0 0 0 6.698 75a4.784 4.784 0 0 0 4.183 2.391 4.781 4.781 0 0 0 5.351 6.377 4.783 4.783 0 0 0 6.377 5.351A4.784 4.784 0 0 0 25 93.302c.242.139.493.251.746.344 3.486 11.867 13.028 22.769 24.254 22.769s20.767-10.902 24.253-22.769c.254-.093.504-.205.747-.344a4.784 4.784 0 0 0 2.391-4.183 4.781 4.781 0 0 0 6.377-5.351 4.783 4.783 0 0 0 5.351-6.377A4.784 4.784 0 0 0 93.302 75a4.787 4.787 0 0 0-.019-4.815 4.788 4.788 0 0 0 2.849-7.824 4.787 4.787 0 0 0 1.446-8.198 4.788 4.788 0 0 0 0-8.325z" fill="#1c2327" fill-rule="nonzero"/></svg>',
'<svg class="fill-current" width="80" height="80" xmlns="http://www.w3.org/2000/svg" fill-rule="evenodd" stroke-linejoin="round" stroke-miterlimit="2" clip-rule="evenodd" viewBox="0 0 100 117"><path fill="#1c2327" fill-rule="nonzero" d="M134.58,130.535C133.459,136.834 130.595,140.317 129.046,140.317C128.988,140.317 128.929,140.311 128.873,140.302C128.789,140.287 128.707,140.257 128.625,140.219C130.377,133.395 131.339,126.473 131.421,119.755C131.788,119.51 132.129,119.383 132.423,119.383C132.481,119.383 132.539,119.388 132.595,119.398C134.164,119.678 135.716,124.155 134.58,130.535ZM113.773,110.157C110.048,109.905 104.623,109.409 99.771,109.988C99.794,109.899 99.81,109.808 99.81,109.711C99.81,109.1 99.314,108.604 98.702,108.604L84.415,108.604L84.415,108.6L70.127,108.6C69.515,108.6 69.019,109.096 69.019,109.708C69.019,109.804 69.035,109.896 69.058,109.985C64.207,109.405 58.782,109.902 55.057,110.154C49.839,110.506 45.404,112.329 42.629,115.748C42.995,106.464 45.024,98.294 48.473,91.522C49.1,91.337 49.704,91.078 50.272,90.745C50.744,93.523 52.651,95.975 55.488,97.008C58.323,98.04 61.359,97.388 63.506,95.566C64.454,98.217 66.757,100.299 69.728,100.823C72.7,101.347 75.576,100.178 77.374,98.011C78.768,100.458 81.398,102.108 84.415,102.108C87.432,102.108 90.062,100.458 91.456,98.011C93.253,100.178 96.13,101.347 99.101,100.823C102.073,100.299 104.377,98.217 105.324,95.566C107.471,97.388 110.507,98.04 113.342,97.008C116.179,95.975 118.086,93.523 118.558,90.745C119.126,91.078 119.73,91.337 120.357,91.522C123.806,98.295 125.836,106.466 126.201,115.751C123.426,112.332 118.991,110.51 113.773,110.157ZM95.945,112.81C97.531,112.233 100.239,111.836 100.662,113.262C101.171,114.98 93.489,121.039 91.851,121.491C90.212,121.943 91.083,117.664 91.988,116.147C92.822,114.748 94.348,113.391 95.945,112.81ZM95.675,110.819C92.983,111.651 90.778,113.056 89.609,115.353C88.419,113.494 86.537,112.285 84.415,112.285C82.293,112.285 80.411,113.493 79.221,115.352C78.053,113.054 75.848,111.648 73.155,110.816L84.415,110.816L84.415,110.819L95.675,110.819ZM121.981,144.573C117.51,151.428 110.708,155.686 102.484,157.982C99.628,154.177 94.849,151.358 89.181,150.33C88.356,151.785 86.535,152.799 84.415,152.799C82.295,152.799 80.473,151.785 79.648,150.33C74.045,151.347 69.308,154.113 66.442,157.852C58.165,155.496 51.257,151.184 46.757,144.294C46.36,143.068 45.991,141.835 45.648,140.598C48.933,143.837 53.249,145.68 57.852,145.369C66.934,144.755 80.045,130.379 80.128,119.65C80.262,116.782 82.131,114.5 84.415,114.5C86.7,114.5 88.569,116.784 88.702,119.653C88.785,130.382 101.896,144.758 110.978,145.372C115.581,145.683 119.896,143.84 123.181,140.603C122.812,141.932 122.412,143.256 121.981,144.573ZM90.202,178.216L90.202,172.29L78.628,172.29L78.628,177.914C74.984,176.263 72.533,173.193 72.533,169.676C72.533,164.414 78.014,162.155 84.776,162.155C91.537,162.155 97.018,164.414 97.018,169.676C97.018,173.421 94.24,176.659 90.202,178.216ZM44.091,117.396C44.926,115.996 46.451,114.64 48.049,114.059C49.634,113.482 52.342,113.085 52.765,114.511C53.274,116.229 45.593,122.288 43.954,122.74C42.316,123.192 43.186,118.912 44.091,117.396ZM39.956,140.302C39.9,140.311 39.842,140.317 39.784,140.317C38.234,140.317 35.371,136.833 34.25,130.535C33.114,124.155 34.666,119.678 36.234,119.398C36.291,119.388 36.349,119.383 36.407,119.383C36.701,119.383 37.042,119.51 37.409,119.755C37.491,126.473 38.453,133.395 40.205,140.219C40.123,140.257 40.04,140.287 39.956,140.302ZM164.741,78.35C166.904,76.556 168.071,73.685 167.548,70.719C167.025,67.753 164.947,65.454 162.3,64.508C164.119,62.366 164.77,59.336 163.74,56.506C162.709,53.675 160.261,51.771 157.489,51.3C158.909,48.874 159.027,45.778 157.521,43.17C156.014,40.56 153.272,39.115 150.46,39.132C151.439,36.496 151.018,33.425 149.081,31.117C147.144,28.808 144.193,27.861 141.426,28.367C141.932,25.6 140.984,22.649 138.676,20.712C136.368,18.775 133.297,18.354 130.66,19.333C130.677,16.521 129.231,13.779 126.623,12.272C124.015,10.766 120.919,10.884 118.493,12.304C118.022,9.532 116.118,7.084 113.287,6.053C110.457,5.023 107.427,5.674 105.284,7.493C104.338,4.846 102.039,2.768 99.073,2.245C96.108,1.722 93.236,2.889 91.442,5.052C90.051,2.61 87.426,0.962 84.415,0.962C81.403,0.962 78.778,2.61 77.387,5.052C75.593,2.889 72.722,1.722 69.756,2.245C66.791,2.768 64.492,4.846 63.546,7.493C61.403,5.674 58.373,5.023 55.543,6.053C52.712,7.084 50.808,9.532 50.337,12.304C47.911,10.884 44.815,10.766 42.207,12.272C39.598,13.779 38.152,16.521 38.17,19.333C35.533,18.354 32.462,18.775 30.154,20.712C27.845,22.649 26.898,25.6 27.404,28.367C24.637,27.861 21.686,28.808 19.749,31.117C17.812,33.425 17.391,36.496 18.37,39.132C15.558,39.115 12.816,40.56 11.309,43.17C9.803,45.778 9.921,48.874 11.341,51.3C8.569,51.771 6.121,53.675 5.09,56.506C4.06,59.336 4.711,62.366 6.53,64.508C3.883,65.455 1.805,67.753 1.282,70.719C0.759,73.685 1.926,76.556 4.089,78.35C1.647,79.741 0,82.366 0,85.378C0,88.389 1.647,91.014 4.089,92.405C1.926,94.199 0.759,97.07 1.282,100.036C1.805,103.001 3.883,105.3 6.53,106.246C4.711,108.389 4.06,111.419 5.09,114.249C6.121,117.08 8.569,118.984 11.341,119.455C9.921,121.881 9.803,124.976 11.309,127.585C12.816,130.194 15.558,131.64 18.37,131.622C17.391,134.259 17.812,137.33 19.749,139.638C21.686,141.946 24.637,142.894 27.404,142.388C26.898,145.155 27.845,148.106 30.154,150.043C32.462,151.98 35.533,152.401 38.17,151.422C38.152,154.234 39.598,156.976 42.207,158.483C42.616,158.719 43.039,158.907 43.467,159.064C49.353,179.099 65.462,197.505 84.415,197.505C103.368,197.505 119.477,179.099 125.363,159.064C125.791,158.907 126.214,158.719 126.623,158.483C129.231,156.976 130.677,154.234 130.66,151.422C133.297,152.401 136.368,151.98 138.676,150.043C140.984,148.106 141.932,145.155 141.426,142.388C144.193,142.894 147.144,141.946 149.081,139.638C151.018,137.33 151.439,134.259 150.46,131.622C153.272,131.64 156.014,130.194 157.521,127.585C159.027,124.976 158.909,121.881 157.489,119.455C160.261,118.984 162.709,117.08 163.74,114.249C164.77,111.419 164.119,108.389 162.3,106.246C164.947,105.3 167.025,103.001 167.548,100.036C168.071,97.07 166.904,94.199 164.741,92.405C167.183,91.014 168.83,88.389 168.83,85.378C168.83,82.366 167.183,79.741 164.741,78.35Z" transform="translate(0 -.57) scale(.59231)"/></svg>',
'<svg class="fill-current" width="80" height="80" xmlns="http://www.w3.org/2000/svg" fill-rule="evenodd" stroke-linejoin="round" stroke-miterlimit="2" clip-rule="evenodd" viewBox="0 0 100 113"><path fill="#1c2327" fill-rule="nonzero" d="M549.13,119.398C549.186,119.388 549.244,119.383 549.303,119.383C549.596,119.383 549.938,119.51 550.305,119.755C550.387,126.473 551.349,133.395 553.101,140.219C553.019,140.257 552.936,140.287 552.852,140.302C552.796,140.311 552.738,140.317 552.68,140.317C551.13,140.317 548.267,136.833 547.145,130.535C546.009,124.155 547.562,119.678 549.13,119.398ZM561.369,91.522C561.996,91.337 562.6,91.078 563.168,90.745C563.64,93.523 565.547,95.975 568.384,97.008C571.219,98.04 574.255,97.388 576.401,95.566C577.349,98.217 579.653,100.299 582.624,100.823C585.595,101.347 588.472,100.178 590.269,98.011C591.663,100.458 594.293,102.108 597.311,102.108C600.328,102.108 602.958,100.458 604.352,98.011C606.149,100.178 609.026,101.347 611.997,100.823C614.968,100.299 617.272,98.217 618.22,95.566C620.366,97.388 623.402,98.04 626.237,97.008C629.074,95.975 630.981,93.523 631.453,90.745C632.021,91.078 632.625,91.337 633.252,91.522C636.701,98.295 638.731,106.466 639.097,115.751C636.321,112.332 631.887,110.51 626.668,110.157C622.943,109.905 617.518,109.409 612.667,109.988C612.69,109.899 612.706,109.808 612.706,109.711C612.706,109.1 612.21,108.604 611.598,108.604L597.311,108.604L597.311,108.6L583.023,108.6C582.411,108.6 581.915,109.096 581.915,109.708C581.915,109.804 581.931,109.896 581.954,109.985C577.102,109.405 571.678,109.902 567.953,110.154C562.734,110.506 558.3,112.329 555.525,115.748C555.89,106.464 557.92,98.294 561.369,91.522ZM608.841,112.81C610.427,112.233 613.134,111.836 613.557,113.262C614.067,114.98 606.385,121.039 604.747,121.491C603.108,121.943 603.979,117.664 604.883,116.147C605.718,114.748 607.244,113.391 608.841,112.81ZM608.571,110.819C605.878,111.651 603.673,113.056 602.505,115.353C601.315,113.494 599.432,112.285 597.311,112.285C595.189,112.285 593.307,113.493 592.117,115.352C590.949,113.054 588.743,111.648 586.05,110.816L597.311,110.816L597.311,110.819L608.571,110.819ZM627.853,160.602C623.974,159.164 619.894,157.206 616.666,154.606C611.763,150.657 606.607,148.091 602.46,147.244C601.332,148.793 599.447,149.81 597.31,149.81C595.174,149.81 593.289,148.793 592.161,147.244C588.014,148.091 582.858,150.657 577.955,154.606C574.727,157.206 570.647,159.164 566.768,160.602C563.241,154.308 560.463,147.521 558.544,140.598C561.829,143.837 566.145,145.68 570.748,145.369C579.829,144.755 592.94,130.379 593.023,119.65C593.157,116.783 595.026,114.5 597.311,114.5C599.596,114.5 601.465,116.784 601.598,119.653C601.68,130.382 614.791,144.758 623.873,145.372C628.476,145.683 632.791,143.84 636.076,140.603C634.157,147.524 631.38,154.31 627.853,160.602ZM597.31,186.011C590.224,186.011 582.271,181.167 575.091,172.717C579.574,172.816 584.394,171.724 589.155,168.514C589.929,167.992 590.667,167.447 591.367,166.886C594.865,164.081 599.756,164.081 603.254,166.886C603.954,167.447 604.692,167.992 605.466,168.514C610.227,171.724 615.047,172.816 619.53,172.717C612.35,181.167 604.397,186.011 597.31,186.011ZM556.987,117.396C557.822,115.996 559.347,114.64 560.945,114.059C562.53,113.482 565.238,113.085 565.661,114.511C566.17,116.229 558.488,122.288 556.85,122.74C555.211,123.192 556.082,118.912 556.987,117.396ZM644.316,119.755C644.684,119.51 645.025,119.383 645.318,119.383C645.377,119.383 645.435,119.388 645.491,119.398C647.059,119.678 648.612,124.155 647.476,130.535C646.354,136.834 643.492,140.317 641.942,140.317C641.883,140.317 641.825,140.311 641.769,140.302C641.685,140.287 641.602,140.257 641.52,140.219C643.272,133.395 644.234,126.473 644.316,119.755ZM512.895,85.378C512.895,88.389 514.543,91.014 516.985,92.405C514.822,94.199 513.655,97.07 514.177,100.036C514.701,103.001 516.779,105.3 519.425,106.246C517.607,108.389 516.956,111.419 517.986,114.249C519.017,117.08 521.465,118.984 524.237,119.455C522.817,121.881 522.698,124.976 524.205,127.585C525.711,130.194 528.453,131.64 531.266,131.622C530.287,134.259 530.708,137.33 532.645,139.638C534.582,141.946 537.533,142.894 540.299,142.388C539.793,145.155 540.741,148.106 543.049,150.043C545.358,151.98 548.429,152.401 551.065,151.422C551.048,154.234 552.493,156.976 555.103,158.483C556.744,159.431 558.579,159.731 560.319,159.475C560.787,160.404 561.269,161.325 561.766,162.236C557.284,163.518 553.92,164.031 553.92,164.031C553.92,164.031 559.571,169.082 567.57,171.484C576.621,184.055 587.3,191.179 597.31,191.179C607.321,191.179 618,184.055 627.051,171.484C635.049,169.082 640.701,164.031 640.701,164.031C640.701,164.031 637.337,163.518 632.855,162.236C633.352,161.325 633.834,160.404 634.302,159.475C636.042,159.731 637.877,159.431 639.518,158.483C642.128,156.976 643.573,154.234 643.556,151.422C646.192,152.401 649.263,151.98 651.572,150.043C653.88,148.106 654.828,145.155 654.322,142.388C657.088,142.894 660.039,141.946 661.976,139.638C663.913,137.33 664.334,134.259 663.355,131.622C666.167,131.64 668.91,130.194 670.416,127.585C671.922,124.976 671.804,121.881 670.384,119.455C673.156,118.984 675.604,117.08 676.635,114.249C677.665,111.419 677.014,108.389 675.196,106.246C677.842,105.3 679.92,103.001 680.443,100.036C680.966,97.07 679.799,94.199 677.636,92.405C680.078,91.014 681.726,88.389 681.726,85.378C681.726,82.366 680.078,79.741 677.636,78.35C679.799,76.556 680.966,73.685 680.443,70.719C679.92,67.753 677.842,65.455 675.196,64.508C677.014,62.366 677.665,59.336 676.635,56.506C675.604,53.675 673.156,51.771 670.384,51.3C671.804,48.874 671.922,45.778 670.416,43.17C668.91,40.56 666.167,39.115 663.355,39.132C664.334,36.496 663.913,33.425 661.976,31.117C660.039,28.808 657.088,27.861 654.322,28.367C654.828,25.6 653.88,22.649 651.572,20.712C649.263,18.775 646.192,18.354 643.556,19.333C643.573,16.521 642.128,13.779 639.518,12.272C636.91,10.766 633.814,10.884 631.388,12.304C630.917,9.532 629.013,7.084 626.182,6.053C623.352,5.023 620.322,5.674 618.18,7.493C617.234,4.846 614.935,2.768 611.969,2.245C609.003,1.722 606.132,2.889 604.338,5.052C602.947,2.61 600.322,0.962 597.31,0.962C594.299,0.962 591.674,2.61 590.283,5.052C588.489,2.889 585.618,1.722 582.652,2.245C579.686,2.768 577.387,4.846 576.441,7.493C574.299,5.674 571.269,5.023 568.439,6.053C565.608,7.084 563.704,9.532 563.233,12.304C560.807,10.884 557.711,10.766 555.103,12.272C552.493,13.779 551.048,16.521 551.065,19.333C548.429,18.354 545.358,18.775 543.049,20.712C540.741,22.649 539.793,25.6 540.299,28.367C537.533,27.861 534.582,28.808 532.645,31.117C530.708,33.425 530.287,36.496 531.266,39.132C528.453,39.115 525.711,40.56 524.205,43.17C522.698,45.778 522.817,48.874 524.237,51.3C521.465,51.771 519.017,53.675 517.986,56.506C516.956,59.336 517.607,62.366 519.425,64.508C516.779,65.454 514.701,67.753 514.177,70.719C513.655,73.685 514.822,76.556 516.985,78.35C514.543,79.741 512.895,82.366 512.895,85.378Z" transform="matrix(.5923 0 0 .5923 -303.792 -.569)"/></svg>',
'<svg class="fill-current" width="80" height="80" xmlns="http://www.w3.org/2000/svg" fill-rule="evenodd" stroke-linejoin="round" stroke-miterlimit="2" clip-rule="evenodd" viewBox="0 0 100 113"><path fill="#1c2327" fill-rule="nonzero" d="M647.476,626.614C646.354,632.913 643.491,636.396 641.942,636.396C641.883,636.396 641.825,636.391 641.769,636.381C641.686,636.366 641.603,636.337 641.52,636.299C643.272,629.475 644.234,622.552 644.316,615.834C644.683,615.589 645.025,615.462 645.318,615.462C645.376,615.462 645.435,615.468 645.491,615.478C647.059,615.757 648.612,620.234 647.476,626.614ZM626.668,606.236C622.943,605.984 617.518,605.488 612.667,606.068C612.69,605.978 612.706,605.887 612.706,605.79C612.706,605.179 612.21,604.683 611.598,604.683L597.311,604.683L597.311,604.68L583.023,604.68C582.411,604.68 581.915,605.176 581.915,605.787C581.915,605.884 581.931,605.975 581.954,606.064C577.102,605.485 571.678,605.981 567.953,606.233C562.734,606.586 558.3,608.408 555.525,611.827C555.891,602.543 557.92,594.373 561.369,587.601C561.996,587.416 562.6,587.156 563.168,586.824C563.64,589.601 565.547,592.054 568.384,593.087C571.219,594.118 574.255,593.467 576.401,591.644C577.349,594.296 579.653,596.378 582.624,596.902C585.595,597.426 588.472,596.257 590.269,594.09C591.663,596.536 594.293,598.187 597.31,598.187C600.328,598.187 602.958,596.536 604.352,594.09C606.149,596.257 609.026,597.426 611.997,596.902C614.968,596.378 617.272,594.296 618.22,591.644C620.366,593.467 623.402,594.118 626.237,593.087C629.074,592.054 630.981,589.601 631.453,586.824C632.021,587.156 632.625,587.416 633.252,587.601C636.701,594.374 638.731,602.546 639.097,611.83C636.321,608.412 631.887,606.589 626.668,606.236ZM608.841,608.889C610.427,608.312 613.134,607.915 613.557,609.341C614.067,611.059 606.385,617.118 604.747,617.57C603.108,618.022 603.979,613.743 604.883,612.226C605.718,610.827 607.244,609.47 608.841,608.889ZM608.571,606.898C605.878,607.73 603.673,609.135 602.505,611.433C601.315,609.573 599.432,608.364 597.311,608.364C595.189,608.364 593.307,609.573 592.117,611.431C590.949,609.133 588.743,607.727 586.05,606.895L597.311,606.895L597.311,606.898L608.571,606.898ZM625.219,661.075C624.057,662.884 622.857,664.589 621.629,666.192L621.629,662.925C621.629,652.353 613.058,643.783 602.486,643.783L602.261,643.783C601.118,645.188 599.328,646.097 597.31,646.097C595.293,646.097 593.503,645.188 592.36,643.783L592.135,643.783C581.563,643.783 572.992,652.353 572.992,662.925L572.992,666.191C571.764,664.589 570.564,662.884 569.402,661.075C564.605,653.603 560.919,645.243 558.544,636.678C561.829,639.916 566.145,641.76 570.748,641.448C579.829,640.834 592.94,626.458 593.023,615.729C593.157,612.862 595.026,610.579 597.311,610.579C599.596,610.579 601.465,612.863 601.598,615.732C601.68,626.461 614.791,640.837 623.873,641.452C628.476,641.763 632.791,639.92 636.076,636.682C633.701,645.245 630.015,653.605 625.219,661.075ZM597.311,682.091C592.67,682.091 587.657,680.009 582.733,676.202C582.733,676.174 582.735,676.151 582.735,676.123L582.735,668.056C582.735,660.207 588.766,653.454 596.606,653.085C604.976,652.691 611.886,659.361 611.886,667.644L611.886,676.123C611.886,676.151 611.888,676.174 611.888,676.202C606.964,680.009 601.951,682.091 597.311,682.091ZM556.987,613.475C557.822,612.076 559.347,610.719 560.945,610.138C562.53,609.561 565.238,609.164 565.661,610.59C566.17,612.308 558.488,618.367 556.85,618.819C555.211,619.271 556.082,614.992 556.987,613.475ZM552.852,636.381C552.796,636.391 552.738,636.396 552.68,636.396C551.13,636.396 548.267,632.912 547.145,626.614C546.009,620.234 547.562,615.757 549.13,615.478C549.186,615.468 549.244,615.462 549.303,615.462C549.596,615.462 549.938,615.589 550.305,615.835C550.387,622.552 551.349,629.475 553.101,636.299C553.018,636.337 552.935,636.366 552.852,636.381ZM681.726,581.456C681.726,578.445 680.078,575.82 677.636,574.429C679.799,572.635 680.966,569.764 680.443,566.798C679.92,563.832 677.842,561.533 675.196,560.587C677.014,558.445 677.665,555.415 676.635,552.585C675.604,549.754 673.156,547.85 670.384,547.379C671.804,544.953 671.922,541.857 670.416,539.249C668.91,536.639 666.167,535.193 663.355,535.211C664.334,532.575 663.913,529.504 661.976,527.195C660.039,524.887 657.088,523.939 654.322,524.445C654.828,521.679 653.88,518.728 651.572,516.791C649.263,514.855 646.192,514.433 643.556,515.412C643.573,512.599 642.128,509.857 639.518,508.351C636.91,506.845 633.814,506.963 631.388,508.383C630.917,505.611 629.013,503.163 626.182,502.132C623.352,501.102 620.322,501.753 618.18,503.571C617.234,500.925 614.935,498.847 611.969,498.324C609.003,497.801 606.132,498.968 604.338,501.131C602.947,498.689 600.322,497.041 597.31,497.041C594.299,497.041 591.674,498.689 590.283,501.131C588.489,498.968 585.618,497.801 582.652,498.324C579.686,498.847 577.387,500.925 576.441,503.571C574.299,501.753 571.269,501.102 568.439,502.132C565.608,503.163 563.704,505.611 563.233,508.383C560.807,506.963 557.711,506.845 555.103,508.351C552.493,509.857 551.048,512.599 551.065,515.412C548.429,514.433 545.358,514.855 543.049,516.791C540.741,518.728 539.793,521.679 540.299,524.445C537.533,523.939 534.582,524.887 532.645,527.195C530.708,529.504 530.287,532.575 531.266,535.211C528.453,535.193 525.711,536.639 524.205,539.249C522.698,541.857 522.817,544.953 524.237,547.379C521.465,547.85 519.017,549.754 517.986,552.585C516.956,555.415 517.607,558.445 519.425,560.587C516.779,561.533 514.701,563.832 514.177,566.798C513.655,569.764 514.822,572.635 516.985,574.429C514.543,575.82 512.895,578.445 512.895,581.456C512.895,584.468 514.543,587.093 516.985,588.484C514.822,590.278 513.655,593.149 514.177,596.115C514.701,599.081 516.779,601.38 519.425,602.326C517.607,604.468 516.956,607.498 517.986,610.328C519.017,613.159 521.465,615.063 524.237,615.534C522.817,617.96 522.698,621.056 524.205,623.664C525.711,626.274 528.453,627.719 531.266,627.702C530.287,630.338 530.708,633.409 532.645,635.717C534.582,638.026 537.533,638.973 540.299,638.467C539.793,641.234 540.741,644.185 543.049,646.122C545.358,648.059 548.429,648.48 551.065,647.501C551.048,650.313 552.493,653.055 555.103,654.562C556.745,655.51 558.579,655.811 560.319,655.554C561.759,658.414 563.339,661.195 565.054,663.867C574.599,678.732 586.356,687.258 597.311,687.258C608.265,687.258 620.022,678.732 629.567,663.867C631.282,661.195 632.862,658.414 634.302,655.554C636.042,655.811 637.877,655.51 639.518,654.562C642.128,653.055 643.573,650.313 643.556,647.501C646.192,648.48 649.263,648.059 651.572,646.122C653.88,644.185 654.828,641.234 654.322,638.467C657.088,638.973 660.039,638.026 661.976,635.717C663.913,633.409 664.334,630.338 663.355,627.702C666.167,627.719 668.91,626.274 670.416,623.664C671.922,621.056 671.804,617.96 670.384,615.534C673.156,615.063 675.604,613.159 676.635,610.328C677.665,607.498 677.014,604.468 675.196,602.326C677.842,601.379 679.92,599.081 680.443,596.115C680.966,593.149 679.799,590.278 677.636,588.484C680.078,587.093 681.726,584.468 681.726,581.456Z" transform="matrix(.5923 0 0 .5923 -303.792 -294.401)"/></svg>'
],
selectedImage: ''
}
},
created () {
const idx = Math.floor(Math.random() * this.logos.length)
this.selectedImage = this.logos[idx]
}
}
</script>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment