summaryrefslogtreecommitdiff
path: root/app/assets/javascripts/super_sidebar/components/nav_item.vue
blob: 4fd6918fd6f906af3edca40afbedbd17b997529f (plain)
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
<script>
import { GlIcon } from '@gitlab/ui';

export default {
  name: 'NavItem',
  components: {
    GlIcon,
  },
  props: {
    item: {
      type: Object,
      required: true,
    },
  },
};
</script>

<template>
  <li>
    <a
      :href="item.link"
      class="gl-display-flex gl-pl-3 gl-py-3 gl-line-height-normal gl-text-black-normal gl-hover-bg-t-gray-a-08"
    >
      <div class="gl-mr-3">
        <slot name="icon">
          <gl-icon v-if="item.icon" :name="item.icon" />
        </slot>
      </div>
      <div class="gl-pr-3">
        {{ item.title }}
        <div v-if="item.subtitle" class="gl-font-sm gl-text-gray-500 gl-mt-1">
          {{ item.subtitle }}
        </div>
      </div>
    </a>
  </li>
</template>