<template>
  <div class="footer bg-secondary text-center pt-5 pb-4">
    <div class="icons pb-4">
      <a aria-label="Git Link" class="gitea text-white" href="https://git.harting.dev/CSGOWTF" target="_blank">
        <!--        <i class="bi bi-github"></i>-->
        <img alt="Gitea Icon" src="../assets/images/icons/gitea.svg">
      </a>
    </div>
    <div class="text">
      <p>This site is an open source project, originally created and maintained by the <span class="text-warning">CSGOWTF</span>
        team.</p>
      <p class="text-muted">For feedback open an <a class="text-decoration-none text-warning"
                                                    href="https://git.harting.dev/CSGOWTF/csgowtf/issues"
                                                    target="_blank">issue</a>.</p>
    </div>
  </div>
</template>

<script>
export default {
  name: "Footer",
}
</script>

<style lang="scss" scoped>
.footer {
  height: 200px;

  img {
    width: 35px;
    height: 35px;
  }

  a:not(.gitea):focus,
  a:not(.gitea):hover {
    outline: none;
    box-shadow: 0 4px 2px -2px var(--bs-warning);
  }

  .gitea:focus,
  .gitea:hover {
    outline: none;
    filter: brightness(0.4) sepia(1) hue-rotate(15deg) saturate(2);
  }

  p {
    font-size: .85rem;
  }
}
</style>
