login page rough draft

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>
+	<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
+ -->

myapp/src/routes/login/+layout.svelte

@@ -0,0 +1,5 @@
+<script>
+    import '../app.css'
+</script>
+
+<slot />

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>