a/it-tools
1
0
Fork 0
mirror of https://github.com/Art051/it-tools.git synced 2025-08-11 19:29:03 +00:00
Code Issues Actions Packages Projects Releases Wiki Activity

feat: added colored share card

Browse Source
This commit is contained in:
Corentin Thomasset
2022-08-17 15:09:43 +02:00
parent 5222bd5d04
commit ab7483b5c2
2 changed files with 84 additions and 0 deletions
Download Patch File Download Diff File Expand all files Collapse all files

23
src/pages/Home.page.vue
View File

@@ -1,6 +1,8 @@
<script setup lang="ts">
import { toolsWithCategory } from '@/tools';
import { Heart } from '@vicons/tabler';
import { useHead } from '@vueuse/head';
import ColoredCard from '../components/ColoredCard.vue';
import ToolCard from '../components/ToolCard.vue';
useHead({ title: 'IT Tools - Handy online tools for developers' });
@@ -9,6 +11,27 @@ useHead({ title: 'IT Tools - Handy online tools for developers' });
<template>
<div class="home-page">
<n-grid x-gap="12" y-gap="12" cols="1 400:2 800:3 1200:4 2000:8">
<n-gi>
<colored-card title="You like it-tools?" :icon="Heart">
Give us a star on
<a
href="https://github.com/CorentinTh/it-tools"
rel="noopener"
target="_blank"
aria-label="IT-Tools' github repository"
>github</a
>
or follow us on
<a
href="https://twitter.com/ittoolsdottech"
rel="noopener"
target="_blank"
aria-label="IT-Tools' twitter account"
>twitter</a
>! Thank you
<n-icon :component="Heart" />
</colored-card>
</n-gi>
<n-gi v-for="tool in toolsWithCategory" :key="tool.name">
<tool-card :tool="tool" />
</n-gi>