Spaces:
Running
Running
File size: 7,671 Bytes
f18c72b 56620a1 f18c72b 56620a1 f18c72b 56620a1 f18c72b 56620a1 f18c72b 56620a1 f18c72b | 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>Science Question Portal | Student Submission</title>
<script src="https://cdn.tailwindcss.com"></script>
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.4.0/css/all.min.css">
<style>
@import url('https://fonts.googleapis.com/css2?family=Poppins:wght@300;400;600;700;800&display=swap');
body {
font-family: 'Poppins', sans-serif;
scroll-behavior: smooth;
}
.hero-gradient {
background: linear-gradient(135deg, #1e3a8a 0%, #1e40af 50%, #1d4ed8 100%);
}
.athlete-card:hover .athlete-overlay {
opacity: 1;
transform: translateY(0);
}
.athlete-overlay {
transition: all 0.4s ease;
opacity: 0;
transform: translateY(20px);
}
.parallax {
background-attachment: fixed;
background-position: center;
background-repeat: no-repeat;
background-size: cover;
}
.floating {
animation: floating 3s ease-in-out infinite;
}
@keyframes floating {
0% { transform: translateY(0px); }
50% { transform: translateY(-15px); }
100% { transform: translateY(0px); }
}
</style>
</head>
<body class="bg-gray-50">
<!-- Navigation -->
<nav class="fixed w-full bg-white shadow-lg z-50">
<div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
<div class="flex justify-between h-16">
<div class="flex items-center">
<div class="flex-shrink-0 flex items-center">
<span class="text-blue-800 font-bold text-2xl">AGYEMANG MATTHEW</span>
</div>
</div>
<div class="hidden md:flex items-center space-x-8">
<a href="#home" class="text-gray-900 hover:text-blue-600 px-3 py-2 font-medium">Submit Questions</a>
<a href="#solutions" class="text-gray-900 hover:text-blue-600 px-3 py-2 font-medium">View Solutions</a>
<a href="#resources" class="text-gray-900 hover:text-blue-600 px-3 py-2 font-medium">Resources</a>
</div>
<div class="md:hidden flex items-center">
<button id="mobile-menu-button" class="text-gray-900 hover:text-blue-600">
<i class="fas fa-bars text-2xl"></i>
</button>
</div>
</div>
</div>
<!-- Mobile menu -->
<div id="mobile-menu" class="hidden md:hidden bg-white shadow-lg">
<div class="px-2 pt-2 pb-3 space-y-1 sm:px-3">
<a href="#home" class="block px-3 py-2 text-gray-900 hover:text-blue-600 font-medium">Submit Questions</a>
<a href="#solutions" class="block px-3 py-2 text-gray-900 hover:text-blue-600 font-medium">View Solutions</a>
<a href="#resources" class="block px-3 py-2 text-gray-900 hover:text-blue-600 font-medium">Resources</a>
</div>
</div>
</nav>
<!-- Student Form Section -->
<section id="home" class="bg-blue-50 pt-24 pb-16">
<div class="max-w-3xl mx-auto px-4 sm:px-6 lg:px-8">
<div class="bg-white rounded-xl shadow-lg p-8">
<h1 class="text-3xl font-bold text-center text-blue-800 mb-8">Science Question Portal</h1>
<form class="space-y-6">
<div class="grid grid-cols-1 md:grid-cols-2 gap-6">
<div>
<label for="name" class="block text-sm font-medium text-gray-700 mb-1">Full Name</label>
<input type="text" id="name" name="name" required
class="w-full px-4 py-2 border border-gray-300 rounded-lg focus:ring-blue-500 focus:border-blue-500">
</div>
<div>
<label for="student-id" class="block text-sm font-medium text-gray-700 mb-1">Student ID</label>
<input type="text" id="student-id" name="student-id" required
class="w-full px-4 py-2 border border-gray-300 rounded-lg focus:ring-blue-500 focus:border-blue-500">
</div>
<div>
<label for="school" class="block text-sm font-medium text-gray-700 mb-1">School</label>
<input type="text" id="school" name="school" required
class="w-full px-4 py-2 border border-gray-300 rounded-lg focus:ring-blue-500 focus:border-blue-500">
</div>
<div>
<label for="course" class="block text-sm font-medium text-gray-700 mb-1">Course</label>
<input type="text" id="course" name="course" required
class="w-full px-4 py-2 border border-gray-300 rounded-lg focus:ring-blue-500 focus:border-blue-500">
</div>
</div>
<div>
<label for="questions" class="block text-sm font-medium text-gray-700 mb-1">Upload Science Questions (PDF/DOC)</label>
<div class="mt-1 flex justify-center px-6 pt-5 pb-6 border-2 border-gray-300 border-dashed rounded-lg">
<div class="space-y-1 text-center">
<div class="flex text-sm text-gray-600">
<label for="file-upload" class="relative cursor-pointer bg-white rounded-md font-medium text-blue-600 hover:text-blue-500 focus-within:outline-none">
<span>Upload a file</span>
<input id="file-upload" name="file-upload" type="file" class="sr-only">
</label>
<p class="pl-1">or drag and drop</p>
</div>
<p class="text-xs text-gray-500">PDF, DOC, DOCX up to 10MB</p>
</div>
</div>
</div>
<div class="pt-4">
<button type="submit" class="w-full bg-blue-600 hover:bg-blue-700 text-white font-bold py-3 px-4 rounded-lg transition duration-300">
Submit Questions
</button>
</div>
</form>
</div>
</div>
</section>
<p style="border-radius: 8px; text-align: center; font-size: 12px; color: #fff; margin-top: 16px;position: fixed; left: 8px; bottom: 8px; z-index: 10; background: rgba(0, 0, 0, 0.8); padding: 4px 8px;">Made with <img src="https://enzostvs-deepsite.hf.space/logo.svg" alt="DeepSite Logo" style="width: 16px; height: 16px; vertical-align: middle;display:inline-block;margin-right:3px;filter:brightness(0) invert(1);"><a href="https://enzostvs-deepsite.hf.space" style="color: #fff;text-decoration: underline;" target="_blank" >DeepSite</a> - 🧬 <a href="https://enzostvs-deepsite.hf.space?remix=Wasty5/the-famous-sports-men" style="color: #fff;text-decoration: underline;" target="_blank" >Remix</a></p></body>
</html> |