userland/src/components/VAlert.vue

<!--
  Copyright 2019 Hackware SpA <human@hackware.cl>
  This file is part of "Hackware Userland" and licensed under the terms
  of the GNU Affero General Public License version 3, or (at your option)
  a later version. You should have received a copy of this license along
  with the software. If not, see <https://www.gnu.org/licenses/>.
-->

<template>
  <div
    class="alert alert-dismissible fade show"
    :class="`alert-${context}`"
    role="alert"
  >
    <slot />
    <button
      class="close"
      type="button"
      data-dismiss="alert"
      aria-label="Close"
    >
      <span aria-hidden="true">&times;</span>
    </button>
  </div>
</template>

<script>
import 'jquery';
import 'bootstrap/js/dist/util';
import 'bootstrap/js/dist/alert';

export default {
  name: 'VAlert',
  props: {
    context: {
      type: String,
      default: 'info',
    },
  },
};
</script>

<style>
.alert a {
  @extend .alert-link;
}
</style>