From d1b3c08c9d138f5fb1e934b525e897a45eec8ada Mon Sep 17 00:00:00 2001
From: Elgius <114131653+Elgius@users.noreply.github.com>
Date: Wed, 5 Apr 2023 13:09:29 +0500
Subject: [PATCH] login page rough draft

---
 myapp/package-lock.json               | 108 +++++++++++++++++++++++++-
 myapp/package.json                    |   4 +-
 myapp/src/routes/+page.svelte         |  35 +++++++--
 myapp/src/routes/login/+layout.svelte |   5 ++
 myapp/src/routes/login/+page.svelte   |  16 ++++
 5 files changed, 155 insertions(+), 13 deletions(-)
 create mode 100644 myapp/src/routes/login/+layout.svelte
 create mode 100644 myapp/src/routes/login/+page.svelte

diff --git a/myapp/package-lock.json b/myapp/package-lock.json
index 6e50eab..f94a4cc 100644
--- a/myapp/package-lock.json
+++ b/myapp/package-lock.json
@@ -8,7 +8,9 @@
 			"name": "myapp",
 			"version": "0.0.1",
 			"dependencies": {
-				"daisyui": "^2.51.5"
+				"@iconify/svelte": "^3.1.0",
+				"daisyui": "^2.51.5",
+				"react-icons": "^4.8.0"
 			},
 			"devDependencies": {
 				"@playwright/test": "^1.28.1",
@@ -468,6 +470,25 @@
 			"integrity": "sha512-ZnQMnLV4e7hDlUvw8H+U8ASL02SS2Gn6+9Ac3wGGLIe7+je2AeAOxPY+izIPJDfFDb7eDjev0Us8MO1iFRN8hA==",
 			"dev": true
 		},
+		"node_modules/@iconify/svelte": {
+			"version": "3.1.0",
+			"resolved": "https://registry.npmjs.org/@iconify/svelte/-/svelte-3.1.0.tgz",
+			"integrity": "sha512-G1w1dcO7eiD+JmQJNwNW4qnAn86oQxKLe1P/iAPjJ0qYYuF7Pb60TPrlcj4+2gu4SXe3a0Jrv++8YmceG+gX/g==",
+			"dependencies": {
+				"@iconify/types": "^2.0.0"
+			},
+			"funding": {
+				"url": "https://github.com/sponsors/cyberalien"
+			},
+			"peerDependencies": {
+				"svelte": ">=3"
+			}
+		},
+		"node_modules/@iconify/types": {
+			"version": "2.0.0",
+			"resolved": "https://registry.npmjs.org/@iconify/types/-/types-2.0.0.tgz",
+			"integrity": "sha512-+wluvCrRhXrhyOmRDJ3q8mux9JkKy5SJ/v8ol2tu4FVjyYvtEzkc/3pK15ET6RKg4b4w4BmTk1+gsCUhf21Ykg=="
+		},
 		"node_modules/@jridgewell/sourcemap-codec": {
 			"version": "1.4.14",
 			"resolved": "https://registry.npmjs.org/@jridgewell/sourcemap-codec/-/sourcemap-codec-1.4.14.tgz",
@@ -1753,6 +1774,12 @@
 				"url": "https://opencollective.com/js-sdsl"
 			}
 		},
+		"node_modules/js-tokens": {
+			"version": "4.0.0",
+			"resolved": "https://registry.npmjs.org/js-tokens/-/js-tokens-4.0.0.tgz",
+			"integrity": "sha512-RdJUflcE3cUzKiMqQgsCu06FPu9UdIJO0beYbPhHN4k6apgJtifcoCtT9bcxOpYBtpD2kCM6Sbzg4CausW/PKQ==",
+			"peer": true
+		},
 		"node_modules/js-yaml": {
 			"version": "4.1.0",
 			"resolved": "https://registry.npmjs.org/js-yaml/-/js-yaml-4.1.0.tgz",
@@ -1845,6 +1872,18 @@
 			"integrity": "sha512-0KpjqXRVvrYyCsX1swR/XTK0va6VQkQM6MNo7PqW77ByjAhoARA8EfrP1N4+KlKj8YS0ZUCtRT/YUuhyYDujIQ==",
 			"dev": true
 		},
+		"node_modules/loose-envify": {
+			"version": "1.4.0",
+			"resolved": "https://registry.npmjs.org/loose-envify/-/loose-envify-1.4.0.tgz",
+			"integrity": "sha512-lyuxPGr/Wfhrlem2CL/UcnUc1zcqKAImBDzukY7Y5F/yQiNdko6+fRLevlw1HgMySw7f611UIY408EtxRSoK3Q==",
+			"peer": true,
+			"dependencies": {
+				"js-tokens": "^3.0.0 || ^4.0.0"
+			},
+			"bin": {
+				"loose-envify": "cli.js"
+			}
+		},
 		"node_modules/loupe": {
 			"version": "2.3.6",
 			"resolved": "https://registry.npmjs.org/loupe/-/loupe-2.3.6.tgz",
@@ -2347,6 +2386,26 @@
 				"url": "https://github.com/sponsors/sindresorhus"
 			}
 		},
+		"node_modules/react": {
+			"version": "18.2.0",
+			"resolved": "https://registry.npmjs.org/react/-/react-18.2.0.tgz",
+			"integrity": "sha512-/3IjMdb2L9QbBdWiW5e3P2/npwMBaU9mHCSCUzNln0ZCYbcfTsGbTJrU/kGemdH2IWmB2ioZ+zkxtmq6g09fGQ==",
+			"peer": true,
+			"dependencies": {
+				"loose-envify": "^1.1.0"
+			},
+			"engines": {
+				"node": ">=0.10.0"
+			}
+		},
+		"node_modules/react-icons": {
+			"version": "4.8.0",
+			"resolved": "https://registry.npmjs.org/react-icons/-/react-icons-4.8.0.tgz",
+			"integrity": "sha512-N6+kOLcihDiAnj5Czu637waJqSnwlMNROzVZMhfX68V/9bu9qHaMIJC4UdozWoOk57gahFCNHwVvWzm0MTzRjg==",
+			"peerDependencies": {
+				"react": "*"
+			}
+		},
 		"node_modules/read-cache": {
 			"version": "1.0.0",
 			"resolved": "https://registry.npmjs.org/read-cache/-/read-cache-1.0.0.tgz",
@@ -2642,7 +2701,6 @@
 			"version": "3.58.0",
 			"resolved": "https://registry.npmjs.org/svelte/-/svelte-3.58.0.tgz",
 			"integrity": "sha512-brIBNNB76mXFmU/Kerm4wFnkskBbluBDCjx/8TcpYRb298Yh2dztS2kQ6bhtjMcvUhd5ynClfwpz5h2gnzdQ1A==",
-			"dev": true,
 			"engines": {
 				"node": ">= 8"
 			}
@@ -3252,6 +3310,19 @@
 			"integrity": "sha512-ZnQMnLV4e7hDlUvw8H+U8ASL02SS2Gn6+9Ac3wGGLIe7+je2AeAOxPY+izIPJDfFDb7eDjev0Us8MO1iFRN8hA==",
 			"dev": true
 		},
+		"@iconify/svelte": {
+			"version": "3.1.0",
+			"resolved": "https://registry.npmjs.org/@iconify/svelte/-/svelte-3.1.0.tgz",
+			"integrity": "sha512-G1w1dcO7eiD+JmQJNwNW4qnAn86oQxKLe1P/iAPjJ0qYYuF7Pb60TPrlcj4+2gu4SXe3a0Jrv++8YmceG+gX/g==",
+			"requires": {
+				"@iconify/types": "^2.0.0"
+			}
+		},
+		"@iconify/types": {
+			"version": "2.0.0",
+			"resolved": "https://registry.npmjs.org/@iconify/types/-/types-2.0.0.tgz",
+			"integrity": "sha512-+wluvCrRhXrhyOmRDJ3q8mux9JkKy5SJ/v8ol2tu4FVjyYvtEzkc/3pK15ET6RKg4b4w4BmTk1+gsCUhf21Ykg=="
+		},
 		"@jridgewell/sourcemap-codec": {
 			"version": "1.4.14",
 			"resolved": "https://registry.npmjs.org/@jridgewell/sourcemap-codec/-/sourcemap-codec-1.4.14.tgz",
@@ -4177,6 +4248,12 @@
 			"integrity": "sha512-FfVSdx6pJ41Oa+CF7RDaFmTnCaFhua+SNYQX74riGOpl96x+2jQCqEfQ2bnXu/5DPCqlRuiqyvTJM0Qjz26IVg==",
 			"dev": true
 		},
+		"js-tokens": {
+			"version": "4.0.0",
+			"resolved": "https://registry.npmjs.org/js-tokens/-/js-tokens-4.0.0.tgz",
+			"integrity": "sha512-RdJUflcE3cUzKiMqQgsCu06FPu9UdIJO0beYbPhHN4k6apgJtifcoCtT9bcxOpYBtpD2kCM6Sbzg4CausW/PKQ==",
+			"peer": true
+		},
 		"js-yaml": {
 			"version": "4.1.0",
 			"resolved": "https://registry.npmjs.org/js-yaml/-/js-yaml-4.1.0.tgz",
@@ -4245,6 +4322,15 @@
 			"integrity": "sha512-0KpjqXRVvrYyCsX1swR/XTK0va6VQkQM6MNo7PqW77ByjAhoARA8EfrP1N4+KlKj8YS0ZUCtRT/YUuhyYDujIQ==",
 			"dev": true
 		},
+		"loose-envify": {
+			"version": "1.4.0",
+			"resolved": "https://registry.npmjs.org/loose-envify/-/loose-envify-1.4.0.tgz",
+			"integrity": "sha512-lyuxPGr/Wfhrlem2CL/UcnUc1zcqKAImBDzukY7Y5F/yQiNdko6+fRLevlw1HgMySw7f611UIY408EtxRSoK3Q==",
+			"peer": true,
+			"requires": {
+				"js-tokens": "^3.0.0 || ^4.0.0"
+			}
+		},
 		"loupe": {
 			"version": "2.3.6",
 			"resolved": "https://registry.npmjs.org/loupe/-/loupe-2.3.6.tgz",
@@ -4552,6 +4638,21 @@
 			"resolved": "https://registry.npmjs.org/quick-lru/-/quick-lru-5.1.1.tgz",
 			"integrity": "sha512-WuyALRjWPDGtt/wzJiadO5AXY+8hZ80hVpe6MyivgraREW751X3SbhRvG3eLKOYN+8VEvqLcf3wdnt44Z4S4SA=="
 		},
+		"react": {
+			"version": "18.2.0",
+			"resolved": "https://registry.npmjs.org/react/-/react-18.2.0.tgz",
+			"integrity": "sha512-/3IjMdb2L9QbBdWiW5e3P2/npwMBaU9mHCSCUzNln0ZCYbcfTsGbTJrU/kGemdH2IWmB2ioZ+zkxtmq6g09fGQ==",
+			"peer": true,
+			"requires": {
+				"loose-envify": "^1.1.0"
+			}
+		},
+		"react-icons": {
+			"version": "4.8.0",
+			"resolved": "https://registry.npmjs.org/react-icons/-/react-icons-4.8.0.tgz",
+			"integrity": "sha512-N6+kOLcihDiAnj5Czu637waJqSnwlMNROzVZMhfX68V/9bu9qHaMIJC4UdozWoOk57gahFCNHwVvWzm0MTzRjg==",
+			"requires": {}
+		},
 		"read-cache": {
 			"version": "1.0.0",
 			"resolved": "https://registry.npmjs.org/read-cache/-/read-cache-1.0.0.tgz",
@@ -4750,8 +4851,7 @@
 		"svelte": {
 			"version": "3.58.0",
 			"resolved": "https://registry.npmjs.org/svelte/-/svelte-3.58.0.tgz",
-			"integrity": "sha512-brIBNNB76mXFmU/Kerm4wFnkskBbluBDCjx/8TcpYRb298Yh2dztS2kQ6bhtjMcvUhd5ynClfwpz5h2gnzdQ1A==",
-			"dev": true
+			"integrity": "sha512-brIBNNB76mXFmU/Kerm4wFnkskBbluBDCjx/8TcpYRb298Yh2dztS2kQ6bhtjMcvUhd5ynClfwpz5h2gnzdQ1A=="
 		},
 		"svelte-hmr": {
 			"version": "0.15.1",
diff --git a/myapp/package.json b/myapp/package.json
index c369032..178e4dc 100644
--- a/myapp/package.json
+++ b/myapp/package.json
@@ -29,6 +29,8 @@
 	},
 	"type": "module",
 	"dependencies": {
-		"daisyui": "^2.51.5"
+		"@iconify/svelte": "^3.1.0",
+		"daisyui": "^2.51.5",
+		"react-icons": "^4.8.0"
 	}
 }
diff --git a/myapp/src/routes/+page.svelte b/myapp/src/routes/+page.svelte
index c75c241..6f77bcb 100644
--- a/myapp/src/routes/+page.svelte
+++ b/myapp/src/routes/+page.svelte
@@ -1,10 +1,29 @@
-<h1 class= 'text-3xl font-bold underline text-center'>
-    hello world
-</h1>
+<script>
+	// import {Icon} from '@iconify/svelte';
+	// import {FaTelegramPlane} from 'svelte-icons/fa';
+</script>
 
+<section>
+	<div class="container">
+		<div class="text-center my-40">
+			<h1 class="text-3xl sm:text-4xl font-bold">Honesty</h1>
+			<sub class="text-sm">By Fishie</sub>
+		</div>
+	</div>
+	<div class="p-10 sm:p-20" />
+	<div class="p-10" />
 
-<style lang='postcss'>
-    :global(html){
-        background-color: theme('colors.gray.100');
-    }
-</style>
\ No newline at end of file
+	<footer class="container mx-auto">
+		<div class="flex justify-center items-center">
+			<button class="btn btn-error">
+				<a href="">Login via Telegram</a>
+			</button>
+		</div>
+	</footer>
+</section>
+
+<!-- TODO:
+1. make it responsive
+2. decide font
+3. work on padding and Margins
+ -->
diff --git a/myapp/src/routes/login/+layout.svelte b/myapp/src/routes/login/+layout.svelte
new file mode 100644
index 0000000..0ad60c3
--- /dev/null
+++ b/myapp/src/routes/login/+layout.svelte
@@ -0,0 +1,5 @@
+<script>
+    import '../app.css'
+</script>
+
+<slot />
\ No newline at end of file
diff --git a/myapp/src/routes/login/+page.svelte b/myapp/src/routes/login/+page.svelte
new file mode 100644
index 0000000..bd7c9c2
--- /dev/null
+++ b/myapp/src/routes/login/+page.svelte
@@ -0,0 +1,16 @@
+<style>
+.title{
+    color: red;
+    font-size: 20px;
+}
+</style>
+
+<script>
+
+</script>
+
+<div>
+<h1 class="title">
+    hello page 1
+</h1>
+</div>
\ No newline at end of file