sid22669 commited on
Commit
8eaf5f8
·
verified ·
1 Parent(s): 34b5aec

Update templates/index.html

Browse files
Files changed (1) hide show
  1. templates/index.html +35 -23
templates/index.html CHANGED
@@ -3,11 +3,11 @@
3
  <head>
4
  <meta charset="UTF-8">
5
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
6
- <title>Prediction Input</title>
7
  <style>
8
  /* General body styling */
9
  body {
10
- font-family: Arial, sans-serif;
11
  background-color: #f4f7fc;
12
  color: #333;
13
  margin: 0;
@@ -23,41 +23,42 @@
23
  color: #4e73df;
24
  text-align: center;
25
  margin-bottom: 40px;
 
26
  }
27
 
28
  /* Form container styling */
29
  form {
30
  background-color: #fff;
31
- padding: 20px;
32
- border-radius: 8px;
33
- box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
34
  width: 100%;
35
- max-width: 400px;
36
  }
37
 
38
  label {
39
  display: block;
40
  margin-bottom: 8px;
41
- font-size: 1rem;
42
  font-weight: bold;
43
  color: #333;
44
  }
45
 
46
  input[type="number"] {
47
  width: 100%;
48
- padding: 10px;
49
- margin-bottom: 15px;
50
  border: 1px solid #ccc;
51
- border-radius: 4px;
52
  font-size: 1rem;
53
  }
54
 
55
  input[type="submit"] {
56
  background-color: #4e73df;
57
  color: white;
58
- padding: 12px 20px;
59
  border: none;
60
- border-radius: 4px;
61
  font-size: 1.1rem;
62
  cursor: pointer;
63
  transition: background-color 0.3s;
@@ -68,6 +69,14 @@
68
  background-color: #2e59d9;
69
  }
70
 
 
 
 
 
 
 
 
 
71
  /* Responsive Design */
72
  @media (max-width: 600px) {
73
  h1 {
@@ -75,43 +84,46 @@
75
  }
76
 
77
  form {
78
- padding: 15px;
79
  width: 90%;
80
  }
81
 
82
  input[type="number"] {
83
- padding: 8px;
84
  }
85
 
86
  input[type="submit"] {
87
- padding: 10px;
88
  }
89
  }
90
  </style>
91
  </head>
92
  <body>
93
 
94
- <h1>Enter the input values for prediction</h1>
 
95
  <form action="/predict" method="POST">
96
- <label for="input1">Input 1:</label>
 
 
97
  <input type="number" id="input1" name="input1" step="any" required>
98
 
99
- <label for="input2">Input 2:</label>
100
  <input type="number" id="input2" name="input2" step="any" required>
101
 
102
- <label for="input3">Input 3:</label>
103
  <input type="number" id="input3" name="input3" step="any" required>
104
 
105
- <label for="input4">Input 4:</label>
106
  <input type="number" id="input4" name="input4" step="any" required>
107
 
108
- <label for="input5">Input 5:</label>
109
  <input type="number" id="input5" name="input5" step="any" required>
110
 
111
- <label for="input6">Input 6:</label>
112
  <input type="number" id="input6" name="input6" step="any" required>
113
 
114
- <label for="input7">Input 7:</label>
115
  <input type="number" id="input7" name="input7" step="any" required>
116
 
117
  <input type="submit" value="Get Prediction">
 
3
  <head>
4
  <meta charset="UTF-8">
5
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
6
+ <title>Fetal Health Prediction Input</title>
7
  <style>
8
  /* General body styling */
9
  body {
10
+ font-family: 'Arial', sans-serif;
11
  background-color: #f4f7fc;
12
  color: #333;
13
  margin: 0;
 
23
  color: #4e73df;
24
  text-align: center;
25
  margin-bottom: 40px;
26
+ font-size: 2rem;
27
  }
28
 
29
  /* Form container styling */
30
  form {
31
  background-color: #fff;
32
+ padding: 30px;
33
+ border-radius: 10px;
34
+ box-shadow: 0 6px 12px rgba(0, 0, 0, 0.1);
35
  width: 100%;
36
+ max-width: 450px;
37
  }
38
 
39
  label {
40
  display: block;
41
  margin-bottom: 8px;
42
+ font-size: 1.1rem;
43
  font-weight: bold;
44
  color: #333;
45
  }
46
 
47
  input[type="number"] {
48
  width: 100%;
49
+ padding: 12px;
50
+ margin-bottom: 20px;
51
  border: 1px solid #ccc;
52
+ border-radius: 6px;
53
  font-size: 1rem;
54
  }
55
 
56
  input[type="submit"] {
57
  background-color: #4e73df;
58
  color: white;
59
+ padding: 15px;
60
  border: none;
61
+ border-radius: 6px;
62
  font-size: 1.1rem;
63
  cursor: pointer;
64
  transition: background-color 0.3s;
 
69
  background-color: #2e59d9;
70
  }
71
 
72
+ /* Title styling */
73
+ .form-title {
74
+ color: #333;
75
+ font-size: 1.25rem;
76
+ margin-bottom: 30px;
77
+ font-weight: bold;
78
+ }
79
+
80
  /* Responsive Design */
81
  @media (max-width: 600px) {
82
  h1 {
 
84
  }
85
 
86
  form {
87
+ padding: 20px;
88
  width: 90%;
89
  }
90
 
91
  input[type="number"] {
92
+ padding: 10px;
93
  }
94
 
95
  input[type="submit"] {
96
+ padding: 12px;
97
  }
98
  }
99
  </style>
100
  </head>
101
  <body>
102
 
103
+ <h1>Fetal Health Prediction Input</h1>
104
+
105
  <form action="/predict" method="POST">
106
+ <p class="form-title">Enter the following values for the prediction:</p>
107
+
108
+ <label for="input1">Baseline Value (baseline_value):</label>
109
  <input type="number" id="input1" name="input1" step="any" required>
110
 
111
+ <label for="input2">Accelerations (accelerations):</label>
112
  <input type="number" id="input2" name="input2" step="any" required>
113
 
114
+ <label for="input3">Fetal Movement (fetal_movement):</label>
115
  <input type="number" id="input3" name="input3" step="any" required>
116
 
117
+ <label for="input4">Uterine Contractions (uterine_contractions):</label>
118
  <input type="number" id="input4" name="input4" step="any" required>
119
 
120
+ <label for="input5">Light Decelerations (light_decelerations):</label>
121
  <input type="number" id="input5" name="input5" step="any" required>
122
 
123
+ <label for="input6">Severe Decelerations (severe_decelerations):</label>
124
  <input type="number" id="input6" name="input6" step="any" required>
125
 
126
+ <label for="input7">Prolonged Decelerations (prolongued_decelerations):</label>
127
  <input type="number" id="input7" name="input7" step="any" required>
128
 
129
  <input type="submit" value="Get Prediction">