iachat/app/javascript/dashboard/routes/dashboard/conversation/search/SwitchLayout.vue

37 lines
623 B
Vue

<template>
<woot-button
v-tooltip.left="$t('CONVERSATION.SWITCH_VIEW_LAYOUT')"
icon="arrow-right-import"
size="tiny"
variant="smooth"
color-scheme="secondary"
class="layout-switch__container"
:class="{ expanded: isOnExpandedLayout }"
@click="toggle"
/>
</template>
<script>
export default {
props: {
isOnExpandedLayout: {
type: Boolean,
default: false,
},
},
methods: {
toggle() {
this.$emit('toggle');
},
},
};
</script>
<style lang="scss" soped>
.layout-switch__container {
&.expanded .icon {
transform: rotate(180deg);
}
}
</style>