Hugging Face's logo

Spaces:
LovnishVerma
/
braintumor
Running

App Files Community
LovnishVerma commited on
Commit
77bef31
·
verified ·
1 Parent(s): d79939b

Update templates/braintumor.html

Browse files
Files changed (1) hide show
  1. templates/braintumor.html +230 -230
templates/braintumor.html CHANGED
@@ -1,230 +1,230 @@
1
- <!doctype html>
2
- <html lang="en">
3
-
4
- <head>
5
- <!-- Required meta tags -->
6
- <meta charset="utf-8">
7
- <meta name="viewport" content="width=device-width, initial-scale=1">
8
-
9
- <!-- Bootstrap CSS -->
10
- <link href="https://cdn.jsdelivr.net/npm/[email protected]/dist/css/bootstrap.min.css" rel="stylesheet"
11
- integrity="sha384-eOJMYsd53ii+scO/bJGFsiCZc+5NDVN2yr8+0RDqr0Ql0h+rP48ckxlpbzKgwra6" crossorigin="anonymous">
12
-
13
- <!-- Custom Styles -->
14
- <style type="text/css">
15
- body {
16
- background-image: url(static/brain.gif);
17
- background-position: center;
18
- background-size: cover;
19
- font-family: 'Roboto', sans-serif;
20
- margin-top: 40px;
21
- color: #fff;
22
- }
23
-
24
- .navbar {
25
- background-color: #212121 !important;
26
- }
27
-
28
- .navbar-brand {
29
- font-weight: bold;
30
- font-size: 1.5rem;
31
- }
32
-
33
- .regform {
34
- background-color: rgba(0, 0, 0, 0.6);
35
- padding: 20px;
36
- text-align: center;
37
- border-radius: 15px 15px 0 0;
38
- box-shadow: 0 10px 15px rgba(0, 0, 0, 0.5);
39
- margin-top: 20px;
40
- }
41
-
42
- .regform h1 {
43
- font-size: 2rem;
44
- font-weight: bold;
45
- }
46
-
47
- .main-form {
48
- background-color: rgba(0, 0, 0, 0.7);
49
- margin: 20px auto;
50
- padding: 30px;
51
- border-radius: 10px;
52
- max-width: 900px;
53
- }
54
-
55
- .form-group label {
56
- font-size: 1rem;
57
- font-weight: 500;
58
- }
59
-
60
- .form-control {
61
- border-radius: 5px;
62
- box-shadow: none;
63
- border: 2px solid #bbb;
64
- margin-bottom: 15px;
65
- }
66
-
67
- .form-control:focus {
68
- border-color: #5cb85c;
69
- }
70
-
71
- .btn-submit {
72
- background-color: #28a745;
73
- color: white;
74
- font-size: 1.1rem;
75
- padding: 15px 30px;
76
- border-radius: 5px;
77
- border: none;
78
- transition: background-color 0.3s ease;
79
- }
80
-
81
- .btn-submit:hover {
82
- background-color: #218838;
83
- }
84
-
85
- .form-text {
86
- font-size: 0.85rem;
87
- }
88
-
89
- .col-md-6 {
90
- margin-bottom: 15px;
91
- }
92
-
93
- .col-md-6 label,
94
- .col-md-6 input,
95
- .col-md-6 select {
96
- font-size: 1rem;
97
- }
98
-
99
- .footer {
100
- text-align: center;
101
- margin-top: 30px;
102
- font-size: 0.9rem;
103
- color: #ccc;
104
- }
105
-
106
- /* Responsive design */
107
- @media (max-width: 767px) {
108
- .regform h1 {
109
- font-size: 1.6rem;
110
- }
111
-
112
- .main-form {
113
- padding: 20px;
114
- }
115
- }
116
- </style>
117
-
118
- <title>Brain Tumor Detection</title>
119
- </head>
120
-
121
- <body>
122
- <nav class="navbar navbar-expand-lg navbar-dark bg-dark">
123
- <div class="container-fluid">
124
- <a class="navbar-brand" href="/">CNN Brain Tumor Detection</a>
125
- <button class="navbar-toggler" type="button" data-bs-toggle="collapse" data-bs-target="#navbarNav"
126
- aria-controls="navbarNav" aria-expanded="false" aria-label="Toggle navigation">
127
- <span class="navbar-toggler-icon"></span>
128
- </button>
129
- <div class="collapse navbar-collapse" id="navbarNav">
130
- <ul class="navbar-nav ms-auto">
131
- <li class="nav-item">
132
- <a class="nav-link" href="/dbresults">View MongoDB Results</a>
133
- </li>
134
- </ul>
135
- </div>
136
- </div>
137
- </nav>
138
-
139
- <div class="regform">
140
- <h1>Brain Tumor Detection Form</h1>
141
- </div>
142
-
143
- <div class="container">
144
- <form action="resultbt" class="main-form needs-validation" method="POST" enctype="multipart/form-data" novalidate>
145
- <div class="row">
146
- <div class="col-md-6">
147
- <div class="form-group">
148
- <label for="firstname">First Name</label>
149
- <input type="text" name="firstname" id="firstname" class="form-control" required>
150
- </div>
151
- </div>
152
- <div class="col-md-6">
153
- <div class="form-group">
154
- <label for="lastname">Last Name</label>
155
- <input type="text" name="lastname" id="lastname" class="form-control" required>
156
- </div>
157
- </div>
158
- </div>
159
-
160
- <div class="form-group">
161
- <label for="phone">Phone Number</label>
162
- <input type="tel" name="phone" id="phone" class="form-control" required>
163
- <small class="form-text">* Include your area code</small>
164
- </div>
165
-
166
- <div class="form-group">
167
- <label for="email">Email Address</label>
168
- <input type="email" name="email" id="email" class="form-control" required>
169
- </div>
170
-
171
- <div class="row">
172
- <div class="col-md-6">
173
- <div class="form-group">
174
- <label for="gender">Gender</label>
175
- <select name="gender" id="gender" class="form-control" required>
176
- <option value="male">Male</option>
177
- <option value="female">Female</option>
178
- </select>
179
- </div>
180
- </div>
181
- <div class="col-md-6">
182
- <div class="form-group">
183
- <label for="age">Age</label>
184
- <input type="number" name="age" id="age" class="form-control" required>
185
- </div>
186
- </div>
187
- </div>
188
-
189
- <div class="form-group">
190
- <label for="file">Upload Your Brain MRI</label>
191
- <input type="file" class="form-control" id="file" name="file" required>
192
- </div>
193
-
194
- <div class="text-center">
195
- <button type="submit" class="btn-submit">Submit</button>
196
- </div>
197
- </form>
198
- </div>
199
-
200
- <div class="footer">
201
- <p>&copy; 2024 Brain Tumor Detection - All Rights Reserved</p>
202
- </div>
203
-
204
- <!-- Bootstrap Bundle with Popper -->
205
- <script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/js/bootstrap.bundle.min.js"
206
- integrity="sha384-JEW9xMcG8R+pH31jmWH6WWP0WintQrMb4s7ZOdauHnUtxwoG2vI5DkLtS3qm9Ekf"
207
- crossorigin="anonymous"></script>
208
-
209
- <!-- Enable Bootstrap validation -->
210
- <script>
211
- (function () {
212
- 'use strict'
213
- // Fetch all the forms we want to apply custom Bootstrap validation styles to
214
- var forms = document.querySelectorAll('.needs-validation')
215
- // Loop over them and prevent submission
216
- Array.prototype.slice.call(forms)
217
- .forEach(function (form) {
218
- form.addEventListener('submit', function (event) {
219
- if (!form.checkValidity()) {
220
- event.preventDefault()
221
- event.stopPropagation()
222
- }
223
- form.classList.add('was-validated')
224
- }, false)
225
- })
226
- })()
227
- </script>
228
- </body>
229
-
230
- </html>
 
1
+ <!doctype html>
2
+ <html lang="en">
3
+
4
+ <head>
5
+ <!-- Required meta tags -->
6
+ <meta charset="utf-8">
7
+ <meta name="viewport" content="width=device-width, initial-scale=1">
8
+
9
+ <!-- Bootstrap CSS -->
10
+ <link href="https://cdn.jsdelivr.net/npm/[email protected]/dist/css/bootstrap.min.css" rel="stylesheet"
11
+ integrity="sha384-eOJMYsd53ii+scO/bJGFsiCZc+5NDVN2yr8+0RDqr0Ql0h+rP48ckxlpbzKgwra6" crossorigin="anonymous">
12
+
13
+ <!-- Custom Styles -->
14
+ <style type="text/css">
15
+ body {
16
+ background-image: url(static/brain.gif);
17
+ background-position: center;
18
+ background-size: cover;
19
+ font-family: 'Roboto', sans-serif;
20
+ margin-top: 40px;
21
+ color: #fff;
22
+ }
23
+
24
+ .navbar {
25
+ background-color: #212121 !important;
26
+ }
27
+
28
+ .navbar-brand {
29
+ font-weight: bold;
30
+ font-size: 1.5rem;
31
+ }
32
+
33
+ .regform {
34
+ background-color: rgba(0, 0, 0, 0.6);
35
+ padding: 20px;
36
+ text-align: center;
37
+ border-radius: 15px 15px 0 0;
38
+ box-shadow: 0 10px 15px rgba(0, 0, 0, 0.5);
39
+ margin-top: 20px;
40
+ }
41
+
42
+ .regform h1 {
43
+ font-size: 2rem;
44
+ font-weight: bold;
45
+ }
46
+
47
+ .main-form {
48
+ background-color: rgba(0, 0, 0, 0.7);
49
+ margin: 20px auto;
50
+ padding: 30px;
51
+ border-radius: 10px;
52
+ max-width: 900px;
53
+ }
54
+
55
+ .form-group label {
56
+ font-size: 1rem;
57
+ font-weight: 500;
58
+ }
59
+
60
+ .form-control {
61
+ border-radius: 5px;
62
+ box-shadow: none;
63
+ border: 2px solid #bbb;
64
+ margin-bottom: 15px;
65
+ }
66
+
67
+ .form-control:focus {
68
+ border-color: #5cb85c;
69
+ }
70
+
71
+ .btn-submit {
72
+ background-color: #28a745;
73
+ color: white;
74
+ font-size: 1.1rem;
75
+ padding: 15px 30px;
76
+ border-radius: 5px;
77
+ border: none;
78
+ transition: background-color 0.3s ease;
79
+ }
80
+
81
+ .btn-submit:hover {
82
+ background-color: #218838;
83
+ }
84
+
85
+ .form-text {
86
+ font-size: 0.85rem;
87
+ }
88
+
89
+ .col-md-6 {
90
+ margin-bottom: 15px;
91
+ }
92
+
93
+ .col-md-6 label,
94
+ .col-md-6 input,
95
+ .col-md-6 select {
96
+ font-size: 1rem;
97
+ }
98
+
99
+ .footer {
100
+ text-align: center;
101
+ margin-top: 30px;
102
+ font-size: 0.9rem;
103
+ color: #ccc;
104
+ }
105
+
106
+ /* Responsive design */
107
+ @media (max-width: 767px) {
108
+ .regform h1 {
109
+ font-size: 1.6rem;
110
+ }
111
+
112
+ .main-form {
113
+ padding: 20px;
114
+ }
115
+ }
116
+ </style>
117
+
118
+ <title>Brain Tumor Detection</title>
119
+ </head>
120
+
121
+ <body>
122
+ <nav class="navbar navbar-expand-lg navbar-dark bg-dark">
123
+ <div class="container-fluid">
124
+ <a class="navbar-brand" href="/">CNN Brain Tumor Detection</a>
125
+ <button class="navbar-toggler" type="button" data-bs-toggle="collapse" data-bs-target="#navbarNav"
126
+ aria-controls="navbarNav" aria-expanded="false" aria-label="Toggle navigation">
127
+ <span class="navbar-toggler-icon"></span>
128
+ </button>
129
+ <div class="collapse navbar-collapse" id="navbarNav">
130
+ <ul class="navbar-nav ms-auto">
131
+ <li class="nav-item">
132
+ <a class="nav-link" href="/dbresults">View MongoDB Results</a>
133
+ </li>
134
+ </ul>
135
+ </div>
136
+ </div>
137
+ </nav>
138
+
139
+ <div class="regform">
140
+ <h1>Brain Tumor Detection Form</h1>
141
+ </div>
142
+
143
+ <div class="container">
144
+ <form action="resultbt" class="main-form needs-validation" method="POST" enctype="multipart/form-data" novalidate>
145
+ <div class="row">
146
+ <div class="col-md-6">
147
+ <div class="form-group">
148
+ <label for="firstname">First Name</label>
149
+ <input type="text" name="firstname" id="firstname" class="form-control" required>
150
+ </div>
151
+ </div>
152
+ <div class="col-md-6">
153
+ <div class="form-group">
154
+ <label for="lastname">Last Name</label>
155
+ <input type="text" name="lastname" id="lastname" class="form-control" required>
156
+ </div>
157
+ </div>
158
+ </div>
159
+
160
+ <div class="form-group">
161
+ <label for="phone">Phone Number</label>
162
+ <input type="tel" name="phone" id="phone" class="form-control" required>
163
+ <small class="form-text">* Include your area code</small>
164
+ </div>
165
+
166
+ <div class="form-group">
167
+ <label for="email">Email Address</label>
168
+ <input type="email" name="email" id="email" class="form-control" required>
169
+ </div>
170
+
171
+ <div class="row">
172
+ <div class="col-md-6">
173
+ <div class="form-group">
174
+ <label for="gender">Gender</label>
175
+ <select name="gender" id="gender" class="form-control" required>
176
+ <option value="male">Male</option>
177
+ <option value="female">Female</option>
178
+ </select>
179
+ </div>
180
+ </div>
181
+ <div class="col-md-6">
182
+ <div class="form-group">
183
+ <label for="age">Age</label>
184
+ <input type="number" name="age" id="age" class="form-control" required>
185
+ </div>
186
+ </div>
187
+ </div>
188
+
189
+ <div class="form-group">
190
+ <label for="file">Upload Your Brain MRI</label>
191
+ <input type="file" class="form-control" id="file" name="file" required>
192
+ </div>
193
+
194
+ <div class="text-center">
195
+ <button type="submit" class="btn-submit">Submit</button>
196
+ </div>
197
+ </form>
198
+ </div>
199
+
200
+ <div class="footer">
201
+ <p>&copy; 2025 Brain Tumor Detection by Lovnish Verma - All Rights Reserved</p>
202
+ </div>
203
+
204
+ <!-- Bootstrap Bundle with Popper -->
205
+ <script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/js/bootstrap.bundle.min.js"
206
+ integrity="sha384-JEW9xMcG8R+pH31jmWH6WWP0WintQrMb4s7ZOdauHnUtxwoG2vI5DkLtS3qm9Ekf"
207
+ crossorigin="anonymous"></script>
208
+
209
+ <!-- Enable Bootstrap validation -->
210
+ <script>
211
+ (function () {
212
+ 'use strict'
213
+ // Fetch all the forms we want to apply custom Bootstrap validation styles to
214
+ var forms = document.querySelectorAll('.needs-validation')
215
+ // Loop over them and prevent submission
216
+ Array.prototype.slice.call(forms)
217
+ .forEach(function (form) {
218
+ form.addEventListener('submit', function (event) {
219
+ if (!form.checkValidity()) {
220
+ event.preventDefault()
221
+ event.stopPropagation()
222
+ }
223
+ form.classList.add('was-validated')
224
+ }, false)
225
+ })
226
+ })()
227
+ </script>
228
+ </body>
229
+
230
+ </html>