Spaces:
Sleeping
Sleeping
<html lang="en"> | |
<head> | |
<meta charset="UTF-8"> | |
<meta name="viewport" content="width=device-width, initial-scale=1.0"> | |
<title>Student Exam Performance Predictor</title> | |
<style> | |
body { | |
background: url('https://ed.stanford.edu/sites/default/files/news_images/biologygettyimages-535847793.jpg') center/cover no-repeat; /* Replace 'your-background-image.jpg' with the actual path to your image */ | |
display: flex; | |
align-items: center; | |
justify-content: center; | |
height: 100vh; | |
margin: 0; | |
} | |
.login { | |
background-color: rgb(207, 192, 235); /* Set your desired background color */ | |
padding: 20px; | |
border-radius: 8px; | |
box-shadow: 0 0 10px rgba(158, 121, 121, 0.1); | |
} | |
/* Add any other CSS styles as needed */ | |
</style> | |
</head> | |
<body> | |
<div class="login"> | |
<form action="{{ url_for('predict_datapoint')}}" method="post"> | |
<h1> | |
<legend>Student Exam Performance Prediction</legend> | |
</h1> | |
<div class="mb-3"> | |
<label class="form-label">Gender</label> | |
<select class="form-control" name="gender" placeholder="Enter you Gender" required> | |
<option class="placeholder" selected disabled value="">Select your Gender</option> | |
<option value="male"> | |
Male | |
</option> | |
<option value="female"> | |
Female | |
</option> | |
</select> | |
</div> | |
<div class="mb-3"> | |
<label class="form-label">Race or Ethnicity</label> | |
<select class="form-control" name="ethnicity" placeholder="Enter you ethnicity" required> | |
<option class="placeholder" selected disabled value="">Select Ethnicity</option> | |
<option value="group A"> | |
Group A | |
</option> | |
<option value="group B"> | |
Group B | |
</option> | |
<option value="group C"> | |
Group C | |
</option> | |
<option value="group D"> | |
Group D | |
</option> | |
<option value="group E"> | |
Group E | |
</option> | |
</select> | |
</div> | |
<div class="mb-3"> | |
<label class="form-label">Parental Level of Education</label> | |
<select class="form-control" name="parental_level_of_education" | |
placeholder="Enter you Parent Education" required> | |
<option class="placeholder" selected disabled value="">Select Parent Education</option> | |
<option value="associate's degree"> | |
associate's degree | |
</option> | |
<option value="bachelor's degree"> | |
bachelor's degree | |
</option> | |
<option value="high school"> | |
high school | |
</option> | |
<option value="master's degree"> | |
master's degree | |
</option> | |
<option value="some college"> | |
some college | |
</option> | |
<option value="some high school"> | |
some high school | |
</option> | |
</select> | |
</div> | |
<div class="mb-3"> | |
<label class="form-label">Lunch Type</label> | |
<select class="form-control" name="lunch" placeholder="Enter you Lunch" required> | |
<option class="placeholder" selected disabled value="">Select Lunch Type</option> | |
<option value="free/reduced"> | |
free/reduced | |
</option> | |
<option value="standard"> | |
standard | |
</option> | |
</select> | |
</div> | |
<div class="mb-3"> | |
<label class="form-label">Test preparation Course</label> | |
<select class="form-control" name="test_preparation_course" placeholder="Enter you Course" | |
required> | |
<option class="placeholder" selected disabled value="">Select Test_course</option> | |
<option value="none"> | |
None | |
</option> | |
<option value="completed"> | |
Completed | |
</option> | |
</select> | |
</div> | |
<div class="mb-3"> | |
<label class="form-label">Writing Score out of 100</label> | |
<input class="form-control" type="number" name="reading_score" | |
placeholder="Enter your Writing Score score" min='0' max='100' /> | |
</div> | |
<div class="mb-3"> | |
<label class="form-label">Reading Score out of 100</label> | |
<input class="form-control" type="number" name="writing_score" | |
placeholder="Enter your Reading Score" min='0' max='100' /> | |
</div> | |
<div class="mb-3"> | |
<input class="btn btn-primary" type="submit" value="Predict your Maths Score" required /> | |
</div> | |
</form> | |
<h2> | |
THE prediction is {{results}} | |
</h2> | |
</div> | |
</body> | |
</html> | |