diff options
author | Vinicius Reis <vinicius.reis@nextcloud.com> | 2022-05-23 21:53:28 +0300 |
---|---|---|
committer | Vinicius Reis <vinicius.reis@nextcloud.com> | 2022-05-23 21:53:28 +0300 |
commit | 5e8f07716c829ce77d0bc877ebfb6a8874d5e806 (patch) | |
tree | a1523dd9972e28c11932e51239e7d11ad353b930 /src | |
parent | 29898e4db0c498d4bf0afea54e3c72d10a71b561 (diff) |
💄 (#2345): table icons
Signed-off-by: Vinicius Reis <vinicius.reis@nextcloud.com>
Diffstat (limited to 'src')
-rw-r--r-- | src/components/icons.js | 6 | ||||
-rw-r--r-- | src/nodes/TableCellView.vue | 21 | ||||
-rw-r--r-- | src/nodes/TableHeaderView.vue | 22 | ||||
-rw-r--r-- | src/nodes/TableView.vue | 17 |
4 files changed, 50 insertions, 16 deletions
diff --git a/src/components/icons.js b/src/components/icons.js index 0b2515766..c68bae5ad 100644 --- a/src/components/icons.js +++ b/src/components/icons.js @@ -23,6 +23,7 @@ import MdiLoading from 'vue-material-design-icons/Loading' export { default as Lock } from 'vue-material-design-icons/Lock' +export { default as Delete } from 'vue-material-design-icons/Delete' export { default as Undo } from 'vue-material-design-icons/ArrowULeftTop' export { default as Redo } from 'vue-material-design-icons/ArrowURightTop' export { default as Info } from 'vue-material-design-icons/Information' @@ -51,6 +52,11 @@ export { default as FormatListNumbered } from 'vue-material-design-icons/FormatL export { default as FormatListBulleted } from 'vue-material-design-icons/FormatListBulleted' export { default as FormatListCheckbox } from 'vue-material-design-icons/FormatListCheckbox' export { default as FormatQuote } from 'vue-material-design-icons/FormatQuoteClose' +export { default as TableSettings } from 'vue-material-design-icons/TableCog' +export { default as TableAddRowAfter } from 'vue-material-design-icons/TableRowPlusAfter' +export { default as TableAddRowBefore } from 'vue-material-design-icons/TableRowPlusBefore' +export { default as TableAddColumnAfter } from 'vue-material-design-icons/TableColumnPlusAfter' +export { default as TableAddColumnBefore } from 'vue-material-design-icons/TableColumnPlusBefore' export const Loading = { functional: true, diff --git a/src/nodes/TableCellView.vue b/src/nodes/TableCellView.vue index 91d390407..dd80da21c 100644 --- a/src/nodes/TableCellView.vue +++ b/src/nodes/TableCellView.vue @@ -26,18 +26,25 @@ <NodeViewContent class="content" /> <Actions v-if="editor.isEditable"> <ActionButton icon="icon-add_row_before" - :close-after-click="true" + close-after-click @click="addRowBefore"> + <template #icon> + <TableAddRowBefore /> + </template> {{ t('text', 'Add row before') }} </ActionButton> - <ActionButton icon="icon-add_row_after" - :close-after-click="true" + <ActionButton close-after-click @click="addRowAfter"> + <template #icon> + <TableAddRowAfter /> + </template> {{ t('text', 'Add row after') }} </ActionButton> - <ActionButton icon="icon-delete" - :close-after-click="true" + <ActionButton close-after-click @click="deleteRow"> + <template #icon> + <Delete /> + </template> {{ t('text', 'Delete this row') }} </ActionButton> </Actions> @@ -49,6 +56,7 @@ import { NodeViewWrapper, NodeViewContent } from '@tiptap/vue-2' import Actions from '@nextcloud/vue/dist/Components/Actions' import ActionButton from '@nextcloud/vue/dist/Components/ActionButton' +import { TableAddRowBefore, TableAddRowAfter, Delete } from '../components/icons.js' export default { name: 'TableCellView', @@ -57,6 +65,9 @@ export default { Actions, NodeViewWrapper, NodeViewContent, + TableAddRowBefore, + TableAddRowAfter, + Delete, }, props: { editor: { diff --git a/src/nodes/TableHeaderView.vue b/src/nodes/TableHeaderView.vue index c2094a42e..e4cb5c3f1 100644 --- a/src/nodes/TableHeaderView.vue +++ b/src/nodes/TableHeaderView.vue @@ -25,19 +25,25 @@ <div> <NodeViewContent class="content" /> <Actions v-if="editor.isEditable"> - <ActionButton icon="icon-add_col_before" - :close-after-click="true" + <ActionButton close-after-click @click="addColumnBefore"> + <template #icon> + <TableAddColumnBefore /> + </template> {{ t('text', 'Add column before') }} </ActionButton> - <ActionButton icon="icon-add_col_after" - :close-after-click="true" + <ActionButton close-after-click @click="addColumnAfter"> + <template #icon> + <TableAddColumnAfter /> + </template> {{ t('text', 'Add column after') }} </ActionButton> - <ActionButton icon="icon-delete" - :close-after-click="true" + <ActionButton close-after-click @click="deleteColumn"> + <template #icon> + <Delete /> + </template> {{ t('text', 'Delete this column') }} </ActionButton> </Actions> @@ -49,6 +55,7 @@ import { NodeViewWrapper, NodeViewContent } from '@tiptap/vue-2' import Actions from '@nextcloud/vue/dist/Components/Actions' import ActionButton from '@nextcloud/vue/dist/Components/ActionButton' +import { Delete, TableAddColumnBefore, TableAddColumnAfter } from '../components/icons.js' export default { name: 'TableHeaderView', @@ -57,6 +64,9 @@ export default { Actions, NodeViewWrapper, NodeViewContent, + Delete, + TableAddColumnBefore, + TableAddColumnAfter, }, props: { editor: { diff --git a/src/nodes/TableView.vue b/src/nodes/TableView.vue index ab26c9089..46cb55d9a 100644 --- a/src/nodes/TableView.vue +++ b/src/nodes/TableView.vue @@ -24,12 +24,16 @@ <NodeViewWrapper class="table-wrapper"> <NodeViewContent class="content" as="table" /> <Actions v-if="editor.isEditable" - :force-menu="true" - class="table-settings" - default-icon="icon-table_settings"> - <ActionButton icon="icon-delete" - :close-after-click="true" + force-menu + class="table-settings"> + <template #icon> + <TableSettings /> + </template> + <ActionButton close-after-click @click="deleteNode"> + <template #icon> + <Delete /> + </template> {{ t('text', 'Delete this table') }} </ActionButton> </Actions> @@ -41,6 +45,7 @@ import { NodeViewWrapper, NodeViewContent } from '@tiptap/vue-2' import Actions from '@nextcloud/vue/dist/Components/Actions' import ActionButton from '@nextcloud/vue/dist/Components/ActionButton' +import { TableSettings, Delete } from '../components/icons.js' export default { name: 'TableView', @@ -49,6 +54,8 @@ export default { Actions, NodeViewWrapper, NodeViewContent, + TableSettings, + Delete, }, props: { editor: { |