|
@@ -0,0 +1,46 @@
|
|
|
+<template>
|
|
|
+ <div class="flex items-center justify-center min-h-screen bg-gray-800">
|
|
|
+ <div class="bg-white p-8 rounded-lg shadow-lg w-full max-w-md">
|
|
|
+ <h2 class="text-2xl font-bold mb-6 text-gray-800">Login</h2>
|
|
|
+ <form>
|
|
|
+ <div class="mb-4">
|
|
|
+ <label for="username" class="block text-gray-700 font-bold mb-2">Username</label>
|
|
|
+ <input
|
|
|
+ type="text"
|
|
|
+ id="username"
|
|
|
+ class="shadow appearance-none border rounded w-full py-2 px-3 text-gray-700 leading-tight focus:outline-none focus:shadow-outline"
|
|
|
+ placeholder="Enter your username"
|
|
|
+ />
|
|
|
+ </div>
|
|
|
+ <div class="mb-6">
|
|
|
+ <label for="password" class="block text-gray-700 font-bold mb-2">Password</label>
|
|
|
+ <input
|
|
|
+ type="password"
|
|
|
+ id="password"
|
|
|
+ class="shadow appearance-none border rounded w-full py-2 px-3 text-gray-700 mb-3 leading-tight focus:outline-none focus:shadow-outline"
|
|
|
+ placeholder="Enter your password"
|
|
|
+ />
|
|
|
+ <a href="#" class="inline-block align-baseline font-bold text-sm text-blue-500 hover:text-blue-800">
|
|
|
+ Forgot Password?
|
|
|
+ </a>
|
|
|
+ </div>
|
|
|
+ <div class="flex items-center justify-between">
|
|
|
+ <button
|
|
|
+ class="bg-blue-500 hover:bg-blue-700 text-white font-bold py-2 px-4 rounded focus:outline-none focus:shadow-outline"
|
|
|
+ type="button"
|
|
|
+ >
|
|
|
+ Login
|
|
|
+ </button>
|
|
|
+ </div>
|
|
|
+ </form>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+</template>
|
|
|
+
|
|
|
+<script setup>
|
|
|
+// Add any necessary logic here
|
|
|
+</script>
|
|
|
+
|
|
|
+<style scoped>
|
|
|
+/* Additional styles can be added here if needed */
|
|
|
+</style>
|