alighasami/vue-flow
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

docs: Remove data script and fetch data in Banner.vue

Browse Source 
* Wrap Banner in suspension
This commit is contained in:
Braks
2022-04-05 09:10:05 +02:00
parent cc76a76415
commit bec26f3363
4 changed files with 11 additions and 19 deletions
Download Patch File Download Diff File Expand all files Collapse all files
docs/components/home/Banner.vue
+7 -4
View File
@@ -1,7 +1,10 @@
<script lang="ts" setup>
import data from '../../.data.json'
import { $fetch } from 'ohmyfetch'
import Star from '~icons/carbon/star'
import Download from '~icons/carbon/download'
const githubData = await $fetch('https://api.github.com/repos/bcakmakoglu/vue-flow?page=$i&per_page=100')
const npmData = await $fetch('https://api.npmjs.org/downloads/point/last-month/@braks/vue-flow')
</script>
<template>
<div class="w-full bg-black text-white border-b-1 border-white">
@@ -9,16 +12,16 @@ import Download from '~icons/carbon/download'
<div class="grid md:grid-cols-3 gap-3 text-center <md:divide-y md:divide-x divide-white">
<div class="grid grid-rows-auto gap-2 py-4 md:py-0">
<div class="text-gray-400 font-semibold text-lg">Stargazers</div>
<div class="font-bold text-3xl flex gap-2 items-center justify-center"><Star /> {{ data.stargazers_count }}</div>
<div class="font-bold text-3xl flex gap-2 items-center justify-center"><Star /> {{ githubData.stargazers_count }}</div>
</div>
<div class="grid grid-rows-2 gap-2 py-4 md:py-0">
<div class="text-gray-400 font-semibold text-lg">Downloads (last month)</div>
<div class="font-bold text-3xl flex gap-2 items-center justify-center"><Download /> {{ data.downloads }}</div>
<div class="font-bold text-3xl flex gap-2 items-center justify-center"><Download /> {{ npmData.downloads }}</div>
</div>
<div class="grid grid-rows-2 gap-2 py-4 md:py-0">
<div class="text-gray-400 font-semibold text-lg">License</div>
<div class="font-bold text-3xl">
{{ data.license.key.toUpperCase() }}
{{ githubData.license.key.toUpperCase() }}
</div>
</div>
</div>