mirror of
https://github.com/muerwre/muerwre.github.io.git
synced 2025-04-25 02:46:39 +07:00
52 lines
1.2 KiB
Vue
52 lines
1.2 KiB
Vue
<template>
|
|
<div :class="$style.grid">
|
|
<ContactRow value="@vv4000" href="https://t.me/vv4000" label="Telegram">
|
|
<IconsTelegram :width="24" :height="24" />
|
|
</ContactRow>
|
|
|
|
<ContactRow
|
|
:value="`@${contacts.github}`"
|
|
:href="`https://github.com/${contacts.github}`"
|
|
label="Github"
|
|
>
|
|
<IconsGithub :width="24" :height="24" />
|
|
</ContactRow>
|
|
|
|
<ContactRow
|
|
value="Fedor Katurov"
|
|
:href="contacts.linkedin"
|
|
label="LinkedIn"
|
|
>
|
|
<IconsLinkedin :width="24" :height="24" />
|
|
</ContactRow>
|
|
|
|
<ContactRow :value="mail" :href="`mailto:${mail}`" label="Mail">
|
|
<IconsSend :width="24" :height="24" />
|
|
</ContactRow>
|
|
</div>
|
|
</template>
|
|
|
|
<script lang="ts" setup>
|
|
import { contacts } from "~~/constants/contacts";
|
|
|
|
const mail = ref("...loading");
|
|
|
|
onMounted(() => (mail.value = atob(contacts.email)));
|
|
</script>
|
|
|
|
<style lang="scss" module>
|
|
@import "@/assets/css/mixins";
|
|
|
|
.grid {
|
|
width: auto;
|
|
display: grid;
|
|
grid-template-columns: repeat(auto-fit, minmax(230px, auto));
|
|
gap: 16px;
|
|
align-items: flex-start;
|
|
justify-content: flex-start;
|
|
|
|
@include phone {
|
|
justify-content: stretch;
|
|
}
|
|
}
|
|
</style>
|