arthur/website-old
1
0
Fork 0
mirror of https://github.com/ArthurDanjou/website-old.git synced 2026-01-14 20:19:35 +01:00
Code Issues 31 Packages Projects Releases Wiki Activity

Move social links in a component

Browse Source
This commit is contained in:
Arthur Danjou
2021-08-25 12:49:34 +02:00
parent 8732f7c117
commit 62621587d7
3 changed files with 44 additions and 69 deletions
Download Patch File Download Diff File Expand all files Collapse all files

33
src/components/Footer.vue
View File

@@ -16,26 +16,7 @@
</nuxt-link>
</div>
</div>
<div class="social-links flex space-x-4 mb-8">
<a target="_blank" href="https://twitter.com/ArthurDanj" rel="noopener noreferrer">
<TwitterIcon />
</a>
<a target="_blank" href="https://github.com/ArthurDanjou" rel="noopener noreferrer">
<GithubIcon />
</a>
<a target="_blank" href="https://www.polywork.com/arthurdanjou" rel="noopener noreferrer">
<PolyworkIcon />
</a>
<a target="_blank" href="https://www.twitch.tv/arthurdanjou" rel="noopener noreferrer">
<TwitchIcon />
</a>
<a target="_blank" href="https://discord.gg/ENG6cFQhPS" rel="noopener noreferrer">
<DiscordIcon />
</a>
<a target="_blank" href="mailto:contact@arthurdanjou.fr" rel="noopener noreferrer">
<MailIcon />
</a>
</div>
<SocialList class="flex space-x-4 mb-8" />
</div>
<div class="lg:ml-32 lg:w-1/3">
<h1 class="font-bold mb-4 text-lg underline">
@@ -109,7 +90,7 @@
</template>
<script lang="ts">
import {computed, defineComponent, ref, useAsync, useContext, useRouter, useStore} from "@nuxtjs/composition-api";
import {computed, defineComponent, ref, useAsync, useContext, useStore} from "@nuxtjs/composition-api";
import {State} from "~/types/types";
export default defineComponent({
@@ -167,16 +148,6 @@ export default defineComponent({
@apply text-indigo-600;
}
.social-links a {
svg {
@apply h-6 w-6 duration-300
}
&:hover svg {
@apply transform hover:scale-120
}
}
.link a {
@apply duration-500 border-b-2 border-transparent;

40
src/components/SideMenu.vue
View File

@@ -77,40 +77,14 @@
</div>
</div>
</div>
<div class="social-links flex justify-between space-x-0.5">
<a target="_blank" href="https://twitter.com/ArthurDanj" rel="noopener noreferrer">
<TwitterIcon />
</a>
<a target="_blank" href="https://github.com/ArthurDanjou" rel="noopener noreferrer">
<GithubIcon />
</a>
<a target="_blank" href="https://www.polywork.com/arthurdanjou" rel="noopener noreferrer">
<PolyworkIcon />
</a>
<a target="_blank" href="https://www.twitch.tv/arthurdanjou" rel="noopener noreferrer">
<TwitchIcon />
</a>
<a target="_blank" href="https://discord.gg/ENG6cFQhPS" rel="noopener noreferrer">
<DiscordIcon />
</a>
<a target="_blank" href="mailto:contact@arthurdanjou.fr" rel="noopener noreferrer">
<MailIcon />
</a>
</div>
<SocialList class="flex justify-between space-x-0.5" />
</nav>
</div>
</div>
</template>
<script lang="ts">
import {
computed,
defineComponent,
useAsync,
useContext,
useRouter,
useStore
} from "@nuxtjs/composition-api";
import {computed, defineComponent, useAsync, useContext, useRouter, useStore} from "@nuxtjs/composition-api";
import {State} from "~/types/types";
export default defineComponent({
@@ -175,14 +149,4 @@ export default defineComponent({
.link-active a {
@apply text-indigo-600;
}
.social-links a {
svg {
@apply h-6 w-6 duration-300
}
&:hover svg {
@apply transform hover:scale-120
}
}
</style>

40
src/components/SocialList.vue Normal file
View File

@@ -0,0 +1,40 @@
<template>
<div class="social-links">
<a target="_blank" href="https://twitter.com/ArthurDanj" rel="noopener noreferrer">
<TwitterIcon />
</a>
<a target="_blank" href="https://github.com/ArthurDanjou" rel="noopener noreferrer">
<GithubIcon />
</a>
<a target="_blank" href="https://www.polywork.com/arthurdanjou" rel="noopener noreferrer">
<PolyworkIcon />
</a>
<a target="_blank" href="https://www.twitch.tv/arthurdanjou" rel="noopener noreferrer">
<TwitchIcon />
</a>
<a target="_blank" href="https://go.arthurdanjou.fr/discord" rel="noopener noreferrer">
<DiscordIcon />
</a>
<a target="_blank" href="mailto:contact@arthurdanjou.fr" rel="noopener noreferrer">
<MailIcon />
</a>
</div>
</template>
<script>
export default {
name: "SocialList"
}
</script>
<style lang="scss">
.social-links a {
svg {
@apply h-6 w-6 duration-300
}
&:hover svg {
@apply transform hover:scale-120
}
}
</style>