Migrate composer action menu icons to material design icons + migrate to Vue buttons

[GretaD]

ref nextcloud/groupware#38

[ChristophWurst]

Why did you rename button to Button? the nc/vue button component is imported as VButton

Are the button changes even necessary for the icon replacement?

[GretaD]

Why did you rename button to Button? the nc/vue button component is imported as VButton

Are the button changes even necessary for the icon replacement?

no there are not necessary on this pr because < button > doesnt have an icon. When it has an icon then it needs < Button >. I did it here because ive done it with other PRs

[ChristophWurst]

👍 🐘

[raimund-schluessler]

There is quite a bit of chaos with the buttons now, you have button, Button and VButton, whereas they all should be VButton (or how you want to import them) regardless of whether they have icons or not. button will only render to a standard HTML component and not profit from the accessibility features of the vue component.

button (standard HTML button with an icon even):

mail/src/components/Composer.vue

Lines 61 to 67 in 57ffa52

	<button
	:title="t('mail','Toggle recipients list mode')"
	:class="{'active':!autoLimit}"
	@click.prevent="toggleViewMode">
	<UnfoldMoreHorizontal v-if="autoLimit" :size="24" />
	<UnfoldLessHorizontal v-else :size="24" />
	</button>

Button (probably also standard HTML with an icon):

mail/src/components/Composer.vue

Lines 355 to 363 in 57ffa52

	<Button :disabled="!canSend"
	class="button primary send-button"
	type="submit"
	@click="onSend">
	<Send
	:title="submitButtonTitle"
	:size="20" />
	{{ submitButtonTitle }}
	</Button>

Button without icon:

mail/src/components/Composer.vue

Lines 377 to 379 in 57ffa52

	<Button @click="state = STATES.EDITING">
	{{ t('mail', 'Go back') }}
	</Button>