From f4ade963e44f68a928ff0a1f0bb70ebc2fb4f3e8 Mon Sep 17 00:00:00 2001
From: Stefan Peters <stefandesu@exo.pm>
Date: Tue, 27 Sep 2022 09:25:27 +0200
Subject: [PATCH] MappingBrowser go to page: Replace with icon (#387)

---
 src/components/MappingBrowserTable.vue | 11 +++++++----
 src/main.js                            |  3 ++-
 2 files changed, 9 insertions(+), 5 deletions(-)

diff --git a/src/components/MappingBrowserTable.vue b/src/components/MappingBrowserTable.vue
index d9adda97..8695c34c 100644
--- a/src/components/MappingBrowserTable.vue
+++ b/src/components/MappingBrowserTable.vue
@@ -329,12 +329,15 @@
             @input="$emit('pageChange', { registry: section.registry, page: $event, userInitiated: false })"
             @change="$emit('pageChange', { registry: section.registry, page: $event, userInitiated: true })" />
           <div class="mappingBrowser-pagination-number fontSize-small">
-            <div
+            <a
               v-if="section.totalCount >= 1000"
               :id="`mappingBrowser-pagination-goToPage-${section.id}`"
-              class="button"
-              style="display: inline-block"
-              @click="$set(popoverShown, `goToPage-${section.id}`, false)">go to page…</div>
+              href=""
+              class="fontSize-verySmall"
+              style="margin-right: 10px;"
+              @click.stop.prevent="$set(popoverShown, `goToPage-${section.id}`, false)">
+              <font-awesome-icon icon="arrow-right-to-bracket" />
+            </a>
             <span v-if="section.items.length < section.totalCount">
               {{ section.items.length }} {{ $t("general.of") }} {{ section.totalCount.toLocaleString() }}
             </span>
diff --git a/src/main.js b/src/main.js
index 9c3137b6..143dc56c 100644
--- a/src/main.js
+++ b/src/main.js
@@ -8,7 +8,7 @@ import log from "@/utils/log.js"
 import store from "@/store/index.js"
 import { Tabs, Tab } from "cocoda-vue-tabs"
 import { library } from "@fortawesome/fontawesome-svg-core"
-import { faStar, faPlusCircle, faExchangeAlt, faThumbsUp, faThumbsDown, faAngleDown, faAngleRight, faAngleLeft, faLevelUpAlt, faLevelDownAlt, faEllipsisV, faEllipsisH, faSortUp, faTimesCircle, faLink, faIdCard, faUser, faSearch, faFilter, faCode, faCog, faDownload, faCaretDown, faInfoCircle, faComment, faEdit, faSave, faTrashAlt, faBan, faWindowMinimize, faPlusSquare, faCheck, faCheckSquare, faLock, faLockOpen, faExternalLinkSquareAlt, faLongArrowAltDown, faLongArrowAltUp, faExternalLinkAlt, faPuzzlePiece, faExclamation, faShareAltSquare, faRecycle, faCaretSquareLeft, faCaretSquareRight, faClipboard, faAngleDoubleRight, faClone, faExclamationCircle, faQuestionCircle, faChevronUp, faChevronDown, faPencilAlt, faArrowRight, faArrowLeft, faArrowUp, faArrowDown, faSyncAlt, faList, faSitemap, faSeedling } from "@fortawesome/free-solid-svg-icons"
+import { faStar, faPlusCircle, faExchangeAlt, faThumbsUp, faThumbsDown, faAngleDown, faAngleRight, faAngleLeft, faLevelUpAlt, faLevelDownAlt, faEllipsisV, faEllipsisH, faSortUp, faTimesCircle, faLink, faIdCard, faUser, faSearch, faFilter, faCode, faCog, faDownload, faCaretDown, faInfoCircle, faComment, faEdit, faSave, faTrashAlt, faBan, faWindowMinimize, faPlusSquare, faCheck, faCheckSquare, faLock, faLockOpen, faExternalLinkSquareAlt, faLongArrowAltDown, faLongArrowAltUp, faExternalLinkAlt, faPuzzlePiece, faExclamation, faShareAltSquare, faRecycle, faCaretSquareLeft, faCaretSquareRight, faClipboard, faAngleDoubleRight, faClone, faExclamationCircle, faQuestionCircle, faChevronUp, faChevronDown, faPencilAlt, faArrowRight, faArrowLeft, faArrowUp, faArrowDown, faSyncAlt, faList, faSitemap, faSeedling, faArrowRightToBracket } from "@fortawesome/free-solid-svg-icons"
 import { faGithub } from "@fortawesome/free-brands-svg-icons"
 import { FontAwesomeIcon } from "@fortawesome/vue-fontawesome"
 import globalMixins from "@/mixins/global.js"
@@ -115,6 +115,7 @@ library.add(faSyncAlt)
 library.add(faList)
 library.add(faSitemap)
 library.add(faSeedling)
+library.add(faArrowRightToBracket)
 Vue.component("FontAwesomeIcon", FontAwesomeIcon)
 
 // Add objects mixin