From 7e4169a74eb4d5100d20eb68c9bc9e6d941daed5 Mon Sep 17 00:00:00 2001 From: A1300399510 Date: Tue, 10 Sep 2024 14:27:42 +0800 Subject: [PATCH] =?UTF-8?q?=E5=A2=9E=E5=8A=A0=E7=94=9F=E6=88=90=E5=9B=BE?= =?UTF-8?q?=E7=89=87=E5=BC=B9=E7=AA=97=E5=92=8C=E7=BB=99=E5=AD=A6=E5=BC=9F?= =?UTF-8?q?=E5=AD=A6=E5=A6=B9=E7=95=99=E8=A8=80?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- css/style.css | 43 ++++++++++++++++++++++++++++++++++ css/style.less | 46 ++++++++++++++++++++++++++++++++++++ index.html | 63 +++++++++++++++++++++++++++++++++++++++++--------- js/base.js | 4 ++-- 4 files changed, 143 insertions(+), 13 deletions(-) diff --git a/css/style.css b/css/style.css index 6369041..abbd053 100644 --- a/css/style.css +++ b/css/style.css @@ -444,3 +444,46 @@ height: 20px; margin-left: 6px; } +.pop-up { + width: 100vw; + height: 100vh; + background-color: rgba(0, 0, 0, 0.4); + position: fixed; + top: 0; + left: 0; + z-index: 1; +} +.pop-up .select { + width: 600px; + height: 500px; + background: #fff; + border-radius: 20px; + flex-direction: column; + justify-content: center; + align-items: center; +} +.pop-up .select .title { + font-weight: 650; + font-size: 20px; + margin-bottom: 10px; +} +.pop-up .select .img-box { + width: 400px; + height: 400px; + overflow: hidden; +} +.pop-up .select .img-box .img { + height: 400px; + object-fit: contain; +} +.pop-up .select .btn { + padding: 0 20px; + height: 40px; + border: 1px solid #eee; + border-radius: 20px; + text-align: center; + line-height: 40px; + cursor: pointer; + color: #000; + text-decoration: none; +} diff --git a/css/style.less b/css/style.less index b49a1af..0154e89 100644 --- a/css/style.less +++ b/css/style.less @@ -518,3 +518,49 @@ margin-left: 6px; } } + +.pop-up { + width: 100vw; + height: 100vh; + background-color: rgba(0, 0, 0, 0.4); + position: fixed; + top: 0; + left: 0; + z-index: 1; + .select { + width: 600px; + height: 500px; + background: #fff; + border-radius: 20px; + flex-direction: column; + justify-content: center; + align-items: center; + .title { + font-weight: 650; + font-size: 20px; + margin-bottom: 10px; + } + .img-box { + width: 400px; + height: 400px; + overflow: hidden; + .img { + // width: 400px; + height: 400px; + object-fit: contain; + } + } + + .btn { + padding: 0 20px; + height: 40px; + border: 1px solid #eee; + border-radius: 20px; + text-align: center; + line-height: 40px; + cursor: pointer; + color: #000; + text-decoration: none; + } + } +} diff --git a/index.html b/index.html index f13deff..8f31d8c 100644 --- a/index.html +++ b/index.html @@ -22,7 +22,7 @@
确定
-
保存图片
+
生成图片
+ +
+
+
生成成功
+
+ +
+ 另存为 +
+
@@ -413,9 +439,12 @@ base01: "", arrow1round: "", + + selectState: false, + selectBase64: "", }, mounted() { - axios.defaults.headers.common["Authorization"] = "813blr43ue2hhf2kjnlfibyy9swlxm2x" + // axios.defaults.headers.common["Authorization"] = "3v900y3avdzkp1ljhuycvhq2ck7ah01y" this.base01 = base01 this.base02 = base02 @@ -490,6 +519,15 @@ } const data = res.data + while (data.info.message && data.info.message.indexOf("\n\n\n\n") >= 0) { + data.info.message = data.info.message.replace("\n\n\n\n", "\n\n\n") + } + if (data.info.message && (data.info.message == "\n\n\n" || data.info.message == "\n\n" || data.info.message == "\n")) data.info.message = "" // 留言只有 回车 + + // 删除前后的空格 + if (data.info.content) data.info.content = data.info.content.trim() + if (data.info.message) data.info.message = data.info.message.trim() + const offercollege = data.offercollege || [] this.offercollege = offercollege @@ -709,22 +747,25 @@ // document.body.appendChild(canvas) // 或者你可以将canvas转换为图片数据 - var img = canvas.toDataURL("image/png") + let img = canvas.toDataURL("image/png") // 创建一个新的图片元素 - var newImg = document.createElement("img") - newImg.src = img + // let newImg = document.createElement("img") + // newImg.src = img // 将新图片添加到文档中 // document.body.appendChild(newImg) + this.selectBase64 = img + this.selectState = true + // 创建一个链接元素用于下载 - var downloadLink = document.createElement("a") - downloadLink.href = img - // 为下载的文件命名 - downloadLink.download = this.inputId + ".png" - // 触发下载 - downloadLink.click() + // var downloadLink = document.createElement("a") + // downloadLink.href = img + // // 为下载的文件命名 + // downloadLink.download = this.inputId + ".png" + // // 触发下载 + // downloadLink.click() }) }, }, diff --git a/js/base.js b/js/base.js index f12d104..baf985f 100644 --- a/js/base.js +++ b/js/base.js @@ -6,9 +6,9 @@ const base03 = `data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAFYAAABjCAYAAAAB4f const arrow1round = `data:image/svg+xml;base64,77u/PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz4KPHN2ZyB2ZXJzaW9uPSIxLjEiIHhtbG5zOnhsaW5rPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5L3hsaW5rIiB3aWR0aD0iMjBweCIgaGVpZ2h0PSIyMHB4IiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciPgogIDxkZWZzPgogICAgPGxpbmVhckdyYWRpZW50IGdyYWRpZW50VW5pdHM9InVzZXJTcGFjZU9uVXNlIiB4MT0iMTAiIHkxPSIwIiB4Mj0iMTAiIHkyPSIyMCIgaWQ9IkxpbmVhckdyYWRpZW50ODIiPgogICAgICA8c3RvcCBpZD0iU3RvcDgzIiBzdG9wLWNvbG9yPSIjNjZjNjM5IiBvZmZzZXQ9IjAiIC8+CiAgICAgIDxzdG9wIGlkPSJTdG9wODQiIHN0b3AtY29sb3I9IiNjN2VkNzYiIG9mZnNldD0iMSIgLz4KICAgIDwvbGluZWFyR3JhZGllbnQ+CiAgPC9kZWZzPgogIDxnIHRyYW5zZm9ybT0ibWF0cml4KDEgMCAwIDEgLTEyNjIgLTE5MzYgKSI+CiAgICA8cGF0aCBkPSJNIDguNzUgMTYuNzQ0NzkxNjY2NjY2NyAgQyA4Ljk3NTY5NDQ0NDQ0NDQ0IDE2Ljc0NDc5MTY2NjY2NjcgIDkuMTcxMDA2OTQ0NDQ0NDQgMTYuNjYyMzI2Mzg4ODg4OSAgOS4zMzU5Mzc1IDE2LjQ5NzM5NTgzMzMzMzMgIEwgMTUuMjQ3Mzk1ODMzMzMzMyAxMC41ODU5Mzc1ICBDIDE1LjQxMjMyNjM4ODg4ODkgMTAuNDIxMDA2OTQ0NDQ0NCAgMTUuNDk0NzkxNjY2NjY2NyAxMC4yMjU2OTQ0NDQ0NDQ0ICAxNS40OTQ3OTE2NjY2NjY3IDEwICBDIDE1LjQ5NDc5MTY2NjY2NjcgOS43NzQzMDU1NTU1NTU1NiAgMTUuNDEyMzI2Mzg4ODg4OSA5LjU3ODk5MzA1NTU1NTU2ICAxNS4yNDczOTU4MzMzMzMzIDkuNDE0MDYyNSAgTCA5LjMzNTkzNzUgMy41MDI2MDQxNjY2NjY2NyAgQyA5LjE3MTAwNjk0NDQ0NDQ0IDMuMzM3NjczNjExMTExMTEgIDguOTc1Njk0NDQ0NDQ0NDQgMy4yNTUyMDgzMzMzMzMzMyAgOC43NSAzLjI1NTIwODMzMzMzMzMzICBDIDguNTI0MzA1NTU1NTU1NTYgMy4yNTUyMDgzMzMzMzMzMyAgOC4zMjg5OTMwNTU1NTU1NiAzLjMzNzY3MzYxMTExMTExICA4LjE2NDA2MjUgMy41MDI2MDQxNjY2NjY2NyAgTCA2LjgzNTkzNzUgNC44MzA3MjkxNjY2NjY2NyAgQyA2LjY3MTAwNjk0NDQ0NDQ1IDQuOTk1NjU5NzIyMjIyMjIgIDYuNTg4NTQxNjY2NjY2NjcgNS4xOTA5NzIyMjIyMjIyMiAgNi41ODg1NDE2NjY2NjY2NyA1LjQxNjY2NjY2NjY2NjY3ICBDIDYuNTg4NTQxNjY2NjY2NjcgNS42NDIzNjExMTExMTExMSAgNi42NzEwMDY5NDQ0NDQ0NSA1LjgzNzY3MzYxMTExMTExICA2LjgzNTkzNzUgNi4wMDI2MDQxNjY2NjY2NyAgTCAxMC44MzMzMzMzMzMzMzMzIDEwICBMIDYuODM1OTM3NSAxMy45OTczOTU4MzMzMzMzICBDIDYuNjcxMDA2OTQ0NDQ0NDUgMTQuMTYyMzI2Mzg4ODg4OSAgNi41ODg1NDE2NjY2NjY2NyAxNC4zNTc2Mzg4ODg4ODg5ICA2LjU4ODU0MTY2NjY2NjY3IDE0LjU4MzMzMzMzMzMzMzMgIEMgNi41ODg1NDE2NjY2NjY2NyAxNC44MDkwMjc3Nzc3Nzc4ICA2LjY3MTAwNjk0NDQ0NDQ1IDE1LjAwNDM0MDI3Nzc3NzggIDYuODM1OTM3NSAxNS4xNjkyNzA4MzMzMzMzICBMIDguMTY0MDYyNSAxNi40OTczOTU4MzMzMzMzICBDIDguMzI4OTkzMDU1NTU1NTYgMTYuNjYyMzI2Mzg4ODg4OSAgOC41MjQzMDU1NTU1NTU1NiAxNi43NDQ3OTE2NjY2NjY3ICA4Ljc1IDE2Ljc0NDc5MTY2NjY2NjcgIFogTSAxOC42NTg4NTQxNjY2NjY3IDQuOTgwNDY4NzUgIEMgMTkuNTUyOTUxMzg4ODg4OSA2LjUxMjU4NjgwNTU1NTU1ICAyMCA4LjE4NTc2Mzg4ODg4ODg5ICAyMCAxMCAgQyAyMCAxMS44MTQyMzYxMTExMTExICAxOS41NTI5NTEzODg4ODg5IDEzLjQ4NzQxMzE5NDQ0NDQgIDE4LjY1ODg1NDE2NjY2NjcgMTUuMDE5NTMxMjUgIEMgMTcuNzY0NzU2OTQ0NDQ0NCAxNi41NTE2NDkzMDU1NTU2ICAxNi41NTE2NDkzMDU1NTU2IDE3Ljc2NDc1Njk0NDQ0NDQgIDE1LjAxOTUzMTI1IDE4LjY1ODg1NDE2NjY2NjcgIEMgMTMuNDg3NDEzMTk0NDQ0NCAxOS41NTI5NTEzODg4ODg5ICAxMS44MTQyMzYxMTExMTExIDIwICAxMCAyMCAgQyA4LjE4NTc2Mzg4ODg4ODg5IDIwICA2LjUxMjU4NjgwNTU1NTU2IDE5LjU1Mjk1MTM4ODg4ODkgIDQuOTgwNDY4NzUgMTguNjU4ODU0MTY2NjY2NyAgQyAzLjQ0ODM1MDY5NDQ0NDQ0IDE3Ljc2NDc1Njk0NDQ0NDQgIDIuMjM1MjQzMDU1NTU1NTYgMTYuNTUxNjQ5MzA1NTU1NiAgMS4zNDExNDU4MzMzMzMzMyAxNS4wMTk1MzEyNSAgQyAwLjQ0NzA0ODYxMTExMTExMSAxMy40ODc0MTMxOTQ0NDQ0ICAwIDExLjgxNDIzNjExMTExMTEgIDAgMTAgIEMgMCA4LjE4NTc2Mzg4ODg4ODg5ICAwLjQ0NzA0ODYxMTExMTExMSA2LjUxMjU4NjgwNTU1NTU1ICAxLjM0MTE0NTgzMzMzMzMzIDQuOTgwNDY4NzUgIEMgMi4yMzUyNDMwNTU1NTU1NiAzLjQ0ODM1MDY5NDQ0NDQ0ICAzLjQ0ODM1MDY5NDQ0NDQ0IDIuMjM1MjQzMDU1NTU1NTUgIDQuOTgwNDY4NzUgMS4zNDExNDU4MzMzMzMzMyAgQyA2LjUxMjU4NjgwNTU1NTU2IDAuNDQ3MDQ4NjExMTExMTA5ICA4LjE4NTc2Mzg4ODg4ODg5IDAgIDEwIDAgIEMgMTEuODE0MjM2MTExMTExMSAwICAxMy40ODc0MTMxOTQ0NDQ0IDAuNDQ3MDQ4NjExMTExMTA5ICAxNS4wMTk1MzEyNSAxLjM0MTE0NTgzMzMzMzMzICBDIDE2LjU1MTY0OTMwNTU1NTYgMi4yMzUyNDMwNTU1NTU1NSAgMTcuNzY0NzU2OTQ0NDQ0NCAzLjQ0ODM1MDY5NDQ0NDQ0ICAxOC42NTg4NTQxNjY2NjY3IDQuOTgwNDY4NzUgIFogIiBmaWxsLXJ1bGU9Im5vbnplcm8iIGZpbGw9InVybCgjTGluZWFyR3JhZGllbnQ4MikiIHN0cm9rZT0ibm9uZSIgdHJhbnNmb3JtPSJtYXRyaXgoMSAwIDAgMSAxMjYyIDE5MzYgKSIgLz4KICA8L2c+Cjwvc3ZnPg==` -const arrowblue = `data:image/svg+xml;base64,77u/PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz4KPHN2ZyB2ZXJzaW9uPSIxLjEiIHhtbG5zOnhsaW5rPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5L3hsaW5rIiB3aWR0aD0iMTFweCIgaGVpZ2h0PSIyMHB4IiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciPgogIDxnIHRyYW5zZm9ybT0ibWF0cml4KDEgMCAwIDEgLTE2OCAtMTMwICkiPgogICAgPHBhdGggZD0iTSAxMC42MzcxNTI3Nzc3Nzc4IDkuMTIxMDkzNzUgIEMgMTAuODc5MDUwOTI1OTI1OSA5LjM2ODQ4OTU4MzMzMzMzICAxMSA5LjY2MTQ1ODMzMzMzMzMzICAxMSAxMCAgQyAxMSAxMC4zMzg1NDE2NjY2NjY3ICAxMC44NzkwNTA5MjU5MjU5IDEwLjYzMTUxMDQxNjY2NjcgIDEwLjYzNzE1Mjc3Nzc3NzggMTAuODc4OTA2MjUgIEwgMi4wODE1OTcyMjIyMjIyMiAxOS42Mjg5MDYyNSAgQyAxLjgzOTY5OTA3NDA3NDA3IDE5Ljg3NjMwMjA4MzMzMzMgIDEuNTUzMjQwNzQwNzQwNzQgMjAgIDEuMjIyMjIyMjIyMjIyMjIgMjAgIEMgMC44OTEyMDM3MDM3MDM3MDQgMjAgIDAuNjA0NzQ1MzcwMzcwMzcgMTkuODc2MzAyMDgzMzMzMyAgMC4zNjI4NDcyMjIyMjIyMjIgMTkuNjI4OTA2MjUgIEMgMC4xMjA5NDkwNzQwNzQwNzQgMTkuMzgxNTEwNDE2NjY2NyAgMCAxOS4wODg1NDE2NjY2NjY3ICAwIDE4Ljc1ICBMIDAgMS4yNSAgQyAwIDAuOTExNDU4MzMzMzMzMzMgIDAuMTIwOTQ5MDc0MDc0MDc0IDAuNjE4NDg5NTgzMzMzMzMgIDAuMzYyODQ3MjIyMjIyMjIyIDAuMzcxMDkzNzUgIEMgMC42MDQ3NDUzNzAzNzAzNyAwLjEyMzY5NzkxNjY2NjY2NSAgMC44OTEyMDM3MDM3MDM3MDQgMCAgMS4yMjIyMjIyMjIyMjIyMiAwICBDIDEuNTUzMjQwNzQwNzQwNzQgMCAgMS44Mzk2OTkwNzQwNzQwNyAwLjEyMzY5NzkxNjY2NjY2NSAgMi4wODE1OTcyMjIyMjIyMiAwLjM3MTA5Mzc1ICBMIDEwLjYzNzE1Mjc3Nzc3NzggOS4xMjEwOTM3NSAgWiAiIGZpbGwtcnVsZT0ibm9uemVybyIgZmlsbD0iIzAwMzRkZiIgc3Ryb2tlPSJub25lIiB0cmFuc2Zvcm09Im1hdHJpeCgxIDAgMCAxIDE2OCAxMzAgKSIgLz4KICA8L2c+Cjwvc3ZnPg==` +const arrowblue = `data:image/svg+xml;base64,77u/PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz4KPHN2ZyB2ZXJzaW9uPSIxLjEiIHhtbG5zOnhsaW5rPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5L3hsaW5rIiB3aWR0aD0iMTFweCIgaGVpZ2h0PSIyMHB4IiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciPgogIDxnIHRyYW5zZm9ybT0ibWF0cml4KDEgMCAwIDEgLTEwODcgLTEzMCApIj4KICAgIDxwYXRoIGQ9Ik0gMTAuNjM3MTUyNzc3Nzc3OCA5LjEyMTA5Mzc1ICBDIDEwLjg3OTA1MDkyNTkyNTkgOS4zNjg0ODk1ODMzMzMzMyAgMTEgOS42NjE0NTgzMzMzMzMzMyAgMTEgMTAgIEMgMTEgMTAuMzM4NTQxNjY2NjY2NyAgMTAuODc5MDUwOTI1OTI1OSAxMC42MzE1MTA0MTY2NjY3ICAxMC42MzcxNTI3Nzc3Nzc4IDEwLjg3ODkwNjI1ICBMIDIuMDgxNTk3MjIyMjIyMjIgMTkuNjI4OTA2MjUgIEMgMS44Mzk2OTkwNzQwNzQwNyAxOS44NzYzMDIwODMzMzMzICAxLjU1MzI0MDc0MDc0MDc0IDIwICAxLjIyMjIyMjIyMjIyMjIyIDIwICBDIDAuODkxMjAzNzAzNzAzNzA0IDIwICAwLjYwNDc0NTM3MDM3MDM3IDE5Ljg3NjMwMjA4MzMzMzMgIDAuMzYyODQ3MjIyMjIyMjIyIDE5LjYyODkwNjI1ICBDIDAuMTIwOTQ5MDc0MDc0MDc0IDE5LjM4MTUxMDQxNjY2NjcgIDAgMTkuMDg4NTQxNjY2NjY2NyAgMCAxOC43NSAgTCAwIDEuMjUgIEMgMCAwLjkxMTQ1ODMzMzMzMzMzICAwLjEyMDk0OTA3NDA3NDA3NCAwLjYxODQ4OTU4MzMzMzMzICAwLjM2Mjg0NzIyMjIyMjIyMiAwLjM3MTA5Mzc1ICBDIDAuNjA0NzQ1MzcwMzcwMzcgMC4xMjM2OTc5MTY2NjY2NjUgIDAuODkxMjAzNzAzNzAzNzA0IDAgIDEuMjIyMjIyMjIyMjIyMjIgMCAgQyAxLjU1MzI0MDc0MDc0MDc0IDAgIDEuODM5Njk5MDc0MDc0MDcgMC4xMjM2OTc5MTY2NjY2NjUgIDIuMDgxNTk3MjIyMjIyMjIgMC4zNzEwOTM3NSAgTCAxMC42MzcxNTI3Nzc3Nzc4IDkuMTIxMDkzNzUgIFogIiBmaWxsLXJ1bGU9Im5vbnplcm8iIGZpbGw9IiM1ZTQ3ZWYiIHN0cm9rZT0ibm9uZSIgdHJhbnNmb3JtPSJtYXRyaXgoMSAwIDAgMSAxMDg3IDEzMCApIiAvPgogIDwvZz4KPC9zdmc+` -const arrowlightblue = `data:image/svg+xml;base64,77u/PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz4KPHN2ZyB2ZXJzaW9uPSIxLjEiIHhtbG5zOnhsaW5rPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5L3hsaW5rIiB3aWR0aD0iMTFweCIgaGVpZ2h0PSIyMHB4IiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciPgogIDxnIHRyYW5zZm9ybT0ibWF0cml4KDEgMCAwIDEgLTE3NyAtMTMwICkiPgogICAgPHBhdGggZD0iTSAxMC42MzcxNTI3Nzc3Nzc4IDkuMTIxMDkzNzUgIEMgMTAuODc5MDUwOTI1OTI1OSA5LjM2ODQ4OTU4MzMzMzMzICAxMSA5LjY2MTQ1ODMzMzMzMzMzICAxMSAxMCAgQyAxMSAxMC4zMzg1NDE2NjY2NjY3ICAxMC44NzkwNTA5MjU5MjU5IDEwLjYzMTUxMDQxNjY2NjcgIDEwLjYzNzE1Mjc3Nzc3NzggMTAuODc4OTA2MjUgIEwgMi4wODE1OTcyMjIyMjIyMiAxOS42Mjg5MDYyNSAgQyAxLjgzOTY5OTA3NDA3NDA3IDE5Ljg3NjMwMjA4MzMzMzMgIDEuNTUzMjQwNzQwNzQwNzQgMjAgIDEuMjIyMjIyMjIyMjIyMjIgMjAgIEMgMC44OTEyMDM3MDM3MDM3MDQgMjAgIDAuNjA0NzQ1MzcwMzcwMzcgMTkuODc2MzAyMDgzMzMzMyAgMC4zNjI4NDcyMjIyMjIyMjIgMTkuNjI4OTA2MjUgIEMgMC4xMjA5NDkwNzQwNzQwNzQgMTkuMzgxNTEwNDE2NjY2NyAgMCAxOS4wODg1NDE2NjY2NjY3ICAwIDE4Ljc1ICBMIDAgMS4yNSAgQyAwIDAuOTExNDU4MzMzMzMzMzMgIDAuMTIwOTQ5MDc0MDc0MDc0IDAuNjE4NDg5NTgzMzMzMzMgIDAuMzYyODQ3MjIyMjIyMjIyIDAuMzcxMDkzNzUgIEMgMC42MDQ3NDUzNzAzNzAzNyAwLjEyMzY5NzkxNjY2NjY2NSAgMC44OTEyMDM3MDM3MDM3MDQgMCAgMS4yMjIyMjIyMjIyMjIyMiAwICBDIDEuNTUzMjQwNzQwNzQwNzQgMCAgMS44Mzk2OTkwNzQwNzQwNyAwLjEyMzY5NzkxNjY2NjY2NSAgMi4wODE1OTcyMjIyMjIyMiAwLjM3MTA5Mzc1ICBMIDEwLjYzNzE1Mjc3Nzc3NzggOS4xMjEwOTM3NSAgWiAiIGZpbGwtcnVsZT0ibm9uemVybyIgZmlsbD0iI2IxYzlmYyIgc3Ryb2tlPSJub25lIiB0cmFuc2Zvcm09Im1hdHJpeCgxIDAgMCAxIDE3NyAxMzAgKSIgLz4KICA8L2c+Cjwvc3ZnPg==` +const arrowlightblue = `data:image/svg+xml;base64,77u/PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz4KPHN2ZyB2ZXJzaW9uPSIxLjEiIHhtbG5zOnhsaW5rPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5L3hsaW5rIiB3aWR0aD0iMTFweCIgaGVpZ2h0PSIyMHB4IiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciPgogIDxnIHRyYW5zZm9ybT0ibWF0cml4KDEgMCAwIDEgLTEwOTYgLTEzMCApIj4KICAgIDxwYXRoIGQ9Ik0gMTAuNjM3MTUyNzc3Nzc3OCA5LjEyMTA5Mzc1ICBDIDEwLjg3OTA1MDkyNTkyNTkgOS4zNjg0ODk1ODMzMzMzMyAgMTEgOS42NjE0NTgzMzMzMzMzMyAgMTEgMTAgIEMgMTEgMTAuMzM4NTQxNjY2NjY2NyAgMTAuODc5MDUwOTI1OTI1OSAxMC42MzE1MTA0MTY2NjY3ICAxMC42MzcxNTI3Nzc3Nzc4IDEwLjg3ODkwNjI1ICBMIDIuMDgxNTk3MjIyMjIyMjIgMTkuNjI4OTA2MjUgIEMgMS44Mzk2OTkwNzQwNzQwNyAxOS44NzYzMDIwODMzMzMzICAxLjU1MzI0MDc0MDc0MDc0IDIwICAxLjIyMjIyMjIyMjIyMjIyIDIwICBDIDAuODkxMjAzNzAzNzAzNzA0IDIwICAwLjYwNDc0NTM3MDM3MDM3IDE5Ljg3NjMwMjA4MzMzMzMgIDAuMzYyODQ3MjIyMjIyMjIyIDE5LjYyODkwNjI1ICBDIDAuMTIwOTQ5MDc0MDc0MDc0IDE5LjM4MTUxMDQxNjY2NjcgIDAgMTkuMDg4NTQxNjY2NjY2NyAgMCAxOC43NSAgTCAwIDEuMjUgIEMgMCAwLjkxMTQ1ODMzMzMzMzMzICAwLjEyMDk0OTA3NDA3NDA3NCAwLjYxODQ4OTU4MzMzMzMzICAwLjM2Mjg0NzIyMjIyMjIyMiAwLjM3MTA5Mzc1ICBDIDAuNjA0NzQ1MzcwMzcwMzcgMC4xMjM2OTc5MTY2NjY2NjUgIDAuODkxMjAzNzAzNzAzNzA0IDAgIDEuMjIyMjIyMjIyMjIyMjIgMCAgQyAxLjU1MzI0MDc0MDc0MDc0IDAgIDEuODM5Njk5MDc0MDc0MDcgMC4xMjM2OTc5MTY2NjY2NjUgIDIuMDgxNTk3MjIyMjIyMjIgMC4zNzEwOTM3NSAgTCAxMC42MzcxNTI3Nzc3Nzc4IDkuMTIxMDkzNzUgIFogIiBmaWxsLXJ1bGU9Im5vbnplcm8iIGZpbGw9IiM5NDk4ZmMiIHN0cm9rZT0ibm9uZSIgdHJhbnNmb3JtPSJtYXRyaXgoMSAwIDAgMSAxMDk2IDEzMCApIiAvPgogIDwvZz4KPC9zdmc+` const arrowround = `data:image/svg+xml;base64,77u/PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz4KPHN2ZyB2ZXJzaW9uPSIxLjEiIHhtbG5zOnhsaW5rPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5L3hsaW5rIiB3aWR0aD0iMjBweCIgaGVpZ2h0PSIyMHB4IiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciPgogIDxkZWZzPgogICAgPGxpbmVhckdyYWRpZW50IGdyYWRpZW50VW5pdHM9InVzZXJTcGFjZU9uVXNlIiB4MT0iMTAiIHkxPSIwIiB4Mj0iMTAiIHkyPSIyMCIgaWQ9IkxpbmVhckdyYWRpZW50NjciPgogICAgICA8c3RvcCBpZD0iU3RvcDY4IiBzdG9wLWNvbG9yPSIjYzI4MGZmIiBvZmZzZXQ9IjAiIC8+CiAgICAgIDxzdG9wIGlkPSJTdG9wNjkiIHN0b3AtY29sb3I9IiM4MDgwZmYiIG9mZnNldD0iMSIgLz4KICAgIDwvbGluZWFyR3JhZGllbnQ+CiAgPC9kZWZzPgogIDxnIHRyYW5zZm9ybT0ibWF0cml4KDEgMCAwIDEgLTM0MyAtMjQ1MyApIj4KICAgIDxwYXRoIGQ9Ik0gOC43NSAxNi43NDQ3OTE2NjY2NjY3ICBDIDguOTc1Njk0NDQ0NDQ0NDQgMTYuNzQ0NzkxNjY2NjY2NyAgOS4xNzEwMDY5NDQ0NDQ0NCAxNi42NjIzMjYzODg4ODg5ICA5LjMzNTkzNzUgMTYuNDk3Mzk1ODMzMzMzMyAgTCAxNS4yNDczOTU4MzMzMzMzIDEwLjU4NTkzNzUgIEMgMTUuNDEyMzI2Mzg4ODg4OSAxMC40MjEwMDY5NDQ0NDQ0ICAxNS40OTQ3OTE2NjY2NjY3IDEwLjIyNTY5NDQ0NDQ0NDQgIDE1LjQ5NDc5MTY2NjY2NjcgMTAgIEMgMTUuNDk0NzkxNjY2NjY2NyA5Ljc3NDMwNTU1NTU1NTU2ICAxNS40MTIzMjYzODg4ODg5IDkuNTc4OTkzMDU1NTU1NTYgIDE1LjI0NzM5NTgzMzMzMzMgOS40MTQwNjI1ICBMIDkuMzM1OTM3NSAzLjUwMjYwNDE2NjY2NjY3ICBDIDkuMTcxMDA2OTQ0NDQ0NDQgMy4zMzc2NzM2MTExMTExMSAgOC45NzU2OTQ0NDQ0NDQ0NCAzLjI1NTIwODMzMzMzMzMzICA4Ljc1IDMuMjU1MjA4MzMzMzMzMzMgIEMgOC41MjQzMDU1NTU1NTU1NiAzLjI1NTIwODMzMzMzMzMzICA4LjMyODk5MzA1NTU1NTU2IDMuMzM3NjczNjExMTExMTEgIDguMTY0MDYyNSAzLjUwMjYwNDE2NjY2NjY3ICBMIDYuODM1OTM3NSA0LjgzMDcyOTE2NjY2NjY3ICBDIDYuNjcxMDA2OTQ0NDQ0NDUgNC45OTU2NTk3MjIyMjIyMiAgNi41ODg1NDE2NjY2NjY2NyA1LjE5MDk3MjIyMjIyMjIyICA2LjU4ODU0MTY2NjY2NjY3IDUuNDE2NjY2NjY2NjY2NjcgIEMgNi41ODg1NDE2NjY2NjY2NyA1LjY0MjM2MTExMTExMTExICA2LjY3MTAwNjk0NDQ0NDQ1IDUuODM3NjczNjExMTExMTEgIDYuODM1OTM3NSA2LjAwMjYwNDE2NjY2NjY3ICBMIDEwLjgzMzMzMzMzMzMzMzMgMTAgIEwgNi44MzU5Mzc1IDEzLjk5NzM5NTgzMzMzMzMgIEMgNi42NzEwMDY5NDQ0NDQ0NSAxNC4xNjIzMjYzODg4ODg5ICA2LjU4ODU0MTY2NjY2NjY3IDE0LjM1NzYzODg4ODg4ODkgIDYuNTg4NTQxNjY2NjY2NjcgMTQuNTgzMzMzMzMzMzMzMyAgQyA2LjU4ODU0MTY2NjY2NjY3IDE0LjgwOTAyNzc3Nzc3NzggIDYuNjcxMDA2OTQ0NDQ0NDUgMTUuMDA0MzQwMjc3Nzc3OCAgNi44MzU5Mzc1IDE1LjE2OTI3MDgzMzMzMzMgIEwgOC4xNjQwNjI1IDE2LjQ5NzM5NTgzMzMzMzMgIEMgOC4zMjg5OTMwNTU1NTU1NiAxNi42NjIzMjYzODg4ODg5ICA4LjUyNDMwNTU1NTU1NTU2IDE2Ljc0NDc5MTY2NjY2NjcgIDguNzUgMTYuNzQ0NzkxNjY2NjY2NyAgWiBNIDE4LjY1ODg1NDE2NjY2NjcgNC45ODA0Njg3NSAgQyAxOS41NTI5NTEzODg4ODg5IDYuNTEyNTg2ODA1NTU1NTUgIDIwIDguMTg1NzYzODg4ODg4ODkgIDIwIDEwICBDIDIwIDExLjgxNDIzNjExMTExMTEgIDE5LjU1Mjk1MTM4ODg4ODkgMTMuNDg3NDEzMTk0NDQ0NCAgMTguNjU4ODU0MTY2NjY2NyAxNS4wMTk1MzEyNSAgQyAxNy43NjQ3NTY5NDQ0NDQ0IDE2LjU1MTY0OTMwNTU1NTYgIDE2LjU1MTY0OTMwNTU1NTYgMTcuNzY0NzU2OTQ0NDQ0NCAgMTUuMDE5NTMxMjUgMTguNjU4ODU0MTY2NjY2NyAgQyAxMy40ODc0MTMxOTQ0NDQ0IDE5LjU1Mjk1MTM4ODg4ODkgIDExLjgxNDIzNjExMTExMTEgMjAgIDEwIDIwICBDIDguMTg1NzYzODg4ODg4ODkgMjAgIDYuNTEyNTg2ODA1NTU1NTYgMTkuNTUyOTUxMzg4ODg4OSAgNC45ODA0Njg3NSAxOC42NTg4NTQxNjY2NjY3ICBDIDMuNDQ4MzUwNjk0NDQ0NDQgMTcuNzY0NzU2OTQ0NDQ0NCAgMi4yMzUyNDMwNTU1NTU1NiAxNi41NTE2NDkzMDU1NTU2ICAxLjM0MTE0NTgzMzMzMzMzIDE1LjAxOTUzMTI1ICBDIDAuNDQ3MDQ4NjExMTExMTExIDEzLjQ4NzQxMzE5NDQ0NDQgIDAgMTEuODE0MjM2MTExMTExMSAgMCAxMCAgQyAwIDguMTg1NzYzODg4ODg4ODkgIDAuNDQ3MDQ4NjExMTExMTExIDYuNTEyNTg2ODA1NTU1NTUgIDEuMzQxMTQ1ODMzMzMzMzMgNC45ODA0Njg3NSAgQyAyLjIzNTI0MzA1NTU1NTU2IDMuNDQ4MzUwNjk0NDQ0NDQgIDMuNDQ4MzUwNjk0NDQ0NDQgMi4yMzUyNDMwNTU1NTU1NSAgNC45ODA0Njg3NSAxLjM0MTE0NTgzMzMzMzMzICBDIDYuNTEyNTg2ODA1NTU1NTYgMC40NDcwNDg2MTExMTExMDkgIDguMTg1NzYzODg4ODg4ODkgMCAgMTAgMCAgQyAxMS44MTQyMzYxMTExMTExIDAgIDEzLjQ4NzQxMzE5NDQ0NDQgMC40NDcwNDg2MTExMTExMDkgIDE1LjAxOTUzMTI1IDEuMzQxMTQ1ODMzMzMzMzMgIEMgMTYuNTUxNjQ5MzA1NTU1NiAyLjIzNTI0MzA1NTU1NTU1ICAxNy43NjQ3NTY5NDQ0NDQ0IDMuNDQ4MzUwNjk0NDQ0NDQgIDE4LjY1ODg1NDE2NjY2NjcgNC45ODA0Njg3NSAgWiAiIGZpbGwtcnVsZT0ibm9uemVybyIgZmlsbD0idXJsKCNMaW5lYXJHcmFkaWVudDY3KSIgc3Ryb2tlPSJub25lIiB0cmFuc2Zvcm09Im1hdHJpeCgxIDAgMCAxIDM0MyAyNDUzICkiIC8+CiAgPC9nPgo8L3N2Zz4=`