Skip to content

Commit

Permalink
enhancement: Changes button design for tables in settings page (#3553)
Browse files Browse the repository at this point in the history 
* enhancement: Changes button design for tables in settings page

* Minor fixes

* Review fixes
  • Loading branch information
@iamsivin
iamsivin committed Dec 16, 2021
1 parent 9984edd commit 93f384a
Show file tree
Hide file tree
Showing 9 changed files with 58 additions and 40 deletions.
2 changes: 1 addition & 1 deletion app/javascript/dashboard/assets/scss/_foundation-custom.scss
View file
Expand Up @@ -12,7 +12,7 @@
padding: var(--space-normal);
}

.button-wrapper .button.link.grey-btn {
.button-wrapper .button.grey-btn {
margin-left: var(--space-normal);
}

Expand Down
12 changes: 7 additions & 5 deletions app/javascript/dashboard/routes/dashboard/settings/agents/Index.vue
View file
Expand Up @@ -57,24 +57,26 @@
<div class="button-wrapper">
<woot-button
v-if="showEditAction(agent)"
variant="link"
v-tooltip.top="$t('AGENT_MGMT.EDIT.BUTTON_TEXT')"
variant="smooth"
size="tiny"
color-scheme="secondary"
icon="edit"
class-names="grey-btn"
@click="openEditPopup(agent)"
>
{{ $t('AGENT_MGMT.EDIT.BUTTON_TEXT') }}
</woot-button>
<woot-button
v-if="showDeleteAction(agent)"
variant="link"
color-scheme="secondary"
v-tooltip.top="$t('AGENT_MGMT.DELETE.BUTTON_TEXT')"
variant="smooth"
color-scheme="alert"
size="tiny"
icon="dismiss-circle"
class-names="grey-btn"
:is-loading="loading[agent.id]"
@click="openDeletePopup(agent, index)"
>
{{ $t('AGENT_MGMT.DELETE.BUTTON_TEXT') }}
</woot-button>
</div>
</td>
Expand Down
12 changes: 7 additions & 5 deletions app/javascript/dashboard/routes/dashboard/settings/attributes/CustomAttribute.vue
View file
Expand Up @@ -50,22 +50,24 @@
</td>
<td class="button-wrapper">
<woot-button
variant="link"
v-tooltip.top="$t('ATTRIBUTES_MGMT.LIST.BUTTONS.EDIT')"
variant="smooth"
size="tiny"
color-scheme="secondary"
class-names="grey-btn"
icon="edit"
@click="openEditPopup(attribute)"
>
{{ $t('ATTRIBUTES_MGMT.LIST.BUTTONS.EDIT') }}
</woot-button>
<woot-button
variant="link"
color-scheme="secondary"
v-tooltip.top="$t('ATTRIBUTES_MGMT.LIST.BUTTONS.DELETE')"
variant="smooth"
color-scheme="alert"
size="tiny"
icon="dismiss-circle"
class-names="grey-btn"
@click="openDelete(attribute)"
>
{{ $t('ATTRIBUTES_MGMT.LIST.BUTTONS.DELETE') }}
</woot-button>
</td>
</tr>
Expand Down
13 changes: 7 additions & 6 deletions app/javascript/dashboard/routes/dashboard/settings/canned/Index.vue
View file
Expand Up @@ -50,23 +50,24 @@
<!-- Action Buttons -->
<td class="button-wrapper">
<woot-button
variant="link"
v-tooltip.top="$t('CANNED_MGMT.EDIT.BUTTON_TEXT')"
variant="smooth"
size="tiny"
color-scheme="secondary"
icon="edit"
class-names="grey-btn"
@click="openEditPopup(cannedItem)"
>
{{ $t('CANNED_MGMT.EDIT.BUTTON_TEXT') }}
</woot-button>
<woot-button
variant="link"
color-scheme="secondary"
v-tooltip.top="$t('CANNED_MGMT.DELETE.BUTTON_TEXT')"
variant="smooth"
color-scheme="alert"
size="tiny"
icon="dismiss-circle"
class-names="grey-btn"
:is-loading="loading[cannedItem.id]"
@click="openDeletePopup(cannedItem, index)"
>
{{ $t('CANNED_MGMT.DELETE.BUTTON_TEXT') }}
</woot-button>
</td>
</tr>
Expand Down
12 changes: 7 additions & 5 deletions app/javascript/dashboard/routes/dashboard/settings/inbox/Index.vue
View file
Expand Up @@ -68,25 +68,27 @@
>
<woot-button
v-if="isAdmin"
v-tooltip.top="$t('INBOX_MGMT.SETTINGS')"
variant="smooth"
size="tiny"
icon="settings"
variant="link"
color-scheme="secondary"
class-names="grey-btn"
>
{{ $t('INBOX_MGMT.SETTINGS') }}
</woot-button>
</router-link>

<woot-button
v-if="isAdmin"
variant="link"
color-scheme="secondary"
v-tooltip.top="$t('INBOX_MGMT.DELETE.BUTTON_TEXT')"
variant="smooth"
color-scheme="alert"
size="tiny"
class-names="grey-btn"
:is-loading="loading[item.id]"
icon="dismiss-circle"
@click="openDelete(item)"
>
{{ $t('INBOX_MGMT.DELETE.BUTTON_TEXT') }}
</woot-button>
</div>
</td>
Expand Down
7 changes: 4 additions & 3 deletions ...vascript/dashboard/routes/dashboard/settings/integrationapps/MultipleIntegrationHooks.vue
View file
Expand Up @@ -24,13 +24,14 @@
</td>
<td class="button-wrapper">
<woot-button
variant="link"
color-scheme="secondary"
v-tooltip.top="$t('INTEGRATION_APPS.LIST.DELETE.BUTTON_TEXT')"
variant="smooth"
color-scheme="alert"
size="tiny"
icon="dismiss-circle"
class-names="grey-btn"
@click="$emit('delete', hook)"
>
{{ $t('INTEGRATION_APPS.LIST.DELETE.BUTTON_TEXT') }}
</woot-button>
</td>
</tr>
Expand Down
16 changes: 11 additions & 5 deletions app/javascript/dashboard/routes/dashboard/settings/integrations/Webhook.vue
View file
Expand Up @@ -43,20 +43,26 @@
</td>
<td class="button-wrapper">
<woot-button
variant="link"
v-tooltip.top="
$t('INTEGRATION_SETTINGS.WEBHOOK.EDIT.BUTTON_TEXT')
"
variant="smooth"
size="tiny"
color-scheme="secondary"
icon="edit"
@click="openEditPopup(webHookItem)"
>
{{ $t('INTEGRATION_SETTINGS.WEBHOOK.EDIT.BUTTON_TEXT') }}
</woot-button>
<woot-button
variant="link"
v-tooltip.top="
$t('INTEGRATION_SETTINGS.WEBHOOK.DELETE.BUTTON_TEXT')
"
variant="smooth"
color-scheme="alert"
size="tiny"
icon="dismiss-circle"
color-scheme="secondary"
@click="openDeletePopup(webHookItem, index)"
>
{{ $t('INTEGRATION_SETTINGS.WEBHOOK.DELETE.BUTTON_TEXT') }}
</woot-button>
</td>
</tr>
Expand Down
12 changes: 7 additions & 5 deletions app/javascript/dashboard/routes/dashboard/settings/labels/Index.vue
View file
Expand Up @@ -44,24 +44,26 @@
</td>
<td class="button-wrapper">
<woot-button
variant="link"
v-tooltip.top="$t('LABEL_MGMT.FORM.EDIT')"
variant="smooth"
size="tiny"
color-scheme="secondary"
class-names="grey-btn"
:is-loading="loading[label.id]"
icon="edit"
@click="openEditPopup(label)"
>
{{ $t('LABEL_MGMT.FORM.EDIT') }}
</woot-button>
<woot-button
variant="link"
color-scheme="secondary"
v-tooltip.top="$t('LABEL_MGMT.FORM.DELETE')"
variant="smooth"
color-scheme="alert"
size="tiny"
icon="dismiss-circle"
class-names="grey-btn"
:is-loading="loading[label.id]"
@click="openDeletePopup(label, index)"
>
{{ $t('LABEL_MGMT.FORM.DELETE') }}
</woot-button>
</td>
</tr>
Expand Down
12 changes: 7 additions & 5 deletions app/javascript/dashboard/routes/dashboard/settings/teams/Index.vue
View file
Expand Up @@ -27,24 +27,26 @@
>
<woot-button
v-if="isAdmin"
variant="link"
v-tooltip.top="$t('TEAMS_SETTINGS.LIST.EDIT_TEAM')"
variant="smooth"
size="tiny"
color-scheme="secondary"
class-names="grey-btn"
icon="settings"
>
{{ $t('TEAMS_SETTINGS.LIST.EDIT_TEAM') }}
</woot-button>
</router-link>
<woot-button
v-if="isAdmin"
variant="link"
color-scheme="secondary"
v-tooltip.top="$t('TEAMS_SETTINGS.DELETE.BUTTON_TEXT')"
variant="smooth"
color-scheme="alert"
size="tiny"
icon="dismiss-circle"
class-names="grey-btn"
:is-loading="loading[item.id]"
@click="openDelete(item)"
>
{{ $t('TEAMS_SETTINGS.DELETE.BUTTON_TEXT') }}
</woot-button>
</div>
</td>
Expand Down

0 comments on commit 93f384a

Please sign in to comment.