dan/design
1
0
Fork 0
mirror of https://github.com/danbulant/design synced 2026-07-09 13:00:57 +00:00
Code Issues Projects Releases Packages Wiki Activity Actions

add mastodon contact link

Browse source
This commit is contained in:
Daniel Bulant 2022-11-19 16:52:14 +01:00
parent 26c6baa77e
commit 587ac7ff7e
1 changed files with 58 additions and 46 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

26
src/lib/components/contact.svelte
View file

@ -14,6 +14,7 @@
</script> </script>
<div class="rounded-lg bg-dark-800 text-gray-300 max-w-100 m-auto mb-5 mt-15 p-5"> <div class="rounded-lg bg-dark-800 text-gray-300 max-w-100 m-auto mb-5 mt-15 p-5">
<div class="list">
<a href="https://goo.gl/maps/pM3bGyx9u5uBuqqv5" class="flex items-center justify-center w-full p-5" rel="noreferrer noopener" target="_blank"> <a href="https://goo.gl/maps/pM3bGyx9u5uBuqqv5" class="flex items-center justify-center w-full p-5" rel="noreferrer noopener" target="_blank">
<div class="text-gray-400 h-7 w-7"> <div class="text-gray-400 h-7 w-7">
<Location /> <Location />
@ -21,34 +22,44 @@
Prague, Czech Republic Prague, Czech Republic
</a> </a>
<div class="profiles"> <div class="profiles">
<a href="https://github.com/danbulant" use:goatCounter data-goatcounter-click="contact-github" rel="noreferrer noopener" target="_blank"> <a href="https://github.com/danbulant" use:goatCounter data-goatcounter-click="contact-github" rel="me" target="_blank">
<span class="platform">GitHub</span> <span class="platform">GitHub</span>
<div class="main"> <div class="main">
<img src="/tech/github.png" alt="" draggable={false}> <img src="/tech/github.png" alt="" draggable={false}>
<span class="name">danbulant</span> <span class="name">danbulant</span>
</div> </div>
</a> </a>
<a href="https://www.linkedin.com/in/danbulant/" use:goatCounter data-goatcounter-click="contact-linkedin" rel="noreferrer noopener" target="_blank"> <a href="https://www.linkedin.com/in/danbulant/" use:goatCounter data-goatcounter-click="contact-linkedin" rel="me" target="_blank">
<span class="platform">LinkedIn</span> <span class="platform">LinkedIn</span>
<div class="main"> <div class="main">
<img src="/tech/linkedin.png" class="rounded-1" alt="" draggable={false}> <img src="/tech/linkedin.png" class="rounded-1" alt="" draggable={false}>
<span class="name">danbulant</span> <span class="name">danbulant</span>
</div> </div>
</a> </a>
<a href="https://discord.gg/XKPbz5xRuK" use:goatCounter data-goatcounter-click="contact-discord" rel="noreferrer noopener" target="_blank"> <a href="https://discord.gg/XKPbz5xRuK" use:goatCounter data-goatcounter-click="contact-discord" target="_blank">
<span class="platform">Discord</span> <span class="platform">Discord</span>
<div class="main"> <div class="main">
<img src="/tech/discord.png" alt="" draggable={false}> <img src="/tech/discord.png" alt="" draggable={false}>
<span class="name">TechmandanCZ#3372</span> <span class="name">TechmandanCZ#3372</span>
</div> </div>
</a> </a>
<a href="https://twitter.com/danbulant" use:goatCounter data-goatcounter-click="contact-twitter" rel="noreferrer noopener" target="_blank"> <a href="https://twitter.com/danbulant" use:goatCounter data-goatcounter-click="contact-twitter" rel="me" target="_blank">
<span class="platform">Twitter</span> <span class="platform">Twitter</span>
<div class="main"> <div class="main">
<img src="/tech/twitter.png" alt="" draggable={false}> <img src="/tech/twitter.png" alt="" draggable={false}>
<span class="name">danbulant</span> <span class="name">@danbulant</span>
</div> </div>
</a> </a>
<div>
<span class="platform">Mastodon</span>
<div class="main">
<img src="/tech/mastodon.png" alt="" draggable={false}>
<div class="flex flex-col">
<a rel="me" use:goatCounter data-goatcounter-click="contact-mastodon" href="https://mastodon.social/danbulant" class="name !hover:underline">@danbulant@mastodon.social</a>
<a rel="me" use:goatCounter data-goatcounter-click="contact-layer8" href="https://layer8.space/@techmandan" class="name !hover:underline">@techmandan@layer8.space</a>
</div>
</div>
</div>
<a href="mailto:me@danbulant.eu" use:goatCounter data-goatcounter-click="contact-email"> <a href="mailto:me@danbulant.eu" use:goatCounter data-goatcounter-click="contact-email">
<span class="platform">Email</span> <span class="platform">Email</span>
<div class="main"> <div class="main">
@ -65,18 +76,19 @@
</div> </div>
</div> </div>
</div> </div>
</div>
<style> <style>
.platform { .platform {
@apply text-gray-400; @apply text-gray-400;
} }
.main { .main {
@apply flex gap-3 pt-1; @apply flex gap-3 pt-1 items-center;
} }
.profiles { .profiles {
@apply max-w-80 m-auto flex flex-col; @apply max-w-80 m-auto flex flex-col;
} }
a:active, a:hover { a:hover, a:active {
@apply no-underline; @apply no-underline;
} }
a:active .main, a:hover .main { a:active .main, a:hover .main {