DigitalConsumer.ISS/src/iss-components/nav-button/nav-button.vue
Johan Gunawan 8ab9838425 SSR-199
2023-01-20 15:30:32 -05:00

39 lines
No EOL
920 B
Vue

<template>
<input v-if="type == 'button'" type="button" class="nav-button" v-bind:value="text" v-on:click="navTo"/>
<p v-else type="" class="nav-text" v-on:click="navTo">{{text}}</p>
</template>
<script>
export default({
name: "navButton",
props: {
text: String,
scenario: String,
type: String,
},
methods: {
navTo(){
this.$router.navigate(this.scenario, this.$route)
}
}
})
</script>
<style lang="scss" scoped>
.nav-button {
background-color: lightgray;
padding: 2.5px;
border-radius: 5px;
min-width: 70px;
font-family: Cambria, Cochin, Georgia, Times, 'Times New Roman', serif;
font-size: 14px;
}
.nav-text {
color: blue;
cursor: pointer;
text-decoration: underline;
}
</style>