Spaces:
Running
Running
File size: 7,534 Bytes
fd4a429 |
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 94 95 96 97 98 99 100 101 102 103 104 105 106 107 108 109 110 111 112 113 114 115 116 117 118 119 120 121 122 123 124 125 126 127 128 129 130 131 132 133 134 135 136 137 138 139 |
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Edit Student - EduFlow Student Hub</title>
<script src="https://cdn.tailwindcss.com"></script>
<script src="https://cdn.jsdelivr.net/npm/feather-icons/dist/feather.min.js"></script>
<script src="https://unpkg.com/feather-icons"></script>
<style>
.glass-effect {
background: rgba(255, 255, 255, 0.1);
backdrop-filter: blur(10px);
border: 1px solid rgba(255, 255, 255, 0.2);
}
.gradient-bg {
background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
}
</style>
</head>
<body class="min-h-screen gradient-bg">
<!-- Header -->
<header class="glass-effect text-white shadow-lg">
<div class="container mx-auto px-4 py-4">
<div class="flex justify-between items-center">
<div class="flex items-center space-x-2">
<i data-feather="book-open" class="w-8 h-8"></i>
<h1 class="text-2xl font-bold">EduFlow Student Hub</h1>
</div>
<nav class="hidden md:flex space-x-6">
<a href="../index.html" class="hover:text-blue-200 transition-colors">Dashboard</a>
<a href="view.html" class="hover:text-blue-200 transition-colors">Students</a>
<a href="add.html" class="hover:text-blue-200 transition-colors">Add Student</a>
</nav>
<button class="md:hidden">
<i data-feather="menu" class="w-6 h-6"></i>
</button>
</div>
</div>
</header>
<!-- Main Content -->
<main class="container mx-auto px-4 py-8">
<div class="max-w-2xl mx-auto">
<div class="glass-effect rounded-xl p-6 text-white">
<div class="flex items-center space-x-2 mb-6">
<i data-feather="edit" class="w-6 h-6"></i>
<h2 class="text-2xl font-bold">Edit Student</h2>
</div>
<form id="editStudentForm" class="space-y-6">
<div class="grid grid-cols-1 md:grid-cols-2 gap-6">
<div>
<label class="block text-sm font-medium mb-2">First Name</label>
<input type="text" value="John" required class="w-full px-4 py-2 bg-white/10 border border-white/20 rounded-lg text-white placeholder-gray-300 focus:outline-none focus:border-blue-300">
</div>
<div>
<label class="block text-sm font-medium mb-2">Last Name</label>
<input type="text" value="Smith" required class="w-full px-4 py-2 bg-white/10 border border-white/20 rounded-lg text-white placeholder-gray-300 focus:outline-none focus:border-blue-300">
</div>
</div>
<div>
<label class="block text-sm font-medium mb-2">Email Address</label>
<input type="email" value="john.smith@university.edu" required class="w-full px-4 py-2 bg-white/10 border border-white/20 rounded-lg text-white placeholder-gray-300 focus:outline-none focus:border-blue-300">
</div>
<div class="grid grid-cols-1 md:grid-cols-2 gap-6">
<div>
<label class="block text-sm font-medium mb-2">Student ID</label>
<input type="text" value="STU001" required readonly class="w-full px-4 py-2 bg-white/5 border border-white/20 rounded-lg text-gray-300">
</div>
<div>
<label class="block text-sm font-medium mb-2">Phone Number</label>
<input type="tel" value="+1 (555) 123-4567" class="w-full px-4 py-2 bg-white/10 border border-white/20 rounded-lg text-white placeholder-gray-300 focus:outline-none focus:border-blue-300">
</div>
</div>
<div class="grid grid-cols-1 md:grid-cols-2 gap-6">
<div>
<label class="block text-sm font-medium mb-2">Course</label>
<select required class="w-full px-4 py-2 bg-white/10 border border-white/20 rounded-lg text-white focus:outline-none focus:border-blue-300">
<option value="cs" selected>Computer Science</option>
<option value="math">Mathematics</option>
<option value="phy">Physics</option>
<option value="chem">Chemistry</option>
<option value="bio">Biology</option>
</select>
</div>
<div>
<label class="block text-sm font-medium mb-2">Year</label>
<select required class="w-full px-4 py-2 bg-white/10 border border-white/20 rounded-lg text-white focus:outline-none focus:border-blue-300">
<option value="1">Year 1</option>
<option value="2">Year 2</option>
<option value="3" selected>Year 3</option>
<option value="4">Year 4</option>
</select>
</div>
</div>
<div>
<label class="block text-sm font-medium mb-2">Address</label>
<textarea rows="3" class="w-full px-4 py-2 bg-white/10 border border-white/20 rounded-lg text-white placeholder-gray-300 focus:outline-none focus:border-blue-300">123 University Ave, Campus City, CC 12345</textarea>
</div>
<div class="flex items-center space-x-2">
<input type="checkbox" id="activeStatus" checked class="rounded bg-white/10 border-white/20">
<label for="activeStatus" class="text-sm">Active Student</label>
</div>
<div class="flex space-x-4 pt-4">
<button type="submit" class="bg-blue-500 hover:bg-blue-600 text-white px-6 py-2 rounded-lg flex items-center space-x-2 transition-colors">
<i data-feather="save" class="w-4 h-4"></i>
<span>Update Student</span>
</button>
<a href="view.html" class="bg-white/10 hover:bg-white/20 text-white px-6 py-2 rounded-lg flex items-center space-x-2 transition-colors">
<i data-feather="x" class="w-4 h-4"></i>
<span>Cancel</span>
</a>
</div>
</form>
</div>
</div>
</main>
<script>
document.getElementById('editStudentForm').addEventListener('submit', function(e) {
e.preventDefault();
// Simulate form submission
alert('Student information updated successfully!');
window.location.href = 'view.html';
});
feather.replace();
</script>
</body>
</html>
|