google

Experiences into wriable/normal (better and faster)

package-lock.json

@@ -20,6 +20,7 @@
 				"magic-string": "^0.30.0",
 				"mapbox": "^1.0.0-beta10",
 				"mapbox-gl": "^2.10.0",
+				"patch-package": "^6.5.1",
 				"sorcery": "^0.11.0",
 				"svelte-appwrite-client": "^0.2.3",
 				"svelte-check": "^3.1.4",
@@ -708,6 +709,11 @@
 				"url": "https://opencollective.com/typescript-eslint"
 			}
 		},
+		"node_modules/@yarnpkg/lockfile": {
+			"version": "1.1.0",
+			"resolved": "https://registry.npmjs.org/@yarnpkg/lockfile/-/lockfile-1.1.0.tgz",
+			"integrity": "sha512-GpSwvyXOcOOlV70vbnzjj4fW5xW/FdUF6nQEt1ENy7m4ZCczi1+/buVUPAqmGfqznsORNFzUMjctTIp8a9tuCQ=="
+		},
 		"node_modules/acorn": {
 			"version": "8.8.2",
 			"resolved": "https://registry.npmjs.org/acorn/-/acorn-8.8.2.tgz",
@@ -790,7 +796,6 @@
 			"version": "4.3.0",
 			"resolved": "https://registry.npmjs.org/ansi-styles/-/ansi-styles-4.3.0.tgz",
 			"integrity": "sha512-zbB9rCJAT1rbjiVDb2hqKFHNYLxgtk8NURxZ3IZwD3F6NtxbXZQCnnSi1Lkx+IDohdPlFp222wVALIheZJQSEg==",
-			"dev": true,
 			"dependencies": {
 				"color-convert": "^2.0.1"
 			},
@@ -916,6 +921,14 @@
 			"resolved": "https://registry.npmjs.org/asynckit/-/asynckit-0.4.0.tgz",
 			"integrity": "sha512-Oei9OH4tRh0YqU3GxhX79dM/mwVgvbZJaSNaRk+bshkj0S5cfHcgYakreBjrHwatXKbz+IoIdYLxrKim2MjW0Q=="
 		},
+		"node_modules/at-least-node": {
+			"version": "1.0.0",
+			"resolved": "https://registry.npmjs.org/at-least-node/-/at-least-node-1.0.0.tgz",
+			"integrity": "sha512-+q/t7Ekv1EDY2l6Gda6LLiX14rU9TV20Wa3ofeQmwPFZbOMo9DXrLbOjFaaclkXKWidIaopwAObQDqwWtGUjqg==",
+			"engines": {
+				"node": ">= 4.0.0"
+			}
+		},
 		"node_modules/autoprefixer": {
 			"version": "10.4.14",
 			"resolved": "https://registry.npmjs.org/autoprefixer/-/autoprefixer-10.4.14.tgz",
@@ -1133,7 +1146,6 @@
 			"version": "4.1.2",
 			"resolved": "https://registry.npmjs.org/chalk/-/chalk-4.1.2.tgz",
 			"integrity": "sha512-oKnbhFyRIXpUuez8iBMmyEa4nbj4IOQyuhc/wy9kY7/WVPcwIO9VA668Pu8RkO7+0G76SLROeyw9CpQ061i4mA==",
-			"dev": true,
 			"dependencies": {
 				"ansi-styles": "^4.1.0",
 				"supports-color": "^7.1.0"
@@ -1209,6 +1221,11 @@
 				"node": ">= 6"
 			}
 		},
+		"node_modules/ci-info": {
+			"version": "2.0.0",
+			"resolved": "https://registry.npmjs.org/ci-info/-/ci-info-2.0.0.tgz",
+			"integrity": "sha512-5tK7EtrZ0N+OLFMthtqOj4fI2Jeb88C4CAZPu25LDVUgXJ0A3Js4PMGqrn0JU1W0Mh1/Z8wZzYPxqUrXeBboCQ=="
+		},
 		"node_modules/classnames": {
 			"version": "2.3.2",
 			"resolved": "https://registry.npmjs.org/classnames/-/classnames-2.3.2.tgz",
@@ -1241,7 +1258,6 @@
 			"version": "2.0.1",
 			"resolved": "https://registry.npmjs.org/color-convert/-/color-convert-2.0.1.tgz",
 			"integrity": "sha512-RRECPsj7iu/xb5oKYcsFHSppFNnsj/52OVTRKb4zP5onXwVF3zVmmToNcOfGC+CRDpfK/U584fMg38ZHCaElKQ==",
-			"dev": true,
 			"dependencies": {
 				"color-name": "~1.1.4"
 			},
@@ -1252,8 +1268,7 @@
 		"node_modules/color-name": {
 			"version": "1.1.4",
 			"resolved": "https://registry.npmjs.org/color-name/-/color-name-1.1.4.tgz",
-			"integrity": "sha512-dOy+3AuW3a2wNbZHIuMZpTcgjGuLU/uBL/ubcZF9OXbDo8ff4O8yVp5Bf0efS8uEoYo5q4Fx7dY9OgQGXgAsQA==",
+			"integrity": "sha512-dOy+3AuW3a2wNbZHIuMZpTcgjGuLU/uBL/ubcZF9OXbDo8ff4O8yVp5Bf0efS8uEoYo5q4Fx7dY9OgQGXgAsQA=="
-			"dev": true
 		},
 		"node_modules/combined-stream": {
 			"version": "1.0.8",
@@ -2568,6 +2583,14 @@
 				"url": "https://github.com/sponsors/sindresorhus"
 			}
 		},
+		"node_modules/find-yarn-workspace-root": {
+			"version": "2.0.0",
+			"resolved": "https://registry.npmjs.org/find-yarn-workspace-root/-/find-yarn-workspace-root-2.0.0.tgz",
+			"integrity": "sha512-1IMnbjt4KzsQfnhnzNd8wUEgXZ44IzZaZmnLYx7D5FZlaHt2gW20Cri8Q+E/t5tIj4+epTBub+2Zxu/vNILzqQ==",
+			"dependencies": {
+				"micromatch": "^4.0.2"
+			}
+		},
 		"node_modules/flat-cache": {
 			"version": "3.0.4",
 			"resolved": "https://registry.npmjs.org/flat-cache/-/flat-cache-3.0.4.tgz",
@@ -2646,6 +2669,20 @@
 				"url": "https://www.patreon.com/infusion"
 			}
 		},
+		"node_modules/fs-extra": {
+			"version": "9.1.0",
+			"resolved": "https://registry.npmjs.org/fs-extra/-/fs-extra-9.1.0.tgz",
+			"integrity": "sha512-hcg3ZmepS30/7BSFqRvoo3DOMQu7IjqxO5nCDt+zM9XWjb33Wg7ziNT+Qvqbuc3+gWpzO02JubVyk2G4Zvo1OQ==",
+			"dependencies": {
+				"at-least-node": "^1.0.0",
+				"graceful-fs": "^4.2.0",
+				"jsonfile": "^6.0.1",
+				"universalify": "^2.0.0"
+			},
+			"engines": {
+				"node": ">=10"
+			}
+		},
 		"node_modules/fs.realpath": {
 			"version": "1.0.0",
 			"resolved": "https://registry.npmjs.org/fs.realpath/-/fs.realpath-1.0.0.tgz",
@@ -2892,7 +2929,6 @@
 			"version": "4.0.0",
 			"resolved": "https://registry.npmjs.org/has-flag/-/has-flag-4.0.0.tgz",
 			"integrity": "sha512-EykJT/Q1KjTWctppgIAgfSO0tKVuZUjhgMr17kqTumMl6Afv3EISleU7qZUzoXDFTAHTDC4NOoG/ZxU3EvlMPQ==",
-			"dev": true,
 			"engines": {
 				"node": ">=8"
 			}
@@ -3274,6 +3310,17 @@
 				"url": "https://github.com/sponsors/ljharb"
 			}
 		},
+		"node_modules/is-ci": {
+			"version": "2.0.0",
+			"resolved": "https://registry.npmjs.org/is-ci/-/is-ci-2.0.0.tgz",
+			"integrity": "sha512-YfJT7rkpQB0updsdHLGWrvhBJfcfzNNawYDNIyQXJz0IViGf75O8EBPKSdvw2rF+LGCsX4FZ8tcr3b19LcZq4w==",
+			"dependencies": {
+				"ci-info": "^2.0.0"
+			},
+			"bin": {
+				"is-ci": "bin.js"
+			}
+		},
 		"node_modules/is-core-module": {
 			"version": "2.11.0",
 			"resolved": "https://registry.npmjs.org/is-core-module/-/is-core-module-2.11.0.tgz",
@@ -3301,6 +3348,20 @@
 				"url": "https://github.com/sponsors/ljharb"
 			}
 		},
+		"node_modules/is-docker": {
+			"version": "2.2.1",
+			"resolved": "https://registry.npmjs.org/is-docker/-/is-docker-2.2.1.tgz",
+			"integrity": "sha512-F+i2BKsFrH66iaUFc0woD8sLy8getkwTwtOBjvs56Cx4CgJDeKQeqfz8wAYiSb8JOprWhHH5p77PbmYCvvUuXQ==",
+			"bin": {
+				"is-docker": "cli.js"
+			},
+			"engines": {
+				"node": ">=8"
+			},
+			"funding": {
+				"url": "https://github.com/sponsors/sindresorhus"
+			}
+		},
 		"node_modules/is-extglob": {
 			"version": "2.1.1",
 			"resolved": "https://registry.npmjs.org/is-extglob/-/is-extglob-2.1.1.tgz",
@@ -3469,11 +3530,21 @@
 				"url": "https://github.com/sponsors/ljharb"
 			}
 		},
+		"node_modules/is-wsl": {
+			"version": "2.2.0",
+			"resolved": "https://registry.npmjs.org/is-wsl/-/is-wsl-2.2.0.tgz",
+			"integrity": "sha512-fKzAra0rGJUUBwGBgNkHZuToZcn+TtXHpeCgmkMJMMYx1sQDYaCSyjJBSCa2nH1DGm7s3n1oBnohoVTBaN7Lww==",
+			"dependencies": {
+				"is-docker": "^2.0.0"
+			},
+			"engines": {
+				"node": ">=8"
+			}
+		},
 		"node_modules/isexe": {
 			"version": "2.0.0",
 			"resolved": "https://registry.npmjs.org/isexe/-/isexe-2.0.0.tgz",
-			"integrity": "sha512-RHxMLp9lnKHGHRng9QFhRCMbYAcVpn69smSGcq3f36xjgVVWThj4qqLbTLlq7Ssj8B+fIQ1EuCEGI2lKsyQeIw==",
+			"integrity": "sha512-RHxMLp9lnKHGHRng9QFhRCMbYAcVpn69smSGcq3f36xjgVVWThj4qqLbTLlq7Ssj8B+fIQ1EuCEGI2lKsyQeIw=="
-			"dev": true
 		},
 		"node_modules/isomorphic-form-data": {
 			"version": "2.0.0",
@@ -3529,11 +3600,30 @@
 				"json5": "lib/cli.js"
 			}
 		},
+		"node_modules/jsonfile": {
+			"version": "6.1.0",
+			"resolved": "https://registry.npmjs.org/jsonfile/-/jsonfile-6.1.0.tgz",
+			"integrity": "sha512-5dgndWOriYSm5cnYaJNhalLNDKOqFwyDB/rr1E9ZsGciGvKPs8R2xYGCacuf3z6K1YKDz182fd+fY3cn3pMqXQ==",
+			"dependencies": {
+				"universalify": "^2.0.0"
+			},
+			"optionalDependencies": {
+				"graceful-fs": "^4.1.6"
+			}
+		},
 		"node_modules/kdbush": {
 			"version": "3.0.0",
 			"resolved": "https://registry.npmjs.org/kdbush/-/kdbush-3.0.0.tgz",
 			"integrity": "sha512-hRkd6/XW4HTsA9vjVpY9tuXJYLSlelnkTmVFu4M9/7MIYQtFcHpbugAU7UbOfjOiVSVYl2fqgBuJ32JUmRo5Ew=="
 		},
+		"node_modules/klaw-sync": {
+			"version": "6.0.0",
+			"resolved": "https://registry.npmjs.org/klaw-sync/-/klaw-sync-6.0.0.tgz",
+			"integrity": "sha512-nIeuVSzdCCs6TDPTqI8w1Yre34sSq7AkZ4B3sfOBbI2CgVSB4Du4aLQijFU2+lhAFCwt9+42Hel6lQNIv6AntQ==",
+			"dependencies": {
+				"graceful-fs": "^4.1.11"
+			}
+		},
 		"node_modules/kleur": {
 			"version": "4.1.5",
 			"resolved": "https://registry.npmjs.org/kleur/-/kleur-4.1.5.tgz",
@@ -4587,6 +4677,11 @@
 			"resolved": "https://registry.npmjs.org/next-tick/-/next-tick-1.1.0.tgz",
 			"integrity": "sha512-CXdUiJembsNjuToQvxayPZF9Vqht7hewsvy2sOWafLvi2awflj9mOC6bHIg50orX8IJvWKY9wYQ/zB2kogPslQ=="
 		},
+		"node_modules/nice-try": {
+			"version": "1.0.5",
+			"resolved": "https://registry.npmjs.org/nice-try/-/nice-try-1.0.5.tgz",
+			"integrity": "sha512-1nh45deeb5olNY7eX82BkPO7SSxR5SSYJiPTrTdFUVYwAl8CKMA5N9PjTYkHiRjisVcxcQ1HXdLhx2qxxJzLNQ=="
+		},
 		"node_modules/no-case": {
 			"version": "3.0.4",
 			"resolved": "https://registry.npmjs.org/no-case/-/no-case-3.0.4.tgz",
@@ -4708,6 +4803,21 @@
 				"wrappy": "1"
 			}
 		},
+		"node_modules/open": {
+			"version": "7.4.2",
+			"resolved": "https://registry.npmjs.org/open/-/open-7.4.2.tgz",
+			"integrity": "sha512-MVHddDVweXZF3awtlAS+6pgKLlm/JgxZ90+/NBurBoQctVOOB/zDdVjcyPzQ+0laDGbsWgrRkflI65sQeOgT9Q==",
+			"dependencies": {
+				"is-docker": "^2.0.0",
+				"is-wsl": "^2.1.1"
+			},
+			"engines": {
+				"node": ">=8"
+			},
+			"funding": {
+				"url": "https://github.com/sponsors/sindresorhus"
+			}
+		},
 		"node_modules/optionator": {
 			"version": "0.9.1",
 			"resolved": "https://registry.npmjs.org/optionator/-/optionator-0.9.1.tgz",
@@ -4725,6 +4835,14 @@
 				"node": ">= 0.8.0"
 			}
 		},
+		"node_modules/os-tmpdir": {
+			"version": "1.0.2",
+			"resolved": "https://registry.npmjs.org/os-tmpdir/-/os-tmpdir-1.0.2.tgz",
+			"integrity": "sha512-D2FR03Vir7FIu45XBY20mTb+/ZSWB00sjU9jdQXt83gDrI4Ztz5Fs7/yy74g2N5SVQY4xY1qDr4rNddwYRVX0g==",
+			"engines": {
+				"node": ">=0.10.0"
+			}
+		},
 		"node_modules/p-limit": {
 			"version": "3.1.0",
 			"resolved": "https://registry.npmjs.org/p-limit/-/p-limit-3.1.0.tgz",
@@ -4780,6 +4898,114 @@
 				"tslib": "^2.0.3"
 			}
 		},
+		"node_modules/patch-package": {
+			"version": "6.5.1",
+			"resolved": "https://registry.npmjs.org/patch-package/-/patch-package-6.5.1.tgz",
+			"integrity": "sha512-I/4Zsalfhc6bphmJTlrLoOcAF87jcxko4q0qsv4bGcurbr8IskEOtdnt9iCmsQVGL1B+iUhSQqweyTLJfCF9rA==",
+			"dependencies": {
+				"@yarnpkg/lockfile": "^1.1.0",
+				"chalk": "^4.1.2",
+				"cross-spawn": "^6.0.5",
+				"find-yarn-workspace-root": "^2.0.0",
+				"fs-extra": "^9.0.0",
+				"is-ci": "^2.0.0",
+				"klaw-sync": "^6.0.0",
+				"minimist": "^1.2.6",
+				"open": "^7.4.2",
+				"rimraf": "^2.6.3",
+				"semver": "^5.6.0",
+				"slash": "^2.0.0",
+				"tmp": "^0.0.33",
+				"yaml": "^1.10.2"
+			},
+			"bin": {
+				"patch-package": "index.js"
+			},
+			"engines": {
+				"node": ">=10",
+				"npm": ">5"
+			}
+		},
+		"node_modules/patch-package/node_modules/cross-spawn": {
+			"version": "6.0.5",
+			"resolved": "https://registry.npmjs.org/cross-spawn/-/cross-spawn-6.0.5.tgz",
+			"integrity": "sha512-eTVLrBSt7fjbDygz805pMnstIs2VTBNkRm0qxZd+M7A5XDdxVRWO5MxGBXZhjY4cqLYLdtrGqRf8mBPmzwSpWQ==",
+			"dependencies": {
+				"nice-try": "^1.0.4",
+				"path-key": "^2.0.1",
+				"semver": "^5.5.0",
+				"shebang-command": "^1.2.0",
+				"which": "^1.2.9"
+			},
+			"engines": {
+				"node": ">=4.8"
+			}
+		},
+		"node_modules/patch-package/node_modules/path-key": {
+			"version": "2.0.1",
+			"resolved": "https://registry.npmjs.org/path-key/-/path-key-2.0.1.tgz",
+			"integrity": "sha512-fEHGKCSmUSDPv4uoj8AlD+joPlq3peND+HRYyxFz4KPw4z926S/b8rIuFs2FYJg3BwsxJf6A9/3eIdLaYC+9Dw==",
+			"engines": {
+				"node": ">=4"
+			}
+		},
+		"node_modules/patch-package/node_modules/rimraf": {
+			"version": "2.7.1",
+			"resolved": "https://registry.npmjs.org/rimraf/-/rimraf-2.7.1.tgz",
+			"integrity": "sha512-uWjbaKIK3T1OSVptzX7Nl6PvQ3qAGtKEtVRjRuazjfL3Bx5eI409VZSqgND+4UNnmzLVdPj9FqFJNPqBZFve4w==",
+			"dependencies": {
+				"glob": "^7.1.3"
+			},
+			"bin": {
+				"rimraf": "bin.js"
+			}
+		},
+		"node_modules/patch-package/node_modules/semver": {
+			"version": "5.7.1",
+			"resolved": "https://registry.npmjs.org/semver/-/semver-5.7.1.tgz",
+			"integrity": "sha512-sauaDf/PZdVgrLTNYHRtpXa1iRiKcaebiKQ1BJdpQlWH2lCvexQdX55snPFyK7QzpudqbCI0qXFfOasHdyNDGQ==",
+			"bin": {
+				"semver": "bin/semver"
+			}
+		},
+		"node_modules/patch-package/node_modules/shebang-command": {
+			"version": "1.2.0",
+			"resolved": "https://registry.npmjs.org/shebang-command/-/shebang-command-1.2.0.tgz",
+			"integrity": "sha512-EV3L1+UQWGor21OmnvojK36mhg+TyIKDh3iFBKBohr5xeXIhNBcx8oWdgkTEEQ+BEFFYdLRuqMfd5L84N1V5Vg==",
+			"dependencies": {
+				"shebang-regex": "^1.0.0"
+			},
+			"engines": {
+				"node": ">=0.10.0"
+			}
+		},
+		"node_modules/patch-package/node_modules/shebang-regex": {
+			"version": "1.0.0",
+			"resolved": "https://registry.npmjs.org/shebang-regex/-/shebang-regex-1.0.0.tgz",
+			"integrity": "sha512-wpoSFAxys6b2a2wHZ1XpDSgD7N9iVjg29Ph9uV/uaP9Ex/KXlkTZTeddxDPSYQpgvzKLGJke2UU0AzoGCjNIvQ==",
+			"engines": {
+				"node": ">=0.10.0"
+			}
+		},
+		"node_modules/patch-package/node_modules/slash": {
+			"version": "2.0.0",
+			"resolved": "https://registry.npmjs.org/slash/-/slash-2.0.0.tgz",
+			"integrity": "sha512-ZYKh3Wh2z1PpEXWr0MpSBZ0V6mZHAQfYevttO11c51CaWjGTaadiKZ+wVt1PbMlDV5qhMFslpZCemhwOK7C89A==",
+			"engines": {
+				"node": ">=6"
+			}
+		},
+		"node_modules/patch-package/node_modules/which": {
+			"version": "1.3.1",
+			"resolved": "https://registry.npmjs.org/which/-/which-1.3.1.tgz",
+			"integrity": "sha512-HxJdYWq1MTIQbJ3nw0cqssHoTNU267KlrDuGZ1WYlxDStUtKUhOaJmh112/TZmHxxUfuJqPXSOm7tDyas0OSIQ==",
+			"dependencies": {
+				"isexe": "^2.0.0"
+			},
+			"bin": {
+				"which": "bin/which"
+			}
+		},
 		"node_modules/path-exists": {
 			"version": "4.0.0",
 			"resolved": "https://registry.npmjs.org/path-exists/-/path-exists-4.0.0.tgz",
@@ -5595,7 +5821,6 @@
 			"version": "7.2.0",
 			"resolved": "https://registry.npmjs.org/supports-color/-/supports-color-7.2.0.tgz",
 			"integrity": "sha512-qpCAvRl9stuOHveKsn7HncJRvv501qIacKzQlO/+Lwxc9+0q2wLyv4Dfvt80/DPn2pqOBsJdDiogXGR9+OvwRw==",
-			"dev": true,
 			"dependencies": {
 				"has-flag": "^4.0.0"
 			},
@@ -5968,6 +6193,17 @@
 				"@popperjs/core": "^2.9.0"
 			}
 		},
+		"node_modules/tmp": {
+			"version": "0.0.33",
+			"resolved": "https://registry.npmjs.org/tmp/-/tmp-0.0.33.tgz",
+			"integrity": "sha512-jRCJlojKnZ3addtTOjdIqoRuPEKBvNXcGYqzO6zWZX8KfKEpnGY5jfggJQ3EjKuu8D4bJRr0y+cYJFmYbImXGw==",
+			"dependencies": {
+				"os-tmpdir": "~1.0.2"
+			},
+			"engines": {
+				"node": ">=0.6.0"
+			}
+		},
 		"node_modules/to-regex-range": {
 			"version": "5.0.1",
 			"resolved": "https://registry.npmjs.org/to-regex-range/-/to-regex-range-5.0.1.tgz",
@@ -6200,6 +6436,14 @@
 				"url": "https://opencollective.com/unified"
 			}
 		},
+		"node_modules/universalify": {
+			"version": "2.0.0",
+			"resolved": "https://registry.npmjs.org/universalify/-/universalify-2.0.0.tgz",
+			"integrity": "sha512-hAZsKq7Yy11Zu1DE0OzWjw7nnLZmJZYTDZZyEFHZdUhV8FkH5MCfoU1XMaxXovpyW5nq5scPqq0ZDP9Zyl04oQ==",
+			"engines": {
+				"node": ">= 10.0.0"
+			}
+		},
 		"node_modules/update-browserslist-db": {
 			"version": "1.0.10",
 			"resolved": "https://registry.npmjs.org/update-browserslist-db/-/update-browserslist-db-1.0.10.tgz",
@@ -6483,7 +6727,6 @@
 			"version": "1.10.2",
 			"resolved": "https://registry.npmjs.org/yaml/-/yaml-1.10.2.tgz",
 			"integrity": "sha512-r3vXyErRCYJ7wg28yvBY5VSoAF8ZvlcW9/BwUzEtUsjvX/DKs24dIkuwjtuprwJJHsbyUbLApepYTR1BN4uHrg==",
-			"devOptional": true,
 			"engines": {
 				"node": ">= 6"
 			}
@@ -6991,6 +7234,11 @@
 				"eslint-visitor-keys": "^3.3.0"
 			}
 		},
+		"@yarnpkg/lockfile": {
+			"version": "1.1.0",
+			"resolved": "https://registry.npmjs.org/@yarnpkg/lockfile/-/lockfile-1.1.0.tgz",
+			"integrity": "sha512-GpSwvyXOcOOlV70vbnzjj4fW5xW/FdUF6nQEt1ENy7m4ZCczi1+/buVUPAqmGfqznsORNFzUMjctTIp8a9tuCQ=="
+		},
 		"acorn": {
 			"version": "8.8.2",
 			"resolved": "https://registry.npmjs.org/acorn/-/acorn-8.8.2.tgz",
@@ -7051,7 +7299,6 @@
 			"version": "4.3.0",
 			"resolved": "https://registry.npmjs.org/ansi-styles/-/ansi-styles-4.3.0.tgz",
 			"integrity": "sha512-zbB9rCJAT1rbjiVDb2hqKFHNYLxgtk8NURxZ3IZwD3F6NtxbXZQCnnSi1Lkx+IDohdPlFp222wVALIheZJQSEg==",
-			"dev": true,
 			"requires": {
 				"color-convert": "^2.0.1"
 			}
@@ -7144,6 +7391,11 @@
 			"resolved": "https://registry.npmjs.org/asynckit/-/asynckit-0.4.0.tgz",
 			"integrity": "sha512-Oei9OH4tRh0YqU3GxhX79dM/mwVgvbZJaSNaRk+bshkj0S5cfHcgYakreBjrHwatXKbz+IoIdYLxrKim2MjW0Q=="
 		},
+		"at-least-node": {
+			"version": "1.0.0",
+			"resolved": "https://registry.npmjs.org/at-least-node/-/at-least-node-1.0.0.tgz",
+			"integrity": "sha512-+q/t7Ekv1EDY2l6Gda6LLiX14rU9TV20Wa3ofeQmwPFZbOMo9DXrLbOjFaaclkXKWidIaopwAObQDqwWtGUjqg=="
+		},
 		"autoprefixer": {
 			"version": "10.4.14",
 			"resolved": "https://registry.npmjs.org/autoprefixer/-/autoprefixer-10.4.14.tgz",
@@ -7284,7 +7536,6 @@
 			"version": "4.1.2",
 			"resolved": "https://registry.npmjs.org/chalk/-/chalk-4.1.2.tgz",
 			"integrity": "sha512-oKnbhFyRIXpUuez8iBMmyEa4nbj4IOQyuhc/wy9kY7/WVPcwIO9VA668Pu8RkO7+0G76SLROeyw9CpQ061i4mA==",
-			"dev": true,
 			"requires": {
 				"ansi-styles": "^4.1.0",
 				"supports-color": "^7.1.0"
@@ -7330,6 +7581,11 @@
 				}
 			}
 		},
+		"ci-info": {
+			"version": "2.0.0",
+			"resolved": "https://registry.npmjs.org/ci-info/-/ci-info-2.0.0.tgz",
+			"integrity": "sha512-5tK7EtrZ0N+OLFMthtqOj4fI2Jeb88C4CAZPu25LDVUgXJ0A3Js4PMGqrn0JU1W0Mh1/Z8wZzYPxqUrXeBboCQ=="
+		},
 		"classnames": {
 			"version": "2.3.2",
 			"resolved": "https://registry.npmjs.org/classnames/-/classnames-2.3.2.tgz",
@@ -7357,7 +7613,6 @@
 			"version": "2.0.1",
 			"resolved": "https://registry.npmjs.org/color-convert/-/color-convert-2.0.1.tgz",
 			"integrity": "sha512-RRECPsj7iu/xb5oKYcsFHSppFNnsj/52OVTRKb4zP5onXwVF3zVmmToNcOfGC+CRDpfK/U584fMg38ZHCaElKQ==",
-			"dev": true,
 			"requires": {
 				"color-name": "~1.1.4"
 			}
@@ -7365,8 +7620,7 @@
 		"color-name": {
 			"version": "1.1.4",
 			"resolved": "https://registry.npmjs.org/color-name/-/color-name-1.1.4.tgz",
-			"integrity": "sha512-dOy+3AuW3a2wNbZHIuMZpTcgjGuLU/uBL/ubcZF9OXbDo8ff4O8yVp5Bf0efS8uEoYo5q4Fx7dY9OgQGXgAsQA==",
+			"integrity": "sha512-dOy+3AuW3a2wNbZHIuMZpTcgjGuLU/uBL/ubcZF9OXbDo8ff4O8yVp5Bf0efS8uEoYo5q4Fx7dY9OgQGXgAsQA=="
-			"dev": true
 		},
 		"combined-stream": {
 			"version": "1.0.8",
@@ -8268,6 +8522,14 @@
 				"path-exists": "^4.0.0"
 			}
 		},
+		"find-yarn-workspace-root": {
+			"version": "2.0.0",
+			"resolved": "https://registry.npmjs.org/find-yarn-workspace-root/-/find-yarn-workspace-root-2.0.0.tgz",
+			"integrity": "sha512-1IMnbjt4KzsQfnhnzNd8wUEgXZ44IzZaZmnLYx7D5FZlaHt2gW20Cri8Q+E/t5tIj4+epTBub+2Zxu/vNILzqQ==",
+			"requires": {
+				"micromatch": "^4.0.2"
+			}
+		},
 		"flat-cache": {
 			"version": "3.0.4",
 			"resolved": "https://registry.npmjs.org/flat-cache/-/flat-cache-3.0.4.tgz",
@@ -8329,6 +8591,17 @@
 			"integrity": "sha512-MhLuK+2gUcnZe8ZHlaaINnQLl0xRIGRfcGk2yl8xoQAfHrSsL3rYu6FCmBdkdbhc9EPlwyGHewaRsvwRMJtAlA==",
 			"dev": true
 		},
+		"fs-extra": {
+			"version": "9.1.0",
+			"resolved": "https://registry.npmjs.org/fs-extra/-/fs-extra-9.1.0.tgz",
+			"integrity": "sha512-hcg3ZmepS30/7BSFqRvoo3DOMQu7IjqxO5nCDt+zM9XWjb33Wg7ziNT+Qvqbuc3+gWpzO02JubVyk2G4Zvo1OQ==",
+			"requires": {
+				"at-least-node": "^1.0.0",
+				"graceful-fs": "^4.2.0",
+				"jsonfile": "^6.0.1",
+				"universalify": "^2.0.0"
+			}
+		},
 		"fs.realpath": {
 			"version": "1.0.0",
 			"resolved": "https://registry.npmjs.org/fs.realpath/-/fs.realpath-1.0.0.tgz",
@@ -8507,8 +8780,7 @@
 		"has-flag": {
 			"version": "4.0.0",
 			"resolved": "https://registry.npmjs.org/has-flag/-/has-flag-4.0.0.tgz",
-			"integrity": "sha512-EykJT/Q1KjTWctppgIAgfSO0tKVuZUjhgMr17kqTumMl6Afv3EISleU7qZUzoXDFTAHTDC4NOoG/ZxU3EvlMPQ==",
+			"integrity": "sha512-EykJT/Q1KjTWctppgIAgfSO0tKVuZUjhgMr17kqTumMl6Afv3EISleU7qZUzoXDFTAHTDC4NOoG/ZxU3EvlMPQ=="
-			"dev": true
 		},
 		"has-property-descriptors": {
 			"version": "1.0.0",
@@ -8763,6 +9035,14 @@
 			"integrity": "sha512-1BC0BVFhS/p0qtw6enp8e+8OD0UrK0oFLztSjNzhcKA3WDuJxxAPXzPuPtKkjEY9UUoEWlX/8fgKeu2S8i9JTA==",
 			"dev": true
 		},
+		"is-ci": {
+			"version": "2.0.0",
+			"resolved": "https://registry.npmjs.org/is-ci/-/is-ci-2.0.0.tgz",
+			"integrity": "sha512-YfJT7rkpQB0updsdHLGWrvhBJfcfzNNawYDNIyQXJz0IViGf75O8EBPKSdvw2rF+LGCsX4FZ8tcr3b19LcZq4w==",
+			"requires": {
+				"ci-info": "^2.0.0"
+			}
+		},
 		"is-core-module": {
 			"version": "2.11.0",
 			"resolved": "https://registry.npmjs.org/is-core-module/-/is-core-module-2.11.0.tgz",
@@ -8781,6 +9061,11 @@
 				"has-tostringtag": "^1.0.0"
 			}
 		},
+		"is-docker": {
+			"version": "2.2.1",
+			"resolved": "https://registry.npmjs.org/is-docker/-/is-docker-2.2.1.tgz",
+			"integrity": "sha512-F+i2BKsFrH66iaUFc0woD8sLy8getkwTwtOBjvs56Cx4CgJDeKQeqfz8wAYiSb8JOprWhHH5p77PbmYCvvUuXQ=="
+		},
 		"is-extglob": {
 			"version": "2.1.1",
 			"resolved": "https://registry.npmjs.org/is-extglob/-/is-extglob-2.1.1.tgz",
@@ -8889,11 +9174,18 @@
 				"call-bind": "^1.0.2"
 			}
 		},
+		"is-wsl": {
+			"version": "2.2.0",
+			"resolved": "https://registry.npmjs.org/is-wsl/-/is-wsl-2.2.0.tgz",
+			"integrity": "sha512-fKzAra0rGJUUBwGBgNkHZuToZcn+TtXHpeCgmkMJMMYx1sQDYaCSyjJBSCa2nH1DGm7s3n1oBnohoVTBaN7Lww==",
+			"requires": {
+				"is-docker": "^2.0.0"
+			}
+		},
 		"isexe": {
 			"version": "2.0.0",
 			"resolved": "https://registry.npmjs.org/isexe/-/isexe-2.0.0.tgz",
-			"integrity": "sha512-RHxMLp9lnKHGHRng9QFhRCMbYAcVpn69smSGcq3f36xjgVVWThj4qqLbTLlq7Ssj8B+fIQ1EuCEGI2lKsyQeIw==",
+			"integrity": "sha512-RHxMLp9lnKHGHRng9QFhRCMbYAcVpn69smSGcq3f36xjgVVWThj4qqLbTLlq7Ssj8B+fIQ1EuCEGI2lKsyQeIw=="
-			"dev": true
 		},
 		"isomorphic-form-data": {
 			"version": "2.0.0",
@@ -8939,11 +9231,28 @@
 				"minimist": "^1.2.0"
 			}
 		},
+		"jsonfile": {
+			"version": "6.1.0",
+			"resolved": "https://registry.npmjs.org/jsonfile/-/jsonfile-6.1.0.tgz",
+			"integrity": "sha512-5dgndWOriYSm5cnYaJNhalLNDKOqFwyDB/rr1E9ZsGciGvKPs8R2xYGCacuf3z6K1YKDz182fd+fY3cn3pMqXQ==",
+			"requires": {
+				"graceful-fs": "^4.1.6",
+				"universalify": "^2.0.0"
+			}
+		},
 		"kdbush": {
 			"version": "3.0.0",
 			"resolved": "https://registry.npmjs.org/kdbush/-/kdbush-3.0.0.tgz",
 			"integrity": "sha512-hRkd6/XW4HTsA9vjVpY9tuXJYLSlelnkTmVFu4M9/7MIYQtFcHpbugAU7UbOfjOiVSVYl2fqgBuJ32JUmRo5Ew=="
 		},
+		"klaw-sync": {
+			"version": "6.0.0",
+			"resolved": "https://registry.npmjs.org/klaw-sync/-/klaw-sync-6.0.0.tgz",
+			"integrity": "sha512-nIeuVSzdCCs6TDPTqI8w1Yre34sSq7AkZ4B3sfOBbI2CgVSB4Du4aLQijFU2+lhAFCwt9+42Hel6lQNIv6AntQ==",
+			"requires": {
+				"graceful-fs": "^4.1.11"
+			}
+		},
 		"kleur": {
 			"version": "4.1.5",
 			"resolved": "https://registry.npmjs.org/kleur/-/kleur-4.1.5.tgz",
@@ -9638,6 +9947,11 @@
 			"resolved": "https://registry.npmjs.org/next-tick/-/next-tick-1.1.0.tgz",
 			"integrity": "sha512-CXdUiJembsNjuToQvxayPZF9Vqht7hewsvy2sOWafLvi2awflj9mOC6bHIg50orX8IJvWKY9wYQ/zB2kogPslQ=="
 		},
+		"nice-try": {
+			"version": "1.0.5",
+			"resolved": "https://registry.npmjs.org/nice-try/-/nice-try-1.0.5.tgz",
+			"integrity": "sha512-1nh45deeb5olNY7eX82BkPO7SSxR5SSYJiPTrTdFUVYwAl8CKMA5N9PjTYkHiRjisVcxcQ1HXdLhx2qxxJzLNQ=="
+		},
 		"no-case": {
 			"version": "3.0.4",
 			"resolved": "https://registry.npmjs.org/no-case/-/no-case-3.0.4.tgz",
@@ -9721,6 +10035,15 @@
 				"wrappy": "1"
 			}
 		},
+		"open": {
+			"version": "7.4.2",
+			"resolved": "https://registry.npmjs.org/open/-/open-7.4.2.tgz",
+			"integrity": "sha512-MVHddDVweXZF3awtlAS+6pgKLlm/JgxZ90+/NBurBoQctVOOB/zDdVjcyPzQ+0laDGbsWgrRkflI65sQeOgT9Q==",
+			"requires": {
+				"is-docker": "^2.0.0",
+				"is-wsl": "^2.1.1"
+			}
+		},
 		"optionator": {
 			"version": "0.9.1",
 			"resolved": "https://registry.npmjs.org/optionator/-/optionator-0.9.1.tgz",
@@ -9735,6 +10058,11 @@
 				"word-wrap": "^1.2.3"
 			}
 		},
+		"os-tmpdir": {
+			"version": "1.0.2",
+			"resolved": "https://registry.npmjs.org/os-tmpdir/-/os-tmpdir-1.0.2.tgz",
+			"integrity": "sha512-D2FR03Vir7FIu45XBY20mTb+/ZSWB00sjU9jdQXt83gDrI4Ztz5Fs7/yy74g2N5SVQY4xY1qDr4rNddwYRVX0g=="
+		},
 		"p-limit": {
 			"version": "3.1.0",
 			"resolved": "https://registry.npmjs.org/p-limit/-/p-limit-3.1.0.tgz",
@@ -9775,6 +10103,85 @@
 				"tslib": "^2.0.3"
 			}
 		},
+		"patch-package": {
+			"version": "6.5.1",
+			"resolved": "https://registry.npmjs.org/patch-package/-/patch-package-6.5.1.tgz",
+			"integrity": "sha512-I/4Zsalfhc6bphmJTlrLoOcAF87jcxko4q0qsv4bGcurbr8IskEOtdnt9iCmsQVGL1B+iUhSQqweyTLJfCF9rA==",
+			"requires": {
+				"@yarnpkg/lockfile": "^1.1.0",
+				"chalk": "^4.1.2",
+				"cross-spawn": "^6.0.5",
+				"find-yarn-workspace-root": "^2.0.0",
+				"fs-extra": "^9.0.0",
+				"is-ci": "^2.0.0",
+				"klaw-sync": "^6.0.0",
+				"minimist": "^1.2.6",
+				"open": "^7.4.2",
+				"rimraf": "^2.6.3",
+				"semver": "^5.6.0",
+				"slash": "^2.0.0",
+				"tmp": "^0.0.33",
+				"yaml": "^1.10.2"
+			},
+			"dependencies": {
+				"cross-spawn": {
+					"version": "6.0.5",
+					"resolved": "https://registry.npmjs.org/cross-spawn/-/cross-spawn-6.0.5.tgz",
+					"integrity": "sha512-eTVLrBSt7fjbDygz805pMnstIs2VTBNkRm0qxZd+M7A5XDdxVRWO5MxGBXZhjY4cqLYLdtrGqRf8mBPmzwSpWQ==",
+					"requires": {
+						"nice-try": "^1.0.4",
+						"path-key": "^2.0.1",
+						"semver": "^5.5.0",
+						"shebang-command": "^1.2.0",
+						"which": "^1.2.9"
+					}
+				},
+				"path-key": {
+					"version": "2.0.1",
+					"resolved": "https://registry.npmjs.org/path-key/-/path-key-2.0.1.tgz",
+					"integrity": "sha512-fEHGKCSmUSDPv4uoj8AlD+joPlq3peND+HRYyxFz4KPw4z926S/b8rIuFs2FYJg3BwsxJf6A9/3eIdLaYC+9Dw=="
+				},
+				"rimraf": {
+					"version": "2.7.1",
+					"resolved": "https://registry.npmjs.org/rimraf/-/rimraf-2.7.1.tgz",
+					"integrity": "sha512-uWjbaKIK3T1OSVptzX7Nl6PvQ3qAGtKEtVRjRuazjfL3Bx5eI409VZSqgND+4UNnmzLVdPj9FqFJNPqBZFve4w==",
+					"requires": {
+						"glob": "^7.1.3"
+					}
+				},
+				"semver": {
+					"version": "5.7.1",
+					"resolved": "https://registry.npmjs.org/semver/-/semver-5.7.1.tgz",
+					"integrity": "sha512-sauaDf/PZdVgrLTNYHRtpXa1iRiKcaebiKQ1BJdpQlWH2lCvexQdX55snPFyK7QzpudqbCI0qXFfOasHdyNDGQ=="
+				},
+				"shebang-command": {
+					"version": "1.2.0",
+					"resolved": "https://registry.npmjs.org/shebang-command/-/shebang-command-1.2.0.tgz",
+					"integrity": "sha512-EV3L1+UQWGor21OmnvojK36mhg+TyIKDh3iFBKBohr5xeXIhNBcx8oWdgkTEEQ+BEFFYdLRuqMfd5L84N1V5Vg==",
+					"requires": {
+						"shebang-regex": "^1.0.0"
+					}
+				},
+				"shebang-regex": {
+					"version": "1.0.0",
+					"resolved": "https://registry.npmjs.org/shebang-regex/-/shebang-regex-1.0.0.tgz",
+					"integrity": "sha512-wpoSFAxys6b2a2wHZ1XpDSgD7N9iVjg29Ph9uV/uaP9Ex/KXlkTZTeddxDPSYQpgvzKLGJke2UU0AzoGCjNIvQ=="
+				},
+				"slash": {
+					"version": "2.0.0",
+					"resolved": "https://registry.npmjs.org/slash/-/slash-2.0.0.tgz",
+					"integrity": "sha512-ZYKh3Wh2z1PpEXWr0MpSBZ0V6mZHAQfYevttO11c51CaWjGTaadiKZ+wVt1PbMlDV5qhMFslpZCemhwOK7C89A=="
+				},
+				"which": {
+					"version": "1.3.1",
+					"resolved": "https://registry.npmjs.org/which/-/which-1.3.1.tgz",
+					"integrity": "sha512-HxJdYWq1MTIQbJ3nw0cqssHoTNU267KlrDuGZ1WYlxDStUtKUhOaJmh112/TZmHxxUfuJqPXSOm7tDyas0OSIQ==",
+					"requires": {
+						"isexe": "^2.0.0"
+					}
+				}
+			}
+		},
 		"path-exists": {
 			"version": "4.0.0",
 			"resolved": "https://registry.npmjs.org/path-exists/-/path-exists-4.0.0.tgz",
@@ -10318,7 +10725,6 @@
 			"version": "7.2.0",
 			"resolved": "https://registry.npmjs.org/supports-color/-/supports-color-7.2.0.tgz",
 			"integrity": "sha512-qpCAvRl9stuOHveKsn7HncJRvv501qIacKzQlO/+Lwxc9+0q2wLyv4Dfvt80/DPn2pqOBsJdDiogXGR9+OvwRw==",
-			"dev": true,
 			"requires": {
 				"has-flag": "^4.0.0"
 			}
@@ -10536,6 +10942,14 @@
 				"@popperjs/core": "^2.9.0"
 			}
 		},
+		"tmp": {
+			"version": "0.0.33",
+			"resolved": "https://registry.npmjs.org/tmp/-/tmp-0.0.33.tgz",
+			"integrity": "sha512-jRCJlojKnZ3addtTOjdIqoRuPEKBvNXcGYqzO6zWZX8KfKEpnGY5jfggJQ3EjKuu8D4bJRr0y+cYJFmYbImXGw==",
+			"requires": {
+				"os-tmpdir": "~1.0.2"
+			}
+		},
 		"to-regex-range": {
 			"version": "5.0.1",
 			"resolved": "https://registry.npmjs.org/to-regex-range/-/to-regex-range-5.0.1.tgz",
@@ -10703,6 +11117,11 @@
 				"unist-util-is": "^5.0.0"
 			}
 		},
+		"universalify": {
+			"version": "2.0.0",
+			"resolved": "https://registry.npmjs.org/universalify/-/universalify-2.0.0.tgz",
+			"integrity": "sha512-hAZsKq7Yy11Zu1DE0OzWjw7nnLZmJZYTDZZyEFHZdUhV8FkH5MCfoU1XMaxXovpyW5nq5scPqq0ZDP9Zyl04oQ=="
+		},
 		"update-browserslist-db": {
 			"version": "1.0.10",
 			"resolved": "https://registry.npmjs.org/update-browserslist-db/-/update-browserslist-db-1.0.10.tgz",
@@ -10883,8 +11302,7 @@
 		"yaml": {
 			"version": "1.10.2",
 			"resolved": "https://registry.npmjs.org/yaml/-/yaml-1.10.2.tgz",
-			"integrity": "sha512-r3vXyErRCYJ7wg28yvBY5VSoAF8ZvlcW9/BwUzEtUsjvX/DKs24dIkuwjtuprwJJHsbyUbLApepYTR1BN4uHrg==",
+			"integrity": "sha512-r3vXyErRCYJ7wg28yvBY5VSoAF8ZvlcW9/BwUzEtUsjvX/DKs24dIkuwjtuprwJJHsbyUbLApepYTR1BN4uHrg=="
-			"devOptional": true
 		},
 		"yocto-queue": {
 			"version": "0.1.0",

package.json

@@ -28,7 +28,8 @@
 		"svelte-preprocess-sass": "^2.0.1",
 		"tailwindcss": "^3.2.4",
 		"typescript": "^4.9.5",
-		"vite": "^3.2.3"
+		"vite": "^3.2.3",
+		"patch-package": "^6.5.1"
 	},
 	"dependencies": {
 		"@beyonk/svelte-mapbox": "^8.2.0",
@@ -43,6 +44,7 @@
 		"magic-string": "^0.30.0",
 		"mapbox": "^1.0.0-beta10",
 		"mapbox-gl": "^2.10.0",
+		
 		"sorcery": "^0.11.0",
 		"svelte-appwrite-client": "^0.2.3",
 		"svelte-check": "^3.1.4",

src/App.svelte

@@ -1,13 +1,15 @@
 <script lang="ts">
 	import './main.scss'
 	import { i18n, isLoading as localeLoading } from '$lib/locales'
-	import { isLoading as authLoading, user } from '$lib/appwrite'
+	import client, { isLoading as authLoading, databases, user } from '$lib/appwrite'
 	import { onMount } from 'svelte'
 
 	import Routes from './__routes.svelte'
 	/** import CookiesPopUp from '$lib/components/Cookies/CookiesPopUp.svelte' */
 	import { navigate } from '$lib/router'
 	import LocationRequest from '$lib/components/Map/LocationRequest.svelte'
+	import { Models } from 'appwrite'
+	import { UsersAnswersDocument } from '$lib/TStypes/experiences'
 
 	let isMounted = false
 	$: isReady = $localeLoading === false && $authLoading === false && isMounted

src/__routes.svelte

@@ -6,6 +6,7 @@
 	import Error from '$src/__error.svelte'
 	import NavigationBarLayout from '$lib/components/Layouts/NavigationBarLayout.svelte'
 	import ArrowBackLayout from '$lib/components/Layouts/ArrowBackLayout.svelte'
+	import BlankedLayout from '$lib/components/Layouts/BlankedLayout.svelte'
 </script>
 
 <Router
@@ -23,10 +24,7 @@
 			path: '/login',
 			component: () => import('$routes/authorization/login/log_in.svelte'),
 		},
-		{
+
-			path: '/register',
-			component: () => import('$root/src/routes/authorization/register/register.svelte'),
-		},
 		{
 			path: '/register/failed',
 			component: () => import('$routes/authorization/register/registerFailed.svelte'),
@@ -56,6 +54,10 @@
 				path: '/profile/:erantId',
 				component: () => import('$routes/profile/profile.svelte'),
 			},
+			{
+				path: '/map',
+				component: () => import('$routes/map/map.svelte'),
+			},
 		].map((routes) => {
 			return { ...routes, layout: NavigationBarLayout }
 		}),
@@ -67,6 +69,15 @@
 		].map((routes) => {
 			return { ...routes, layout: ArrowBackLayout }
 		}),
+		...[
+			//authorization
+			{
+				path: '/register',
+				component: () => import('$root/src/routes/authorization/register/register.svelte'),
+			},
+		].map((routes) => {
+			return { ...routes, layout: BlankedLayout }
+		}),
 		{
 			path: '/error',
 			component: () => import('$routes/error.svelte'),
@@ -79,10 +90,7 @@
 			path: '/test',
 			component: () => import('$routes/test.svelte'),
 		},*/
-		{
+
-			path: '/map',
-			component: () => import('$root/src/routes/map/map.svelte'),
-		},
 		{
 			path: '/profile/',
 			component: () => import('$src/__error.svelte'),
@@ -100,9 +108,5 @@
 			path: '/cookie-policy',
 			component: () => import('$routes/legal/cookie-policy.svelte'),
 		},
-		{
-			path: '/preferences',
-			component: () => import('$root/src/routes/onboarding/preferencesPage.svelte'),
-		},
 	]}
 />

src/lib/TStypes/experiences.ts

@@ -1,9 +1,6 @@
-export type CheckPoint = {
+import { Models } from 'appwrite'
-	$id: string
+
-	$collectionId: string
+export interface CheckPoint extends Models.Document {
-	$createdAt: string
-	$databaseId: string
-	$permissions: string
 	$updatedAt: string
 	CPAfter: string
 	CPAnswerID: string
@@ -17,13 +14,7 @@ export type CheckPoint = {
 	CPType: 'CHECKBOX' | 'TEXT' | 'INFO' | 'RADIO' | 'NUMBER'
 }
 
-export type Experience = {
+export interface Experience extends Models.Document {
-	$id: string
-	$collectionId: string
-	$createdAt: string
-	$databaseId: string
-	$permissions: string
-	$updatedAt: string
 	ExpApproved: boolean
 	ExpCPsID: string[]
 	ExpCategory?: string
@@ -39,4 +30,35 @@ export type Experience = {
 	ExpURL: string
 	UserID: string
 	checkPoints: Array<CheckPoint>
+	rating: number
+}
+
+export interface ExperienceDocument extends Models.Document {
+	ExpApproved: boolean
+	ExpCPsID: string[]
+	ExpCategory?: string
+	ExpEnd0: string
+	ExpEnd60: string
+	ExpEnd100: string
+	ExpImage?: string
+	ExpIntroduction: string
+	ExpLocation: number[]
+	ExpName: string
+	ExpStart: string
+	ExpTestingCode: string
+	ExpURL: string
+	UserID: string
+	checkPoints: Array<string>
+}
+
+export interface CPAnswerDocument extends Models.Document {
+	CPAnswer: string[]
+}
+
+export interface UsersAnswersDocument extends Models.Document {
+	userId: string
+	checkPoint: string
+	experience: string
+	correct: boolean
+	attemptCount: number
 }

src/lib/TStypes/users.ts

@@ -0,0 +1,10 @@
+export interface Account {
+	userId: string;
+	userName: string;
+	erantId: string;
+	userImage: string;
+	userInterests: string;
+	userRecommended: string;
+	userTravelBuddy: string;
+	termsAccepted: boolean;
+}

src/lib/components/Buttons/Button.svelte

@@ -6,13 +6,12 @@
 	export let href: string = ''
 	export let disabled: boolean = false
 	export let primary: boolean = false
-	export let style: string = ''
 
 	let className = ''
 	export { className as class }
 </script>
 
-<button {disabled} class:disabled {style} on:click={() => navigate(href)} on:click={() => dispatch('submit', true)} on:click class={className} class:primary>
+<button {disabled} class:disabled on:click={() => navigate(href)} on:click={() => dispatch('submit', true)} on:click class={className} class:primary>
 	<slot />
 </button>
 

src/lib/components/Categories/preference.svelte

@@ -1,17 +1,32 @@
 <script lang="ts">
-    export let preferences;
+	import { Img } from "flowbite-svelte"
-    export let onPreferenceSelect;
+  import { createEventDispatcher } from "svelte";
+  const dispatch = createEventDispatcher();
+
+
+    export let name;
+    export let img;
+
   </script>
-  
+
-  <div class="category-3-in-row">
+  <div class="preference">
-    {#each preferences as preference}
       <div
-        class="preference"
+        on:click={() => dispatch('selected')}
-        style="background-image: url({preference.img})"
-        on:click={() => onPreferenceSelect(preference)}
       >
-        <span>{preference.name}</span>
+          <Img alt="sample 1" size="max-w-lg" class="rounded-lg abcd" src={img}/>
+        <span>{name}</span>
       </div>
-    {/each}
   </div>
+
+<style lang="scss">
+  div
+            &.selected {
+                div {
+                    border: 1px dashed #4263eb;
+                    p {
+                    color: #4263eb;
+                    }
+                }
+            }
+</style>
   

src/lib/components/Common/Alert.svelte

@@ -0,0 +1,21 @@
+<script lang="ts">
+	import { Alert } from 'flowbite-svelte'
+	export let color: 'red' | 'yellow' | 'green' | 'purple' | 'pink' | 'blue' | 'light' | 'dark' = 'green'
+	export let dismissable = false
+
+	let className = ''
+	export { className as class }
+</script>
+
+<Alert {...$$restProps} {dismissable} class="mt-4 ml-2 mr-2 absolute top-0 z-50 {className}" {color}>
+	<span slot="icon"><slot name="icon" {color} /></span>
+	<span class="text-lg font-medium"><slot name="title" {color} /></span>
+	<div slot="extra">
+		<div class="mt-2 mb-4 text-sm">
+			<slot {color} />
+		</div>
+		<div class="flex gap-2">
+			<slot name="buttons" {color} />
+		</div>
+	</div>
+</Alert>

src/lib/components/Inputs/Input.svelte

@@ -1,31 +1,208 @@
-<script>
+<script lang="ts">
-	export let value = ''
+	import elementIdGenerator from '$lib/utils/elementIdGenerator'
-	export let type = 'text'
+	import { Input } from 'flowbite-svelte'
-	export let placeholder = ''
+	import { createEventDispatcher, onMount } from 'svelte'
 
-	let className
+	const dispatch = createEventDispatcher()
+	export let value = ''
+	export let placeholder = ''
+	export let id = elementIdGenerator()
+	export let readOnly = false
+	export let maxLength = Infinity
+	export let icon: string | null | boolean | undefined = null
+	export let iconFunction: 'password' = null
+	export let changedIconOnActive = icon
+	export let iconPosition: 'right' | 'left' = 'left'
+
+	//erant-new
+	export let autocomplete = ''
+	export let pattern: RegExp = null
+
+	export let prefix: string = ''
+	export let invisiblePrefix = icon ? true : false
+
+	export let type:
+		| 'color'
+		| 'date'
+		| 'datetime-local'
+		| 'email'
+		| 'file'
+		| 'hidden'
+		| 'image'
+		| 'month'
+		| 'number'
+		| 'password'
+		| 'reset'
+		| 'submit'
+		| 'tel'
+		| 'text'
+		| 'time'
+		| 'url'
+		| 'week'
+		| 'search'
+		| 'textarea' = 'text'
+
+	let className: string = ''
 	export { className as class }
 
-	function typeAction(node) {
+	$: inputValue = /*pattern ? value.replace(pattern, '') :*/ value //this is here because we always want to equal input.value = value
-		node.type = type
+
+	$: prefixControl(inputValue) //when inputValue changes => it will check prefix (so when we do $: inputValue = value this func will trigger every moment when inputValue will change and it will overwhite currect input.value thats will be {value})
+	$: patternControl(inputValue) //when inputValue changes => it will check prefix (so when we do $: inputValue = value this func will trigger every moment when inputValue will change and it will overwhite currect input.value thats will be {value})
+
+	const prefixControl = (_e) => {
+		if (prefix) {
+			if (!invisiblePrefix) {
+				if (inputValue?.indexOf(prefix) !== 0) inputValue = `${prefix}${inputValue}`
+				value = inputValue
+			} else if (inputValue?.indexOf(prefix) !== 0) {
+				value = `${prefix}${inputValue}`
+				//inputValue = value.slice(prefix.length, value.length)
+			} else value = inputValue
+		} else {
+			value = inputValue
+		}
+	}
+
+	const patternControl = (_e) => {
+		inputValue = inputValue.replace(pattern, '')
+	}
+
+	$: console.log(pattern?.test(inputValue))
+
+	let inputElement: HTMLElement = null
+
+	onMount(() => {
+		prefixControl('')
+		patternControl('')
+		inputElement = document.getElementById(id)
+	})
+
+	let iconActived = false
+	let iconPushedCount = 0
+
+	const iconClick = () => {
+		iconPushedCount++
+		iconActived = iconPushedCount % 2 === 1
+		dispatch('iconClick')
+		if (iconFunction === 'password') {
+			type = type === 'text' ? 'password' : 'text'
+			retype(inputElement)
+		}
+	}
+	const retype = (e: HTMLElement) => {
+		e.setAttribute('type', type)
 	}
 </script>
 
-<input bind:value class="input {className}" use:typeAction {placeholder} on:input />
+<div class="relative w-full">
+	{#if icon}
+		<button
+			class={`absolute inset-y-0 ${iconPosition === 'left' ? 'left-0 pl-3' : 'right-0 pr-3'} flex items-center  pointer-events-none ${
+				!iconFunction ? 'pointer-events-none' : 'pointer-events-auto'
+			} z-50 `}
+			on:click={iconClick}
+		>
+			{#if typeof icon === 'string'}
+				{#if iconActived}
+					{changedIconOnActive}
+				{:else}
+					{icon}
+				{/if}
+			{:else}
+				<slot active={iconActived} />
+			{/if}
+		</button>
+	{/if}
 
+	<input
+		use:retype
+		{id}
+		class="input rounded-xl p-4 text-gray-900 border border-gray-300 text-left outline-none appearance-none {icon
+			? iconPosition === 'left'
+				? 'pl-12'
+				: 'pr-12'
+			: ''} {className} {readOnly ? 'cursor-pointer' : ''}"
+		{placeholder}
+		bind:value={inputValue}
+		on:input
+		readonly={readOnly ? true : null}
+		maxlength={maxLength}
+		{...$$restProps}
+		{autocomplete}
+	/>
+</div>
+
+<!--
+{#if icon}
+	{#if iconPosition === 'left'}
+		<Input
+			{autocomplete}
+			{...$$restProps}
+			maxlength={maxLength}
+			readonly={readOnly ? true : null}
+			{id}
+			{type}
+			bind:value={inputValue}
+			class="input rounded-xl p-4 text-gray-900 border border-gray-300 text-left outline-none appearance-none  {className} {readOnly ? 'cursor-pointer' : ''}"
+			color={!podm ? 'red' : null}
+			{placeholder}
+			on:input
+		>
+			<button class={`w-auto ${!iconFunction ? 'pointer-events-none' : 'pointer-events-auto'} z-50 `} on:click={iconClick} slot="left">
+				{#if iconActived}
+					{changedIconOnActive}
+				{:else}
+					{icon}
+				{/if}
+			</button>
+		</Input>
+	{:else}
+		<Input
+			{autocomplete}
+			{...$$restProps}
+			maxlength={maxLength}
+			readonly={readOnly ? true : null}
+			{id}
+			{type}
+			bind:value={inputValue}
+			class="input rounded-xl p-4 text-gray-900 border border-gray-300 text-left outline-none appearance-none  {className} {readOnly ? 'cursor-pointer' : ''}"
+			color={!podm ? 'red' : null}
+			{placeholder}
+			on:input
+		>
+			<button class={`w-auto ${!iconFunction ? 'pointer-events-none' : 'pointer-events-auto'} z-50 `} on:click={iconClick} slot="right">
+				{#if iconActived}
+					{changedIconOnActive}
+				{:else}
+					{icon}
+				{/if}
+			</button>
+		</Input>
+	{/if}
+{:else}
+	<Input
+		{autocomplete}
+		{...$$restProps}
+		maxlength={maxLength}
+		readonly={readOnly ? true : null}
+		{id}
+		{type}
+		bind:value={inputValue}
+		class="input rounded-xl p-4 text-gray-900 border border-gray-300 text-left outline-none appearance-none  {className} {readOnly ? 'cursor-pointer' : ''}"
+		color={!podm ? 'red' : null}
+		{placeholder}
+		on:input
+	/>
+{/if}
+	-->
 <style>
-	input {
+	.input::placeholder {
-		background-color: rgb(232, 232, 232);
+		color: #8f8f8f;
-		color: var(--blue);
+		font-size: 18px;
-		background: white;
+		font-family: 'Source Sans Pro';
-		border: 4px solid var(--blue);
+		font-style: normal;
-		border-radius: 25px;
-		text-align: left;
-		font-size: 30px;
 		font-weight: 600;
-		line-height: 20px;
+		line-height: 28px;
-		padding: 28px 20px;
-		outline: none;
-		appearance: none;
 	}
 </style>

src/lib/components/Layouts/BlankedLayout.svelte

@@ -0,0 +1,6 @@
+<script>
+</script>
+
+<div class="w-full h-full p-2">
+	<slot />
+</div>

src/lib/components/Map/Erantmap.svelte

@@ -3,7 +3,7 @@
 	import Map from './Map.svelte'
 	import { navigate } from 'svelte-routing'
 	import NavigationBarLayout from '../Layouts/NavigationBarLayout.svelte'
-	import { createEventDispatcher, onMount } from 'svelte'
+	import { createEventDispatcher } from 'svelte'
 	import LocationRequest from './LocationRequest.svelte'
 	const dispatch = createEventDispatcher()
 
@@ -12,8 +12,6 @@
 	export let mapComponent = null
 	export let userLocation = { lat: 0, lng: 0 }
 
-	$: console.log(userLocation, center)
-
 	let className = ''
 	export { className as class }
 	/*;(() => {
@@ -43,8 +41,10 @@
 
 	const userCenter = () => {
 		// @ts-ignore
-		document.getElementsByClassName('mapboxgl-ctrl-geolocate')[0].click()
+		if (trigger) trigger()
 	}
+
+	let trigger
 </script>
 
 <LocationRequest />
@@ -54,7 +54,17 @@
 		<Map on:ready={() => setTimeout(() => userCenter(), 100)} {center} bind:mapComponent class={className} on:move>
 			<slot />
 			<GeolocateControl
-				options={{ trackUserLocation: true }}
+				options={{
+					trackUserLocation: true,
+					showUserHeading: true,
+					maximumAge: 1500,
+					positionOptions: {
+						enableHighAccuracy: true,
+					},
+					showUserLocation: true,
+					showAccuracyCircle: false,
+				}}
+				bind:trigger
 				on:trackuserlocationstart={() => {}}
 				on:geolocate={(e) => {
 					// @ts-ignore

src/lib/components/Map/Marker.svelte

@@ -9,7 +9,7 @@
 	export let userLocation = { lat: 0, lng: 0 }
 	export let popup: string | null = null
 
-	export let round = (1 / 110.574 / 1000) * 12 //cca 12m nutno pozměnit!!!!!!!!!! tento komentář nemazat
+	export let round = (1 / 110.574 / 1000) * 30 //cca 12m nutno pozměnit!!!!!!!!!! tento komentář nemazat
 	let Mlat = [lat - round, lat + round]
 	let Mlng = [lng - round, lng + round]
 	$: isIn = userLocation ? userLocation.lat > Mlat[0] && userLocation.lat < Mlat[1] && userLocation.lng > Mlng[0] && userLocation.lng < Mlng[1] : null

src/lib/components/erant/Progressbar.svelte

@@ -0,0 +1,20 @@
+<script lang="ts">
+	import { Progressbar } from 'flowbite-svelte'
+
+	export let max: number
+	export let progress: number
+	export let showWrittenProgress = false
+	export let labelInside: boolean = false
+
+	$: value = JSON.stringify((progress / max) * 100)
+
+	let className = ''
+	export { className as class }
+</script>
+
+<div class={`w-full h-auto flex flex-wrap flex-row justify-center ${className}`}>
+	{#if showWrittenProgress}
+		<span>{progress}/{max}</span>
+	{/if}
+	<Progressbar {labelInside} progress={value} />
+</div>

src/lib/utils/database/experience.ts

@@ -2,8 +2,8 @@ import { databases, user as userStore } from '$lib/appwrite'
 import { Account, Models, Permission, Query, Role } from 'appwrite'
 import database from 'svelte-appwrite-client/src/lib/database'
 import { getLocationDataFromLatAndLong } from '../locations'
-import { writable } from 'svelte/store'
+import { Writable, writable } from 'svelte/store'
-import { CheckPoint, Experience } from '$lib/TStypes/experiences'
+import { CPAnswerDocument, CheckPoint, Experience, UsersAnswersDocument } from '$lib/TStypes/experiences'
 import collections from '$lib/collections'
 
 export type AnswerState = 'wrong-firstTime' | 'wrong-secondTime' | 'correct' | 'not-control' | null
@@ -13,30 +13,38 @@ userStore.subscribe((res) => (user = res))
 
 //Loading of checkpoints and rating is done in the same function to prevent multiple requests to the database
 export const load = async (pathName: string, previewQuestionsCount?: number, preview?: Function) => {
-	const checkPoints: Array<CheckPoint> = []
+	const experience = (await databases.listDocuments<Models.Document & Experience>('63cef30d6da945dd4250', '63cef4bd210fdf2e5888', [Query.equal('ExpURL', pathName)])).documents[0]
-	// @ts-ignore
-	const experience: Experience = (await databases.listDocuments('63cef30d6da945dd4250', '63cef4bd210fdf2e5888', [Query.equal('ExpURL', pathName)])).documents[0]
 
-	const checkPointsIds = experience.ExpCPsID
 	const rating = await getRating(experience.$id)
 
-	for (const checkPointId of checkPointsIds) {
+	const checkPointsDocument = (
-		try {
+		await Promise.all(
-			// @ts-ignore
+			new Array(Math.ceil(experience.ExpCPsID.length / 25)).fill(null).map((_lap, i) => {
-			checkPoints.push(await databases.getDocument('63cef30d6da945dd4250', '63cef84d908acf805758', checkPointId))
+				return databases.listDocuments<Models.Document & CheckPoint>('63cef30d6da945dd4250', '63cef84d908acf805758', [
-			if (checkPointsIds.indexOf(checkPointId) === previewQuestionsCount - 1) {
+					Query.equal('$id', experience.ExpCPsID),
-				experience['rating'] = rating
+					Query.limit(25),
-				experience['checkPoints'] = checkPoints
+					Query.offset(i * 25),
-				preview(experience)
+				])
-			}
+			}),
-		} catch (error) {}
+		)
-	}
+	)
+		.map((listItem) => listItem.documents)
+		.flat()
 
 	experience['rating'] = rating
-	experience['checkPoints'] = checkPoints
+	experience['checkPoints'] = checkPointsDocument
 
 	return experience
 }
+
+export const loadAsStore = (pathName: string, previewQuestionsCount?: number, preview?: Function) => {
+	const store = writable<Experience>(null)
+	load(pathName, previewQuestionsCount, preview).then((experience) => {
+		store.set(experience)
+	})
+	return [store]
+}
+
 //Fetch of Rating
 const getRating = async (expId: string) => {
 	const { documents, total } = await databases.listDocuments('63cef30d6da945dd4250', '63ee6353ebb174cf815d', [Query.equal('ExpID', expId)])
@@ -48,20 +56,22 @@ const getRating = async (expId: string) => {
 export const answer = async (experienceId: string, checkPointId: string, answer: any) => {
 	try {
 		const checkPoint = await databases.getDocument('63cef30d6da945dd4250', '63cef84d908acf805758', checkPointId)
-		console.log({ checkPoint })
 		const { CPType, CPAnswerID } = checkPoint
-		const correctAnswer = (await databases.getDocument('63cef30d6da945dd4250', '63dd5c2b764061e40025', CPAnswerID)).CPAnswer
+		const correctAnswer =
+			CPType !== 'INFO' ? (await databases.getDocument<Models.Document & CPAnswerDocument>('63cef30d6da945dd4250', '63dd5c2b764061e40025', CPAnswerID)).CPAnswer : null
 
 		let correct: boolean = false
 
 		if (CPType === 'CHECKBOX') correct = JSON.stringify(answer) === JSON.stringify(correctAnswer)
-		if (CPType === 'RADIO' || CPType === 'NUMBER' || CPType === 'TEXT') correct = answer === correctAnswer[0]
+		if (CPType === 'RADIO' || CPType === 'NUMBER') correct = answer === correctAnswer[0]
-
+		if (CPType === 'INFO') correct = false
+		if (CPType === 'TEXT') correct = correctAnswer[0].localeCompare(answer, 'en', { sensitivity: 'base' }) === 0
 		await saveAnswerIntoDatabase(experienceId, checkPointId, correct)
 
 		return correct
 	} catch (error) {
 		throw new Error(error)
+
 		//operation only for sveltekit 401, 500, 403
 	}
 }
@@ -84,7 +94,7 @@ const saveAnswerIntoDatabase = async (experienceId: string, checkPointId: string
 					experience: experienceId,
 					attemptCount: 1,
 				},
-				[Permission.read(Role.user(user.$id)), Permission.update(Role.user(user.$id))],
+				[Permission.read(Role.user(user.$id)), Permission.update(Role.user(user.$id)), Permission.delete(Role.user(user.$id))],
 			)
 		}
 	} else {
@@ -131,15 +141,46 @@ export const getExperiencesAsStore = () => {
 }
 
 export const getUserProgress = async (experienceId: string) => {
-	const { documents } = await databases.listDocuments('63cef30d6da945dd4250', 'users-answers', [Query.equal('userId', user.$id), Query.equal('experience', experienceId)])
+	const { documents, total } = await databases.listDocuments<Models.Document & UsersAnswersDocument>('63cef30d6da945dd4250', 'users-answers', [
-	return documents
+		Query.equal('userId', user.$id),
+		Query.equal('experience', experienceId),
+		Query.limit(25),
+		Query.offset(0),
+	])
+
+	const allOtherDocuments = (
+		await Promise.all(
+			new Array(Math.ceil((total - 25) / 25) > 0 ? Math.ceil((total - 25) / 25) : 0)
+				.fill(null)
+				.map((_n, i) =>
+					databases.listDocuments<Models.Document & UsersAnswersDocument>('63cef30d6da945dd4250', 'users-answers', [
+						Query.equal('userId', user.$id),
+						Query.equal('experience', experienceId),
+						Query.limit(25),
+						Query.offset((i + 1) * 25),
+					]),
+				),
+		)
+	).flatMap((list) => list.documents)
+
+	return [...documents, ...allOtherDocuments]
 }
 export const getUserProgressAsStore = (experienceId: string) => {
-	const store = writable<Models.Document[]>([])
+	const store = writable<(Models.Document & UsersAnswersDocument)[]>([])
+	const loading = writable<boolean>(true)
 	getUserProgress(experienceId).then((documents) => {
 		store.set(documents)
+		loading.set(false)
 	})
-	return [store] as const
+	return [store, loading] as const
 }
 
+export const getExperienceIdByUrl = async (url: string) => {
+	return (await databases.listDocuments('63cef30d6da945dd4250', '63cef4bd210fdf2e5888', [Query.equal('ExpURL', url)])).documents[0].$id
+}
+export const getExperienceIdByUrlAsStore = (url: string): [Writable<string>] => {
+	const store = writable<string>(null)
+	getExperienceIdByUrl(url).then((exp) => store.set(exp))
+	return [store]
+}
 // !pridat trideni podle kategorie! export const getExperiencesByCategory = async (category: string) => {}

src/lib/utils/database/preferences.ts

@@ -1,5 +1,6 @@
 import { databases } from '$lib/appwrite';
 import { Query } from 'appwrite';
+import { writable } from 'svelte/store'
 
 // typescript interfaces for objects return definitions
 interface Interest {
@@ -16,14 +17,22 @@ interface Recommendations {
   }
 
   // Define a variable to store the selected preferences
-  let selectedInterests = [];
+  // let selectedInterests = [];
-  let selectedTravelBuddies = [];
+  // let selectedTravelBuddies = [];
-  let selectedRecommendations = [];
+  // let selectedRecommendations = [];
 
 // fetch interests
-export const getInterests = async (): Promise<Interest[]> => {
-    return ((await databases.listDocuments('6417cf1de159d094b370', '6417cf29f2118829b3b4')).documents as unknown as Interest[])};
 
+    export const getInterests = () => {
+      const store = writable<Interest[]>([]) 
+      databases.listDocuments('6417cf1de159d094b370', '6417cf29f2118829b3b4').then(({ documents }) => {
+        // @ts-ignore
+        store.set(documents)
+      })
+    
+      
+      return [store] as const
+    } 
 
 // fetch travel buddies
 export const getTravelBuddies = async (): Promise<TravelBuddies[]> => {
@@ -49,6 +58,7 @@ export const addSelectedPreferences = async (userId, interests, travelBuddies, r
     return updatedUser;
   };
 
+
 //   // Function to update Interests
 //   function updateSelectedInterests(preference) {
 //     if (selectedInterests.includes(preference)) {

src/lib/utils/locations.ts

@@ -1,8 +1,8 @@
 export const getLocationDataFromLatAndLong = async (latitude: number, longitude: number) => {
 	const response = await fetch(`https://nominatim.openstreetmap.org/reverse?lat=${latitude}&lon=${longitude}&format=json`)
-	const data = await response.json()
+	const data = await response.json()	
 	return {
-		city: data.address.town || data.address.city || data.address.village,
+		city: data?.address?.town || data?.address?.city || data?.address?.village,
-		state: data.address.country,
+		state: data?.address?.country,
 	}
 }

src/routes/authorization/Components/EmailSent.svelte

@@ -0,0 +1,144 @@
+<script lang="ts">
+	import { Img, P } from 'flowbite-svelte'
+</script>
+
+<div class="w-full h-full flex flex-wrap flex-col justify-center items-center">
+	<svg width="308" height="269" viewBox="0 0 308 269" fill="none" xmlns="http://www.w3.org/2000/svg">
+		<g clip-path="url(#clip0_2257_46490)">
+			<path
+				d="M15.3136 91.667L0.5108 83.3197C0.311127 74.389 2.29196 65.5444 6.2813 57.5541C9.69415 73.0623 27.6548 80.4407 35.9416 93.9813C38.4939 98.2243 40.0597 102.988 40.5231 107.919C40.9865 112.851 40.3356 117.823 38.6186 122.468L39.5922 134.492C31.9416 132.198 24.8787 128.271 18.8902 122.98C12.9017 117.69 8.12982 111.163 4.90348 103.849C3.13412 99.7278 1.89017 95.3999 1.20101 90.9675C8.1027 91.7028 15.3136 91.667 15.3136 91.667Z"
+				fill="#F2F2F2"
+			/>
+			<path
+				d="M281.418 243.526L281.872 233.308C286.604 230.776 291.881 229.438 297.247 229.412C289.862 235.456 290.785 247.107 285.779 255.235C284.198 257.758 282.07 259.893 279.553 261.481C277.037 263.069 274.195 264.069 271.239 264.408L265.06 268.196C264.212 263.464 264.399 258.603 265.608 253.95C266.817 249.297 269.019 244.961 272.063 241.242C273.791 239.173 275.773 237.329 277.961 235.756C279.441 239.663 281.418 243.526 281.418 243.526Z"
+				fill="#F2F2F2"
+			/>
+			<path d="M265.496 262.938L259.9 262.937L257.238 241.33L265.497 241.33L265.496 262.938Z" fill="#FFB6B6" />
+			<path
+				d="M266.923 268.368L248.881 268.367V268.139C248.881 266.274 249.621 264.486 250.938 263.168C252.255 261.849 254.041 261.108 255.903 261.108L259.199 258.605L265.348 261.109L266.923 261.109L266.923 268.368Z"
+				fill="#2F2E41"
+			/>
+			<path d="M239.5 262.938L233.905 262.937L231.243 241.33L239.502 241.33L239.5 262.938Z" fill="#FFB6B6" />
+			<path
+				d="M240.928 268.368L222.886 268.367V268.139C222.886 266.274 223.626 264.486 224.943 263.168C226.26 261.849 228.046 261.108 229.908 261.108L233.204 258.605L239.353 261.109L240.928 261.109L240.928 268.368Z"
+				fill="#2F2E41"
+			/>
+			<path
+				d="M237.079 144.808L273.474 145.719C280.386 149.477 280.491 157.613 278.226 167.272C278.226 167.272 278.991 173.012 277.461 174.543C275.932 176.074 275.168 176.074 275.932 178.753C276.697 181.433 272.657 185.808 273.148 186.3C273.639 186.791 274.785 189.47 274.785 189.47L270.963 211.286C270.963 211.286 268.287 249.176 267.522 249.941C266.757 250.707 265.993 249.941 266.757 251.855C267.522 253.769 268.287 253.003 267.522 253.769C266.845 254.5 266.207 255.266 265.611 256.065H256.368C256.368 256.065 255.671 252.238 255.671 251.855C255.671 251.472 254.907 249.176 254.907 248.793C254.907 248.41 255.582 247.734 255.582 247.734C255.816 246.956 255.974 246.157 256.054 245.349C256.054 244.583 258.347 215.113 258.347 215.113L253.76 176.84L242.674 214.347C242.674 214.347 242.674 247.262 241.909 248.028C241.145 248.793 241.145 248.41 241.527 249.941C241.909 251.472 243.438 251.09 242.291 252.238C241.145 253.386 240.762 251.472 241.145 253.386L241.527 255.3L230.058 255.464C230.058 255.464 228.529 252.238 229.294 251.09C230.058 249.941 230.012 250.255 229.08 248.376C228.147 246.497 227.765 246.114 228.147 245.731C228.529 245.349 228.529 243.313 228.529 243.313L230.441 206.693C230.441 206.693 230.823 168.037 230.823 166.889C230.852 166.298 230.743 165.709 230.505 165.167V163.608L231.97 158.086L237.079 144.808Z"
+				fill="#2F2E41"
+			/>
+			<path
+				d="M258.941 69.0414C265.187 69.0414 270.25 63.9727 270.25 57.72C270.25 51.4674 265.187 46.3987 258.941 46.3987C252.696 46.3987 247.633 51.4674 247.633 57.72C247.633 63.9727 252.696 69.0414 258.941 69.0414Z"
+				fill="#FFB6B6"
+			/>
+			<path
+				d="M253.287 76.524C250.851 77.974 249.394 80.6383 248.557 83.3493C247.008 88.3685 246.076 93.558 245.781 98.8029L244.897 114.505L233.954 147.94C243.438 155.975 279.088 149.766 279.088 149.766C279.088 149.766 280.182 149.401 279.088 148.306C277.994 147.21 276.928 148.181 278.023 147.085C279.117 145.989 278.363 147.21 277.998 146.114C277.633 145.019 277.998 145.749 278.363 145.384C278.728 145.019 275.539 141.732 275.539 141.732L278.457 122.54L282.105 83.8281C277.727 78.35 268.924 75.1207 268.924 75.1207L266.649 71.0215L255.276 71.9324L253.287 76.524Z"
+				fill="#E6E6E6"
+			/>
+			<path
+				d="M251.737 51.0758C252.174 51.0792 252.61 51.1364 253.033 51.2461C253.869 51.4471 254.717 51.5895 255.572 51.6722C258.189 51.9188 260.649 53.0366 262.558 54.847C264.467 56.6573 265.715 59.0559 266.102 61.6597C266.759 61.0861 268.255 60.0311 269.48 61.0116C269.499 61.0272 269.51 61.0352 269.553 61.0147C270.367 60.6282 271.812 55.8702 271.855 51.6809C271.878 49.4574 271.529 46.618 269.733 45.7189L269.638 45.6715L269.613 45.5685C269.493 45.0684 268.152 44.2146 265.822 43.5501C261.587 42.3424 255.275 39.99 251.72 43.452C251.451 44.6192 250.576 47.1169 249.692 47.4C248.713 47.7134 247.867 47.9838 247.734 49.1861C247.623 50.897 247.631 52.6136 247.758 54.3234C248.09 53.2772 248.741 52.3615 249.62 51.7052C250.245 51.284 250.984 51.0643 251.737 51.0758Z"
+				fill="#2F2E41"
+			/>
+			<path
+				d="M230.689 113.631L249.161 101.788L239.857 89.4055L230.67 100.719L202.046 102.477C201.293 101.732 200.34 101.222 199.303 101.01C198.266 100.798 197.189 100.893 196.205 101.282C195.22 101.672 194.371 102.34 193.759 103.205C193.147 104.07 192.8 105.095 192.76 106.154C192.72 107.213 192.988 108.261 193.532 109.17C194.077 110.079 194.874 110.81 195.826 111.273C196.778 111.736 197.844 111.913 198.894 111.78C199.945 111.647 200.934 111.211 201.741 110.525L230.689 113.631Z"
+				fill="#FFB6B6"
+			/>
+			<path
+				d="M266.305 85.2561C267.377 91.7518 247.132 104.156 247.132 104.156C247.131 102.631 235.048 114.141 234.502 112.877C232.952 109.283 231.862 100.771 229.696 99.4087C228.457 98.6295 237.157 91.3101 237.157 91.3101C237.157 91.3101 241.71 86.7172 247.686 80.9239C249.345 79.2547 251.399 78.0329 253.657 77.3722C255.914 76.7116 258.302 76.6335 260.598 77.1453C260.598 77.1453 265.233 78.7603 266.305 85.2561Z"
+				fill="#E6E6E6"
+			/>
+			<path
+				d="M304.378 116.74L292.16 98.5016L279.992 108.076L291.485 117.032L293.846 145.646C293.118 146.416 292.629 147.38 292.439 148.423C292.249 149.466 292.367 150.541 292.777 151.518C293.187 152.495 293.872 153.332 294.749 153.926C295.626 154.52 296.656 154.846 297.715 154.863C298.773 154.881 299.814 154.59 300.71 154.026C301.606 153.462 302.319 152.649 302.762 151.686C303.204 150.723 303.357 149.652 303.203 148.604C303.048 147.556 302.592 146.575 301.89 145.781L304.378 116.74Z"
+				fill="#FFB6B6"
+			/>
+			<path
+				d="M275.289 81.691C281.753 80.4804 294.568 100.483 294.568 100.483C293.046 100.515 304.796 112.367 303.545 112.939C299.989 114.567 291.512 115.838 290.197 118.035C289.445 119.292 281.952 110.739 281.952 110.739C281.952 110.739 277.269 106.278 271.357 100.419C269.655 98.7941 268.391 96.764 267.684 94.5183C266.976 92.2725 266.848 89.884 267.31 87.5751C267.31 87.5751 268.825 82.9016 275.289 81.691Z"
+				fill="#E6E6E6"
+			/>
+			<path
+				d="M307.5 268.458C307.501 268.529 307.487 268.6 307.46 268.666C307.433 268.732 307.393 268.791 307.342 268.842C307.292 268.892 307.232 268.932 307.166 268.959C307.101 268.986 307.03 269 306.959 269H179.445C179.301 269 179.163 268.943 179.062 268.841C178.96 268.74 178.903 268.602 178.903 268.458C178.903 268.314 178.96 268.176 179.062 268.075C179.163 267.973 179.301 267.916 179.445 267.916H306.959C307.03 267.916 307.101 267.93 307.166 267.957C307.232 267.984 307.292 268.024 307.342 268.074C307.393 268.125 307.433 268.185 307.46 268.25C307.487 268.316 307.501 268.387 307.5 268.458Z"
+				fill="#CCCCCC"
+			/>
+			<path
+				d="M189.373 104.208H34.6166C32.1988 104.211 29.8808 105.174 28.1711 106.885C26.4615 108.597 25.4998 110.918 25.4971 113.338V209.801C25.4998 212.222 26.4615 214.543 28.1712 216.254C29.8808 217.966 32.1988 218.929 34.6166 218.932H189.373C191.79 218.929 194.108 217.966 195.818 216.255C197.528 214.543 198.49 212.222 198.492 209.801V113.338C198.49 110.918 197.528 108.597 195.818 106.885C194.109 105.174 191.791 104.211 189.373 104.208Z"
+				fill="#0094FF"
+			/>
+			<path
+				d="M189.373 104.208H34.6166C32.1988 104.211 29.8808 105.174 28.1711 106.885C26.4615 108.597 25.4998 110.918 25.4971 113.338V209.801C25.4998 212.222 26.4615 214.543 28.1712 216.254C29.8808 217.966 32.1988 218.929 34.6166 218.932H189.373C191.79 218.929 194.108 217.966 195.818 216.255C197.528 214.543 198.49 212.222 198.492 209.801V113.338C198.49 110.918 197.528 108.597 195.818 106.885C194.109 105.174 191.791 104.211 189.373 104.208ZM192.365 173.499C192.328 183.319 188.448 192.734 181.558 199.723C174.667 206.713 165.315 210.72 155.507 210.885C139.804 211.09 164.195 211.17 145.257 211.17C101.95 211.17 56.793 210.756 39.9445 210.487C37.7277 210.441 35.6167 209.53 34.0621 207.947C32.5074 206.364 31.6324 204.236 31.6239 202.016V113.345C31.6247 112.551 31.94 111.788 32.5008 111.226C33.0615 110.663 33.822 110.345 34.616 110.342H189.366C190.16 110.343 190.921 110.659 191.483 111.22C192.045 111.781 192.363 112.543 192.365 113.337V173.499Z"
+				fill="#3F3D56"
+			/>
+			<path
+				d="M170.323 48.6614H52.4147C51.3715 48.6629 50.3541 48.9867 49.5015 49.5886C48.649 50.1905 48.0027 51.0412 47.651 52.0245L29.441 103.174C29.1692 103.937 29.0845 104.755 29.1939 105.558C29.3033 106.361 29.6036 107.126 30.0697 107.789C30.5358 108.451 31.1539 108.992 31.8722 109.366C32.5905 109.74 33.388 109.936 34.1975 109.937L192.331 110.218H192.338C193.175 110.218 193.999 110.01 194.736 109.613C195.473 109.215 196.1 108.641 196.56 107.942C197.021 107.242 197.301 106.439 197.375 105.605C197.45 104.77 197.316 103.93 196.987 103.16L174.971 51.73C174.582 50.8188 173.934 50.0422 173.107 49.4966C172.281 48.951 171.312 48.6606 170.323 48.6614Z"
+				fill="#3F3D56"
+			/>
+			<path
+				d="M197.396 104.271C197.396 104.957 197.256 105.635 196.987 106.266L174.972 145.855C174.58 146.765 173.931 147.539 173.105 148.084C172.279 148.629 171.312 148.919 170.323 148.921H52.4167C51.3731 148.92 50.3552 148.596 49.5019 147.995C48.6487 147.393 48.0016 146.543 47.6489 145.559L29.4423 106.252C29.2192 105.626 29.1215 104.962 29.1548 104.298C29.1882 103.634 29.3519 102.983 29.6367 102.382C29.9214 101.782 30.3216 101.243 30.8144 100.797C31.3072 100.352 31.8829 100.007 32.5086 99.7846C33.0499 99.5889 33.621 99.4888 34.1964 99.4886L53.5131 99.4521L61.3971 99.4385L165.141 99.2563L173.03 99.2426L192.333 99.2062H192.337C193.679 99.2064 194.965 99.7401 195.914 100.69C196.863 101.64 197.396 102.928 197.396 104.271Z"
+				fill="#3F3D56"
+			/>
+			<path
+				d="M46.2178 176.566C48.5559 176.566 80.663 178.531 80.663 180.872C80.663 183.213 48.5559 185.043 46.2178 185.043C45.0951 185.043 44.0182 184.597 43.2243 183.802C42.4304 183.007 41.9844 181.929 41.9844 180.805C41.9844 179.681 42.4304 178.603 43.2243 177.808C44.0182 177.013 45.0951 176.566 46.2178 176.566Z"
+				fill="#3F3D56"
+			/>
+			<path
+				d="M162.98 17.5449H63.5623C60.8979 17.548 58.3435 18.609 56.4596 20.4952C54.5756 22.3814 53.5158 24.9388 53.5127 27.6063V148.921H170.322C171.282 148.924 172.221 148.65 173.029 148.133V27.6063C173.026 24.9388 171.966 22.3814 170.082 20.4952C168.198 18.609 165.644 17.548 162.98 17.5449Z"
+				fill="#E6E6E6"
+			/>
+			<path
+				d="M125.033 25.7024H70.5498C68.1237 25.7048 65.7976 26.6704 64.0817 28.3875C62.3657 30.1046 61.4 32.433 61.3965 34.8619V148.921H165.14V65.8566C165.128 55.2108 160.899 45.0046 153.38 37.4769C145.861 29.9491 135.666 25.7147 125.033 25.7024Z"
+				fill="white"
+			/>
+			<path
+				d="M147.466 138.791H79.071C78.4798 138.791 77.9128 139.026 77.4947 139.445C77.0767 139.863 76.8418 140.431 76.8418 141.023C76.8418 141.615 77.0767 142.182 77.4947 142.601C77.9128 143.019 78.4798 143.255 79.071 143.255H147.466C148.057 143.255 148.624 143.019 149.043 142.601C149.461 142.182 149.695 141.615 149.695 141.023C149.695 140.431 149.461 139.863 149.043 139.445C148.624 139.026 148.057 138.791 147.466 138.791Z"
+				fill="#E4E4E4"
+			/>
+			<path
+				d="M147.467 129.964H79.0713C78.4795 129.964 77.9119 130.199 77.4934 130.618C77.0749 131.037 76.8398 131.606 76.8398 132.198C76.8398 132.791 77.0749 133.359 77.4934 133.778C77.9119 134.197 78.4795 134.432 79.0713 134.432H147.467C148.058 134.432 148.626 134.197 149.044 133.778C149.463 133.359 149.698 132.791 149.698 132.198C149.698 131.606 149.463 131.037 149.044 130.618C148.626 130.199 148.058 129.964 147.467 129.964Z"
+				fill="#E4E4E4"
+			/>
+			<path
+				d="M108.719 121.142H79.071C78.4798 121.142 77.9128 121.377 77.4947 121.795C77.0767 122.214 76.8418 122.781 76.8418 123.373C76.8418 123.965 77.0767 124.533 77.4947 124.952C77.9128 125.37 78.4798 125.605 79.071 125.605H108.719C109.31 125.605 109.877 125.37 110.296 124.952C110.714 124.533 110.948 123.965 110.948 123.373C110.948 122.781 110.714 122.214 110.296 121.795C109.877 121.377 109.31 121.142 108.719 121.142Z"
+				fill="#E4E4E4"
+			/>
+			<path
+				d="M147.467 102.659H79.0713C78.4795 102.659 77.9119 102.894 77.4934 103.313C77.0749 103.732 76.8398 104.3 76.8398 104.893C76.8398 105.485 77.0749 106.054 77.4934 106.473C77.9119 106.891 78.4795 107.127 79.0713 107.127H147.467C148.058 107.127 148.626 106.891 149.044 106.473C149.463 106.054 149.698 105.485 149.698 104.893C149.698 104.3 149.463 103.732 149.044 103.313C148.626 102.894 148.058 102.659 147.467 102.659Z"
+				fill="#E4E4E4"
+			/>
+			<path
+				d="M147.466 93.8362H79.071C78.4798 93.8362 77.9128 94.0713 77.4947 94.4899C77.0767 94.9084 76.8418 95.4761 76.8418 96.068C76.8418 96.6599 77.0767 97.2276 77.4947 97.6461C77.9128 98.0646 78.4798 98.2998 79.071 98.2998H147.466C148.057 98.2998 148.624 98.0646 149.043 97.6461C149.461 97.2276 149.695 96.6599 149.695 96.068C149.695 95.4761 149.461 94.9084 149.043 94.4899C148.624 94.0713 148.057 93.8362 147.466 93.8362Z"
+				fill="#E4E4E4"
+			/>
+			<path
+				d="M108.72 85.0092H79.0713C78.4795 85.0092 77.9119 85.2445 77.4934 85.6635C77.0749 86.0825 76.8398 86.6507 76.8398 87.2432C76.8398 87.8357 77.0749 88.404 77.4934 88.823C77.9119 89.2419 78.4795 89.4773 79.0713 89.4773H108.72C109.311 89.4773 109.879 89.2419 110.297 88.823C110.716 88.404 110.951 87.8357 110.951 87.2432C110.951 86.6507 110.716 86.0825 110.297 85.6635C109.879 85.2445 109.311 85.0092 108.72 85.0092Z"
+				fill="#E4E4E4"
+			/>
+			<path
+				d="M147.467 66.5261H79.0713C78.4795 66.5261 77.9119 66.7615 77.4934 67.1805C77.0749 67.5994 76.8398 68.1677 76.8398 68.7602C76.8398 69.3527 77.0749 69.921 77.4934 70.3399C77.9119 70.7589 78.4795 70.9943 79.0713 70.9943H147.467C148.058 70.9943 148.626 70.7589 149.044 70.3399C149.463 69.921 149.698 69.3527 149.698 68.7602C149.698 68.1677 149.463 67.5994 149.044 67.1805C148.626 66.7615 148.058 66.5261 147.467 66.5261Z"
+				fill="#0094FF"
+			/>
+			<path
+				d="M147.467 57.7037H79.0713C78.4795 57.7037 77.9119 57.9391 77.4934 58.3581C77.0749 58.7771 76.8398 59.3453 76.8398 59.9378C76.8398 60.5303 77.0749 61.0986 77.4934 61.5175C77.9119 61.9365 78.4795 62.1719 79.0713 62.1719H147.467C148.058 62.1719 148.626 61.9365 149.044 61.5175C149.463 61.0986 149.698 60.5303 149.698 59.9378C149.698 59.3453 149.463 58.7771 149.044 58.3581C148.626 57.9391 148.058 57.7037 147.467 57.7037Z"
+				fill="#0094FF"
+			/>
+			<path
+				d="M108.72 48.8767H79.0713C78.4795 48.8767 77.9119 49.1121 77.4934 49.5311C77.0749 49.95 76.8398 50.5183 76.8398 51.1108C76.8398 51.7033 77.0749 52.2715 77.4934 52.6905C77.9119 53.1095 78.4795 53.3449 79.0713 53.3449H108.72C109.311 53.3449 109.879 53.1095 110.297 52.6905C110.716 52.2715 110.951 51.7033 110.951 51.1108C110.951 50.5183 110.716 49.95 110.297 49.5311C109.879 49.1121 109.311 48.8767 108.72 48.8767Z"
+				fill="#0094FF"
+			/>
+			<path
+				d="M169.302 34.764C178.891 34.764 186.664 26.9818 186.664 17.382C186.664 7.7822 178.891 0 169.302 0C159.714 0 151.94 7.7822 151.94 17.382C151.94 26.9818 159.714 34.764 169.302 34.764Z"
+				fill="#0094FF"
+			/>
+			<path
+				d="M166.933 26.4286C166.634 26.4286 166.338 26.3587 166.07 26.2244C165.802 26.0902 165.568 25.8952 165.389 25.655L160.652 19.3321C160.499 19.1291 160.388 18.8978 160.324 18.6515C160.261 18.4053 160.246 18.1488 160.282 17.897C160.317 17.6452 160.402 17.4028 160.532 17.1839C160.661 16.9649 160.832 16.7737 161.035 16.6211C161.238 16.4685 161.47 16.3575 161.716 16.2946C161.962 16.2316 162.218 16.2179 162.47 16.2542C162.721 16.2905 162.963 16.3762 163.181 16.5062C163.4 16.6363 163.59 16.8082 163.742 17.0121L166.841 21.1484L174.8 9.19622C175.084 8.76953 175.526 8.47333 176.028 8.37276C176.53 8.27219 177.052 8.3755 177.478 8.65995C177.904 8.94441 178.2 9.38671 178.3 9.88956C178.401 10.3924 178.298 10.9146 178.014 11.3413L168.541 25.5676C168.369 25.8248 168.139 26.0372 167.868 26.187C167.598 26.3367 167.296 26.4193 166.987 26.428C166.969 26.4283 166.951 26.4286 166.933 26.4286Z"
+				fill="white"
+			/>
+		</g>
+		<defs>
+			<clipPath id="clip0_2257_46490">
+				<rect width="307" height="269" fill="white" transform="translate(0.5)" />
+			</clipPath>
+		</defs>
+	</svg>
+
+	<span class="text-4xl">Mail Sent</span>
+	<span class="text-2xl text-[#00000066] text-center">Verify your account by clicking the link we sent you.</span>
+</div>

src/routes/authorization/Components/SocialLogin.svelte

@@ -0,0 +1,79 @@
+<script lang="ts">
+	import { account, user } from '$lib/appwrite'
+	import GoogleLogo from '$lib/svg/GoogleLogo.svelte'
+
+	const urlFail = `${location.origin}/register/failed`
+	const urlSuccess = `${location.origin}/create/account`
+
+	export let disableLogin = false
+
+	const login = async (platform: 'facebook' | 'google') => {
+		if (disableLogin) return
+		try {
+			await user.deleteSessions()
+		} catch (error) {}
+		user.createOAuth2Session(platform, urlSuccess, urlFail)
+	}
+</script>
+
+<div class="continue_with">
+	<button on:click={() => login('google')}>
+		<GoogleLogo />
+		<p>Continue with Google</p>
+	</button>
+
+	<button on:click on:click={() => login('facebook')}>
+		<p>Continue with Facebook</p>
+	</button>
+</div>
+
+<!--!!!!!!!!!Vím že je to špatně, ale nemuze prestavovat cely kod od znova, to by jsme se vsichni strasne zpozdili-->
+<style lang="scss">
+	.continue_with {
+		width: calc(100% - 48px);
+		margin: 0 auto 0 auto;
+		position: relative;
+		display: flex;
+		flex-direction: column;
+		align-items: center;
+		gap: 20px;
+
+		@media screen and (max-width: 410px) {
+			width: calc(100% - 24px);
+		}
+
+		button {
+			height: 60px;
+			width: 100%;
+
+			display: flex;
+			flex-direction: row;
+			align-items: center;
+			justify-content: center;
+			gap: 16px;
+
+			background-color: #fff;
+			border-radius: 10px;
+			box-shadow: 0px 0px 3px rgba(0, 0, 0, 0.084), 0px 2px 3px rgba(0, 0, 0, 0.168);
+
+			@media screen and (max-width: 410px) {
+				gap: 3.5vw;
+			}
+			p {
+				font-family: 'Source Sans Pro';
+				font-style: normal;
+				font-weight: 600;
+				font-size: 28px;
+				line-height: 36px;
+				color: rgba(0, 0, 0, 0.54);
+
+				@media screen and (max-width: 400px) {
+					font-size: 7.3vw;
+				}
+			}
+		}
+		button:hover {
+			opacity: 70%;
+		}
+	}
+</style>

src/routes/authorization/login/log_in.svelte

@@ -8,6 +8,9 @@
 	import { Helper } from 'flowbite-svelte'
 	import { getErrorMessage } from '../utils/authorizationErrors'
 	import Button from '$lib/components/Buttons/Button.svelte'
+	import SocialLogin from '../Components/SocialLogin.svelte'
+	import Input from '$lib/components/Inputs/Input.svelte'
+	import Eye from '$lib/svg/Eye.svelte'
 
 	export let purpose = 'login' //possible values login, register
 
@@ -20,6 +23,9 @@
 	const emailLogin = async () => {
 		state = 'loading'
 		error = null
+		try {
+			await user.deleteSessions()
+		} catch (error) {}
 		try {
 			await user.createEmailSession(email, password)
 			//if (navigation.canGoBack) navigation.back()
@@ -54,8 +60,18 @@
 			<Helper class="ml-4" color="red">{error}</Helper>
 		{/if}
 		<div class="inform">
-			<input bind:value={email} type="text" placeholder="E-mail" autocomplete="email" required />
+			<Input bind:value={email} type="text" placeholder="E-mail" autocomplete="email" class="p-3 border-1 rounded-[15px] bg-[#eeeeee] text-lg w-full" />
-			<HiddenInput bind:value={password} placeholder="Password" />
+			<Input
+				bind:value={password}
+				let:active
+				iconPosition="right"
+				icon
+				type="password"
+				placeholder="Password"
+				class="p-3 border-1 rounded-[15px] bg-[#eeeeee] text-lg w-full"
+			>
+				<Eye {active} />
+			</Input>
 			<div class="forgot_password">
 				<a href="/forgot-password">Forgot password?</a>
 			</div>
@@ -69,16 +85,7 @@
 		</div>
 	</div>
 
-	<div class="continue_with">
+	<SocialLogin />
-		<button>
-			<GoogleLogo />
-			<p>Continue with Google</p>
-		</button>
-
-		<button on:click={() => account.createOAuth2Session('facebook', `${location.origin}/create/account`, `${location.origin}/register/failed`)}>
-			<p>Continue with Facebook</p>
-		</button>
-	</div>
 
 	<div class="LR_switch">
 		<!--LR switch = login / register switch-->

src/routes/authorization/register/createAccount.svelte

@@ -11,6 +11,7 @@
 				erantId: params.erantId,
 				userName: $user.name,
 				userId: $user.$id,
+				termsAccepted: true,
 			},
 			[Permission.delete(Role.user($user.$id)), Permission.update(Role.user($user.$id)), Permission.read(Role.users('verified'))],
 		)

src/routes/authorization/register/emailVerification.svelte

@@ -14,7 +14,7 @@
 			await user.updateVerification(userId, secret)
 			navigate(`/create/account/${params.erantId}`)
 		} catch (err) {
-			console.log(err)
+			navigate('/')
 		}
 	})()
 </script>

src/routes/authorization/register/register.svelte

@@ -1,5 +1,5 @@
 <script lang="ts">
-	import { account } from '$lib/appwrite'
+	import { account, user } from '$lib/appwrite'
 	import Loading from '$lib/components/Common/Loading.svelte'
 	import HiddenInput from '$lib/components/Inputs/Hidden_Input.svelte'
 	import GoogleLogo from '$lib/svg/GoogleLogo.svelte'
@@ -9,20 +9,28 @@
 	import { ID } from 'appwrite'
 	import { Checkbox, Helper } from 'flowbite-svelte'
 	import Button from '$lib/components/Buttons/Button.svelte'
+	import SocialLogin from '../Components/SocialLogin.svelte'
+	import Input from '$lib/components/Inputs/Input.svelte'
+	import EmailSent from '../Components/EmailSent.svelte'
 
 	let email = ''
 	let password = ''
 	let repeatPassword = ''
 	let name = ''
 	let erantId = ''
-	let policyChecked: boolean = false
+	let termsChecked = false
+	let termsCheckboxShake = false
+	$: if (termsCheckboxShake) setTimeout(() => (termsCheckboxShake = false), 750)
 
 	let state: 'email-sent' | 'register' | 'loading' = 'register'
 	let error: string | null = null
-	$: buttonCodition = name.length > 0 && email.length > 0 && password.length >= 8 && password === repeatPassword && erantId.length > 2 && policyChecked
+	$: buttonCodition = name.length > 0 && email.length > 0 && password.length >= 8 && password === repeatPassword && erantId.length > 2 && termsChecked
 
 	const register = async () => {
 		//if (password === repeatPassword || name.length < 8 || email.length < 8) throw new Error('conditions are not fine')
+		try {
+			await user.deleteSessions()
+		} catch (error) {}
 		try {
 			state = 'loading'
 			error = null
@@ -43,6 +51,8 @@
 			state = 'register'
 		}
 	}
+
+	$: console.log(erantId)
 </script>
 
 {#if state !== 'email-sent'}
@@ -58,15 +68,49 @@
 				<Helper class="ml-4" color="red">{error}</Helper>
 			{/if}
 			<div class="inform">
-				<input bind:value={name} type="text" placeholder="Your name" autocomplete="full-name" required />
+				<Input bind:value={name} placeholder="Your name" autocomplete="full-name" class="p-3 border-1 rounded-[15px] bg-[#eeeeee] text-lg w-full" />
-				<input bind:value={email} type="text" placeholder="Your e-mail" autocomplete="email" required />
+				<Input bind:value={email} placeholder="Your e-mail" autocomplete="email" class="p-3 border-1 rounded-[15px] bg-[#eeeeee] text-lg w-full" />
-				<input bind:value={erantId} type="text" placeholder="@your_nickname" autocomplete="email" required />
+				<div class="w-full">
-				<HiddenInput bind:value={password} placeholder="Password" />
+					<Input
-				<HiddenInput bind:value={repeatPassword} placeholder="Re-type password" />
+						bind:value={erantId}
+						prefix="@"
+						placeholder="your_nickname"
+						class="p-3 border-1 rounded-[15px] bg-[#eeeeee] text-lg w-full"
+						pattern={/[^@a-zA-Z0-9]/g}
+						invisiblePrefix
+						icon="@"
+					/>
+				</div>
+				<Input
+					iconFunction="password"
+					bind:value={password}
+					placeholder="Password"
+					class="p-3 border-1 rounded-[15px] bg-[#eeeeee] text-lg w-full"
+					inputFunction="password"
+					iconPosition="right"
+					icon="eye"
+				/>
+				<div class="w-full">
+					<Input
+						iconFunction="password"
+						bind:value={repeatPassword}
+						placeholder="Re-type password"
+						class="p-3 border-1 rounded-[15px] bg-[#eeeeee] text-lg w-full"
+						inputFunction="password"
+						iconPosition="right"
+						icon="eye"
+					/>
+					{#if password !== repeatPassword && password.length >= 8}
+						<Helper class="flex justify-start w-full pl-4" helperClass="text-sm" color="red">Passwords are not equal</Helper>
+					{/if}
+				</div>
+
 				<div class="flex items-center">
 					<Checkbox
-						bind:checked={policyChecked}
+						bind:checked={termsChecked}
-						class="w-4 h-4 text-blue-600 bg-gray-100 border-gray-300 rounded focus:ring-blue-500 dark:focus:ring-blue-600 dark:ring-offset-gray-800 focus:ring-2 dark:bg-gray-700 dark:border-gray-600"
+						class="w-5 h-5 text-blue-600 bg-gray-100 border-gray-300 rounded focus:ring-blue-500 dark:focus:ring-blue-600 dark:ring-offset-gray-800 focus:ring-2 dark:bg-gray-700 dark:border-gray-600 {termsCheckboxShake
+							? 'animate-bounce border-4 border-red-500'
+							: ''}"
 					/>
 					<label for="link-checkbox" class="ml-2 text-sm font-medium text-gray-900 dark:text-gray-300"
 						>I agree with the <a href="erant.cz/terms-and-conditions" class="text-blue-600 dark:text-blue-500 hover:underline">terms and conditions</a>,
@@ -84,23 +128,19 @@
 			</div>
 		</div>
 
-		<div class="continue_with">
+		<SocialLogin
-			<button on:click={() => account.createOAuth2Session('google', location.origin, `${location.origin}/register/failed`)}>
+			disableLogin={!termsChecked}
-				<GoogleLogo />
+			on:click={() => {
-				<p>Continue with Google</p>
+				if (!termsChecked) termsCheckboxShake = true
-			</button>
+			}}
-
+		/>
-			<button on:click={() => account.createOAuth2Session('facebook', `${location.origin}/`, `${location.origin}/register/failed`)}>
-				<p>Continue with Facebook</p>
-			</button>
-		</div>
 
 		<div class="LR_switch">
 			<p>Already have an account? <a href="/login">Log In</a></p>
 		</div>
 	</div>
 {:else}
-	<div class="w-full h-full flex justify-center items-center absolute">email has been sent</div>
+	<EmailSent />
 {/if}
 
 <style lang="scss">

src/routes/game/Components/Layout.svelte

@@ -3,18 +3,23 @@
 	import Button from '$lib/components/Buttons/Button.svelte'
 	import Image from '$lib/components/Common/Image.svelte'
 	import { createEventDispatcher } from 'svelte'
+	import Loading from '$lib/components/Common/Loading.svelte'
 	const dispatch = createEventDispatcher()
 
 	export let control: 'wrong-firstTime' | 'wrong-secondTime' | 'correct' | 'not-control' | null
-	export let imgSrc
+	export let imgSrc: string = ''
+	export let loading: boolean
+	//
 </script>
 
 <div>
-	<div class="wrap">
+	<div class="wrap mt-2">
-		<div class="h-[var(--quizHeader)] w-full flex relative top-0 justify-center items-center">
+		<div class="w-full flex relative top-0 justify-center items-center">
-			<div class="flex justify-center items-center flex-col flex-wrap gap-3">
+			<div class="flex w-full justify-center items-center flex-col flex-wrap gap-3">
-				<span class="title"><slot name="title" /></span>
+				<span class="title h-min"><slot name="title" /></span>
-				<span style="width: 100%"><Image class="w-full h-[200px]" src={imgSrc} /></span>
+				{#if imgSrc}
+					<span style="width: 100%"><Image class="w-full h-[200px]" src={imgSrc} /></span>
+				{/if}
 			</div>
 		</div>
 		<Section style="height: calc(100% - var(--quizHeader)); position: relative">
@@ -25,7 +30,7 @@
 
 				<div class="flex items-center justify-center flex-col w-full gap-6">
 					<span class="relative"> <slot name="answers" /> </span>
-					<div class="w-full relative  flex justify-center h-fit size">
+					<div class="w-full relative flex justify-center h-fit size">
 						{#if control === 'not-control' || control === null}
 							<span />
 						{:else if control === 'wrong-secondTime' || control === 'correct'}
@@ -41,9 +46,21 @@
 						{/if}
 					</div>
 					{#if control === 'not-control' || control === 'correct' || control === 'wrong-secondTime'}
-						<Button on:submit={() => dispatch('nextQuestion')} primary class="w-3/4 max-w-sm min-w-[400px] h-16 bottom-0 m-10 relative">Na další otázku</Button>
+						<Button on:submit={() => dispatch('nextQuestion')} primary class="w-3/4 max-w-sm min-w-[400px] h-16 bottom-0 m-10 relative">
+							{#if loading}
+								<Loading />
+							{:else}
+								Na další otázku
+							{/if}
+						</Button>
 					{:else if control === 'wrong-firstTime' || control === null}
-						<Button on:submit primary class="w-3/4 max-w-sm min-w-[400px] h-16 bottom-0 m-10 relative">Vyhodnotit</Button>
+						<Button disabled={loading} on:submit primary class="w-3/4 max-w-sm min-w-[400px] h-16 bottom-0 m-10 relative">
+							{#if loading}
+								<Loading />
+							{:else}
+								Vyhodnotit
+							{/if}
+						</Button>
 					{/if}
 				</div>
 			</div>

src/routes/game/Forms/Finish.svelte

@@ -6,12 +6,11 @@
 	export let gameData: Experience
 	export let client
 	let score = (client.points / client.possiblePointsToSeize) * 100
-	console.log(score)
 </script>
 
 <LayoutImg img={gameData.ExpImage}>
 	<div class="w-full h-auto flex flex-wrap flex-row gap-4 justify-center">
-		<div class="h-full w-full flex justify-self-center justify-center text-[32px]  flex-wrap flex-col gap-4 items-center">
+		<div class="h-full w-full flex justify-self-center justify-center text-[32px] flex-wrap flex-col gap-4 items-center">
 			<span> Získali jste {client.points} / {client.possiblePointsToSeize} bodů</span>
 			<span>
 				{#if score > 90}
@@ -23,6 +22,6 @@
 				{/if}
 			</span>
 		</div>
-		<Button class="w-80 mt-8 " on:click={() => navigate(-1)}>ukončit hru</Button>
+		<Button class="w-80 mt-8 " on:click={() => navigate('/')}>ukončit hru</Button>
 	</div>
 </LayoutImg>

src/routes/game/Forms/MultiChoiceForm.svelte

@@ -7,10 +7,9 @@
 	export let checkPoint: CheckPoint
 	export let myAnswer
 
-	export let clear: false | true = false
-	$: if (clear) myAnswers = new Array(checkPoint.CPOptions.length).fill(false)
-
 	let myAnswers = new Array(checkPoint.CPOptions.length).fill(false)
+	export let clear = false
+	$: if (clear) myAnswers = new Array(checkPoint.CPOptions.length).fill(false)
 	$: myAnswer = checkPoint.CPOptions.filter((item, i) => {
 		if (myAnswers[i] === true) return item
 	})

src/routes/game/Forms/Renderer.svelte

@@ -12,11 +12,13 @@
 	import Info from './Info.svelte'
 	import { Experience } from '$lib/TStypes/experiences'
 	import Layout from '../Components/Layout.svelte'
-	import { answer, AnswerState, getUserAnswer } from '$lib/utils/database/experience'
+	import { answer, AnswerState, getUserAnswer, getUserProgressAsStore } from '$lib/utils/database/experience'
-	import { user } from '$lib/appwrite'
+	import client, { user } from '$lib/appwrite'
 	import Button from '$lib/components/Buttons/Button.svelte'
 	import LayoutImg from '$lib/components/Layouts/LayoutImg.svelte'
 	import { Models } from 'appwrite'
+	import { Writable } from 'svelte/store'
+	import { Button as FlowbiteButton } from 'flowbite-svelte'
 
 	const components = {
 		TEXT: TextForm,
@@ -31,14 +33,26 @@
 	export let control: AnswerState = null
 	let view: 'question' | 'map' | 'end' | 'start' | 'start-map' = 'start-map'
 	export let gameData: Experience //data
-	export let userProgress: Models.Document[]
+	export let userProgress
+	//$: [userProgress, userProgressLoading] = getUserProgressAsStore(gameData.$id)
 
 	let client = {
 		//user data about game
-		pos: userProgress.length,
+		pos: 0,
-		end: gameData.checkPoints.length - 1, //kolik otázek
+		end: gameData.ExpCPsID.length - 1, //kolik otázek
-		points: 0, //body
+		points: 0,
-		possiblePointsToSeize: gameData.checkPoints.length * 2,
+		possiblePointsToSeize: new Array(gameData.checkPoints.length).fill(2).reduce((accumulator, currentValue, index) => {
+			if (gameData.checkPoints[index].CPType !== 'INFO') return accumulator + currentValue
+			else return accumulator
+		}),
+	}
+
+	$: if (client.pos < userProgress?.length - 1 + 1) {
+		// nastaví na continue
+		client.pos = userProgress?.length - 1 + 1
+		client.points = userProgress?.map((i) => (i.correct ? 2 : 0))?.reduce((accumulator, currentValue) => accumulator + currentValue)
+
+		view = 'map'
 	}
 
 	$: if (gameData.checkPoints[client.pos].CPType === 'INFO') control = 'not-control'
@@ -53,42 +67,60 @@
 		}
 	}
 
-	//let answers
+	$: checkPoint = gameData.checkPoints[client.pos]
-	//$: if (client.pos < client.end) answers = parseQuestion(gameData.questions[client.pos].answer, gameData.questions[client.pos].type) //delete
+	$: checkPointType = checkPoint?.CPType
+
 	let page = null
-	$: page = view === 'question' ? components[gameData.checkPoints[client.pos].CPType] : null
+	$: page = view === 'question' ? components[checkPointType] : null
 
 	let [lat, lng] = [null, null]
 	$: if (client.pos < client.end) [lat, lng] = view === 'map' ? gameData.checkPoints[client.pos].CPLocation : gameData.ExpLocation
 
 	let userLocation = { lat: 0, lng: 0 }
 
-	$: checkPoint = gameData.checkPoints[client.pos]
 	let myAnswer: string | string[]
 	let clear: boolean = false
+	let answerLoading = false
 
 	const checkAnswer = async () => {
+		answerLoading = true
 		try {
 			const res = await answer(gameData.$id, checkPoint.$id, myAnswer)
-
+			if (checkPointType === 'INFO') {
-			if (res) {
+				nextQuestion()
-				control = 'correct'
+			} else {
-				client.points += 2
+				if (res) {
-			} else if (control === null) {
+					control = 'correct'
-				control = 'wrong-firstTime'
+					client.points += 2
-				clear = true
+				} else if (control === null) {
-			} else control = 'wrong-secondTime'
+					control = 'wrong-firstTime'
-			setTimeout(() => (clear = false), 400)
+					clear = true
+				} else control = 'wrong-secondTime'
+				setTimeout(() => (clear = false), 400)
+			}
 		} catch (error) {
 			console.log(error)
 		}
+		myAnswer = ''
+		answerLoading = false
 	}
+
+	const admins = [
+		'641b2cd262519fdd33ec',
+		'643bfde664ea0c643112',
+		'643bfdd8c64e75d0b8ea',
+		'6427218926d6ab7f8e52',
+		'641d5642c8fa96066cf2',
+		'641b42847ac86f9a306c',
+		'63daafd3355edb14483d',
+	]
 </script>
 
-<input type="number" bind:value={client.pos} />
-<button on:click={() => (view = view === 'start-map' ? 'start' : 'question')}>disappear map</button>
-
 {#if view === 'map' || view === 'start-map'}
+	{#if admins.includes($user.$id)}<!--only if admin-->
+		<FlowbiteButton class="absolute z-50" color="red" on:click={() => (view = view === 'start-map' ? 'start' : 'question')}>disappear map</FlowbiteButton>
+	{/if}
+
 	<Erantmap bind:userLocation class="w-full h-full">
 		<Marker on:enter={() => (view = view === 'start-map' ? 'start' : 'question')} {lat} {lng} {userLocation} />
 	</Erantmap>
@@ -97,7 +129,7 @@
 {#if view === 'start'}
 	<LayoutImg img={gameData.ExpImage}>
 		<div class="w-full h-auto flex flex-wrap flex-row gap-4 justify-center">
-			<div class="h-full w-full flex justify-self-center justify-center text-[32px]  flex-wrap flex-col gap-4 items-center">
+			<div class="h-full w-full flex justify-self-center justify-center text-[32px] flex-wrap flex-col gap-4 items-center">
 				{@html gameData.ExpStart}
 			</div>
 			<Button class="w-80 mt-8 " on:click={() => (view = 'map')}>pokračovat</Button>
@@ -106,7 +138,16 @@
 {/if}
 
 {#if view === 'question'}
-	<Layout imgSrc={'gameData.question.thumbnail'} on:submit={() => checkAnswer()} on:nextQuestion={nextQuestion} {control}>
+	<Layout
+		loading={answerLoading}
+		imgSrc={checkPoint.CPImage}
+		on:submit={() => checkAnswer()}
+		on:nextQuestion={() => {
+			if (checkPointType === 'INFO') checkAnswer()
+			else nextQuestion()
+		}}
+		{control}
+	>
 		<span slot="title">{checkPoint.CPName}</span>
 		<span slot="about">{@html checkPoint.CPText}</span>
 

src/routes/game/experience.svelte

@@ -6,100 +6,115 @@
 	import IconStar from '../../lib/svg/Star.svelte'
 	import IconPoint from '../../lib/svg/Point.svelte'
 	import Loading from '../../lib/components/Common/Loading.svelte'
-	import { data } from '../../lib/stores/stores'
-	import GeolocateControl from '@beyonk/svelte-mapbox/src/lib/map/controls/GeolocateControl.svelte'
 	import Map from '../../lib/components/Map/Map.svelte'
 	import Renderer from './Forms/Renderer.svelte'
 	import Marker from '../../lib/components/Map/Marker.svelte'
-	import { onMount } from 'svelte'
+	import { getExperienceIdByUrlAsStore, getUserProgressAsStore, loadAsStore } from '$lib/utils/database/experience'
-	import { getUserProgressAsStore, load } from '$lib/utils/database/experience'
 	import { getLocationDataFromLatAndLong } from '$lib/utils/locations'
-	import { navigate } from '$lib/router'
 	import { Experience } from '$lib/TStypes/experiences'
+	import Progressbar from '$lib/components/erant/Progressbar.svelte'
+	import { writable } from 'svelte/store'
+	import Alert from '$lib/components/Common/Alert.svelte'
+	import { Button as FlowbiteButton } from 'flowbite-svelte'
+	import { databases, user } from '$lib/appwrite'
+	import { Query } from 'appwrite'
 
 	export let params: { gameurl: string }
-	let gameData: Experience //
+	let gameData = writable<Experience>(null)
-	$: [userProgress] = gameData ? getUserProgressAsStore(gameData?.$id) : []
+	let [id] = getExperienceIdByUrlAsStore(params.gameurl)
-	$: console.log($userProgress)
+	$: [userProgress, userProgressLoading] = $gameData ? getUserProgressAsStore($id) : []
 
-	onMount(async () => {
+	$: [gameData] = $gameData ? [] : loadAsStore(params.gameurl)
-		try {
+	$: if ($gameData && !$userProgressLoading) view = 'experience-preview'
-			gameData = await load(params.gameurl, 2, (preview) => {
-				gameData = preview
-				view = 'experience-preview'
-			})
-		} catch (error) {
-			navigate('/error')
-		}
-	})
-
-	/*$: assets = gameData?.questions
-		?.filter((q) => q.thumbnail !== null)
-		?.slice(0, 8)
-		?.map((q) => q.thumbnail)*/
 
 	let view: 'experience-play' | 'experience-loading' | 'experience-preview' = 'experience-loading'
 
-	//is user already in game
+	const deleteProgress = async () => {
-	//const userInGame = JSON.parse(localStorage.getItem(location.pathname))
+		const documentsToDelete = $userProgress.map(({ $id }) => databases.deleteDocument('63cef30d6da945dd4250', 'users-answers', $id))
-	//$: if (gameData && userInGame) view = 'game-play'
+		const res = await Promise.all(documentsToDelete)
+		deleteProgressAlertVisible = false
+		$userProgress = []
+	}
+
+	let deleteProgressAlertVisible = false
 </script>
 
+{#if deleteProgressAlertVisible}
+	<Alert color="red" let:color>
+		<span slot="title">Delete your progress</span>
+		<div class="text-black">
+			<span>Are you sure that you want to delete your progress in experience {$gameData?.ExpName}</span>
+			<span>Experience Id: {$gameData?.$id}</span>
+			<span>Your current score is: {$userProgress?.length} checkPoints</span>
+		</div>
+		<div slot="buttons">
+			<FlowbiteButton on:click={deleteProgress} {color}>Yes I'm sure</FlowbiteButton>
+			<FlowbiteButton on:click={() => (deleteProgressAlertVisible = false)} outline {color}>No, I missed clicked</FlowbiteButton>
+		</div>
+	</Alert>
+{/if}
+
 {#if view === 'experience-loading'}
-	<h1 class="flex items-center justify-center flex-col">
+	<h1 class="flex items-center justify-center flex-col h-full">
 		<span>Experience is loading...</span>
 		<Loading />
 	</h1>
 {:else if view === 'experience-preview'}
-	<Overlay shareData={{ url: window.location.href }} img={gameData.ExpImage}>
+	<Overlay shareData={{ url: window.location.href }} img={$gameData?.ExpImage}>
 		<div>
-			<span class="text-[36px]">{gameData.ExpName}</span>
+			<span class="text-[36px]">{$gameData?.ExpName}</span>
 			<div class="bubbles">
 				<Bubble background="blue">
 					<span slot="icon"><IconStar /></span>
-					<span> {'gameData.rating'} </span>
+					<span> {$gameData?.rating} </span>
 				</Bubble>
 				<Bubble background="white">
 					<span slot="icon"><IconPoint /></span>
-					{#await getLocationDataFromLatAndLong(gameData.ExpLocation[0], gameData.ExpLocation[1]) then { city }}
+					{#await getLocationDataFromLatAndLong($gameData.ExpLocation[0], $gameData.ExpLocation[1]) then { city }}
 						<span>{city}</span>
 					{/await}
 				</Bubble>
 			</div>
 		</div>
 
-		{#if gameData.ExpIntroduction}
+		{#if $gameData.ExpIntroduction}
-			<Section title="Popis">
+			<Section title="Description">
 				<span>
-					{@html gameData.ExpIntroduction}
+					{@html $gameData.ExpIntroduction}
 				</span>
 			</Section>
 		{/if}
 
-		<Section title="Fotky">
+		<!--<Section title="Fotky">
 			<div class="w-full relative">
 				<div class="px-4 m-auto" style="max-width: var(--max-viewport-width);">
-					<!--<ImageSlider images={assets} />-->
+					<ImageSlider images={assets} />
 				</div>
 			</div>
+		</Section>-->
+		<Section title="Progress">
+			<Progressbar max={$gameData.ExpCPsID.length} progress={$userProgress.length} showWrittenProgress />
 		</Section>
 
 		<div class="w-full relative">
 			<div class="px-4 m-auto" style="max-width: var(--max-viewport-width);">
-				<Map radius class="w-full h-44" center={{ lng: gameData.ExpLocation[1], lat: gameData.ExpLocation[0] }}>
+				<Map radius class="w-full h-44" center={{ lng: $gameData.ExpLocation[1], lat: $gameData.ExpLocation[0] }}>
-					{#each gameData.checkPoints as { CPLocation: [lat, lng] }}
+					{#each $gameData.checkPoints as { CPLocation: [lat, lng] }}
 						<Marker {lat} {lng} />
 					{/each}
 				</Map>
 			</div>
 		</div>
 
-		{#if gameData.checkPoints.length}
+		{#if $gameData.checkPoints.length && !($gameData.ExpCPsID.length === $userProgress.length)}
-			<Button on:click={() => (view = 'experience-play')} primary>Hrát</Button>
+			<Button on:click={() => (view = 'experience-play')} primary>{$userProgress.length ? 'Pokračovat' : 'Hrát'}</Button>
+		{/if}
+		{#if $userProgress.length}
+			<Button class="!bg-red-500" on:click={() => (deleteProgressAlertVisible = true)} primary>resetovat progress</Button>
 		{/if}
 	</Overlay>
 {:else if view === 'experience-play'}
-	<Renderer {gameData} {userProgress} />
+	<Renderer userProgress={$userProgress} gameData={$gameData} />
 {/if}
 
 <style>

src/routes/homepage/homepage.svelte

@@ -1,5 +1,6 @@
 <script>
 	import NavigationBarLayout from '../../lib/components/Layouts/NavigationBarLayout.svelte'
+	import { Img } from "flowbite-svelte"
 	import Discover from './Components/Discover.svelte'
 	import Top from './Components/Top.svelte'
 	import Categories from './Components/Categories.svelte'
@@ -35,7 +36,6 @@
 		})
 	}
 </script>
-
 {#if !fitstTime}
 	<Top headline={city + state} />
 

src/routes/map/map.svelte

@@ -7,31 +7,21 @@
 	import { getExperiencesAsStore } from '$lib/utils/database/experience'
 	import { onMount } from 'svelte'
 
-	let user: { lat: number; lng: number } = { lat: 0, lng: 0 }
+	let userLocation: { lat: number; lng: number } = { lat: 0, lng: 0 }
-	let granted = false
 
-	const lastGame = localStorage.getItem('lastGame')
+	/*const handleLocationGranted = (position: GeolocationPosition) => {
-
+		userLocation = { lat: position.coords.latitude, lng: position.coords.longitude }
-	const handleLocationGranted = (position: GeolocationPosition) => {
-		user = { lat: position.coords.latitude, lng: position.coords.longitude }
 		granted = true
-	}
+	}*/
 
-	navigator.geolocation.getCurrentPosition(handleLocationGranted)
+	//navigator.geolocation.getCurrentPosition(handleLocationGranted)
 
 	$: [experiences] = getExperiencesAsStore()
 </script>
 
-<NavigationBarLayout>
+<!-- Conditionally center on current location if granted is true. -->
-	{#if granted}
+<Erantmap class="w-full h-full" center={{ lng: userLocation.lng, lat: userLocation.lat }}>
-		<!-- Conditionally center on current location if granted is true. -->
+	{#each $experiences as experience}
-		<Erantmap class="w-full h-full" center={{ lng: user.lng, lat: user.lat }} bind:user>
+		<Marker popup={experience.ExpName} on:click={() => navigate(`/${experience.ExpURL}`)} lat={experience.ExpLocation[0]} lng={experience.ExpLocation[1]} {userLocation} />
-			{#each $experiences as experience}
+	{/each}
-				<Marker popup={experience.ExpName} on:click={() => navigate(`/${experience.ExpURL}`)} lat={experience.ExpLocation[0]} lng={experience.ExpLocation[1]} {user} />
+</Erantmap>
-			{/each}
-		</Erantmap>
-	{:else}
-		<!--If not granted, the LocationRequest component is displayed and when it is granted center map. -->
-		<LocationRequest on:locationGranted={() => (granted = true)} />
-	{/if}
-</NavigationBarLayout>

src/routes/onboarding/interestsPage.svelte

@@ -5,7 +5,7 @@
   import collections from '$lib/collections';
   import Loading from '$lib/components/Common/Loading.svelte';
   import Category2InRow from '$lib/components/categories/Category2InRow.svelte';
-  import Category3InRow from '$lib/components/categories/Category3InRow.svelte';
+  import Category3InRow from '$lib/components/Categories/preference.svelte';
   import { getInterests, getTravelBuddies, getRecommendations, addSelectedPreferences } from '$lib/utils/database/preferences';
   import { navigate } from '$lib/router'
   import { onMount } from 'svelte';

src/routes/onboarding/preferencesPage.svelte

@@ -6,6 +6,7 @@
     import { getInterests, getRecommendations, getTravelBuddies, addSelectedPreferences } from '$lib/utils/database/preferences';
     import preference from "$lib/components/Categories/preference.svelte";
   
+  
     let preferences = [];
   
     let selectedPrefId = 1;
@@ -149,12 +150,7 @@
             border-radius: 20px;
             border: 1px solid #4264eb00;
   
-            img {
+            
-              aspect-ratio: 1/1;
-              object-fit: cover;
-              border-radius: 18px;
-              width: 100%;
-            }
   
             p {
               font-weight: 700;
@@ -163,14 +159,7 @@
             }
           }
   
-            &.selected {
+            
-                div {
-                    border: 1px dashed #4263eb;
-                    p {
-                    color: #4263eb;
-                    }
-                }
-            }
         }
       }
     }

src/typography.css

@@ -0,0 +1,214 @@
+
+.display1 {
+    /* Display Large - Source Sans Pro/Regular 64/72 . 0 */
+
+    font-family: 'Source Sans Pro';
+    font-style: normal;
+    font-weight: 600;
+    font-size: 64px;
+    line-height: 72px; /* or 112% */
+    letter-spacing: -0.25px;
+}
+
+.display2{
+    /* Display Medium - Source Sans Pro/Regular 48/56 . 0 */
+
+    font-family: 'Source Sans Pro';
+    font-style: normal;
+    font-weight: 600;
+    font-size: 48px;
+    line-height: 56px; /* or 117% */
+}
+
+.display3{
+    /* Display Small - Source Sans Pro/Regular 40/48 . 0 */
+
+    font-family: 'Source Sans Pro';
+    font-style: normal;
+    font-weight: 600;
+    font-size: 40px;
+    line-height: 48px; /* or 120% */
+}
+
+.h1{
+    /* Headline Large - Source Sans Pro/Regular 32/40 . 0 */
+
+    font-family: 'Source Sans Pro';
+    font-style: normal;
+    font-weight: 600;
+    font-size: 32px;
+    line-height: 40px; /* identical to box height, or 125% */
+}
+
+.h2{
+    /* Headline Medium - Source Sans Pro/Regular 28/36 . 0 */
+
+    font-family: 'Source Sans Pro';
+    font-style: normal;
+    font-weight: 600;
+    font-size: 28px;
+    line-height: 36px; /* identical to box height, or 129% */
+}
+
+.h3{
+    /* Headline Small - Source Sans Pro/Regular 24/32 . 0 */
+
+    font-family: 'Source Sans Pro';
+    font-style: normal;
+    font-weight: 600;
+    font-size: 24px;
+    line-height: 32px; /* identical to box height, or 133% */
+}
+
+.title1{
+    /* Title Large - Source Sans Pro/Medium 22/28 . +0.4 */
+
+    font-family: 'Source Sans Pro';
+    font-style: normal;
+    font-weight: 600;
+    font-size: 24px;
+    line-height: 30px; /* identical to box height, or 125% */
+    letter-spacing: 0.5px;
+}
+
+.title2{
+    /* Title Medium - Source Sans Pro/Medium 16/24 . +0.16 */
+
+    font-family: 'Source Sans Pro';
+    font-style: normal;
+    font-weight: 600;
+    font-size: 16px;
+    line-height: 24px; /* identical to box height, or 150% */
+    letter-spacing: 0.2px;
+}
+
+.title3{
+    /* Title Small - Source Sans Pro/Medium 14/20 . +0.12 */
+
+    font-family: 'Source Sans Pro';
+    font-style: normal;
+    font-weight: 600;
+    font-size: 14px;
+    line-height: 20px; /* identical to box height, or 143% */
+    letter-spacing: 0.16px;
+}
+
+.label1{
+    /* Label Large - Source Sans Pro/Medium 16/24 . +0.2 */
+
+    font-family: 'Source Sans Pro';
+    font-style: normal;
+    font-weight: 600;
+    font-size: 18px;
+    line-height: 28px; /* identical to box height, or 156% */
+    letter-spacing: 0.2px;
+}
+
+.label2{
+    /* Label Medium - Source Sans Pro/Medium 14/20 . +0.4 */
+
+    font-family: 'Source Sans Pro';
+    font-style: normal;
+    font-weight: 600;
+    font-size: 16px;
+    line-height: 24px; /* identical to box height, or 150% */
+    letter-spacing: 0.4px;
+}
+
+.label3{
+    /* Label Small - Source Sans Pro/Medium 12/16 . +0.6 */
+
+    font-family: 'Source Sans Pro';
+    font-style: normal;
+    font-weight: 600;
+    font-size: 14px;
+    line-height: 20px; /* identical to box height, or 143% */
+    letter-spacing: 0.6px;
+}
+
+.body1{
+    /* Body Large - Source Sans Pro/Regular 16/24 . 0 */
+
+    font-family: 'Source Sans Pro';
+    font-style: normal;
+    font-weight: 400;
+    font-size: 16px;
+    line-height: 24px; /* identical to box height, or 150% */
+}
+
+.body2{
+    /* Body Medium - Source Sans Pro/Regular 14/20 . 0 */
+
+    font-family: 'Source Sans Pro';
+    font-style: normal;
+    font-weight: 400;
+    font-size: 14px;
+    line-height: 20px; /* identical to box height, or 143% */
+    letter-spacing: 0.08px;
+}
+
+.body3{
+    /* Body Small - Source Sans Pro/Regular 12/16 . 0 */
+
+    font-family: 'Source Sans Pro';
+    font-style: normal;
+    font-weight: 400;
+    font-size: 12px;
+    line-height: 16px; /* identical to box height, or 133% */
+    letter-spacing: 0.2px;
+}
+
+.overline{
+    /* Overline - Source Sans Pro/Regular 12/16 . 0 */
+
+    font-family: 'Source Sans Pro';
+    font-style: normal;
+    font-weight: 400;
+    font-size: 12px;
+    line-height: 16px; /* identical to box height, or 133% */
+    letter-spacing: 0.8px;
+    text-transform: uppercase;
+}
+
+.caption{
+    /* Caption - Source Sans Pro/Regular 12/16 . 0 */
+
+    font-family: 'Source Sans Pro';
+    font-style: normal;
+    font-weight: 400;
+    font-size: 12px;
+    line-height: 16px; /* identical to box height, or 133% */
+    letter-spacing: 0.5px;
+}
+
+.redacted1{
+    /* Redacted Large */
+
+    font-family: 'Redacted Script';
+    font-style: normal;
+    font-weight: 400;
+    font-size: 16px;
+    line-height: 24px; /* identical to box height, or 150% */
+}
+
+.redacted2{
+    /* Redacted Medium */
+
+    font-family: 'Redacted Script';
+    font-style: normal;
+    font-weight: 400;
+    font-size: 14px;
+    line-height: 20px; /* identical to box height, or 143% */
+    letter-spacing: 0.08px;
+}
+
+.redacted3{
+    /* Redacted Small */
+
+    font-family: 'Redacted Script';
+    font-style: normal;
+    font-weight: 400;
+    font-size: 12px;
+    line-height: 16px; /* identical to box height, or 133% */
+    letter-spacing: 0.2px;
+}