[ { "path": ".gitignore", "content": ".DS_Store\n.env\nnode_modules\n\n" }, { "path": "README.md", "content": "# vue-pagebuilder\n\nA visual pagebuilder for Vue 3.\n\nFeatures:\n\n- Add premade layout blocks to the page\n- Rearrange and delete layout blocks\n- Edit text\n- Upload images (with automatic resize)\n- Font Awesome icon chooser\n- Change colors and fonts\n- Download generated HTML\n\n# demo\n\nhttps://vue-pagebuilder.vercel.app\n\n# preview\n\n![App Preview](https://github.com/dashpilot/vue-pagebuilder/blob/main/editor/img/app-preview2.png?raw=true)\n\n## Run the demo locally\n\nTo run the project locally, run:\n\n```bash\nnpm run serve\n```\n\nThis will start a local server on localhost:8000\n\n## Press the :star: button\n\nDon't forget to press the :star: button to let me know I should continue improving this project.\n" }, { "path": "build/bundle.mjs", "content": "const html$8 = String.raw;\n\nconst template$9 = html$8`\n \n
\n \n\n

{{item.title}}

\n

{{item.subtitle}}

\n\n {{item.button_text}}\n
\n \n`;\n\nvar Header = {\n template: template$9,\n props: [\"item\"],\n mounted() {\n //console.log('Banner component mounted.')\n },\n};\n\nconst html$7 = String.raw;\n\nconst template$8 = html$7`\n
\n
\n
\n
\n
\n

{{item.title}}

\n

{{item.body}}

\n
\n
\n
\n
\n
\n`;\n\nvar Post = {\n template: template$8,\n props: [\"item\"],\n mounted() {\n //console.log('Post component mounted.')\n },\n};\n\nvar helpers = {\n def: function (key, val) {\n if (key) {\n return key;\n } else {\n return val;\n }\n },\n youtube_parser: function (url) {\n var regExp =\n /^.*((youtu.be\\/)|(v\\/)|(\\/u\\/\\w\\/)|(embed\\/)|(watch\\?))\\??v?=?([^#&?]*).*/;\n var match = url.match(regExp);\n return match && match[7].length == 11 ? match[7] : false;\n },\n};\n\nconst html$6 = String.raw;\n\nconst template$7 = html$6`\n \n
\n
\n
\n

{{item.title}}

\n

{{item.body}}

\n
\n
\n \n \n \n
\n
\n
\n \n`;\n\nvar News = {\n template: template$7,\n props: [\"item\"],\n created() {\n this.youtube_parser = helpers.youtube_parser;\n },\n mounted() {\n //console.log('News component mounted.')\n },\n};\n\nconst html$5 = String.raw;\n\nconst template$6 = html$5`\n \n
\n
\n
\n \n \n \n
\n\n
\n

{{item.title}}

\n

{{item.body}}

\n
\n
\n
\n \n`;\n\nvar NewsLeft = {\n template: template$6,\n props: [\"item\"],\n created() {\n this.youtube_parser = helpers.youtube_parser;\n },\n mounted() {\n //console.log('News component mounted.')\n },\n};\n\nconst html$4 = String.raw;\n\nconst template$5 = html$4`\n
\n
\n
\n

{{item.title}}

\n

{{item.body}}

\n
\n
\n
\n`;\n\nvar Featured = {\n template: template$5,\n props: [\"item\"],\n mounted() {\n //console.log('Featured component mounted.')\n },\n};\n\nconst template$4 = `\n \n
\n
\n
\n

{{item.title}}

\n

{{item.body}}

\n
\n
\n

{{def(item.title2, 'Lorem Ipsum')}}

\n

\n {{def(item.body2, \"Lorem ipsum dolor sit amet, consectetur adipiscing elit. Mauris eleifend ligula ut augue scelerisque venenatis.\")}}\n

\n
\n
\n
\n \n`;\n\nvar Features = {\n template: template$4,\n props: [\"item\"],\n created() {\n this.def = helpers.def;\n },\n mounted() {\n //console.log('Features component mounted.')\n },\n};\n\nconst html$3 = String.raw;\nconst template$3 = html$3`\n \n \n  Choose Icon\n \n \n`;\n\nvar Picker = {\n template: template$3,\n props: [\"mykey\", \"value\"],\n emits: [\"input\"],\n mounted() {\n var app = this;\n IconPicker.Init({\n // Required: You have to set the path of IconPicker JSON file to \"jsonUrl\" option. e.g. '/content/plugins/IconPicker/dist/iconpicker-1.5.0.json'\n jsonUrl: \"/editor/js/iconpicker/iconpicker-1.5.0.json\",\n // Optional: Change the buttons or search placeholder text according to the language.\n searchPlaceholder: \"Search Icon\",\n showAllButton: \"Show All\",\n cancelButton: \"Cancel\",\n noResultsFound: \"No results found.\", // v1.5.0 and the next versions\n borderRadius: \"20px\", // v1.5.0 and the next versions\n });\n IconPicker.Run(\"#launchIconPicker-\" + app.mykey, function () {\n //app.value = document.querySelector('#iconPicker').value;\n app.$emit(\"input\", {\n key: app.mykey,\n value: document.querySelector(\"#iconPicker-\" + app.mykey).value,\n });\n });\n },\n};\n\nconst html$2 = String.raw;\n\nconst template$2 = html$2`\n \n
\n
\n

Add Content

\n
×
\n
\n
\n \n
\n
\n \n\n \n
\n
\n

Change Design

\n
×
\n
\n\n
\n
Color
\n\n
\n \n
\n \n ChooseClose\n \n
\n
\n\n
\n \n \n \n
\n \n
\n\n
Font
\n\n
\n Default\n \n Lobster\n \n Playfair Display\n \n Raleway\n \n Cutive Mono\n \n Helvetica\n \n Georgia\n
\n
\n \n \n\n \n
\n
\n

Save

\n
×
\n
\n
\n
\n Download\n free\n
\n\n

\n Download your design as a html file, so you can tweak it further and\n upload it to any hosting you like.\n

\n\n \n
\n
\n \n\n
\n \n \n \n
\n`;\n\nvar Add = {\n template: template$2,\n\n props: [\"layouts\", \"entries\"],\n\n data() {\n return {\n add: false,\n designer: false,\n choose: false,\n save: false,\n color: \"#F7FAFC\",\n font: \"Rubik\",\n spacing: \"-0.04em\",\n colors: [\n \"#1CA085\",\n \"#27AF60\",\n \"#1FBC9C\",\n \"#2ECC70\",\n \"#3398DB\",\n \"#2980B9\",\n \"#575fcf\",\n \"#3D556E\",\n \"#222F3D\",\n \"#ffdd59\",\n \"#F2C511\",\n \"#F39C19\",\n \"#E84B3C\",\n \"#C0382B\",\n \"#BDC3C8\",\n \"#DDE6E8\",\n \"#F7FAFC\",\n \"#FFFFFF\",\n ],\n };\n },\n\n methods: {\n addLayout: function (event) {\n let layout = event.target.getAttribute(\"data-layout\");\n let newItem = {};\n newItem.id = \"item-\" + Date.now();\n newItem.layout = layout;\n newItem.title = \"Lorem Ipsum\";\n newItem.body =\n \"Lorem ipsum dolor sit amet, consectetur adipiscing elit. Mauris eleifend ligula ut augue scelerisque venenatis.\";\n console.log(newItem);\n this.entries.unshift(newItem);\n this.add = false;\n },\n setColor: function (hex) {\n this.color = hex;\n let hex2 = colorContrast(hex);\n let root = document.documentElement;\n root.style.setProperty(\"--bg-color\", hex);\n root.style.setProperty(\"--fg-color\", hex2);\n localStorage.setItem(\"bg-color\", hex);\n localStorage.setItem(\"fg-color\", hex2);\n },\n setFont: function (font) {\n this.font = font;\n let spacing = \"0\";\n if (font == \"Rubik\") {\n spacing = \"-0.04em\";\n }\n let root = document.documentElement;\n root.style.setProperty(\"--font\", font);\n root.style.setProperty(\"--spacing\", spacing);\n localStorage.setItem(\"font\", font);\n localStorage.setItem(\"spacing\", spacing);\n },\n swapStyleSheet(font) {\n let sheet = \"css/\" + font;\n document.getElementById(\"fonts\").setAttribute(\"href\", sheet);\n },\n downloadFile() {\n var css = ``;\n\n let header = `\n \t\t\n \n \n My Website\n\n \n \n \n\n ${css}\n\n \n \n\n \n \t\t\\n\\n`;\n let html = document.querySelector(\"#page\").innerHTML;\n let footer = `\\n\\n\n \t\t`;\n dl(\n \"index.html\",\n html_beautify(header + html.replaceAll(\"\", \"\") + footer)\n );\n },\n },\n mounted() {\n //console.log('Adder component mounted.')\n },\n};\n\nfunction colorContrast(hex) {\n var threshold = 150; /* about half of 256. Lower threshold equals more dark text on dark background */\n var hRed = hexToR(hex);\n var hGreen = hexToG(hex);\n var hBlue = hexToB(hex);\n\n function hexToR(h) {\n return parseInt(cutHex(h).substring(0, 2), 16);\n }\n\n function hexToG(h) {\n return parseInt(cutHex(h).substring(2, 4), 16);\n }\n\n function hexToB(h) {\n return parseInt(cutHex(h).substring(4, 6), 16);\n }\n\n function cutHex(h) {\n return h.charAt(0) == \"#\" ? h.substring(1, 7) : h;\n }\n\n var cBrightness = (hRed * 299 + hGreen * 587 + hBlue * 114) / 1000;\n if (cBrightness > threshold) {\n return \"#000000\";\n } else {\n return \"#ffffff\";\n }\n}\n\nfunction dl(filename, data) {\n var blob = new Blob([data], {\n type: \"text/html\",\n });\n if (window.navigator.msSaveOrOpenBlob) {\n window.navigator.msSaveBlob(blob, filename);\n } else {\n var elem = window.document.createElement(\"a\");\n elem.href = window.URL.createObjectURL(blob);\n elem.download = filename;\n document.body.appendChild(elem);\n elem.click();\n document.body.removeChild(elem);\n }\n}\n\nconst html$1 = String.raw;\nconst template$1 = html$1`\n \n \n`;\n\nvar Image$1 = {\n template: template$1,\n\n props: [\"mykey\"],\n emits: [\"image\"],\n\n data() {\n return {};\n },\n methods: {\n choose: function () {\n document.getElementById(\"fileInput\").click();\n },\n },\n mounted() {\n var app = this;\n\n document\n .getElementById(\"fileInput\")\n .addEventListener(\"change\", function (e) {\n var img_width = 500;\n\n var img = new Image();\n img.onload = function () {\n var canvas = document.createElement(\"canvas\"),\n ctx = canvas.getContext(\"2d\"),\n oc = document.createElement(\"canvas\"),\n octx = oc.getContext(\"2d\");\n\n canvas.width = img_width; // destination canvas size\n canvas.height = (canvas.width * img.height) / img.width;\n\n var cur = {\n width: Math.floor(img.width * 0.5),\n height: Math.floor(img.height * 0.5),\n };\n oc.width = cur.width;\n oc.height = cur.height;\n octx.drawImage(img, 0, 0, cur.width, cur.height);\n while (cur.width * 0.5 > img_width) {\n cur = {\n width: Math.floor(cur.width * 0.5),\n height: Math.floor(cur.height * 0.5),\n };\n octx.drawImage(\n oc,\n 0,\n 0,\n cur.width * 2,\n cur.height * 2,\n 0,\n 0,\n cur.width,\n cur.height\n );\n }\n ctx.drawImage(\n oc,\n 0,\n 0,\n cur.width,\n cur.height,\n 0,\n 0,\n canvas.width,\n canvas.height\n );\n var base64Image = canvas.toDataURL(\"image/jpeg\");\n\n //console.log(base64Image);\n //window.cur_img.src = base64Image;\n //app.item[app.mykey] = base64Image;\n\n app.$emit(\"image\", {\n key: app.mykey,\n value: base64Image,\n });\n };\n img.src = URL.createObjectURL(e.target.files[0]);\n });\n },\n};\n\nconst html = String.raw;\n\nconst template = html`\n \n
\n
\n

Edit

\n
×
\n
\n
\n
\n
{{key.replace('_', ' ')}}
\n\n \n \n \n\n \n \n
\n\n \n
Options
\n
\n \n Move Down\n \n \n Delete\n \n
\n \n\n \n
\n
\n \n\n \n`;\n\nvar Editor = {\n template,\n\n props: [\"layouts\", \"entries\"],\n\n data() {\n return {\n item: false,\n fields: false,\n };\n },\n\n components: {\n \"fa-picker\": Picker,\n \"add-content\": Add,\n \"image-resize\": Image$1,\n },\n\n methods: {\n save: function () {\n console.log(JSON.stringify(this.entries));\n this.item = false;\n },\n setIcon: function (e) {\n this.item[e.key] = e.value;\n },\n setImage: function (e) {\n this.item[e.key] = e.value;\n },\n deleteItem: function (id) {\n let r = confirm(\"Are you sure you want to delete this item?\");\n if (r == true) {\n this.entries.splice(\n this.entries.findIndex((x) => x.id === id),\n 1\n );\n this.item = false;\n }\n },\n moveItem: function (id) {\n var from = this.entries.findIndex((x) => x.id == id);\n var to = from + 1;\n console.log(from);\n console.log(to);\n var f = this.entries.splice(from, 1)[0];\n this.entries.splice(to, 0, f);\n },\n },\n\n mounted() {\n //console.log('Editor component mounted.')\n\n var app = this;\n document.body.addEventListener(\"click\", function (e) {\n if (e.target.closest(\".editable\")) {\n let el = e.target.closest(\".editable\");\n let id = el.id;\n app.item = app.entries.filter((x) => x.id === id)[0];\n\n let myfields = el.getAttribute(\"data-fields\");\n let params = new URLSearchParams(myfields);\n myfields = Object.fromEntries(params.entries());\n //console.log(myfields);\n app.fields = myfields;\n }\n });\n },\n};\n\nconst { createApp } = Vue;\nconst App = createApp({\n data() {\n return {\n editing: true,\n layouts: [\"featured\", \"post\", \"news\", \"newsleft\", \"features\"],\n entries: [\n {\n id: \"item-1\",\n layout: \"header\",\n title: \"Vue Pagebuilder\",\n subtitle: \"Lorem ipsum dolor site amet.\",\n button_text: \"Contact Us\",\n button_link: \"#\",\n icon: \"fas fa-bolt\",\n },\n {\n id: \"item-2\",\n layout: \"post\",\n title: \"Mauris eleifend ligula\",\n body: \" Vivamus in nisi commodo, auctor magna vel, viverra turpis. Quisque dapibus risus nec justo euismod, id fringilla dui lobortis. Mauris vitae semper arcu. Ut ac lorem felis.\",\n },\n {\n id: \"item-3\",\n layout: \"news\",\n title: \"Maecenas tincidunt sem quis rutrum\",\n body: \"Mauris in porttitor elit. Aenean elementum eleifend quam, in tristique eros auctor porta. Donec et est in tellus blandit feugiat id nec nunc.\",\n },\n {\n id: \"item-4\",\n layout: \"features\",\n title: \"Lorem Ipsum\",\n body: \"Lorem ipsum dolor sit amet, consectetur adipiscing elit. Mauris eleifend ligula ut augue scelerisque venenatis.\",\n },\n ],\n };\n },\n\n methods: {\n defaultVal(key, def) {\n if (key == \"\") {\n return def;\n } else {\n return key;\n }\n },\n },\n\n components: {\n \"wdgt-post\": Post,\n \"wdgt-header\": Header,\n \"wdgt-news\": News,\n \"wdgt-newsleft\": NewsLeft,\n \"wdgt-featured\": Featured,\n \"wdgt-features\": Features,\n \"page-editor\": Editor,\n },\n});\n\nwindow.addEventListener(\"load\", () => {\n App.mount(\"main\");\n});\n" }, { "path": "components/featured/featured.mjs", "content": "const html = String.raw;\n\nconst template = html`\n
\n
\n
\n

{{item.title}}

\n

{{item.body}}

\n
\n
\n
\n`;\n\nexport default {\n template,\n props: [\"item\"],\n mounted() {\n //console.log('Featured component mounted.')\n },\n};\n" }, { "path": "components/features/features.mjs", "content": "import helpers from \"./../helpers.mjs\";\n\nconst template = `\n \n
\n
\n
\n

{{item.title}}

\n

{{item.body}}

\n
\n
\n

{{def(item.title2, 'Lorem Ipsum')}}

\n

\n {{def(item.body2, \"Lorem ipsum dolor sit amet, consectetur adipiscing elit. Mauris eleifend ligula ut augue scelerisque venenatis.\")}}\n

\n
\n
\n
\n \n`;\n\nexport default {\n template,\n props: [\"item\"],\n created() {\n this.def = helpers.def;\n },\n mounted() {\n //console.log('Features component mounted.')\n },\n};\n" }, { "path": "components/header/header.mjs", "content": "const html = String.raw;\n\nconst template = html`\n \n
\n \n\n

{{item.title}}

\n

{{item.subtitle}}

\n\n {{item.button_text}}\n
\n \n`;\n\nexport default {\n template,\n props: [\"item\"],\n mounted() {\n //console.log('Banner component mounted.')\n },\n};\n" }, { "path": "components/helpers.mjs", "content": "export default {\n def: function (key, val) {\n if (key) {\n return key;\n } else {\n return val;\n }\n },\n youtube_parser: function (url) {\n var regExp =\n /^.*((youtu.be\\/)|(v\\/)|(\\/u\\/\\w\\/)|(embed\\/)|(watch\\?))\\??v?=?([^#&?]*).*/;\n var match = url.match(regExp);\n return match && match[7].length == 11 ? match[7] : false;\n },\n};\n" }, { "path": "components/news/news.mjs", "content": "import helpers from \"./../helpers.mjs\";\nconst html = String.raw;\n\nconst template = html`\n \n
\n
\n
\n

{{item.title}}

\n

{{item.body}}

\n
\n
\n \n \n \n
\n
\n
\n \n`;\n\nexport default {\n template,\n props: [\"item\"],\n created() {\n this.youtube_parser = helpers.youtube_parser;\n },\n mounted() {\n //console.log('News component mounted.')\n },\n};\n" }, { "path": "components/newsleft/newsleft.mjs", "content": "import helpers from \"./../helpers.mjs\";\nconst html = String.raw;\n\nconst template = html`\n \n
\n
\n
\n \n \n \n
\n\n
\n

{{item.title}}

\n

{{item.body}}

\n
\n
\n
\n \n`;\n\nexport default {\n template,\n props: [\"item\"],\n created() {\n this.youtube_parser = helpers.youtube_parser;\n },\n mounted() {\n //console.log('News component mounted.')\n },\n};\n" }, { "path": "components/post/post.mjs", "content": "const html = String.raw;\n\nconst template = html`\n
\n
\n
\n
\n
\n

{{item.title}}

\n

{{item.body}}

\n
\n
\n
\n
\n
\n`;\n\nexport default {\n template,\n props: [\"item\"],\n mounted() {\n //console.log('Post component mounted.')\n },\n};\n" }, { "path": "editor/components/add-content.mjs", "content": "const html = String.raw;\n\nconst template = html`\n \n
\n
\n

Add Content

\n
×
\n
\n
\n \n
\n
\n \n\n \n \n \n \n\n \n
\n
\n

Save

\n
×
\n
\n
\n
\n Download\n free\n
\n\n

\n Download your design as a html file, so you can tweak it further and\n upload it to any hosting you like.\n

\n\n \n
\n
\n \n\n
\n \n \n \n
\n`;\n\nexport default {\n template,\n\n props: [\"layouts\", \"entries\"],\n\n data() {\n return {\n add: false,\n designer: false,\n choose: false,\n save: false,\n color: \"#F7FAFC\",\n font: \"Rubik\",\n spacing: \"-0.04em\",\n colors: [\n \"#1CA085\",\n \"#27AF60\",\n \"#1FBC9C\",\n \"#2ECC70\",\n \"#3398DB\",\n \"#2980B9\",\n \"#575fcf\",\n \"#3D556E\",\n \"#222F3D\",\n \"#ffdd59\",\n \"#F2C511\",\n \"#F39C19\",\n \"#E84B3C\",\n \"#C0382B\",\n \"#BDC3C8\",\n \"#DDE6E8\",\n \"#F7FAFC\",\n \"#FFFFFF\",\n ],\n };\n },\n\n methods: {\n addLayout: function (event) {\n let layout = event.target.getAttribute(\"data-layout\");\n let newItem = {};\n newItem.id = \"item-\" + Date.now();\n newItem.layout = layout;\n newItem.title = \"Lorem Ipsum\";\n newItem.body =\n \"Lorem ipsum dolor sit amet, consectetur adipiscing elit. Mauris eleifend ligula ut augue scelerisque venenatis.\";\n console.log(newItem);\n this.entries.unshift(newItem);\n this.add = false;\n },\n setColor: function (hex) {\n this.color = hex;\n let hex2 = colorContrast(hex);\n let root = document.documentElement;\n root.style.setProperty(\"--bg-color\", hex);\n root.style.setProperty(\"--fg-color\", hex2);\n localStorage.setItem(\"bg-color\", hex);\n localStorage.setItem(\"fg-color\", hex2);\n },\n setFont: function (font) {\n this.font = font;\n let spacing = \"0\";\n if (font == \"Rubik\") {\n spacing = \"-0.04em\";\n }\n let root = document.documentElement;\n root.style.setProperty(\"--font\", font);\n root.style.setProperty(\"--spacing\", spacing);\n localStorage.setItem(\"font\", font);\n localStorage.setItem(\"spacing\", spacing);\n },\n swapStyleSheet(font) {\n let sheet = \"css/\" + font;\n document.getElementById(\"fonts\").setAttribute(\"href\", sheet);\n },\n downloadFile() {\n var css = ``;\n\n let header = `\n \t\t\n \n \n My Website\n\n \n \n \n\n ${css}\n\n \n \n\n \n \t\t\\n\\n`;\n let html = document.querySelector(\"#page\").innerHTML;\n let footer = `\\n\\n\n \t\t`;\n dl(\n \"index.html\",\n html_beautify(header + html.replaceAll(\"\", \"\") + footer)\n );\n },\n },\n mounted() {\n //console.log('Adder component mounted.')\n },\n};\n\nfunction colorContrast(hex) {\n var threshold = 150; /* about half of 256. Lower threshold equals more dark text on dark background */\n var hRed = hexToR(hex);\n var hGreen = hexToG(hex);\n var hBlue = hexToB(hex);\n\n function hexToR(h) {\n return parseInt(cutHex(h).substring(0, 2), 16);\n }\n\n function hexToG(h) {\n return parseInt(cutHex(h).substring(2, 4), 16);\n }\n\n function hexToB(h) {\n return parseInt(cutHex(h).substring(4, 6), 16);\n }\n\n function cutHex(h) {\n return h.charAt(0) == \"#\" ? h.substring(1, 7) : h;\n }\n\n var cBrightness = (hRed * 299 + hGreen * 587 + hBlue * 114) / 1000;\n if (cBrightness > threshold) {\n return \"#000000\";\n } else {\n return \"#ffffff\";\n }\n}\n\nfunction dl(filename, data) {\n var blob = new Blob([data], {\n type: \"text/html\",\n });\n if (window.navigator.msSaveOrOpenBlob) {\n window.navigator.msSaveBlob(blob, filename);\n } else {\n var elem = window.document.createElement(\"a\");\n elem.href = window.URL.createObjectURL(blob);\n elem.download = filename;\n document.body.appendChild(elem);\n elem.click();\n document.body.removeChild(elem);\n }\n}\n" }, { "path": "editor/components/fa-picker.mjs", "content": "const html = String.raw;\nconst template = html`\n \n \n  Choose Icon\n \n \n`;\n\nexport default {\n template,\n props: [\"mykey\", \"value\"],\n emits: [\"input\"],\n mounted() {\n var app = this;\n IconPicker.Init({\n // Required: You have to set the path of IconPicker JSON file to \"jsonUrl\" option. e.g. '/content/plugins/IconPicker/dist/iconpicker-1.5.0.json'\n jsonUrl: \"/editor/js/iconpicker/iconpicker-1.5.0.json\",\n // Optional: Change the buttons or search placeholder text according to the language.\n searchPlaceholder: \"Search Icon\",\n showAllButton: \"Show All\",\n cancelButton: \"Cancel\",\n noResultsFound: \"No results found.\", // v1.5.0 and the next versions\n borderRadius: \"20px\", // v1.5.0 and the next versions\n });\n IconPicker.Run(\"#launchIconPicker-\" + app.mykey, function () {\n //app.value = document.querySelector('#iconPicker').value;\n app.$emit(\"input\", {\n key: app.mykey,\n value: document.querySelector(\"#iconPicker-\" + app.mykey).value,\n });\n });\n },\n};\n" }, { "path": "editor/components/image-resize.mjs", "content": "const html = String.raw;\nconst template = html`\n \n \n`;\n\nexport default {\n template,\n\n props: [\"mykey\"],\n emits: [\"image\"],\n\n data() {\n return {};\n },\n methods: {\n choose: function () {\n document.getElementById(\"fileInput\").click();\n },\n },\n mounted() {\n var app = this;\n\n document\n .getElementById(\"fileInput\")\n .addEventListener(\"change\", function (e) {\n var img_width = 500;\n\n var img = new Image();\n img.onload = function () {\n var canvas = document.createElement(\"canvas\"),\n ctx = canvas.getContext(\"2d\"),\n oc = document.createElement(\"canvas\"),\n octx = oc.getContext(\"2d\");\n\n canvas.width = img_width; // destination canvas size\n canvas.height = (canvas.width * img.height) / img.width;\n\n var cur = {\n width: Math.floor(img.width * 0.5),\n height: Math.floor(img.height * 0.5),\n };\n oc.width = cur.width;\n oc.height = cur.height;\n octx.drawImage(img, 0, 0, cur.width, cur.height);\n while (cur.width * 0.5 > img_width) {\n cur = {\n width: Math.floor(cur.width * 0.5),\n height: Math.floor(cur.height * 0.5),\n };\n octx.drawImage(\n oc,\n 0,\n 0,\n cur.width * 2,\n cur.height * 2,\n 0,\n 0,\n cur.width,\n cur.height\n );\n }\n ctx.drawImage(\n oc,\n 0,\n 0,\n cur.width,\n cur.height,\n 0,\n 0,\n canvas.width,\n canvas.height\n );\n var base64Image = canvas.toDataURL(\"image/jpeg\");\n\n //console.log(base64Image);\n //window.cur_img.src = base64Image;\n //app.item[app.mykey] = base64Image;\n\n app.$emit(\"image\", {\n key: app.mykey,\n value: base64Image,\n });\n };\n img.src = URL.createObjectURL(e.target.files[0]);\n });\n },\n};\n" }, { "path": "editor/editor.css", "content": ".edit {\n display: block;\n width: 50px;\n height: 50px;\n background-image: url(img/cog.png);\n background-size: cover;\n position: absolute;\n top: 25px;\n right: 25px;\n cursor: pointer;\n}\n\n.editor {\n overflow-y: auto;\n}\n\n#adder,\n#designer,\n#saver {\n position: fixed;\n top: 0;\n width: 300px;\n height: 100%;\n background-color: white;\n border-left: 1px solid #ddd;\n box-shadow: 0px 3px 15px rgba(0, 0, 0, 0.2);\n overflow-y: auto;\n}\n\n.editable > .container {\n border: 1px solid transparent;\n}\n\n.editable > .container:hover {\n border: 1px dashed #333;\n cursor: pointer;\n}\n\n.fade-enter-active,\n.fade-leave-active {\n transition: opacity 0.5s ease;\n}\n\n.fade-enter-from,\n.fade-leave-to {\n opacity: 0;\n}\n\n.slidein-right {\n width: 400px;\n position: fixed;\n z-index: 9999;\n top: 0;\n height: 100%;\n background-color: white;\n box-shadow: 1px 1px 10px rgba(0, 0, 0, 0.5);\n right: 0px;\n}\n\n.slide-right-enter-active,\n.slide-right-leave-active {\n transition: 0.5s ease;\n}\n\n.slide-right-enter-from,\n.slide-right-leave-to {\n right: -400px;\n}\n\n.slidein-left {\n left: 0;\n}\n\n.slide-left-enter-active,\n.slide-left-leave-active {\n transition: 0.5s ease;\n}\n\n.slide-left-enter-from,\n.slide-left-leave-to {\n left: -300px;\n}\n\n.editor textarea {\n min-height: 200px;\n resize: none;\n}\n\n.editor-header {\n padding-bottom: 5px;\n background-color: #f8f8f8;\n padding: 10px;\n padding-left: 20px;\n padding-right: 20px;\n height: 50px;\n border-bottom: 1px solid #dddddd;\n position: fixed;\n z-index: 99;\n}\n\n.slidein-left .editor-header {\n width: 300px;\n}\n\n.slidein-right .editor-header {\n width: 400px;\n}\n\n.editor-header h4 {\n font-size: 16px;\n padding-top: 5px;\n}\n\n.close:hover {\n cursor: pointer;\n}\n\n.editor-content {\n padding: 20px;\n padding-top: 50px;\n}\n\n.editor-content:first-child {\n margin-top: 0;\n}\n\n.label {\n text-transform: uppercase;\n letter-spacing: 0.03em;\n font-size: 14px;\n margin-bottom: 5px;\n margin-top: 20px;\n color: #212529;\n}\n\n.save {\n margin-top: 30px;\n}\n\n.box {\n display: block;\n border: 1px solid #ddd;\n margin-bottom: 10px;\n}\n\n.box:hover {\n background-color: #f8f8f8;\n cursor: pointer;\n text-decoration: none;\n}\n\n#dock {\n position: fixed;\n bottom: 15px;\n text-align: center;\n width: 300px;\n left: calc(50% - 150px);\n}\n\n#dock img {\n width: 60px;\n margin: 5px;\n}\n\n.grow {\n transition: all 0.2s ease-in-out;\n}\n.grow:hover {\n transform: scale(1.1);\n cursor: pointer;\n}\n\n#editor .btn-outline-danger {\n border: 1px solid #6c757d;\n color: #6c757d;\n}\n\n#editor .btn-primary {\n position: fixed;\n right: 15px;\n bottom: 15px;\n width: 370px;\n}\n\n.swatch {\n display: inline-block;\n vertical-align: top;\n width: 32px;\n height: 32px;\n margin-right: 11px;\n margin-bottom: 6px;\n border-radius: 6px;\n cursor: pointer;\n text-align: center;\n border: 1px solid #ddd;\n}\n\n.fa-center {\n margin-top: 8px;\n}\n\n.w-100px {\n width: 100px;\n}\n\na.list-group-item {\n color: black;\n}\n\na.list-group-item:hover {\n background-color: #f8f8f8;\n text-decoration: none;\n cursor: pointer;\n}\n\n.info {\n padding-top: 5px;\n color: #777;\n}\n" }, { "path": "editor/editor.mjs", "content": "import Picker from \"./components/fa-picker.mjs\";\nimport Add from \"./components/add-content.mjs\";\nimport Image from \"./components/image-resize.mjs\";\nconst html = String.raw;\n\nconst template = html`\n \n
\n
\n

Edit

\n
×
\n
\n
\n
\n
{{key.replace('_', ' ')}}
\n\n \n \n \n\n \n \n
\n\n \n
Options
\n
\n \n Move Down\n \n \n Delete\n \n
\n \n\n \n
\n
\n \n\n \n`;\n\nexport default {\n template,\n\n props: [\"layouts\", \"entries\"],\n\n data() {\n return {\n item: false,\n fields: false,\n };\n },\n\n components: {\n \"fa-picker\": Picker,\n \"add-content\": Add,\n \"image-resize\": Image,\n },\n\n methods: {\n save: function () {\n console.log(JSON.stringify(this.entries));\n this.item = false;\n },\n setIcon: function (e) {\n this.item[e.key] = e.value;\n },\n setImage: function (e) {\n this.item[e.key] = e.value;\n },\n deleteItem: function (id) {\n let r = confirm(\"Are you sure you want to delete this item?\");\n if (r == true) {\n this.entries.splice(\n this.entries.findIndex((x) => x.id === id),\n 1\n );\n this.item = false;\n }\n },\n moveItem: function (id) {\n var from = this.entries.findIndex((x) => x.id == id);\n var to = from + 1;\n console.log(from);\n console.log(to);\n var f = this.entries.splice(from, 1)[0];\n this.entries.splice(to, 0, f);\n },\n },\n\n mounted() {\n //console.log('Editor component mounted.')\n\n var app = this;\n document.body.addEventListener(\"click\", function (e) {\n if (e.target.closest(\".editable\")) {\n let el = e.target.closest(\".editable\");\n let id = el.id;\n app.item = app.entries.filter((x) => x.id === id)[0];\n\n let myfields = el.getAttribute(\"data-fields\");\n let params = new URLSearchParams(myfields);\n myfields = Object.fromEntries(params.entries());\n //console.log(myfields);\n app.fields = myfields;\n }\n });\n },\n};\n" }, { "path": "editor/js/iconpicker/iconpicker-1.5.0.css", "content": "/*!\n* IconPicker ('https://github.com/furcan/IconPicker')\n* Version: 1.5.0 \n* Author: Furkan MT ('https://github.com/furcan')\n* Dependencies: Font Awesome Free v5.11.2 (https://fontawesome.com/license/free)\n* Copyright 2019 IconPicker, MIT Licence ('https://opensource.org/licenses/MIT')*\n*/\n\ndiv#IconPickerModal {\ndisplay:none;\nposition: absolute;\nz-index: 999999;\nwidth: 95%;\nmax-width: 1440px;\nleft: 0;\nright: 0;\ntop: 100px;\nmargin: auto;}\n\ndiv#IconPickerModal:before {\ntransition:all .4s ease-in-out;\nopacity: 0;\nvisibility: hidden;\ncontent:\"\";\nposition: fixed;\nz-index:-1;\nleft:0;\ntop:0;\nwidth:100%;\nheight:100%;\nbackground:rgba(0, 0, 0, 0.5);}\n\ndiv#IconPickerModal.animate:before {\nopacity: 1;\nvisibility: visible;}\n\ndiv#IconPickerModal .ip-icons-content {\ntransition:all .4s ease-in-out;\ntransform:scale(.5);\nopacity:0;\nfloat: left;\nwidth: 100%;\nbackground: #ffffff;\nbox-shadow: 0 0 24px -8px rgba(0, 0, 0, 0.2);\nborder-radius: 20px;\npadding: 20px;\nposition:relative;\nz-index:2;}\n\ndiv#IconPickerModal.animate .ip-icons-content {\ntransform:scale(1);\nopacity:1;}\n\ndiv#IconPickerModal .ip-icons-content .ip-icons-search {\nborder-bottom: 1px dashed #e8e8e8;\npadding: 0 0 20px;\nmargin: 0 0 10px;\nposition:relative;\nfloat: left;\nwidth: 100%;}\n\ndiv#IconPickerModal .ip-icons-content .ip-icons-search > input#IconPickerSearch {\ntransition: all .2s ease-in-out;\nfloat: left;\nwidth: 100%;\nheight:50px;\nline-height:50px;\nfont-size: 18px;\ncolor: #1e1e1e;\nbackground: #fff;\nfont-weight: 400;\nborder: 1px solid #f4f4f4;\nbox-shadow:0 0 15px -8px rgba(0, 0, 0, 0.4);\nborder-radius: 50px;\npadding: 0 50px 0 20px;}\ndiv#IconPickerModal .ip-icons-content .ip-icons-search > input#IconPickerSearch:hover,\ndiv#IconPickerModal .ip-icons-content .ip-icons-search > input#IconPickerSearch:focus {\nborder-color:#1e1e1e;}\n\ndiv#IconPickerModal .ip-icons-content .ip-icons-search > i.placeholder-icon {\ntransition: all .2s ease-in-out;\nposition: absolute;\nz-index: 2;\npointer-events: none;\nright: 0;\ntop: 0;\nwidth: 50px;\nheight: 50px;\nborder-radius: 50px;\nfont-size: 25px;\nline-height: 50px;\ntext-align: center;\ncolor: #eaeaea;}\ndiv#IconPickerModal .ip-icons-content .ip-icons-search > input#IconPickerSearch:hover + i.placeholder-icon,\ndiv#IconPickerModal .ip-icons-content .ip-icons-search > input#IconPickerSearch:focus + i.placeholder-icon {\ncolor:#1e1e1e;}\n\ndiv#IconPickerModal .ip-icons-content .ip-icons-search-results {\nposition:relative;\nfloat: left;\nwidth: 100%;}\n\ndiv#IconPickerModal .ip-icons-content .ip-icons-search-results p.ip-no-results-found {\nfloat: left;\nwidth: 100%;\nmargin: 20px 0;\ntext-align: center;\nfont-size: 15px;\nline-height: 1.4;\ncolor: #9b9b9b;}\n\ndiv#IconPickerModal .ip-icons-content .ip-icons-area {\npadding: 10px;\nmax-height:400px;\noverflow:hidden;\nposition:relative;\nfloat: left;\nwidth: 100%;}\ndiv#IconPickerModal.show-all .ip-icons-content .ip-icons-area {\nmax-height:unset;\noverflow:unset;}\n\ndiv#IconPickerModal .ip-icons-content .ip-icons-area:before {\ntransition:all .2s ease-in-out;\ncontent: \"\";\nposition: absolute;\nz-index: 9;\nwidth: 100%;\nheight: 60px;\nleft: 0;\nbottom: 0;\nbox-shadow: 0 0 50px 25px rgba(255, 255, 255, 0.75);\nbackground: rgba(255, 255, 255, 0.8);}\ndiv#IconPickerModal.show-all .ip-icons-content .ip-icons-area:before {\nopacity:0;\nvisibility:hidden;}\n\ndiv#IconPickerModal .ip-icons-content .ip-icons-search-results > * > i,\ndiv#IconPickerModal .ip-icons-content .ip-icons-area > i {\ncursor:pointer;\nposition: relative;\ntransition:all .2s ease-in-out;\nfont-size: 21px;\nline-height: 26px;\nfloat: left;\nborder-radius:5px;\nmargin: 3px;\npadding: 2px;\nmin-width: 30px;\ntext-align: center;}\n\ndiv#IconPickerModal .ip-icons-content .ip-icons-search-results > * > i:hover,\ndiv#IconPickerModal .ip-icons-content .ip-icons-area > i:hover {\ntransform:scale(1.8);\nz-index: 2;\n-moz-box-shadow: 0 0 14px -6px rgba(0, 0, 0, 0.5);\nbox-shadow: 0 0 16px -6px rgba(0, 0, 0, 0.5);\nbackground:#fff;}\n\ndiv#IconPickerModal .ip-icons-content .ip-icons-area > a.ip-show-all-icons {\ntransition: all .2s ease-in-out;\nposition: absolute;\nwidth: 120px;\nz-index: 10;\nleft: 0;\nright: 0;\nbottom: 10px;\nmargin: auto;\ntext-align: center;\nbox-shadow:0 0 24px -8px rgba(0, 0, 0, 0.2);\nbackground: #fff;\ncolor: #9b9b9b;\nborder: 1px solid #bcbcbc;\npadding: 12px;\nborder-radius: 30px;\nfont-weight:500;\nfont-size: 13px;\nline-height: 16px;}\ndiv#IconPickerModal .ip-icons-content .ip-icons-area > a.ip-show-all-icons:hover {\ncolor: #fff;\nborder-color: #1e1e1e;\nbackground: #1e1e1e;}\n\ndiv#IconPickerModal .ip-icons-content .ip-icons-footer {\nborder-top: 1px dashed #e8e8e8;\npadding: 15px 0 0;\nmargin:10px 0 0;\nfloat: left;\nwidth: 100%;}\n\ndiv#IconPickerModal .ip-icons-content .ip-icons-footer a.cancel {\ntransition: all .2s ease-in-out;\nfloat: right;\ncolor: #9b9b9b;\npadding: 10px 18px;\nborder: 1px solid #bcbcbc;\nborder-radius: 20px;\nfont-size: 14px;\nline-height: 15px;\nfont-weight: 500;}\n\ndiv#IconPickerModal .ip-icons-content .ip-icons-footer a.cancel:hover {\ncolor: #fff;\nborder-color: #1e1e1e;\nbackground: #1e1e1e;}\n\ndiv#IconPickerLoading {\ntransition: all .3s ease-in-out;\nopacity: 1;\nposition: absolute;\nz-index: 2;\nwidth: 100%;\nheight: 100%;\nbackground: #fff;\ntext-align: center;}\n\ndiv#IconPickerLoading.hide {\nopacity: 0;}\n\ndiv#IconPickerLoading > svg {\nwidth: 60px;\nheight: 60px;\nposition: absolute;\nz-index: 2;\nleft: 0;\ntop: 0;\nright: 0;\nbottom: 60px;\nmargin: auto;}" }, { "path": "editor/js/iconpicker/iconpicker-1.5.0.js", "content": "/*!\n* IconPicker ('https://github.com/furcan/IconPicker')\n* Version: 1.5.0 \n* Author: Furkan MT ('https://github.com/furcan')\n* Dependencies: Font Awesome Free v5.11.2 (https://fontawesome.com/license/free)\n* Copyright 2019 IconPicker, MIT Licence ('https://opensource.org/licenses/MIT')*\n*/\n\n'use strict';\n\n// IconPicker: Default Options on\nvar ipDefaultOptions = {\n jsonUrl: null,\n searchPlaceholder: 'Search Icon',\n showAllButton: 'Show All',\n cancelButton: 'Cancel',\n noResultsFound: 'No results found.',\n borderRadius: '20px',\n}\nvar ipNewOptions;\nvar ipGithubUrl = 'https://github.com/furcan/IconPicker';\n// IconPicker: Default Options off\n\n// IconPicker: Extend Options on\nvar extendIconPicker = function () {\n var extended = {};\n var deep = false;\n var i = 0;\n if (Object.prototype.toString.call(arguments[0]) === '[object Boolean]') {\n deep = arguments[0];\n i++;\n }\n var merge = function (obj) {\n for (var prop in obj) {\n if (obj.hasOwnProperty(prop)) {\n if (deep && Object.prototype.toString.call(obj[prop]) === '[object Object]') {\n extended[prop] = extendIconPicker(extended[prop], obj[prop]);\n } else {\n extended[prop] = obj[prop];\n }\n }\n }\n };\n for (; i < arguments.length; i++) {\n merge(arguments[i]);\n }\n return extended;\n};\n// IconPicker: Extend Options off\n\n\n// IconPicker: Main on\nvar IconPicker = {\n\n // init\n Init: function (ipUserOptions) {\n ipNewOptions = extendIconPicker(true, ipDefaultOptions, ipUserOptions);\n },\n\n // run\n Run: function (theButton, theCallback) {\n\n // IconPicker: Console Error Function on\n var ipConsoleError = function (errorMessage) {\n return console.error('%c IconPicker (Error) ', 'padding:2px;border-radius:20px;color:#fff;background:#f44336', '\\n' + errorMessage);\n }\n // IconPicker: Console Error Function off\n\n // IconPicker: Console Log Function on\n var ipConsoleLog = function (errorMessage) {\n return console.log('%c IconPicker (Info) ', 'padding:2px;border-radius:20px;color:#fff;background:#00bcd4', '\\n' + errorMessage);\n }\n // IconPicker: Console Log Function off\n\n // IconPicker: Check The Arguments For Proceed on\n if (arguments && arguments.length <= 2) {\n\n // query selector\n var ipButtons = document.querySelectorAll(theButton);\n\n // if button exist on the document\n if (ipButtons && ipButtons.length > 0) {\n for (var i = 0; i < ipButtons.length; i++) {\n\n // IconPicker: Button Listeners -> Send XMLHttpRequest on\n var ipButton = ipButtons[i];\n ipButton.addEventListener('click', function () {\n var jsonUrl = ipNewOptions.jsonUrl;\n var inputElement = this.dataset.iconpickerInput;\n var previewElement = this.dataset.iconpickerPreview;\n var showAllButton = ipNewOptions.showAllButton;\n if (!showAllButton || (showAllButton && showAllButton.length < 1)) {\n showAllButton = ipDefaultOptions.showAllButton;\n }\n var cancelButton = ipNewOptions.cancelButton;\n if (!cancelButton || (cancelButton && cancelButton.length < 1)) {\n cancelButton = ipDefaultOptions.cancelButton;\n }\n var searchPlaceholder = ipNewOptions.searchPlaceholder;\n if (!searchPlaceholder || (searchPlaceholder && searchPlaceholder.length < 1)) {\n searchPlaceholder = ipDefaultOptions.searchPlaceholder;\n }\n var borderRadius = ipNewOptions.borderRadius;\n if (!borderRadius || (borderRadius && borderRadius.length < 1)) {\n borderRadius = ipDefaultOptions.borderRadius;\n }\n\n // check the json url on\n if (!jsonUrl) {\n ipConsoleError('You have to set the path of IconPicker JSON file to \"jsonUrl\" option. \\n\\nVisit to learn how: ' + ipGithubUrl);\n return false;\n }\n // check the json url off\n\n // check the input on\n var checkInput = document.querySelectorAll(inputElement);\n if (checkInput.length <= 0) {\n ipConsoleError('You must define your Input element with it\\'s ID or Class Name to your Button element data attribute. \\n\\nExample: \\ndata-iconpicker-input=\"#MyIconInput\" or \\ndata-iconpicker-input=\".my-icon-input\" \\n\\nVisit to learn how: ' + ipGithubUrl);\n return false;\n }\n // check the input off\n\n // check the preview icon on\n var checkPreviewIcon = document.querySelectorAll(previewElement);\n if (checkPreviewIcon.length <= 0) {\n ipConsoleLog('You can define your Preview Icon element with it\\'s ID or Class Name to your Button element data attribute. \\n\\nExample: \\ndata-iconpicker-preview=\"i#MyIconElement\" or \\ndata-iconpicker-preview=\"i.my-icon-element\" \\n\\nVisit to learn how: ' + ipGithubUrl);\n }\n // check the preview icon off\n\n // check the callback on\n if (!theCallback && typeof theCallback !== 'function') {\n theCallback = undefined;\n }\n // check the callback off\n\n getIconListXmlHttpRequest(jsonUrl, showAllButton, cancelButton, searchPlaceholder, borderRadius, inputElement, previewElement, theCallback);\n\n });\n // IconPicker: Button Listeners -> Send XMLHttpRequest off\n\n }\n }\n // not exist\n else {\n ipConsoleError('You called the IconPicker with \"' + theButton + '\" selector, but there is no such element on the document.');\n }\n\n } else if (arguments && arguments.length > 2) {\n ipConsoleError('More parameters than allowed.');\n return false;\n } else {\n ipConsoleError('You have to call the IconPicker with an Element(Button or etc.) Class or ID. \\n\\nYou can also find the other required data attributes in the Documentation. \\n\\nVisit: ' + ipGithubUrl);\n return false;\n }\n // IconPicker: Check The Arguments For Proceed off\n\n\n // IconPicker: Get Library from JSON and AppendTo Body on\n var getIconListXmlHttpRequest = function (jsonUrl, buttonShowAll, buttonCancel, searchPlaceholder, borderRadius, inputElement, previewElement, theCallback) {\n\n // if chrome browser\n if (navigator.userAgent.toLowerCase().indexOf('chrome') > -1) {\n // check the protocol\n if (window.location.protocol.indexOf('http') <= -1) {\n ipConsoleLog('Chrome Browser blocked this request by CORS policy.');\n return false;\n }\n }\n\n // modal element\n var ipElement = document.getElementById('IconPickerModal');\n\n // if modal element doesn't exist on document send XMLHttpRequest\n if (!ipElement) {\n var xmlHttp = new XMLHttpRequest();\n xmlHttp.open('GET', jsonUrl, true);\n xmlHttp.setRequestHeader('Content-type', 'application/json; charset=utf-8');\n xmlHttp.send();\n xmlHttp.onreadystatechange = function () {\n if (this.readyState === 4) {\n if (this.status === 200) { // success\n var data = this.responseText;\n appendIconListToBody(data, buttonShowAll, buttonCancel, searchPlaceholder, borderRadius, inputElement, previewElement, theCallback);\n } else {\n ipConsoleError('XMLHttpRequest Failed.');\n }\n }\n };\n }\n }\n // IconPicker: Get Library from JSON and AppendTo Body off\n\n\n // IconPicker: Append Library to Body on\n var appendIconListToBody = function (data, buttonShowAll, buttonCancel, searchPlaceholder, borderRadius, inputElement, previewElement, theCallback) {\n\n // data\n var jsonData = JSON.parse(data);\n\n // icons\n var icons = '';\n for (var key in jsonData) {\n if (jsonData.hasOwnProperty(key)) {\n var forObj = jsonData[key];\n var icon = '';\n icons += icon;\n }\n }\n\n // loading indicator\n var loadingIndicator = '
';\n\n // icons wrap\n var iconWrap = '
' +\n '
' +\n '
' +\n '
' +\n loadingIndicator +\n icons +\n '' + buttonShowAll + '' +\n '
' +\n '
' + buttonCancel + '
' +\n '
';\n\n // create the modal element\n var IconPickerModal = document.createElement('div')\n IconPickerModal.id = 'IconPickerModal';\n IconPickerModal.innerHTML = iconWrap;\n\n // body\n var docBody = document.body;\n\n // append to body\n docBody.appendChild(IconPickerModal);\n\n // get the modal element\n var ipElement = document.getElementById(IconPickerModal.id);\n\n // modal element display css\n ipElement.style.display = 'block';\n\n // heights\n var ipHeight = parseInt(ipElement.offsetHeight);\n var winHeight = parseInt(window.innerHeight);\n\n // modal element position top css on\n var liveScrollTop = parseInt(window.pageYOffset || document.documentElement.scrollTop);\n var totalTopPos = liveScrollTop + ((winHeight - ipHeight) / 2);\n if (winHeight + 20 <= ipHeight) {\n totalTopPos = liveScrollTop;\n }\n ipElement.style.top = totalTopPos + 'px';\n // modal element position top css off\n\n // add css animation class to modal\n ipElement.classList.add('animate');\n\n // remove loading indicator on\n var loadingElement = document.getElementById('IconPickerLoading');\n var ltAnimate = setTimeout(function () {\n loadingElement.classList.add('hide');\n clearTimeout(ltAnimate);\n }, 600);\n var ltRemove = setTimeout(function () {\n loadingElement.parentNode.removeChild(loadingElement);\n clearTimeout(ltRemove);\n }, 900);\n // remove loading indicator off\n\n // show all button click listener on\n var showAllButtonElm = document.getElementById(IconPickerModal.id).getElementsByClassName('ip-show-all-icons')[0];\n showAllButtonElm.addEventListener('click', function () {\n ipElement.classList.add('show-all');\n this.parentNode.removeChild(this);\n }, false);\n // show all button click listener off\n\n // close and remove all on\n var removeIpElement = function (delay) {\n ipElement.classList.remove('animate');\n setTimeout(function () {\n docBody.removeChild(ipElement);\n }, delay);\n }\n // close and remove all off\n\n // cancel button click listener on\n var cancelButtonElm = document.getElementById(IconPickerModal.id).getElementsByClassName('cancel')[0];\n cancelButtonElm.addEventListener('click', function () {\n removeIpElement(400);\n }, false);\n // cancel button click listener off\n\n // search input keyup listener on\n var searchInputElm = document.getElementById('IconPickerSearch');\n searchInputElm.addEventListener('keyup', function (e) {\n\n // keycodes\n var eKeyCode = e.keyCode;\n var eCode = e.code.toString().toLowerCase();\n\n // check space and backspace keyup\n var spaceOrBackspace = false;\n if (eKeyCode === 32 || eCode === 'space' || eKeyCode === 8 || eCode === 'backspace') {\n spaceOrBackspace = true;\n }\n\n // cant type space\n if (eKeyCode === 32 || eCode === 'space') {\n this.value = this.value.replace(' ', '');\n return false;\n }\n\n // this val\n var searchVal = this.value.toString().toLowerCase();\n\n // define icons areas\n var firstIconsArea = document.getElementById(IconPickerModal.id).getElementsByClassName('ip-icons-area')[0];\n var searchResultArea = document.getElementById(IconPickerModal.id).getElementsByClassName('ip-icons-search-results')[0];\n\n // clear old results\n searchResultArea.innerHTML = '';\n\n // (if not space or backspace) and (if typed at least one char) able to search\n if (!spaceOrBackspace && searchVal.length > 0) {\n\n // for \"serch term\" in Json\n var tempIcons = '';\n for (var key in jsonData) {\n if (jsonData.hasOwnProperty(key)) {\n var forObj = jsonData[key];\n // if there is results create them\n if (forObj.toString().indexOf(searchVal) > -1) {\n firstIconsArea.style.display = 'none';\n var tempIcon = '';\n tempIcons += tempIcon;\n }\n }\n }\n\n // create a temp container\n var tempResults = document.createElement('div');\n tempResults.id = 'IconsTempResults';\n tempResults.innerHTML = tempIcons;\n\n // no results found on\n if (tempIcons.length < 1) {\n firstIconsArea.style.display = 'none';\n var noResultsText = ipNewOptions.noResultsFound;\n if (!noResultsText || (noResultsText && noResultsText.length < 1)) {\n noResultsText = ipDefaultOptions.noResultsFound;\n }\n var noResultElm = '

' + noResultsText + '

';\n tempResults.innerHTML = noResultElm;\n }\n // no results found off\n\n // append temp container to results area\n searchResultArea.appendChild(tempResults);\n\n // event listener for each temp icon\n eachIconEventListener('search');\n\n }\n // show first icons \n else {\n firstIconsArea.style.display = 'block';\n }\n\n }, false);\n // search input keyup listener off\n\n\n // each icon click listener on\n var eachIconEventListener = function (firstOrSearch) {\n\n var inputElm = document.querySelectorAll(inputElement);\n var previewElm = document.querySelectorAll(previewElement);\n\n // define icons on\n var eachIconElm;\n if (firstOrSearch === 'first') { // first\n eachIconElm = document.getElementById(IconPickerModal.id).getElementsByClassName('first-icon');\n } else if (firstOrSearch === 'search') { // search\n eachIconElm = document.getElementById(IconPickerModal.id).getElementsByClassName('search-icon');\n }\n // define icons off\n\n // add listeners each on\n for (var i = 0; i < eachIconElm.length; i++) {\n var singleIconElm = eachIconElm[i];\n singleIconElm.addEventListener('click', function (e) {\n e.preventDefault();\n var iconClassName = this.dataset.class;\n\n // each input value on\n for (var i = 0; i < inputElm.length; i++) {\n\n var getTagName = inputElm[i].tagName.toString().toLowerCase();\n // if an input or textarea element\n if (getTagName === 'input' || getTagName === 'textarea') {\n inputElm[i].value = iconClassName;\n }\n // else any of element\n else {\n inputElm[i].innerHTML = iconClassName;\n }\n\n }\n // each input value off\n\n // each preview on\n for (var i = 0; i < previewElm.length; i++) {\n previewElm[i].className = iconClassName;\n }\n // each preview off\n\n // callback on\n if (theCallback) {\n theCallback();\n }\n // callback off\n\n removeIpElement(400);\n }, false);\n }\n // add listeners each off\n\n }\n // each icon click listener off\n\n // first icons listeners\n eachIconEventListener('first');\n\n }\n // IconPicker: Append Library to Body off\n },\n}\n// IconPicker: Main off" }, { "path": "editor/js/iconpicker/iconpicker-1.5.0.json", "content": "{\n \"0\":\"fab fa-500px\",\n \"1\":\"fab fa-accessible-icon\",\n \"2\":\"fab fa-accusoft\",\n \"3\":\"fab fa-acquisitions-incorporated\",\n \"4\":\"fas fa-ad\",\n \"5\":\"fas fa-address-book\",\n \"6\":\"far fa-address-book\",\n \"7\":\"fas fa-address-card\",\n \"8\":\"far fa-address-card\",\n \"9\":\"fas fa-adjust\",\n \"10\":\"fab fa-adn\",\n \"11\":\"fab fa-adobe\",\n \"12\":\"fab fa-adversal\",\n \"13\":\"fab fa-affiliatetheme\",\n \"14\":\"fas fa-air-freshener\",\n \"15\":\"fab fa-airbnb\",\n \"16\":\"fab fa-algolia\",\n \"17\":\"fas fa-align-center\",\n \"18\":\"fas fa-align-justify\",\n \"19\":\"fas fa-align-left\",\n \"20\":\"fas fa-align-right\",\n \"21\":\"fab fa-alipay\",\n \"22\":\"fas fa-allergies\",\n \"23\":\"fab fa-amazon\",\n \"24\":\"fab fa-amazon-pay\",\n \"25\":\"fas fa-ambulance\",\n \"26\":\"fas fa-american-sign-language-interpreting\",\n \"27\":\"fab fa-amilia\",\n \"28\":\"fas fa-anchor\",\n \"29\":\"fab fa-android\",\n \"30\":\"fab fa-angellist\",\n \"31\":\"fas fa-angle-double-down\",\n \"32\":\"fas fa-angle-double-left\",\n \"33\":\"fas fa-angle-double-right\",\n \"34\":\"fas fa-angle-double-up\",\n \"35\":\"fas fa-angle-down\",\n \"36\":\"fas fa-angle-left\",\n \"37\":\"fas fa-angle-right\",\n \"38\":\"fas fa-angle-up\",\n \"39\":\"fas fa-angry\",\n \"40\":\"far fa-angry\",\n \"41\":\"fab fa-angrycreative\",\n \"42\":\"fab fa-angular\",\n \"43\":\"fas fa-ankh\",\n \"44\":\"fab fa-app-store\",\n \"45\":\"fab fa-app-store-ios\",\n \"46\":\"fab fa-apper\",\n \"47\":\"fab fa-apple\",\n \"48\":\"fas fa-apple-alt\",\n \"49\":\"fab fa-apple-pay\",\n \"50\":\"fas fa-archive\",\n \"51\":\"fas fa-archway\",\n \"52\":\"fas fa-arrow-alt-circle-down\",\n \"53\":\"far fa-arrow-alt-circle-down\",\n \"54\":\"fas fa-arrow-alt-circle-left\",\n \"55\":\"far fa-arrow-alt-circle-left\",\n \"56\":\"fas fa-arrow-alt-circle-right\",\n \"57\":\"far fa-arrow-alt-circle-right\",\n \"58\":\"fas fa-arrow-alt-circle-up\",\n \"59\":\"far fa-arrow-alt-circle-up\",\n \"60\":\"fas fa-arrow-circle-down\",\n \"61\":\"fas fa-arrow-circle-left\",\n \"62\":\"fas fa-arrow-circle-right\",\n \"63\":\"fas fa-arrow-circle-up\",\n \"64\":\"fas fa-arrow-down\",\n \"65\":\"fas fa-arrow-left\",\n \"66\":\"fas fa-arrow-right\",\n \"67\":\"fas fa-arrow-up\",\n \"68\":\"fas fa-arrows-alt\",\n \"69\":\"fas fa-arrows-alt-h\",\n \"70\":\"fas fa-arrows-alt-v\",\n \"71\":\"fab fa-artstation\",\n \"72\":\"fas fa-assistive-listening-systems\",\n \"73\":\"fas fa-asterisk\",\n \"74\":\"fab fa-asymmetrik\",\n \"75\":\"fas fa-at\",\n \"76\":\"fas fa-atlas\",\n \"77\":\"fab fa-atlassian\",\n \"78\":\"fas fa-atom\",\n \"79\":\"fab fa-audible\",\n \"80\":\"fas fa-audio-description\",\n \"81\":\"fab fa-autoprefixer\",\n \"82\":\"fab fa-avianex\",\n \"83\":\"fab fa-aviato\",\n \"84\":\"fas fa-award\",\n \"85\":\"fab fa-aws\",\n \"86\":\"fas fa-baby\",\n \"87\":\"fas fa-baby-carriage\",\n \"88\":\"fas fa-backspace\",\n \"89\":\"fas fa-backward\",\n \"90\":\"fas fa-bacon\",\n \"91\":\"fas fa-balance-scale\",\n \"92\":\"fas fa-balance-scale-left\",\n \"93\":\"fas fa-balance-scale-right\",\n \"94\":\"fas fa-ban\",\n \"95\":\"fas fa-band-aid\",\n \"96\":\"fab fa-bandcamp\",\n \"97\":\"fas fa-barcode\",\n \"98\":\"fas fa-bars\",\n \"99\":\"fas fa-baseball-ball\",\n \"100\":\"fas fa-basketball-ball\",\n \"101\":\"fas fa-bath\",\n \"102\":\"fas fa-battery-empty\",\n \"103\":\"fas fa-battery-full\",\n \"104\":\"fas fa-battery-half\",\n \"105\":\"fas fa-battery-quarter\",\n \"106\":\"fas fa-battery-three-quarters\",\n \"107\":\"fab fa-battle-net\",\n \"108\":\"fas fa-bed\",\n \"109\":\"fas fa-beer\",\n \"110\":\"fab fa-behance\",\n \"111\":\"fab fa-behance-square\",\n \"112\":\"fas fa-bell\",\n \"113\":\"far fa-bell\",\n \"114\":\"fas fa-bell-slash\",\n \"115\":\"far fa-bell-slash\",\n \"116\":\"fas fa-bezier-curve\",\n \"117\":\"fas fa-bible\",\n \"118\":\"fas fa-bicycle\",\n \"119\":\"fas fa-biking\",\n \"120\":\"fab fa-bimobject\",\n \"121\":\"fas fa-binoculars\",\n \"122\":\"fas fa-biohazard\",\n \"123\":\"fas fa-birthday-cake\",\n \"124\":\"fab fa-bitbucket\",\n \"125\":\"fab fa-bitcoin\",\n \"126\":\"fab fa-bity\",\n \"127\":\"fab fa-black-tie\",\n \"128\":\"fab fa-blackberry\",\n \"129\":\"fas fa-blender\",\n \"130\":\"fas fa-blender-phone\",\n \"131\":\"fas fa-blind\",\n \"132\":\"fas fa-blog\",\n \"133\":\"fab fa-blogger\",\n \"134\":\"fab fa-blogger-b\",\n \"135\":\"fab fa-bluetooth\",\n \"136\":\"fab fa-bluetooth-b\",\n \"137\":\"fas fa-bold\",\n \"138\":\"fas fa-bolt\",\n \"139\":\"fas fa-bomb\",\n \"140\":\"fas fa-bone\",\n \"141\":\"fas fa-bong\",\n \"142\":\"fas fa-book\",\n \"143\":\"fas fa-book-dead\",\n \"144\":\"fas fa-book-medical\",\n \"145\":\"fas fa-book-open\",\n \"146\":\"fas fa-book-reader\",\n \"147\":\"fas fa-bookmark\",\n \"148\":\"far fa-bookmark\",\n \"149\":\"fab fa-bootstrap\",\n \"150\":\"fas fa-border-all\",\n \"151\":\"fas fa-border-none\",\n \"152\":\"fas fa-border-style\",\n \"153\":\"fas fa-bowling-ball\",\n \"154\":\"fas fa-box\",\n \"155\":\"fas fa-box-open\",\n \"156\":\"fas fa-boxes\",\n \"157\":\"fas fa-braille\",\n \"158\":\"fas fa-brain\",\n \"159\":\"fas fa-bread-slice\",\n \"160\":\"fas fa-briefcase\",\n \"161\":\"fas fa-briefcase-medical\",\n \"162\":\"fas fa-broadcast-tower\",\n \"163\":\"fas fa-broom\",\n \"164\":\"fas fa-brush\",\n \"165\":\"fab fa-btc\",\n \"166\":\"fab fa-buffer\",\n \"167\":\"fas fa-bug\",\n \"168\":\"fas fa-building\",\n \"169\":\"far fa-building\",\n \"170\":\"fas fa-bullhorn\",\n \"171\":\"fas fa-bullseye\",\n \"172\":\"fas fa-burn\",\n \"173\":\"fab fa-buromobelexperte\",\n \"174\":\"fas fa-bus\",\n \"175\":\"fas fa-bus-alt\",\n \"176\":\"fas fa-business-time\",\n \"177\":\"fab fa-buy-n-large\",\n \"178\":\"fab fa-buysellads\",\n \"179\":\"fas fa-calculator\",\n \"180\":\"fas fa-calendar\",\n \"181\":\"far fa-calendar\",\n \"182\":\"fas fa-calendar-alt\",\n \"183\":\"far fa-calendar-alt\",\n \"184\":\"fas fa-calendar-check\",\n \"185\":\"far fa-calendar-check\",\n \"186\":\"fas fa-calendar-day\",\n \"187\":\"fas fa-calendar-minus\",\n \"188\":\"far fa-calendar-minus\",\n \"189\":\"fas fa-calendar-plus\",\n \"190\":\"far fa-calendar-plus\",\n \"191\":\"fas fa-calendar-times\",\n \"192\":\"far fa-calendar-times\",\n \"193\":\"fas fa-calendar-week\",\n \"194\":\"fas fa-camera\",\n \"195\":\"fas fa-camera-retro\",\n \"196\":\"fas fa-campground\",\n \"197\":\"fab fa-canadian-maple-leaf\",\n \"198\":\"fas fa-candy-cane\",\n \"199\":\"fas fa-cannabis\",\n \"200\":\"fas fa-capsules\",\n \"201\":\"fas fa-car\",\n \"202\":\"fas fa-car-alt\",\n \"203\":\"fas fa-car-battery\",\n \"204\":\"fas fa-car-crash\",\n \"205\":\"fas fa-car-side\",\n \"206\":\"fas fa-caret-down\",\n \"207\":\"fas fa-caret-left\",\n \"208\":\"fas fa-caret-right\",\n \"209\":\"fas fa-caret-square-down\",\n \"210\":\"far fa-caret-square-down\",\n \"211\":\"fas fa-caret-square-left\",\n \"212\":\"far fa-caret-square-left\",\n \"213\":\"fas fa-caret-square-right\",\n \"214\":\"far fa-caret-square-right\",\n \"215\":\"fas fa-caret-square-up\",\n \"216\":\"far fa-caret-square-up\",\n \"217\":\"fas fa-caret-up\",\n \"218\":\"fas fa-carrot\",\n \"219\":\"fas fa-cart-arrow-down\",\n \"220\":\"fas fa-cart-plus\",\n \"221\":\"fas fa-cash-register\",\n \"222\":\"fas fa-cat\",\n \"223\":\"fab fa-cc-amazon-pay\",\n \"224\":\"fab fa-cc-amex\",\n \"225\":\"fab fa-cc-apple-pay\",\n \"226\":\"fab fa-cc-diners-club\",\n \"227\":\"fab fa-cc-discover\",\n \"228\":\"fab fa-cc-jcb\",\n \"229\":\"fab fa-cc-mastercard\",\n \"230\":\"fab fa-cc-paypal\",\n \"231\":\"fab fa-cc-stripe\",\n \"232\":\"fab fa-cc-visa\",\n \"233\":\"fab fa-centercode\",\n \"234\":\"fab fa-centos\",\n \"235\":\"fas fa-certificate\",\n \"236\":\"fas fa-chair\",\n \"237\":\"fas fa-chalkboard\",\n \"238\":\"fas fa-chalkboard-teacher\",\n \"239\":\"fas fa-charging-station\",\n \"240\":\"fas fa-chart-area\",\n \"241\":\"fas fa-chart-bar\",\n \"242\":\"far fa-chart-bar\",\n \"243\":\"fas fa-chart-line\",\n \"244\":\"fas fa-chart-pie\",\n \"245\":\"fas fa-check\",\n \"246\":\"fas fa-check-circle\",\n \"247\":\"far fa-check-circle\",\n \"248\":\"fas fa-check-double\",\n \"249\":\"fas fa-check-square\",\n \"250\":\"far fa-check-square\",\n \"251\":\"fas fa-cheese\",\n \"252\":\"fas fa-chess\",\n \"253\":\"fas fa-chess-bishop\",\n \"254\":\"fas fa-chess-board\",\n \"255\":\"fas fa-chess-king\",\n \"256\":\"fas fa-chess-knight\",\n \"257\":\"fas fa-chess-pawn\",\n \"258\":\"fas fa-chess-queen\",\n \"259\":\"fas fa-chess-rook\",\n \"260\":\"fas fa-chevron-circle-down\",\n \"261\":\"fas fa-chevron-circle-left\",\n \"262\":\"fas fa-chevron-circle-right\",\n \"263\":\"fas fa-chevron-circle-up\",\n \"264\":\"fas fa-chevron-down\",\n \"265\":\"fas fa-chevron-left\",\n \"266\":\"fas fa-chevron-right\",\n \"267\":\"fas fa-chevron-up\",\n \"268\":\"fas fa-child\",\n \"269\":\"fab fa-chrome\",\n \"270\":\"fab fa-chromecast\",\n \"271\":\"fas fa-church\",\n \"272\":\"fas fa-circle\",\n \"273\":\"far fa-circle\",\n \"274\":\"fas fa-circle-notch\",\n \"275\":\"fas fa-city\",\n \"276\":\"fas fa-clinic-medical\",\n \"277\":\"fas fa-clipboard\",\n \"278\":\"far fa-clipboard\",\n \"279\":\"fas fa-clipboard-check\",\n \"280\":\"fas fa-clipboard-list\",\n \"281\":\"fas fa-clock\",\n \"282\":\"far fa-clock\",\n \"283\":\"fas fa-clone\",\n \"284\":\"far fa-clone\",\n \"285\":\"fas fa-closed-captioning\",\n \"286\":\"far fa-closed-captioning\",\n \"287\":\"fas fa-cloud\",\n \"288\":\"fas fa-cloud-download-alt\",\n \"289\":\"fas fa-cloud-meatball\",\n \"290\":\"fas fa-cloud-moon\",\n \"291\":\"fas fa-cloud-moon-rain\",\n \"292\":\"fas fa-cloud-rain\",\n \"293\":\"fas fa-cloud-showers-heavy\",\n \"294\":\"fas fa-cloud-sun\",\n \"295\":\"fas fa-cloud-sun-rain\",\n \"296\":\"fas fa-cloud-upload-alt\",\n \"297\":\"fab fa-cloudscale\",\n \"298\":\"fab fa-cloudsmith\",\n \"299\":\"fab fa-cloudversify\",\n \"300\":\"fas fa-cocktail\",\n \"301\":\"fas fa-code\",\n \"302\":\"fas fa-code-branch\",\n \"303\":\"fab fa-codepen\",\n \"304\":\"fab fa-codiepie\",\n \"305\":\"fas fa-coffee\",\n \"306\":\"fas fa-cog\",\n \"307\":\"fas fa-cogs\",\n \"308\":\"fas fa-coins\",\n \"309\":\"fas fa-columns\",\n \"310\":\"fas fa-comment\",\n \"311\":\"far fa-comment\",\n \"312\":\"fas fa-comment-alt\",\n \"313\":\"far fa-comment-alt\",\n \"314\":\"fas fa-comment-dollar\",\n \"315\":\"fas fa-comment-dots\",\n \"316\":\"far fa-comment-dots\",\n \"317\":\"fas fa-comment-medical\",\n \"318\":\"fas fa-comment-slash\",\n \"319\":\"fas fa-comments\",\n \"320\":\"far fa-comments\",\n \"321\":\"fas fa-comments-dollar\",\n \"322\":\"fas fa-compact-disc\",\n \"323\":\"fas fa-compass\",\n \"324\":\"far fa-compass\",\n \"325\":\"fas fa-compress\",\n \"326\":\"fas fa-compress-arrows-alt\",\n \"327\":\"fas fa-concierge-bell\",\n \"328\":\"fab fa-confluence\",\n \"329\":\"fab fa-connectdevelop\",\n \"330\":\"fab fa-contao\",\n \"331\":\"fas fa-cookie\",\n \"332\":\"fas fa-cookie-bite\",\n \"333\":\"fas fa-copy\",\n \"334\":\"far fa-copy\",\n \"335\":\"fas fa-copyright\",\n \"336\":\"far fa-copyright\",\n \"337\":\"fab fa-cotton-bureau\",\n \"338\":\"fas fa-couch\",\n \"339\":\"fab fa-cpanel\",\n \"340\":\"fab fa-creative-commons\",\n \"341\":\"fab fa-creative-commons-by\",\n \"342\":\"fab fa-creative-commons-nc\",\n \"343\":\"fab fa-creative-commons-nc-eu\",\n \"344\":\"fab fa-creative-commons-nc-jp\",\n \"345\":\"fab fa-creative-commons-nd\",\n \"346\":\"fab fa-creative-commons-pd\",\n \"347\":\"fab fa-creative-commons-pd-alt\",\n \"348\":\"fab fa-creative-commons-remix\",\n \"349\":\"fab fa-creative-commons-sa\",\n \"350\":\"fab fa-creative-commons-sampling\",\n \"351\":\"fab fa-creative-commons-sampling-plus\",\n \"352\":\"fab fa-creative-commons-share\",\n \"353\":\"fab fa-creative-commons-zero\",\n \"354\":\"fas fa-credit-card\",\n \"355\":\"far fa-credit-card\",\n \"356\":\"fab fa-critical-role\",\n \"357\":\"fas fa-crop\",\n \"358\":\"fas fa-crop-alt\",\n \"359\":\"fas fa-cross\",\n \"360\":\"fas fa-crosshairs\",\n \"361\":\"fas fa-crow\",\n \"362\":\"fas fa-crown\",\n \"363\":\"fas fa-crutch\",\n \"364\":\"fab fa-css3\",\n \"365\":\"fab fa-css3-alt\",\n \"366\":\"fas fa-cube\",\n \"367\":\"fas fa-cubes\",\n \"368\":\"fas fa-cut\",\n \"369\":\"fab fa-cuttlefish\",\n \"370\":\"fab fa-d-and-d\",\n \"371\":\"fab fa-d-and-d-beyond\",\n \"372\":\"fab fa-dashcube\",\n \"373\":\"fas fa-database\",\n \"374\":\"fas fa-deaf\",\n \"375\":\"fab fa-delicious\",\n \"376\":\"fas fa-democrat\",\n \"377\":\"fab fa-deploydog\",\n \"378\":\"fab fa-deskpro\",\n \"379\":\"fas fa-desktop\",\n \"380\":\"fab fa-dev\",\n \"381\":\"fab fa-deviantart\",\n \"382\":\"fas fa-dharmachakra\",\n \"383\":\"fab fa-dhl\",\n \"384\":\"fas fa-diagnoses\",\n \"385\":\"fab fa-diaspora\",\n \"386\":\"fas fa-dice\",\n \"387\":\"fas fa-dice-d20\",\n \"388\":\"fas fa-dice-d6\",\n \"389\":\"fas fa-dice-five\",\n \"390\":\"fas fa-dice-four\",\n \"391\":\"fas fa-dice-one\",\n \"392\":\"fas fa-dice-six\",\n \"393\":\"fas fa-dice-three\",\n \"394\":\"fas fa-dice-two\",\n \"395\":\"fab fa-digg\",\n \"396\":\"fab fa-digital-ocean\",\n \"397\":\"fas fa-digital-tachograph\",\n \"398\":\"fas fa-directions\",\n \"399\":\"fab fa-discord\",\n \"400\":\"fab fa-discourse\",\n \"401\":\"fas fa-divide\",\n \"402\":\"fas fa-dizzy\",\n \"403\":\"far fa-dizzy\",\n \"404\":\"fas fa-dna\",\n \"405\":\"fab fa-dochub\",\n \"406\":\"fab fa-docker\",\n \"407\":\"fas fa-dog\",\n \"408\":\"fas fa-dollar-sign\",\n \"409\":\"fas fa-dolly\",\n \"410\":\"fas fa-dolly-flatbed\",\n \"411\":\"fas fa-donate\",\n \"412\":\"fas fa-door-closed\",\n \"413\":\"fas fa-door-open\",\n \"414\":\"fas fa-dot-circle\",\n \"415\":\"far fa-dot-circle\",\n \"416\":\"fas fa-dove\",\n \"417\":\"fas fa-download\",\n \"418\":\"fab fa-draft2digital\",\n \"419\":\"fas fa-drafting-compass\",\n \"420\":\"fas fa-dragon\",\n \"421\":\"fas fa-draw-polygon\",\n \"422\":\"fab fa-dribbble\",\n \"423\":\"fab fa-dribbble-square\",\n \"424\":\"fab fa-dropbox\",\n \"425\":\"fas fa-drum\",\n \"426\":\"fas fa-drum-steelpan\",\n \"427\":\"fas fa-drumstick-bite\",\n \"428\":\"fab fa-drupal\",\n \"429\":\"fas fa-dumbbell\",\n \"430\":\"fas fa-dumpster\",\n \"431\":\"fas fa-dumpster-fire\",\n \"432\":\"fas fa-dungeon\",\n \"433\":\"fab fa-dyalog\",\n \"434\":\"fab fa-earlybirds\",\n \"435\":\"fab fa-ebay\",\n \"436\":\"fab fa-edge\",\n \"437\":\"fas fa-edit\",\n \"438\":\"far fa-edit\",\n \"439\":\"fas fa-egg\",\n \"440\":\"fas fa-eject\",\n \"441\":\"fab fa-elementor\",\n \"442\":\"fas fa-ellipsis-h\",\n \"443\":\"fas fa-ellipsis-v\",\n \"444\":\"fab fa-ello\",\n \"445\":\"fab fa-ember\",\n \"446\":\"fab fa-empire\",\n \"447\":\"fas fa-envelope\",\n \"448\":\"far fa-envelope\",\n \"449\":\"fas fa-envelope-open\",\n \"450\":\"far fa-envelope-open\",\n \"451\":\"fas fa-envelope-open-text\",\n \"452\":\"fas fa-envelope-square\",\n \"453\":\"fab fa-envira\",\n \"454\":\"fas fa-equals\",\n \"455\":\"fas fa-eraser\",\n \"456\":\"fab fa-erlang\",\n \"457\":\"fab fa-ethereum\",\n \"458\":\"fas fa-ethernet\",\n \"459\":\"fab fa-etsy\",\n \"460\":\"fas fa-euro-sign\",\n \"461\":\"fab fa-evernote\",\n \"462\":\"fas fa-exchange-alt\",\n \"463\":\"fas fa-exclamation\",\n \"464\":\"fas fa-exclamation-circle\",\n \"465\":\"fas fa-exclamation-triangle\",\n \"466\":\"fas fa-expand\",\n \"467\":\"fas fa-expand-arrows-alt\",\n \"468\":\"fab fa-expeditedssl\",\n \"469\":\"fas fa-external-link-alt\",\n \"470\":\"fas fa-external-link-square-alt\",\n \"471\":\"fas fa-eye\",\n \"472\":\"far fa-eye\",\n \"473\":\"fas fa-eye-dropper\",\n \"474\":\"fas fa-eye-slash\",\n \"475\":\"far fa-eye-slash\",\n \"476\":\"fab fa-facebook\",\n \"477\":\"fab fa-facebook-f\",\n \"478\":\"fab fa-facebook-messenger\",\n \"479\":\"fab fa-facebook-square\",\n \"480\":\"fas fa-fan\",\n \"481\":\"fab fa-fantasy-flight-games\",\n \"482\":\"fas fa-fast-backward\",\n \"483\":\"fas fa-fast-forward\",\n \"484\":\"fas fa-fax\",\n \"485\":\"fas fa-feather\",\n \"486\":\"fas fa-feather-alt\",\n \"487\":\"fab fa-fedex\",\n \"488\":\"fab fa-fedora\",\n \"489\":\"fas fa-female\",\n \"490\":\"fas fa-fighter-jet\",\n \"491\":\"fab fa-figma\",\n \"492\":\"fas fa-file\",\n \"493\":\"far fa-file\",\n \"494\":\"fas fa-file-alt\",\n \"495\":\"far fa-file-alt\",\n \"496\":\"fas fa-file-archive\",\n \"497\":\"far fa-file-archive\",\n \"498\":\"fas fa-file-audio\",\n \"499\":\"far fa-file-audio\",\n \"500\":\"fas fa-file-code\",\n \"501\":\"far fa-file-code\",\n \"502\":\"fas fa-file-contract\",\n \"503\":\"fas fa-file-csv\",\n \"504\":\"fas fa-file-download\",\n \"505\":\"fas fa-file-excel\",\n \"506\":\"far fa-file-excel\",\n \"507\":\"fas fa-file-export\",\n \"508\":\"fas fa-file-image\",\n \"509\":\"far fa-file-image\",\n \"510\":\"fas fa-file-import\",\n \"511\":\"fas fa-file-invoice\",\n \"512\":\"fas fa-file-invoice-dollar\",\n \"513\":\"fas fa-file-medical\",\n \"514\":\"fas fa-file-medical-alt\",\n \"515\":\"fas fa-file-pdf\",\n \"516\":\"far fa-file-pdf\",\n \"517\":\"fas fa-file-powerpoint\",\n \"518\":\"far fa-file-powerpoint\",\n \"519\":\"fas fa-file-prescription\",\n \"520\":\"fas fa-file-signature\",\n \"521\":\"fas fa-file-upload\",\n \"522\":\"fas fa-file-video\",\n \"523\":\"far fa-file-video\",\n \"524\":\"fas fa-file-word\",\n \"525\":\"far fa-file-word\",\n \"526\":\"fas fa-fill\",\n \"527\":\"fas fa-fill-drip\",\n \"528\":\"fas fa-film\",\n \"529\":\"fas fa-filter\",\n \"530\":\"fas fa-fingerprint\",\n \"531\":\"fas fa-fire\",\n \"532\":\"fas fa-fire-alt\",\n \"533\":\"fas fa-fire-extinguisher\",\n \"534\":\"fab fa-firefox\",\n \"535\":\"fas fa-first-aid\",\n \"536\":\"fab fa-first-order\",\n \"537\":\"fab fa-first-order-alt\",\n \"538\":\"fab fa-firstdraft\",\n \"539\":\"fas fa-fish\",\n \"540\":\"fas fa-fist-raised\",\n \"541\":\"fas fa-flag\",\n \"542\":\"far fa-flag\",\n \"543\":\"fas fa-flag-checkered\",\n \"544\":\"fas fa-flag-usa\",\n \"545\":\"fas fa-flask\",\n \"546\":\"fab fa-flickr\",\n \"547\":\"fab fa-flipboard\",\n \"548\":\"fas fa-flushed\",\n \"549\":\"far fa-flushed\",\n \"550\":\"fab fa-fly\",\n \"551\":\"fas fa-folder\",\n \"552\":\"far fa-folder\",\n \"553\":\"fas fa-folder-minus\",\n \"554\":\"fas fa-folder-open\",\n \"555\":\"far fa-folder-open\",\n \"556\":\"fas fa-folder-plus\",\n \"557\":\"fas fa-font\",\n \"558\":\"fab fa-font-awesome\",\n \"559\":\"fab fa-font-awesome-alt\",\n \"560\":\"fab fa-font-awesome-flag\",\n \"561\":\"fab fa-fonticons\",\n \"562\":\"fab fa-fonticons-fi\",\n \"563\":\"fas fa-football-ball\",\n \"564\":\"fab fa-fort-awesome\",\n \"565\":\"fab fa-fort-awesome-alt\",\n \"566\":\"fab fa-forumbee\",\n \"567\":\"fas fa-forward\",\n \"568\":\"fab fa-foursquare\",\n \"569\":\"fab fa-free-code-camp\",\n \"570\":\"fab fa-freebsd\",\n \"571\":\"fas fa-frog\",\n \"572\":\"fas fa-frown\",\n \"573\":\"far fa-frown\",\n \"574\":\"fas fa-frown-open\",\n \"575\":\"far fa-frown-open\",\n \"576\":\"fab fa-fulcrum\",\n \"577\":\"fas fa-funnel-dollar\",\n \"578\":\"fas fa-futbol\",\n \"579\":\"far fa-futbol\",\n \"580\":\"fab fa-galactic-republic\",\n \"581\":\"fab fa-galactic-senate\",\n \"582\":\"fas fa-gamepad\",\n \"583\":\"fas fa-gas-pump\",\n \"584\":\"fas fa-gavel\",\n \"585\":\"fas fa-gem\",\n \"586\":\"far fa-gem\",\n \"587\":\"fas fa-genderless\",\n \"588\":\"fab fa-get-pocket\",\n \"589\":\"fab fa-gg\",\n \"590\":\"fab fa-gg-circle\",\n \"591\":\"fas fa-ghost\",\n \"592\":\"fas fa-gift\",\n \"593\":\"fas fa-gifts\",\n \"594\":\"fab fa-git\",\n \"595\":\"fab fa-git-alt\",\n \"596\":\"fab fa-git-square\",\n \"597\":\"fab fa-github\",\n \"598\":\"fab fa-github-alt\",\n \"599\":\"fab fa-github-square\",\n \"600\":\"fab fa-gitkraken\",\n \"601\":\"fab fa-gitlab\",\n \"602\":\"fab fa-gitter\",\n \"603\":\"fas fa-glass-cheers\",\n \"604\":\"fas fa-glass-martini\",\n \"605\":\"fas fa-glass-martini-alt\",\n \"606\":\"fas fa-glass-whiskey\",\n \"607\":\"fas fa-glasses\",\n \"608\":\"fab fa-glide\",\n \"609\":\"fab fa-glide-g\",\n \"610\":\"fas fa-globe\",\n \"611\":\"fas fa-globe-africa\",\n \"612\":\"fas fa-globe-americas\",\n \"613\":\"fas fa-globe-asia\",\n \"614\":\"fas fa-globe-europe\",\n \"615\":\"fab fa-gofore\",\n \"616\":\"fas fa-golf-ball\",\n \"617\":\"fab fa-goodreads\",\n \"618\":\"fab fa-goodreads-g\",\n \"619\":\"fab fa-google\",\n \"620\":\"fab fa-google-drive\",\n \"621\":\"fab fa-google-play\",\n \"622\":\"fab fa-google-plus\",\n \"623\":\"fab fa-google-plus-g\",\n \"624\":\"fab fa-google-plus-square\",\n \"625\":\"fab fa-google-wallet\",\n \"626\":\"fas fa-gopuram\",\n \"627\":\"fas fa-graduation-cap\",\n \"628\":\"fab fa-gratipay\",\n \"629\":\"fab fa-grav\",\n \"630\":\"fas fa-greater-than\",\n \"631\":\"fas fa-greater-than-equal\",\n \"632\":\"fas fa-grimace\",\n \"633\":\"far fa-grimace\",\n \"634\":\"fas fa-grin\",\n \"635\":\"far fa-grin\",\n \"636\":\"fas fa-grin-alt\",\n \"637\":\"far fa-grin-alt\",\n \"638\":\"fas fa-grin-beam\",\n \"639\":\"far fa-grin-beam\",\n \"640\":\"fas fa-grin-beam-sweat\",\n \"641\":\"far fa-grin-beam-sweat\",\n \"642\":\"fas fa-grin-hearts\",\n \"643\":\"far fa-grin-hearts\",\n \"644\":\"fas fa-grin-squint\",\n \"645\":\"far fa-grin-squint\",\n \"646\":\"fas fa-grin-squint-tears\",\n \"647\":\"far fa-grin-squint-tears\",\n \"648\":\"fas fa-grin-stars\",\n \"649\":\"far fa-grin-stars\",\n \"650\":\"fas fa-grin-tears\",\n \"651\":\"far fa-grin-tears\",\n \"652\":\"fas fa-grin-tongue\",\n \"653\":\"far fa-grin-tongue\",\n \"654\":\"fas fa-grin-tongue-squint\",\n \"655\":\"far fa-grin-tongue-squint\",\n \"656\":\"fas fa-grin-tongue-wink\",\n \"657\":\"far fa-grin-tongue-wink\",\n \"658\":\"fas fa-grin-wink\",\n \"659\":\"far fa-grin-wink\",\n \"660\":\"fas fa-grip-horizontal\",\n \"661\":\"fas fa-grip-lines\",\n \"662\":\"fas fa-grip-lines-vertical\",\n \"663\":\"fas fa-grip-vertical\",\n \"664\":\"fab fa-gripfire\",\n \"665\":\"fab fa-grunt\",\n \"666\":\"fas fa-guitar\",\n \"667\":\"fab fa-gulp\",\n \"668\":\"fas fa-h-square\",\n \"669\":\"fab fa-hacker-news\",\n \"670\":\"fab fa-hacker-news-square\",\n \"671\":\"fab fa-hackerrank\",\n \"672\":\"fas fa-hamburger\",\n \"673\":\"fas fa-hammer\",\n \"674\":\"fas fa-hamsa\",\n \"675\":\"fas fa-hand-holding\",\n \"676\":\"fas fa-hand-holding-heart\",\n \"677\":\"fas fa-hand-holding-usd\",\n \"678\":\"fas fa-hand-lizard\",\n \"679\":\"far fa-hand-lizard\",\n \"680\":\"fas fa-hand-middle-finger\",\n \"681\":\"fas fa-hand-paper\",\n \"682\":\"far fa-hand-paper\",\n \"683\":\"fas fa-hand-peace\",\n \"684\":\"far fa-hand-peace\",\n \"685\":\"fas fa-hand-point-down\",\n \"686\":\"far fa-hand-point-down\",\n \"687\":\"fas fa-hand-point-left\",\n \"688\":\"far fa-hand-point-left\",\n \"689\":\"fas fa-hand-point-right\",\n \"690\":\"far fa-hand-point-right\",\n \"691\":\"fas fa-hand-point-up\",\n \"692\":\"far fa-hand-point-up\",\n \"693\":\"fas fa-hand-pointer\",\n \"694\":\"far fa-hand-pointer\",\n \"695\":\"fas fa-hand-rock\",\n \"696\":\"far fa-hand-rock\",\n \"697\":\"fas fa-hand-scissors\",\n \"698\":\"far fa-hand-scissors\",\n \"699\":\"fas fa-hand-spock\",\n \"700\":\"far fa-hand-spock\",\n \"701\":\"fas fa-hands\",\n \"702\":\"fas fa-hands-helping\",\n \"703\":\"fas fa-handshake\",\n \"704\":\"far fa-handshake\",\n \"705\":\"fas fa-hanukiah\",\n \"706\":\"fas fa-hard-hat\",\n \"707\":\"fas fa-hashtag\",\n \"708\":\"fas fa-hat-cowboy\",\n \"709\":\"fas fa-hat-cowboy-side\",\n \"710\":\"fas fa-hat-wizard\",\n \"711\":\"fas fa-haykal\",\n \"712\":\"fas fa-hdd\",\n \"713\":\"far fa-hdd\",\n \"714\":\"fas fa-heading\",\n \"715\":\"fas fa-headphones\",\n \"716\":\"fas fa-headphones-alt\",\n \"717\":\"fas fa-headset\",\n \"718\":\"fas fa-heart\",\n \"719\":\"far fa-heart\",\n \"720\":\"fas fa-heart-broken\",\n \"721\":\"fas fa-heartbeat\",\n \"722\":\"fas fa-helicopter\",\n \"723\":\"fas fa-highlighter\",\n \"724\":\"fas fa-hiking\",\n \"725\":\"fas fa-hippo\",\n \"726\":\"fab fa-hips\",\n \"727\":\"fab fa-hire-a-helper\",\n \"728\":\"fas fa-history\",\n \"729\":\"fas fa-hockey-puck\",\n \"730\":\"fas fa-holly-berry\",\n \"731\":\"fas fa-home\",\n \"732\":\"fab fa-hooli\",\n \"733\":\"fab fa-hornbill\",\n \"734\":\"fas fa-horse\",\n \"735\":\"fas fa-horse-head\",\n \"736\":\"fas fa-hospital\",\n \"737\":\"far fa-hospital\",\n \"738\":\"fas fa-hospital-alt\",\n \"739\":\"fas fa-hospital-symbol\",\n \"740\":\"fas fa-hot-tub\",\n \"741\":\"fas fa-hotdog\",\n \"742\":\"fas fa-hotel\",\n \"743\":\"fab fa-hotjar\",\n \"744\":\"fas fa-hourglass\",\n \"745\":\"far fa-hourglass\",\n \"746\":\"fas fa-hourglass-end\",\n \"747\":\"fas fa-hourglass-half\",\n \"748\":\"fas fa-hourglass-start\",\n \"749\":\"fas fa-house-damage\",\n \"750\":\"fab fa-houzz\",\n \"751\":\"fas fa-hryvnia\",\n \"752\":\"fab fa-html5\",\n \"753\":\"fab fa-hubspot\",\n \"754\":\"fas fa-i-cursor\",\n \"755\":\"fas fa-ice-cream\",\n \"756\":\"fas fa-icicles\",\n \"757\":\"fas fa-icons\",\n \"758\":\"fas fa-id-badge\",\n \"759\":\"far fa-id-badge\",\n \"760\":\"fas fa-id-card\",\n \"761\":\"far fa-id-card\",\n \"762\":\"fas fa-id-card-alt\",\n \"763\":\"fas fa-igloo\",\n \"764\":\"fas fa-image\",\n \"765\":\"far fa-image\",\n \"766\":\"fas fa-images\",\n \"767\":\"far fa-images\",\n \"768\":\"fab fa-imdb\",\n \"769\":\"fas fa-inbox\",\n \"770\":\"fas fa-indent\",\n \"771\":\"fas fa-industry\",\n \"772\":\"fas fa-infinity\",\n \"773\":\"fas fa-info\",\n \"774\":\"fas fa-info-circle\",\n \"775\":\"fab fa-instagram\",\n \"776\":\"fab fa-intercom\",\n \"777\":\"fab fa-internet-explorer\",\n \"778\":\"fab fa-invision\",\n \"779\":\"fab fa-ioxhost\",\n \"780\":\"fas fa-italic\",\n \"781\":\"fab fa-itch-io\",\n \"782\":\"fab fa-itunes\",\n \"783\":\"fab fa-itunes-note\",\n \"784\":\"fab fa-java\",\n \"785\":\"fas fa-jedi\",\n \"786\":\"fab fa-jedi-order\",\n \"787\":\"fab fa-jenkins\",\n \"788\":\"fab fa-jira\",\n \"789\":\"fab fa-joget\",\n \"790\":\"fas fa-joint\",\n \"791\":\"fab fa-joomla\",\n \"792\":\"fas fa-journal-whills\",\n \"793\":\"fab fa-js\",\n \"794\":\"fab fa-js-square\",\n \"795\":\"fab fa-jsfiddle\",\n \"796\":\"fas fa-kaaba\",\n \"797\":\"fab fa-kaggle\",\n \"798\":\"fas fa-key\",\n \"799\":\"fab fa-keybase\",\n \"800\":\"fas fa-keyboard\",\n \"801\":\"far fa-keyboard\",\n \"802\":\"fab fa-keycdn\",\n \"803\":\"fas fa-khanda\",\n \"804\":\"fab fa-kickstarter\",\n \"805\":\"fab fa-kickstarter-k\",\n \"806\":\"fas fa-kiss\",\n \"807\":\"far fa-kiss\",\n \"808\":\"fas fa-kiss-beam\",\n \"809\":\"far fa-kiss-beam\",\n \"810\":\"fas fa-kiss-wink-heart\",\n \"811\":\"far fa-kiss-wink-heart\",\n \"812\":\"fas fa-kiwi-bird\",\n \"813\":\"fab fa-korvue\",\n \"814\":\"fas fa-landmark\",\n \"815\":\"fas fa-language\",\n \"816\":\"fas fa-laptop\",\n \"817\":\"fas fa-laptop-code\",\n \"818\":\"fas fa-laptop-medical\",\n \"819\":\"fab fa-laravel\",\n \"820\":\"fab fa-lastfm\",\n \"821\":\"fab fa-lastfm-square\",\n \"822\":\"fas fa-laugh\",\n \"823\":\"far fa-laugh\",\n \"824\":\"fas fa-laugh-beam\",\n \"825\":\"far fa-laugh-beam\",\n \"826\":\"fas fa-laugh-squint\",\n \"827\":\"far fa-laugh-squint\",\n \"828\":\"fas fa-laugh-wink\",\n \"829\":\"far fa-laugh-wink\",\n \"830\":\"fas fa-layer-group\",\n \"831\":\"fas fa-leaf\",\n \"832\":\"fab fa-leanpub\",\n \"833\":\"fas fa-lemon\",\n \"834\":\"far fa-lemon\",\n \"835\":\"fab fa-less\",\n \"836\":\"fas fa-less-than\",\n \"837\":\"fas fa-less-than-equal\",\n \"838\":\"fas fa-level-down-alt\",\n \"839\":\"fas fa-level-up-alt\",\n \"840\":\"fas fa-life-ring\",\n \"841\":\"far fa-life-ring\",\n \"842\":\"fas fa-lightbulb\",\n \"843\":\"far fa-lightbulb\",\n \"844\":\"fab fa-line\",\n \"845\":\"fas fa-link\",\n \"846\":\"fab fa-linkedin\",\n \"847\":\"fab fa-linkedin-in\",\n \"848\":\"fab fa-linode\",\n \"849\":\"fab fa-linux\",\n \"850\":\"fas fa-lira-sign\",\n \"851\":\"fas fa-list\",\n \"852\":\"fas fa-list-alt\",\n \"853\":\"far fa-list-alt\",\n \"854\":\"fas fa-list-ol\",\n \"855\":\"fas fa-list-ul\",\n \"856\":\"fas fa-location-arrow\",\n \"857\":\"fas fa-lock\",\n \"858\":\"fas fa-lock-open\",\n \"859\":\"fas fa-long-arrow-alt-down\",\n \"860\":\"fas fa-long-arrow-alt-left\",\n \"861\":\"fas fa-long-arrow-alt-right\",\n \"862\":\"fas fa-long-arrow-alt-up\",\n \"863\":\"fas fa-low-vision\",\n \"864\":\"fas fa-luggage-cart\",\n \"865\":\"fab fa-lyft\",\n \"866\":\"fab fa-magento\",\n \"867\":\"fas fa-magic\",\n \"868\":\"fas fa-magnet\",\n \"869\":\"fas fa-mail-bulk\",\n \"870\":\"fab fa-mailchimp\",\n \"871\":\"fas fa-male\",\n \"872\":\"fab fa-mandalorian\",\n \"873\":\"fas fa-map\",\n \"874\":\"far fa-map\",\n \"875\":\"fas fa-map-marked\",\n \"876\":\"fas fa-map-marked-alt\",\n \"877\":\"fas fa-map-marker\",\n \"878\":\"fas fa-map-marker-alt\",\n \"879\":\"fas fa-map-pin\",\n \"880\":\"fas fa-map-signs\",\n \"881\":\"fab fa-markdown\",\n \"882\":\"fas fa-marker\",\n \"883\":\"fas fa-mars\",\n \"884\":\"fas fa-mars-double\",\n \"885\":\"fas fa-mars-stroke\",\n \"886\":\"fas fa-mars-stroke-h\",\n \"887\":\"fas fa-mars-stroke-v\",\n \"888\":\"fas fa-mask\",\n \"889\":\"fab fa-mastodon\",\n \"890\":\"fab fa-maxcdn\",\n \"891\":\"fab fa-mdb\",\n \"892\":\"fas fa-medal\",\n \"893\":\"fab fa-medapps\",\n \"894\":\"fab fa-medium\",\n \"895\":\"fab fa-medium-m\",\n \"896\":\"fas fa-medkit\",\n \"897\":\"fab fa-medrt\",\n \"898\":\"fab fa-meetup\",\n \"899\":\"fab fa-megaport\",\n \"900\":\"fas fa-meh\",\n \"901\":\"far fa-meh\",\n \"902\":\"fas fa-meh-blank\",\n \"903\":\"far fa-meh-blank\",\n \"904\":\"fas fa-meh-rolling-eyes\",\n \"905\":\"far fa-meh-rolling-eyes\",\n \"906\":\"fas fa-memory\",\n \"907\":\"fab fa-mendeley\",\n \"908\":\"fas fa-menorah\",\n \"909\":\"fas fa-mercury\",\n \"910\":\"fas fa-meteor\",\n \"911\":\"fas fa-microchip\",\n \"912\":\"fas fa-microphone\",\n \"913\":\"fas fa-microphone-alt\",\n \"914\":\"fas fa-microphone-alt-slash\",\n \"915\":\"fas fa-microphone-slash\",\n \"916\":\"fas fa-microscope\",\n \"917\":\"fab fa-microsoft\",\n \"918\":\"fas fa-minus\",\n \"919\":\"fas fa-minus-circle\",\n \"920\":\"fas fa-minus-square\",\n \"921\":\"far fa-minus-square\",\n \"922\":\"fas fa-mitten\",\n \"923\":\"fab fa-mix\",\n \"924\":\"fab fa-mixcloud\",\n \"925\":\"fab fa-mizuni\",\n \"926\":\"fas fa-mobile\",\n \"927\":\"fas fa-mobile-alt\",\n \"928\":\"fab fa-modx\",\n \"929\":\"fab fa-monero\",\n \"930\":\"fas fa-money-bill\",\n \"931\":\"fas fa-money-bill-alt\",\n \"932\":\"far fa-money-bill-alt\",\n \"933\":\"fas fa-money-bill-wave\",\n \"934\":\"fas fa-money-bill-wave-alt\",\n \"935\":\"fas fa-money-check\",\n \"936\":\"fas fa-money-check-alt\",\n \"937\":\"fas fa-monument\",\n \"938\":\"fas fa-moon\",\n \"939\":\"far fa-moon\",\n \"940\":\"fas fa-mortar-pestle\",\n \"941\":\"fas fa-mosque\",\n \"942\":\"fas fa-motorcycle\",\n \"943\":\"fas fa-mountain\",\n \"944\":\"fas fa-mouse\",\n \"945\":\"fas fa-mouse-pointer\",\n \"946\":\"fas fa-mug-hot\",\n \"947\":\"fas fa-music\",\n \"948\":\"fab fa-napster\",\n \"949\":\"fab fa-neos\",\n \"950\":\"fas fa-network-wired\",\n \"951\":\"fas fa-neuter\",\n \"952\":\"fas fa-newspaper\",\n \"953\":\"far fa-newspaper\",\n \"954\":\"fab fa-nimblr\",\n \"955\":\"fab fa-node\",\n \"956\":\"fab fa-node-js\",\n \"957\":\"fas fa-not-equal\",\n \"958\":\"fas fa-notes-medical\",\n \"959\":\"fab fa-npm\",\n \"960\":\"fab fa-ns8\",\n \"961\":\"fab fa-nutritionix\",\n \"962\":\"fas fa-object-group\",\n \"963\":\"far fa-object-group\",\n \"964\":\"fas fa-object-ungroup\",\n \"965\":\"far fa-object-ungroup\",\n \"966\":\"fab fa-odnoklassniki\",\n \"967\":\"fab fa-odnoklassniki-square\",\n \"968\":\"fas fa-oil-can\",\n \"969\":\"fab fa-old-republic\",\n \"970\":\"fas fa-om\",\n \"971\":\"fab fa-opencart\",\n \"972\":\"fab fa-openid\",\n \"973\":\"fab fa-opera\",\n \"974\":\"fab fa-optin-monster\",\n \"975\":\"fab fa-orcid\",\n \"976\":\"fab fa-osi\",\n \"977\":\"fas fa-otter\",\n \"978\":\"fas fa-outdent\",\n \"979\":\"fab fa-page4\",\n \"980\":\"fab fa-pagelines\",\n \"981\":\"fas fa-pager\",\n \"982\":\"fas fa-paint-brush\",\n \"983\":\"fas fa-paint-roller\",\n \"984\":\"fas fa-palette\",\n \"985\":\"fab fa-palfed\",\n \"986\":\"fas fa-pallet\",\n \"987\":\"fas fa-paper-plane\",\n \"988\":\"far fa-paper-plane\",\n \"989\":\"fas fa-paperclip\",\n \"990\":\"fas fa-parachute-box\",\n \"991\":\"fas fa-paragraph\",\n \"992\":\"fas fa-parking\",\n \"993\":\"fas fa-passport\",\n \"994\":\"fas fa-pastafarianism\",\n \"995\":\"fas fa-paste\",\n \"996\":\"fab fa-patreon\",\n \"997\":\"fas fa-pause\",\n \"998\":\"fas fa-pause-circle\",\n \"999\":\"far fa-pause-circle\",\n \"1000\":\"fas fa-paw\",\n \"1001\":\"fab fa-paypal\",\n \"1002\":\"fas fa-peace\",\n \"1003\":\"fas fa-pen\",\n \"1004\":\"fas fa-pen-alt\",\n \"1005\":\"fas fa-pen-fancy\",\n \"1006\":\"fas fa-pen-nib\",\n \"1007\":\"fas fa-pen-square\",\n \"1008\":\"fas fa-pencil-alt\",\n \"1009\":\"fas fa-pencil-ruler\",\n \"1010\":\"fab fa-penny-arcade\",\n \"1011\":\"fas fa-people-carry\",\n \"1012\":\"fas fa-pepper-hot\",\n \"1013\":\"fas fa-percent\",\n \"1014\":\"fas fa-percentage\",\n \"1015\":\"fab fa-periscope\",\n \"1016\":\"fas fa-person-booth\",\n \"1017\":\"fab fa-phabricator\",\n \"1018\":\"fab fa-phoenix-framework\",\n \"1019\":\"fab fa-phoenix-squadron\",\n \"1020\":\"fas fa-phone\",\n \"1021\":\"fas fa-phone-alt\",\n \"1022\":\"fas fa-phone-slash\",\n \"1023\":\"fas fa-phone-square\",\n \"1024\":\"fas fa-phone-square-alt\",\n \"1025\":\"fas fa-phone-volume\",\n \"1026\":\"fas fa-photo-video\",\n \"1027\":\"fab fa-php\",\n \"1028\":\"fab fa-pied-piper\",\n \"1029\":\"fab fa-pied-piper-alt\",\n \"1030\":\"fab fa-pied-piper-hat\",\n \"1031\":\"fab fa-pied-piper-pp\",\n \"1032\":\"fas fa-piggy-bank\",\n \"1033\":\"fas fa-pills\",\n \"1034\":\"fab fa-pinterest\",\n \"1035\":\"fab fa-pinterest-p\",\n \"1036\":\"fab fa-pinterest-square\",\n \"1037\":\"fas fa-pizza-slice\",\n \"1038\":\"fas fa-place-of-worship\",\n \"1039\":\"fas fa-plane\",\n \"1040\":\"fas fa-plane-arrival\",\n \"1041\":\"fas fa-plane-departure\",\n \"1042\":\"fas fa-play\",\n \"1043\":\"fas fa-play-circle\",\n \"1044\":\"far fa-play-circle\",\n \"1045\":\"fab fa-playstation\",\n \"1046\":\"fas fa-plug\",\n \"1047\":\"fas fa-plus\",\n \"1048\":\"fas fa-plus-circle\",\n \"1049\":\"fas fa-plus-square\",\n \"1050\":\"far fa-plus-square\",\n \"1051\":\"fas fa-podcast\",\n \"1052\":\"fas fa-poll\",\n \"1053\":\"fas fa-poll-h\",\n \"1054\":\"fas fa-poo\",\n \"1055\":\"fas fa-poo-storm\",\n \"1056\":\"fas fa-poop\",\n \"1057\":\"fas fa-portrait\",\n \"1058\":\"fas fa-pound-sign\",\n \"1059\":\"fas fa-power-off\",\n \"1060\":\"fas fa-pray\",\n \"1061\":\"fas fa-praying-hands\",\n \"1062\":\"fas fa-prescription\",\n \"1063\":\"fas fa-prescription-bottle\",\n \"1064\":\"fas fa-prescription-bottle-alt\",\n \"1065\":\"fas fa-print\",\n \"1066\":\"fas fa-procedures\",\n \"1067\":\"fab fa-product-hunt\",\n \"1068\":\"fas fa-project-diagram\",\n \"1069\":\"fab fa-pushed\",\n \"1070\":\"fas fa-puzzle-piece\",\n \"1071\":\"fab fa-python\",\n \"1072\":\"fab fa-qq\",\n \"1073\":\"fas fa-qrcode\",\n \"1074\":\"fas fa-question\",\n \"1075\":\"fas fa-question-circle\",\n \"1076\":\"far fa-question-circle\",\n \"1077\":\"fas fa-quidditch\",\n \"1078\":\"fab fa-quinscape\",\n \"1079\":\"fab fa-quora\",\n \"1080\":\"fas fa-quote-left\",\n \"1081\":\"fas fa-quote-right\",\n \"1082\":\"fas fa-quran\",\n \"1083\":\"fab fa-r-project\",\n \"1084\":\"fas fa-radiation\",\n \"1085\":\"fas fa-radiation-alt\",\n \"1086\":\"fas fa-rainbow\",\n \"1087\":\"fas fa-random\",\n \"1088\":\"fab fa-raspberry-pi\",\n \"1089\":\"fab fa-ravelry\",\n \"1090\":\"fab fa-react\",\n \"1091\":\"fab fa-reacteurope\",\n \"1092\":\"fab fa-readme\",\n \"1093\":\"fab fa-rebel\",\n \"1094\":\"fas fa-receipt\",\n \"1095\":\"fas fa-record-vinyl\",\n \"1096\":\"fas fa-recycle\",\n \"1097\":\"fab fa-red-river\",\n \"1098\":\"fab fa-reddit\",\n \"1099\":\"fab fa-reddit-alien\",\n \"1100\":\"fab fa-reddit-square\",\n \"1101\":\"fab fa-redhat\",\n \"1102\":\"fas fa-redo\",\n \"1103\":\"fas fa-redo-alt\",\n \"1104\":\"fas fa-registered\",\n \"1105\":\"far fa-registered\",\n \"1106\":\"fas fa-remove-format\",\n \"1107\":\"fab fa-renren\",\n \"1108\":\"fas fa-reply\",\n \"1109\":\"fas fa-reply-all\",\n \"1110\":\"fab fa-replyd\",\n \"1111\":\"fas fa-republican\",\n \"1112\":\"fab fa-researchgate\",\n \"1113\":\"fab fa-resolving\",\n \"1114\":\"fas fa-restroom\",\n \"1115\":\"fas fa-retweet\",\n \"1116\":\"fab fa-rev\",\n \"1117\":\"fas fa-ribbon\",\n \"1118\":\"fas fa-ring\",\n \"1119\":\"fas fa-road\",\n \"1120\":\"fas fa-robot\",\n \"1121\":\"fas fa-rocket\",\n \"1122\":\"fab fa-rocketchat\",\n \"1123\":\"fab fa-rockrms\",\n \"1124\":\"fas fa-route\",\n \"1125\":\"fas fa-rss\",\n \"1126\":\"fas fa-rss-square\",\n \"1127\":\"fas fa-ruble-sign\",\n \"1128\":\"fas fa-ruler\",\n \"1129\":\"fas fa-ruler-combined\",\n \"1130\":\"fas fa-ruler-horizontal\",\n \"1131\":\"fas fa-ruler-vertical\",\n \"1132\":\"fas fa-running\",\n \"1133\":\"fas fa-rupee-sign\",\n \"1134\":\"fas fa-sad-cry\",\n \"1135\":\"far fa-sad-cry\",\n \"1136\":\"fas fa-sad-tear\",\n \"1137\":\"far fa-sad-tear\",\n \"1138\":\"fab fa-safari\",\n \"1139\":\"fab fa-salesforce\",\n \"1140\":\"fab fa-sass\",\n \"1141\":\"fas fa-satellite\",\n \"1142\":\"fas fa-satellite-dish\",\n \"1143\":\"fas fa-save\",\n \"1144\":\"far fa-save\",\n \"1145\":\"fab fa-schlix\",\n \"1146\":\"fas fa-school\",\n \"1147\":\"fas fa-screwdriver\",\n \"1148\":\"fab fa-scribd\",\n \"1149\":\"fas fa-scroll\",\n \"1150\":\"fas fa-sd-card\",\n \"1151\":\"fas fa-search\",\n \"1152\":\"fas fa-search-dollar\",\n \"1153\":\"fas fa-search-location\",\n \"1154\":\"fas fa-search-minus\",\n \"1155\":\"fas fa-search-plus\",\n \"1156\":\"fab fa-searchengin\",\n \"1157\":\"fas fa-seedling\",\n \"1158\":\"fab fa-sellcast\",\n \"1159\":\"fab fa-sellsy\",\n \"1160\":\"fas fa-server\",\n \"1161\":\"fab fa-servicestack\",\n \"1162\":\"fas fa-shapes\",\n \"1163\":\"fas fa-share\",\n \"1164\":\"fas fa-share-alt\",\n \"1165\":\"fas fa-share-alt-square\",\n \"1166\":\"fas fa-share-square\",\n \"1167\":\"far fa-share-square\",\n \"1168\":\"fas fa-shekel-sign\",\n \"1169\":\"fas fa-shield-alt\",\n \"1170\":\"fas fa-ship\",\n \"1171\":\"fas fa-shipping-fast\",\n \"1172\":\"fab fa-shirtsinbulk\",\n \"1173\":\"fas fa-shoe-prints\",\n \"1174\":\"fas fa-shopping-bag\",\n \"1175\":\"fas fa-shopping-basket\",\n \"1176\":\"fas fa-shopping-cart\",\n \"1177\":\"fab fa-shopware\",\n \"1178\":\"fas fa-shower\",\n \"1179\":\"fas fa-shuttle-van\",\n \"1180\":\"fas fa-sign\",\n \"1181\":\"fas fa-sign-in-alt\",\n \"1182\":\"fas fa-sign-language\",\n \"1183\":\"fas fa-sign-out-alt\",\n \"1184\":\"fas fa-signal\",\n \"1185\":\"fas fa-signature\",\n \"1186\":\"fas fa-sim-card\",\n \"1187\":\"fab fa-simplybuilt\",\n \"1188\":\"fab fa-sistrix\",\n \"1189\":\"fas fa-sitemap\",\n \"1190\":\"fab fa-sith\",\n \"1191\":\"fas fa-skating\",\n \"1192\":\"fab fa-sketch\",\n \"1193\":\"fas fa-skiing\",\n \"1194\":\"fas fa-skiing-nordic\",\n \"1195\":\"fas fa-skull\",\n \"1196\":\"fas fa-skull-crossbones\",\n \"1197\":\"fab fa-skyatlas\",\n \"1198\":\"fab fa-skype\",\n \"1199\":\"fab fa-slack\",\n \"1200\":\"fab fa-slack-hash\",\n \"1201\":\"fas fa-slash\",\n \"1202\":\"fas fa-sleigh\",\n \"1203\":\"fas fa-sliders-h\",\n \"1204\":\"fab fa-slideshare\",\n \"1205\":\"fas fa-smile\",\n \"1206\":\"far fa-smile\",\n \"1207\":\"fas fa-smile-beam\",\n \"1208\":\"far fa-smile-beam\",\n \"1209\":\"fas fa-smile-wink\",\n \"1210\":\"far fa-smile-wink\",\n \"1211\":\"fas fa-smog\",\n \"1212\":\"fas fa-smoking\",\n \"1213\":\"fas fa-smoking-ban\",\n \"1214\":\"fas fa-sms\",\n \"1215\":\"fab fa-snapchat\",\n \"1216\":\"fab fa-snapchat-ghost\",\n \"1217\":\"fab fa-snapchat-square\",\n \"1218\":\"fas fa-snowboarding\",\n \"1219\":\"fas fa-snowflake\",\n \"1220\":\"far fa-snowflake\",\n \"1221\":\"fas fa-snowman\",\n \"1222\":\"fas fa-snowplow\",\n \"1223\":\"fas fa-socks\",\n \"1224\":\"fas fa-solar-panel\",\n \"1225\":\"fas fa-sort\",\n \"1226\":\"fas fa-sort-alpha-down\",\n \"1227\":\"fas fa-sort-alpha-down-alt\",\n \"1228\":\"fas fa-sort-alpha-up\",\n \"1229\":\"fas fa-sort-alpha-up-alt\",\n \"1230\":\"fas fa-sort-amount-down\",\n \"1231\":\"fas fa-sort-amount-down-alt\",\n \"1232\":\"fas fa-sort-amount-up\",\n \"1233\":\"fas fa-sort-amount-up-alt\",\n \"1234\":\"fas fa-sort-down\",\n \"1235\":\"fas fa-sort-numeric-down\",\n \"1236\":\"fas fa-sort-numeric-down-alt\",\n \"1237\":\"fas fa-sort-numeric-up\",\n \"1238\":\"fas fa-sort-numeric-up-alt\",\n \"1239\":\"fas fa-sort-up\",\n \"1240\":\"fab fa-soundcloud\",\n \"1241\":\"fab fa-sourcetree\",\n \"1242\":\"fas fa-spa\",\n \"1243\":\"fas fa-space-shuttle\",\n \"1244\":\"fab fa-speakap\",\n \"1245\":\"fab fa-speaker-deck\",\n \"1246\":\"fas fa-spell-check\",\n \"1247\":\"fas fa-spider\",\n \"1248\":\"fas fa-spinner\",\n \"1249\":\"fas fa-splotch\",\n \"1250\":\"fab fa-spotify\",\n \"1251\":\"fas fa-spray-can\",\n \"1252\":\"fas fa-square\",\n \"1253\":\"far fa-square\",\n \"1254\":\"fas fa-square-full\",\n \"1255\":\"fas fa-square-root-alt\",\n \"1256\":\"fab fa-squarespace\",\n \"1257\":\"fab fa-stack-exchange\",\n \"1258\":\"fab fa-stack-overflow\",\n \"1259\":\"fab fa-stackpath\",\n \"1260\":\"fas fa-stamp\",\n \"1261\":\"fas fa-star\",\n \"1262\":\"far fa-star\",\n \"1263\":\"fas fa-star-and-crescent\",\n \"1264\":\"fas fa-star-half\",\n \"1265\":\"far fa-star-half\",\n \"1266\":\"fas fa-star-half-alt\",\n \"1267\":\"fas fa-star-of-david\",\n \"1268\":\"fas fa-star-of-life\",\n \"1269\":\"fab fa-staylinked\",\n \"1270\":\"fab fa-steam\",\n \"1271\":\"fab fa-steam-square\",\n \"1272\":\"fab fa-steam-symbol\",\n \"1273\":\"fas fa-step-backward\",\n \"1274\":\"fas fa-step-forward\",\n \"1275\":\"fas fa-stethoscope\",\n \"1276\":\"fab fa-sticker-mule\",\n \"1277\":\"fas fa-sticky-note\",\n \"1278\":\"far fa-sticky-note\",\n \"1279\":\"fas fa-stop\",\n \"1280\":\"fas fa-stop-circle\",\n \"1281\":\"far fa-stop-circle\",\n \"1282\":\"fas fa-stopwatch\",\n \"1283\":\"fas fa-store\",\n \"1284\":\"fas fa-store-alt\",\n \"1285\":\"fab fa-strava\",\n \"1286\":\"fas fa-stream\",\n \"1287\":\"fas fa-street-view\",\n \"1288\":\"fas fa-strikethrough\",\n \"1289\":\"fab fa-stripe\",\n \"1290\":\"fab fa-stripe-s\",\n \"1291\":\"fas fa-stroopwafel\",\n \"1292\":\"fab fa-studiovinari\",\n \"1293\":\"fab fa-stumbleupon\",\n \"1294\":\"fab fa-stumbleupon-circle\",\n \"1295\":\"fas fa-subscript\",\n \"1296\":\"fas fa-subway\",\n \"1297\":\"fas fa-suitcase\",\n \"1298\":\"fas fa-suitcase-rolling\",\n \"1299\":\"fas fa-sun\",\n \"1300\":\"far fa-sun\",\n \"1301\":\"fab fa-superpowers\",\n \"1302\":\"fas fa-superscript\",\n \"1303\":\"fab fa-supple\",\n \"1304\":\"fas fa-surprise\",\n \"1305\":\"far fa-surprise\",\n \"1306\":\"fab fa-suse\",\n \"1307\":\"fas fa-swatchbook\",\n \"1308\":\"fab fa-swift\",\n \"1309\":\"fas fa-swimmer\",\n \"1310\":\"fas fa-swimming-pool\",\n \"1311\":\"fab fa-symfony\",\n \"1312\":\"fas fa-synagogue\",\n \"1313\":\"fas fa-sync\",\n \"1314\":\"fas fa-sync-alt\",\n \"1315\":\"fas fa-syringe\",\n \"1316\":\"fas fa-table\",\n \"1317\":\"fas fa-table-tennis\",\n \"1318\":\"fas fa-tablet\",\n \"1319\":\"fas fa-tablet-alt\",\n \"1320\":\"fas fa-tablets\",\n \"1321\":\"fas fa-tachometer-alt\",\n \"1322\":\"fas fa-tag\",\n \"1323\":\"fas fa-tags\",\n \"1324\":\"fas fa-tape\",\n \"1325\":\"fas fa-tasks\",\n \"1326\":\"fas fa-taxi\",\n \"1327\":\"fab fa-teamspeak\",\n \"1328\":\"fas fa-teeth\",\n \"1329\":\"fas fa-teeth-open\",\n \"1330\":\"fab fa-telegram\",\n \"1331\":\"fab fa-telegram-plane\",\n \"1332\":\"fas fa-temperature-high\",\n \"1333\":\"fas fa-temperature-low\",\n \"1334\":\"fab fa-tencent-weibo\",\n \"1335\":\"fas fa-tenge\",\n \"1336\":\"fas fa-terminal\",\n \"1337\":\"fas fa-text-height\",\n \"1338\":\"fas fa-text-width\",\n \"1339\":\"fas fa-th\",\n \"1340\":\"fas fa-th-large\",\n \"1341\":\"fas fa-th-list\",\n \"1342\":\"fab fa-the-red-yeti\",\n \"1343\":\"fas fa-theater-masks\",\n \"1344\":\"fab fa-themeco\",\n \"1345\":\"fab fa-themeisle\",\n \"1346\":\"fas fa-thermometer\",\n \"1347\":\"fas fa-thermometer-empty\",\n \"1348\":\"fas fa-thermometer-full\",\n \"1349\":\"fas fa-thermometer-half\",\n \"1350\":\"fas fa-thermometer-quarter\",\n \"1351\":\"fas fa-thermometer-three-quarters\",\n \"1352\":\"fab fa-think-peaks\",\n \"1353\":\"fas fa-thumbs-down\",\n \"1354\":\"far fa-thumbs-down\",\n \"1355\":\"fas fa-thumbs-up\",\n \"1356\":\"far fa-thumbs-up\",\n \"1357\":\"fas fa-thumbtack\",\n \"1358\":\"fas fa-ticket-alt\",\n \"1359\":\"fas fa-times\",\n \"1360\":\"fas fa-times-circle\",\n \"1361\":\"far fa-times-circle\",\n \"1362\":\"fas fa-tint\",\n \"1363\":\"fas fa-tint-slash\",\n \"1364\":\"fas fa-tired\",\n \"1365\":\"far fa-tired\",\n \"1366\":\"fas fa-toggle-off\",\n \"1367\":\"fas fa-toggle-on\",\n \"1368\":\"fas fa-toilet\",\n \"1369\":\"fas fa-toilet-paper\",\n \"1370\":\"fas fa-toolbox\",\n \"1371\":\"fas fa-tools\",\n \"1372\":\"fas fa-tooth\",\n \"1373\":\"fas fa-torah\",\n \"1374\":\"fas fa-torii-gate\",\n \"1375\":\"fas fa-tractor\",\n \"1376\":\"fab fa-trade-federation\",\n \"1377\":\"fas fa-trademark\",\n \"1378\":\"fas fa-traffic-light\",\n \"1379\":\"fas fa-train\",\n \"1380\":\"fas fa-tram\",\n \"1381\":\"fas fa-transgender\",\n \"1382\":\"fas fa-transgender-alt\",\n \"1383\":\"fas fa-trash\",\n \"1384\":\"fas fa-trash-alt\",\n \"1385\":\"far fa-trash-alt\",\n \"1386\":\"fas fa-trash-restore\",\n \"1387\":\"fas fa-trash-restore-alt\",\n \"1388\":\"fas fa-tree\",\n \"1389\":\"fab fa-trello\",\n \"1390\":\"fab fa-tripadvisor\",\n \"1391\":\"fas fa-trophy\",\n \"1392\":\"fas fa-truck\",\n \"1393\":\"fas fa-truck-loading\",\n \"1394\":\"fas fa-truck-monster\",\n \"1395\":\"fas fa-truck-moving\",\n \"1396\":\"fas fa-truck-pickup\",\n \"1397\":\"fas fa-tshirt\",\n \"1398\":\"fas fa-tty\",\n \"1399\":\"fab fa-tumblr\",\n \"1400\":\"fab fa-tumblr-square\",\n \"1401\":\"fas fa-tv\",\n \"1402\":\"fab fa-twitch\",\n \"1403\":\"fab fa-twitter\",\n \"1404\":\"fab fa-twitter-square\",\n \"1405\":\"fab fa-typo3\",\n \"1406\":\"fab fa-uber\",\n \"1407\":\"fab fa-ubuntu\",\n \"1408\":\"fab fa-uikit\",\n \"1409\":\"fab fa-umbraco\",\n \"1410\":\"fas fa-umbrella\",\n \"1411\":\"fas fa-umbrella-beach\",\n \"1412\":\"fas fa-underline\",\n \"1413\":\"fas fa-undo\",\n \"1414\":\"fas fa-undo-alt\",\n \"1415\":\"fab fa-uniregistry\",\n \"1416\":\"fas fa-universal-access\",\n \"1417\":\"fas fa-university\",\n \"1418\":\"fas fa-unlink\",\n \"1419\":\"fas fa-unlock\",\n \"1420\":\"fas fa-unlock-alt\",\n \"1421\":\"fab fa-untappd\",\n \"1422\":\"fas fa-upload\",\n \"1423\":\"fab fa-ups\",\n \"1424\":\"fab fa-usb\",\n \"1425\":\"fas fa-user\",\n \"1426\":\"far fa-user\",\n \"1427\":\"fas fa-user-alt\",\n \"1428\":\"fas fa-user-alt-slash\",\n \"1429\":\"fas fa-user-astronaut\",\n \"1430\":\"fas fa-user-check\",\n \"1431\":\"fas fa-user-circle\",\n \"1432\":\"far fa-user-circle\",\n \"1433\":\"fas fa-user-clock\",\n \"1434\":\"fas fa-user-cog\",\n \"1435\":\"fas fa-user-edit\",\n \"1436\":\"fas fa-user-friends\",\n \"1437\":\"fas fa-user-graduate\",\n \"1438\":\"fas fa-user-injured\",\n \"1439\":\"fas fa-user-lock\",\n \"1440\":\"fas fa-user-md\",\n \"1441\":\"fas fa-user-minus\",\n \"1442\":\"fas fa-user-ninja\",\n \"1443\":\"fas fa-user-nurse\",\n \"1444\":\"fas fa-user-plus\",\n \"1445\":\"fas fa-user-secret\",\n \"1446\":\"fas fa-user-shield\",\n \"1447\":\"fas fa-user-slash\",\n \"1448\":\"fas fa-user-tag\",\n \"1449\":\"fas fa-user-tie\",\n \"1450\":\"fas fa-user-times\",\n \"1451\":\"fas fa-users\",\n \"1452\":\"fas fa-users-cog\",\n \"1453\":\"fab fa-usps\",\n \"1454\":\"fab fa-ussunnah\",\n \"1455\":\"fas fa-utensil-spoon\",\n \"1456\":\"fas fa-utensils\",\n \"1457\":\"fab fa-vaadin\",\n \"1458\":\"fas fa-vector-square\",\n \"1459\":\"fas fa-venus\",\n \"1460\":\"fas fa-venus-double\",\n \"1461\":\"fas fa-venus-mars\",\n \"1462\":\"fab fa-viacoin\",\n \"1463\":\"fab fa-viadeo\",\n \"1464\":\"fab fa-viadeo-square\",\n \"1465\":\"fas fa-vial\",\n \"1466\":\"fas fa-vials\",\n \"1467\":\"fab fa-viber\",\n \"1468\":\"fas fa-video\",\n \"1469\":\"fas fa-video-slash\",\n \"1470\":\"fas fa-vihara\",\n \"1471\":\"fab fa-vimeo\",\n \"1472\":\"fab fa-vimeo-square\",\n \"1473\":\"fab fa-vimeo-v\",\n \"1474\":\"fab fa-vine\",\n \"1475\":\"fab fa-vk\",\n \"1476\":\"fab fa-vnv\",\n \"1477\":\"fas fa-voicemail\",\n \"1478\":\"fas fa-volleyball-ball\",\n \"1479\":\"fas fa-volume-down\",\n \"1480\":\"fas fa-volume-mute\",\n \"1481\":\"fas fa-volume-off\",\n \"1482\":\"fas fa-volume-up\",\n \"1483\":\"fas fa-vote-yea\",\n \"1484\":\"fas fa-vr-cardboard\",\n \"1485\":\"fab fa-vuejs\",\n \"1486\":\"fas fa-walking\",\n \"1487\":\"fas fa-wallet\",\n \"1488\":\"fas fa-warehouse\",\n \"1489\":\"fas fa-water\",\n \"1490\":\"fas fa-wave-square\",\n \"1491\":\"fab fa-waze\",\n \"1492\":\"fab fa-weebly\",\n \"1493\":\"fab fa-weibo\",\n \"1494\":\"fas fa-weight\",\n \"1495\":\"fas fa-weight-hanging\",\n \"1496\":\"fab fa-weixin\",\n \"1497\":\"fab fa-whatsapp\",\n \"1498\":\"fab fa-whatsapp-square\",\n \"1499\":\"fas fa-wheelchair\",\n \"1500\":\"fab fa-whmcs\",\n \"1501\":\"fas fa-wifi\",\n \"1502\":\"fab fa-wikipedia-w\",\n \"1503\":\"fas fa-wind\",\n \"1504\":\"fas fa-window-close\",\n \"1505\":\"far fa-window-close\",\n \"1506\":\"fas fa-window-maximize\",\n \"1507\":\"far fa-window-maximize\",\n \"1508\":\"fas fa-window-minimize\",\n \"1509\":\"far fa-window-minimize\",\n \"1510\":\"fas fa-window-restore\",\n \"1511\":\"far fa-window-restore\",\n \"1512\":\"fab fa-windows\",\n \"1513\":\"fas fa-wine-bottle\",\n \"1514\":\"fas fa-wine-glass\",\n \"1515\":\"fas fa-wine-glass-alt\",\n \"1516\":\"fab fa-wix\",\n \"1517\":\"fab fa-wizards-of-the-coast\",\n \"1518\":\"fab fa-wolf-pack-battalion\",\n \"1519\":\"fas fa-won-sign\",\n \"1520\":\"fab fa-wordpress\",\n \"1521\":\"fab fa-wordpress-simple\",\n \"1522\":\"fab fa-wpbeginner\",\n \"1523\":\"fab fa-wpexplorer\",\n \"1524\":\"fab fa-wpforms\",\n \"1525\":\"fab fa-wpressr\",\n \"1526\":\"fas fa-wrench\",\n \"1527\":\"fas fa-x-ray\",\n \"1528\":\"fab fa-xbox\",\n \"1529\":\"fab fa-xing\",\n \"1530\":\"fab fa-xing-square\",\n \"1531\":\"fab fa-y-combinator\",\n \"1532\":\"fab fa-yahoo\",\n \"1533\":\"fab fa-yammer\",\n \"1534\":\"fab fa-yandex\",\n \"1535\":\"fab fa-yandex-international\",\n \"1536\":\"fab fa-yarn\",\n \"1537\":\"fab fa-yelp\",\n \"1538\":\"fas fa-yen-sign\",\n \"1539\":\"fas fa-yin-yang\",\n \"1540\":\"fab fa-yoast\",\n \"1541\":\"fab fa-youtube\",\n \"1542\":\"fab fa-youtube-square\",\n \"1543\":\"fab fa-zhihu\"\n}" }, { "path": "index.html", "content": "\n\n \n \n Vue 3 Pagebuilder\n\n \n \n \n \n\n \n\n \n \n\n \n\n \n \n \n\n \n \n\n \n\n \n \n\n \n Fork me on GitHub\n
\n
\n
\n \n
\n\n
\n \n
\n
\n \n
\n \n\n" }, { "path": "main.mjs", "content": "import Header from \"./components/header/header.mjs\";\nimport Post from \"./components/post/post.mjs\";\nimport News from \"./components/news/news.mjs\";\nimport NewsLeft from \"./components/newsleft/newsleft.mjs\";\nimport Featured from \"./components/featured/featured.mjs\";\nimport Features from \"./components/features/features.mjs\";\nimport Editor from \"./editor/editor.mjs\";\n\nconst { createApp } = Vue;\nconst App = createApp({\n data() {\n return {\n editing: true,\n layouts: [\"featured\", \"post\", \"news\", \"newsleft\", \"features\"],\n entries: [\n {\n id: \"item-1\",\n layout: \"header\",\n title: \"Vue Pagebuilder\",\n subtitle: \"Lorem ipsum dolor site amet.\",\n button_text: \"Contact Us\",\n button_link: \"#\",\n icon: \"fas fa-bolt\",\n },\n {\n id: \"item-2\",\n layout: \"post\",\n title: \"Mauris eleifend ligula\",\n body: \" Vivamus in nisi commodo, auctor magna vel, viverra turpis. Quisque dapibus risus nec justo euismod, id fringilla dui lobortis. Mauris vitae semper arcu. Ut ac lorem felis.\",\n },\n {\n id: \"item-3\",\n layout: \"news\",\n title: \"Maecenas tincidunt sem quis rutrum\",\n body: \"Mauris in porttitor elit. Aenean elementum eleifend quam, in tristique eros auctor porta. Donec et est in tellus blandit feugiat id nec nunc.\",\n },\n {\n id: \"item-4\",\n layout: \"features\",\n title: \"Lorem Ipsum\",\n body: \"Lorem ipsum dolor sit amet, consectetur adipiscing elit. Mauris eleifend ligula ut augue scelerisque venenatis.\",\n },\n ],\n };\n },\n\n methods: {\n defaultVal(key, def) {\n if (key == \"\") {\n return def;\n } else {\n return key;\n }\n },\n },\n\n components: {\n \"wdgt-post\": Post,\n \"wdgt-header\": Header,\n \"wdgt-news\": News,\n \"wdgt-newsleft\": NewsLeft,\n \"wdgt-featured\": Featured,\n \"wdgt-features\": Features,\n \"page-editor\": Editor,\n },\n});\n\nwindow.addEventListener(\"load\", () => {\n App.mount(\"main\");\n});\n" }, { "path": "package.json", "content": "{\n \"name\": \"vue-pagebuilder\",\n \"version\": \"1.0.1\",\n \"description\": \"A visual pagebuilder for Vue 3\",\n \"main\": \"main.js\",\n \"scripts\": {\n \"build\": \"rollup -c rollup.build.mjs\",\n \"serve\": \"rollup -c rollup.serve.mjs\"\n },\n \"repository\": {\n \"type\": \"git\",\n \"url\": \"git+https://github.com/dashpilot/vue-pagebuilder.git\"\n },\n \"author\": \"\",\n \"license\": \"ISC\",\n \"bugs\": {\n \"url\": \"https://github.com/dashpilot/vue-pagebuilder/issues\"\n },\n \"homepage\": \"https://github.com/dashpilot/vue-pagebuilder#readme\",\n \"devDependencies\": {\n \"rollup\": \"^3.7.5\",\n \"rollup-plugin-serve\": \"^1.1.1\"\n }\n}\n" }, { "path": "rollup.build.mjs", "content": "export default {\n input: \"main.mjs\",\n output: {\n file: \"build/bundle.mjs\",\n format: \"es\",\n },\n};\n" }, { "path": "rollup.serve.mjs", "content": "import serve from \"rollup-plugin-serve\";\n\nexport default {\n input: \"main.mjs\",\n output: {\n file: \"build/bundle.mjs\",\n format: \"es\",\n },\n plugins: [\n serve({\n open: true, // opens browser\n verbose: true, // logs server activity to console\n contentBase: [\"\", \"build\"], // serve from root and build directories\n host: \"localhost\",\n port: 8000,\n }),\n ],\n};\n" }, { "path": "style.css", "content": ":root {\n --bg-color: #f7fafc;\n --fg-color: #000000;\n --font: \"Rubik\";\n --spacing: \"-0.04em\";\n}\n\n.container {\n padding-top: 20px;\n padding-bottom: 20px;\n}\n\nsection h1,\nsection h2,\nsection h3,\nsection h4 {\n font-family: var(--font);\n letter-spacing: var(--spacing);\n font-weight: 600;\n}\n\nsection h1,\nsection h2 {\n font-size: 45px;\n line-height: 45px;\n}\n\nsection h3 {\n margin-top: 20px;\n font-size: 35px;\n line-height: 35px;\n}\n\nsection h1 {\n margin-bottom: 10px;\n}\n\nsection h2 {\n margin-bottom: 25px;\n}\n\nsection p {\n font-family: \"Rubik\", sans-serif;\n font-weight: 300;\n font-size: 20px;\n line-height: 30px;\n color: #4f5c65;\n}\n\nsection {\n padding: 25px;\n padding-top: 100px;\n padding-bottom: 100px;\n}\n\n#header:nth-child(odd) h1,\n#header:nth-child(odd) h2,\n#header:nth-child(odd) h3,\n#header:nth-child(odd) p,\n#header:nth-child(odd) .fas {\n color: var(--fg-color);\n}\n\n#content section:nth-child(even) h1,\n#content section:nth-child(even) h2,\n#content section:nth-child(even) h3,\n#content section:nth-child(even) p,\n#content section:nth-child(even) .fas {\n color: var(--fg-color);\n}\n\n#content section:nth-child(even) {\n background-color: var(--bg-color);\n}\n\n#header:nth-child(odd) {\n background-color: var(--bg-color);\n}\n\n.btn-secondary {\n font-family: \"Rubik\", sans-serif;\n border: 1px solid #000;\n font-size: 20px;\n padding: 8px 25px 8px 25px;\n margin-top: 25px;\n background-color: transparent;\n}\n\n.btn-secondary:hover {\n border: 1px solid #999;\n background-color: transparent;\n}\n\n#header:nth-child(odd) .btn-secondary {\n color: var(--fg-color);\n border-color: var(--fg-color);\n}\n\n#content:nth-child(odd) .btn-secondary {\n color: var(--fg-color);\n border-color: var(--fg-color);\n}\n\n.fa-big {\n font-size: 45px;\n margin-bottom: 15px;\n}\n\n.responsive-container {\n position: relative;\n overflow: hidden;\n width: 100%;\n padding-top: 56.25%;\n /* 16:9 Aspect Ratio (divide 9 by 16 = 0.5625) */\n}\n\n/* Then style the iframe to fit in the container div with full height and width */\n\n.responsive-iframe {\n position: absolute;\n top: 0;\n left: 0;\n bottom: 0;\n right: 0;\n width: 100%;\n height: 100%;\n}\n" }, { "path": "test-inline.html", "content": "\n\n \n \n Vue Pagebuilder\n\n \n \n \n \n\n \n\n \n \n\n \n \n \n\n \n
\n
\n
\n
\n \n
\n
\n

\n

\n
\n
\n
\n
\n \n \n\n \n
\n\n \n \n\n" }, { "path": "test.html", "content": "\n\n \n \n Vue Pagebuilder\n\n \n \n \n \n\n \n \n \n \n \n\n \n \n \n\n \n
\n
\n \n \n \n \n \n
\n\n \n
\n \n\n" } ]