DigitalConsumer.ISS/src/iss-components/nav-button/nav-button.vue
2023-08-02 10:45:39 -04:00

50 lines
932 B
Vue

<template>
<input
v-if="type == 'button'"
type="button"
class="nav-button"
:value="text"
@click="navTo" />
<p
v-else
type=""
class="nav-text"
@click="navTo">
{{ text }}
</p>
</template>
<script>
export default ({
name: 'nav-button',
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>