49 lines
944 B
Vue
49 lines
944 B
Vue
<template lang="pug">
|
|
q-btn(
|
|
padding="14px 14px 14px 10px",
|
|
style="width: 76px"
|
|
:class="checkActive",
|
|
:href="path",
|
|
:id="id",
|
|
@click="(e) => changeStylePage(e)"
|
|
)
|
|
slot
|
|
</template>
|
|
|
|
<script>
|
|
export default {
|
|
name: "ButtonSidebar",
|
|
props: {
|
|
path: String,
|
|
id: String,
|
|
changeStylePage: Function,
|
|
active: Boolean,
|
|
},
|
|
data() {
|
|
return {
|
|
selectedStyle: false,
|
|
};
|
|
},
|
|
computed: {
|
|
checkActive() {
|
|
return this.active ? "active button" : "button";
|
|
},
|
|
},
|
|
};
|
|
</script>
|
|
|
|
<style lang="sass" scoped>
|
|
.button
|
|
background-color: trnsparent
|
|
border-radius: 0 4px 4px 0
|
|
border-left: 4px solid transparent
|
|
.active
|
|
background-color: var(--btn-blue-color-1)
|
|
border-left-color: var(--btn-blue-color)
|
|
color: var(--btn-blue-color)
|
|
.button:hover
|
|
background-color: var(--btn-blue-color-1)
|
|
border-left-color: var(--btn-blue-color)
|
|
color: var(--btn-blue-color)
|
|
</style>
|