feat(style): change style of selected task type category

Signed-off-by: Julien Veyssier <julien-nc@posteo.net>

Author: julien-nc

src/components/TaskTypeSelect.vue

@@ -12,6 +12,7 @@
 				:menu-name="variants.text"
 				:container="$refs.taskTypeSelect"
 				:primary="isCategorySelected(variants)"
+				:class="{ categoryWithSubSelected: isCategorySelected(variants) }"
 				@click="onMenuCategorySelected(variants)">
 				<NcActionButton v-for="t in variants.tasks"
 					:key="t.id"
@@ -30,7 +31,8 @@
 			</NcActions>
 			<NcButton v-else
 				:key="variants.id + '-button'"
-				:variant="isCategorySelected(variants) ? 'primary' : 'secondary'"
+				variant="secondary"
+				:class="{ categorySelected: isCategorySelected(variants) }"
 				:title="variants.text"
 				@click="onMenuCategorySelected(variants)">
 				<template #icon>
@@ -73,18 +75,21 @@
 </template>
 
 <script>
-import NcActions from '@nextcloud/vue/components/NcActions'
-import NcButton from '@nextcloud/vue/components/NcButton'
-import NcActionButton from '@nextcloud/vue/components/NcActionButton'
 import MessageOutlineIcon from 'vue-material-design-icons/MessageOutline.vue'
 import DotsHorizontalIcon from 'vue-material-design-icons/DotsHorizontal.vue'
 import TextLongIcon from 'vue-material-design-icons/TextLong.vue'
 import ImageOutlineIcon from 'vue-material-design-icons/ImageOutline.vue'
 import WebIcon from 'vue-material-design-icons/Web.vue'
 import FileIcon from 'vue-material-design-icons/File.vue'
+
 import ContentPasteSearchIcon from './icons/ContentPasteSearch.vue'
 import WaveformIcon from './icons/Waveform.vue'
 
+import NcActions from '@nextcloud/vue/components/NcActions'
+import NcButton from '@nextcloud/vue/components/NcButton'
+import NcActionButton from '@nextcloud/vue/components/NcActionButton'
+import NcAssistantButton from '@nextcloud/vue/components/NcAssistantButton'
+
 export default {
 	name: 'TaskTypeSelect',
 
@@ -93,6 +98,7 @@ export default {
 		NcActionButton,
 		MessageOutlineIcon,
 		NcButton,
+		NcAssistantButton,
 	},
 
 	props: {
@@ -271,6 +277,18 @@ export default {
 </script>
 
 <style lang="scss">
+.task-type-select {
+	.categorySelected,
+	.categoryWithSubSelected button {
+		background: var(--color-element-assistant) !important;
+		color: white !important;
+		border: none !important;
+		padding-block: 0 !important;
+	}
+}
+</style>
+
+<style scoped lang="scss">
 .task-type-select {
 	display: flex;
 	align-items: center;