<template>
  <div>
    <v-container class="justify-center text-center">
      <p class="text-h4">Contact</p>
      <v-row>
        <v-col md="3">
          <v-card class="rounded-xl" elevation="8">
            <br>
            <v-icon>mdi-email</v-icon>
            <v-card-title class="justify-center">Email</v-card-title>

            <v-card-text>
              <a href="mailto:troplo@troplo.com">troplo@troplo.com</a>
            </v-card-text>
          </v-card>
        </v-col>
        <v-col md="3">
          <v-card class="rounded-xl" elevation="8">
            <br>
            <v-icon>mdi-matrix</v-icon>
            <v-card-title class="justify-center">Matrix</v-card-title>

            <v-card-text>
              <a href="https://matrix.to/#/@troplo:troplo.com?via=troplo.com">@troplo:troplo.com</a>
            </v-card-text>
          </v-card>
        </v-col>
        <v-col md="3">
          <v-card class="rounded-xl" elevation="8">
            <br>
            <v-icon>mdi-discord</v-icon>
            <v-card-title class="justify-center">Discord</v-card-title>

            <v-card-text>
              <a href="https://discord.com/users/692259321907773460">
                Troplo#8495
              </a>
            </v-card-text>
          </v-card>
        </v-col>
        <v-col md="3">
          <v-card class="rounded-xl" elevation="8">
            <br>
            <v-icon>mdi-twitter</v-icon>
            <v-card-title class="justify-center">Twitter</v-card-title>

            <v-card-text>
              <a href="https://twitter.com/TheTroplo">@TheTroplo</a>
            </v-card-text>
          </v-card>
        </v-col>
        <v-col md="3">
          <v-card class="rounded-xl" elevation="8">
            <br>
            <v-icon>mdi-send</v-icon>
            <v-card-title class="justify-center">Telegram</v-card-title>

            <v-card-text>
              <a href="https://t.me/Troplo">@Troplo</a>
            </v-card-text>
          </v-card>
        </v-col>
        <v-col md="3">
          <v-card class="rounded-xl" elevation="8">
            <br>
            <v-icon>mdi-github</v-icon>
            <v-card-title class="justify-center">GitHub</v-card-title>

            <v-card-text>
              <a href="https://github.com/Troplo">Troplo</a>
            </v-card-text>
          </v-card>
        </v-col>
        <v-col md="3">
          <v-card class="rounded-xl" elevation="8">
            <br>
            <v-icon>mdi-tea</v-icon>
            <v-card-title class="justify-center">Gitea</v-card-title>

            <v-card-text>
              <a href="https://git.troplo.com/Troplo">Troplo</a>
            </v-card-text>
          </v-card>
        </v-col>
      </v-row>
    </v-container>
  </div>
</template>

<script>
export default {
  name: "Contact"
}
</script>

<style scoped>

</style>