Chore: Fixes icon size in button (#3555)
* Chore: Fixes icon size in button * Changes normal button to woot button
This commit is contained in:
parent
ac372f188d
commit
c2191e48b1
14 changed files with 87 additions and 71 deletions
|
@ -8,7 +8,6 @@
|
|||
color-scheme="secondary"
|
||||
variant="smooth"
|
||||
size="small"
|
||||
:icon-size="14"
|
||||
@click="toggleEmojiPicker"
|
||||
/>
|
||||
|
||||
|
@ -27,7 +26,6 @@
|
|||
:title="$t('CONVERSATION.REPLYBOX.TIP_ATTACH_ICON')"
|
||||
icon="attach"
|
||||
emoji="📎"
|
||||
:icon-size="14"
|
||||
color-scheme="secondary"
|
||||
variant="smooth"
|
||||
size="small"
|
||||
|
@ -37,7 +35,6 @@
|
|||
v-if="enableRichEditor && !isOnPrivateNote"
|
||||
icon="quote"
|
||||
emoji="🖊️"
|
||||
:icon-size="16"
|
||||
color-scheme="secondary"
|
||||
variant="smooth"
|
||||
size="small"
|
||||
|
|
|
@ -1,23 +1,23 @@
|
|||
<template>
|
||||
<div class="top-box">
|
||||
<div class="mode-wrap button-group">
|
||||
<button
|
||||
class="button clear button--reply"
|
||||
<woot-button
|
||||
variant="clear"
|
||||
class="button--reply"
|
||||
:class="replyButtonClass"
|
||||
@click="handleReplyClick"
|
||||
>
|
||||
<emoji-or-icon icon="" emoji="💬" />
|
||||
{{ $t('CONVERSATION.REPLYBOX.REPLY') }}
|
||||
</button>
|
||||
</woot-button>
|
||||
|
||||
<button
|
||||
class="button clear button--note"
|
||||
<woot-button
|
||||
class="button--note"
|
||||
variant="clear"
|
||||
:class="noteButtonClass"
|
||||
@click="handleNoteClick"
|
||||
>
|
||||
<emoji-or-icon icon="" emoji="📝" />
|
||||
{{ $t('CONVERSATION.REPLYBOX.PRIVATE_NOTE') }}
|
||||
</button>
|
||||
</woot-button>
|
||||
</div>
|
||||
<div class="action-wrap">
|
||||
<div v-if="isMessageLengthReachingThreshold" class="tabs-title">
|
||||
|
@ -29,7 +29,6 @@
|
|||
<woot-button
|
||||
v-if="popoutReplyBox"
|
||||
variant="clear"
|
||||
size="large"
|
||||
icon="dismiss"
|
||||
color-scheme="secondary"
|
||||
class-names="popout-button"
|
||||
|
@ -38,7 +37,6 @@
|
|||
<woot-button
|
||||
v-else
|
||||
variant="clear"
|
||||
size="large"
|
||||
icon="resize-large"
|
||||
color-scheme="secondary"
|
||||
class-names="popout-button"
|
||||
|
@ -49,7 +47,6 @@
|
|||
|
||||
<script>
|
||||
import { REPLY_EDITOR_MODES, CHAR_LENGTH_WARNING } from './constants';
|
||||
import EmojiOrIcon from 'shared/components/EmojiOrIcon';
|
||||
import {
|
||||
hasPressedAltAndPKey,
|
||||
hasPressedAltAndLKey,
|
||||
|
@ -57,9 +54,6 @@ import {
|
|||
import eventListenerMixins from 'shared/mixins/eventListenerMixins';
|
||||
export default {
|
||||
name: 'ReplyTopPanel',
|
||||
components: {
|
||||
EmojiOrIcon,
|
||||
},
|
||||
mixins: [eventListenerMixins],
|
||||
props: {
|
||||
mode: {
|
||||
|
@ -189,11 +183,4 @@ export default {
|
|||
color: var(--s-600);
|
||||
}
|
||||
}
|
||||
|
||||
.popout-button {
|
||||
display: flex;
|
||||
justify-content: flex-end;
|
||||
height: auto;
|
||||
padding-right: var(--space-normal);
|
||||
}
|
||||
</style>
|
||||
|
|
|
@ -22,7 +22,6 @@
|
|||
<div class="filter-actions">
|
||||
<woot-button
|
||||
icon="add"
|
||||
icon-size="16"
|
||||
color-scheme="success"
|
||||
variant="smooth"
|
||||
size="small"
|
||||
|
|
|
@ -3,8 +3,7 @@
|
|||
<woot-button
|
||||
v-if="!currentChat.muted"
|
||||
v-tooltip="$t('CONTACT_PANEL.MUTE_CONTACT')"
|
||||
variant="smooth"
|
||||
size="small"
|
||||
variant="clear"
|
||||
color-scheme="secondary"
|
||||
icon="speaker-mute"
|
||||
@click="mute"
|
||||
|
@ -12,16 +11,14 @@
|
|||
<woot-button
|
||||
v-else
|
||||
v-tooltip.left="$t('CONTACT_PANEL.UNMUTE_CONTACT')"
|
||||
variant="smooth"
|
||||
size="small"
|
||||
variant="clear"
|
||||
color-scheme="secondary"
|
||||
icon="speaker-1"
|
||||
@click="unmute"
|
||||
/>
|
||||
<woot-button
|
||||
v-tooltip="$t('CONTACT_PANEL.SEND_TRANSCRIPT')"
|
||||
variant="smooth"
|
||||
size="small"
|
||||
variant="clear"
|
||||
color-scheme="secondary"
|
||||
icon="share"
|
||||
@click="toggleEmailActionsModal"
|
||||
|
@ -93,8 +90,8 @@ export default {
|
|||
.actions--container {
|
||||
align-items: center;
|
||||
|
||||
.button {
|
||||
margin-right: var(--space-small);
|
||||
.resolve-actions {
|
||||
margin-left: var(--space-small);
|
||||
}
|
||||
}
|
||||
|
||||
|
|
Loading…
Add table
Add a link
Reference in a new issue