This repository has been archived on 2025-01-07. You can view files and clone it, but you cannot make any changes to it's state, such as pushing and creating new issues, pull requests or comments.
rebuilding-acquia/src/components/Application/StarToggle.vue

21 lines
658 B
Vue
Raw Normal View History

2018-12-26 13:37:23 +00:00
<template>
<button type="button" @click="starred = !starred" class="focus:outline-none" :class="[starred ? 'text-orange-100 hover:text-orange-200 focus:text-orange-200' : 'text-gray-400 focus:text-orange-200 hover:text-orange-100']">
2018-12-26 13:37:23 +00:00
<span class="visuallyhidden">{{ !starred ? 'Star' : 'Unstar' }} {{ application.name }}</span>
2018-12-29 16:59:34 +00:00
<svg class="h-6 w-6 fill-current -mr-1" role="presentation"><use :xlink:href="`/img/icons.symbol.svg#state__${starred ? 'starred' : 'unstarred'}`"></use></svg>
2018-12-26 13:37:23 +00:00
</button>
</template>
<script>
export default {
props: {
2019-03-30 00:09:48 +00:00
application: Object
2018-12-26 13:37:23 +00:00
},
2018-12-26 16:10:19 +00:00
2019-03-30 00:09:48 +00:00
data () {
2018-12-26 16:10:19 +00:00
return {
starred: false
}
2019-03-30 00:09:48 +00:00
}
2018-12-26 13:37:23 +00:00
}
</script>