|
@@ -18,12 +18,10 @@
|
|
|
|
|
|
|
|
<template>
|
|
<template>
|
|
|
<div :class="{ 'dropdown-inline': inline }">
|
|
<div :class="{ 'dropdown-inline': inline }">
|
|
|
- <a v-if="inline" href="javascript: void(0);" @click="toggleMenu">
|
|
|
|
|
|
|
+ <hue-link v-if="inline" @click="toggleMenu">
|
|
|
{{ text }} <i class="fa fa-caret-down" />
|
|
{{ text }} <i class="fa fa-caret-down" />
|
|
|
- </a>
|
|
|
|
|
- <button v-else class="btn" type="button" @click="toggleMenu">
|
|
|
|
|
- {{ text }} <i class="fa fa-caret-down" />
|
|
|
|
|
- </button>
|
|
|
|
|
|
|
+ </hue-link>
|
|
|
|
|
+ <hue-button v-else @click="toggleMenu"> {{ text }} <i class="fa fa-caret-down" /> </hue-button>
|
|
|
<div :class="{ open: menuOpen }" class="hue-dropdown-container" @click="toggleMenu">
|
|
<div :class="{ open: menuOpen }" class="hue-dropdown-container" @click="toggleMenu">
|
|
|
<div class="hue-dropdown-menu">
|
|
<div class="hue-dropdown-menu">
|
|
|
<ul>
|
|
<ul>
|
|
@@ -35,11 +33,14 @@
|
|
|
</template>
|
|
</template>
|
|
|
|
|
|
|
|
<script lang="ts">
|
|
<script lang="ts">
|
|
|
|
|
+ import HueButton from '../HueButton.vue';
|
|
|
|
|
+ import HueLink from '../HueLink.vue';
|
|
|
import Vue from 'vue';
|
|
import Vue from 'vue';
|
|
|
import Component from 'vue-class-component';
|
|
import Component from 'vue-class-component';
|
|
|
import { Prop } from 'vue-property-decorator';
|
|
import { Prop } from 'vue-property-decorator';
|
|
|
-
|
|
|
|
|
- @Component
|
|
|
|
|
|
|
+ @Component({
|
|
|
|
|
+ components: { HueButton, HueLink }
|
|
|
|
|
+ })
|
|
|
export default class Dropdown extends Vue {
|
|
export default class Dropdown extends Vue {
|
|
|
@Prop({ required: false, default: '' })
|
|
@Prop({ required: false, default: '' })
|
|
|
text: string;
|
|
text: string;
|