<script>
  import { _ } from 'svelte-i18n';

  import LanguageSelector from '$/components/language_selector/language_selector.svelte';

  const licenseUrl = 'https://gitlab.com/rbdr/forum/';
</script>

<footer title="{$_('footer.title')}">
  <ul>
    <li>{@html $_('footer.license', { values: { licenseUrl } })}</li>
    <li>{$_('footer.choose_language')}: <LanguageSelector /></li>
  </ul>
</footer>

<style>
  footer {
    grid-column: col-start 1 / span 12;
    border-top: 1px solid black;
  }

  ul {
    padding: 0;
  }

  li {
    display: inline;
    margin: 5px;
  }

  a {
    text-decoration: none;
    line-height: 3em;
    display: inline-block;
  }
</style>
