Hugging Face's logo

Spaces:
Neurolingua
/
Aiducation-Edtech-GenAI

App Files Community
6
Neurolingua commited on
Commit
815fe05
•
1 Parent(s): 21d2a09

Update templates/teacher_paper_gen.html

Browse files
Files changed (1) hide show
  1. templates/teacher_paper_gen.html +196 -200
templates/teacher_paper_gen.html CHANGED
@@ -1,200 +1,196 @@
1
- <!DOCTYPE html>
2
- <html lang="en">
3
- <head>
4
- <meta charset="UTF-8">
5
- <meta name="viewport" content="width=device-width, initial-scale=1.0">
6
- <title>Professional Question Paper Generator</title>
7
- <link href="https://fonts.googleapis.com/css2?family=Roboto:wght@300;400;500;700&display=swap" rel="stylesheet">
8
- <style>
9
- :root {
10
- --primary-color: #3498db;
11
- --secondary-color: #2c3e50;
12
- --background-color: #f5f6fa;
13
- --text-color: #333;
14
- --card-background: rgba(255, 255, 255, 0.8); /* Adjusted for transparency */
15
- }
16
-
17
- body {
18
- font-family: 'Roboto', sans-serif;
19
- background-color: var(--background-color);
20
- color: var(--text-color);
21
- line-height: 1.6;
22
- margin: 0;
23
- padding: 0;
24
- overflow: hidden; /* Prevent scrolling */
25
- }
26
-
27
- .background-video {
28
- position: fixed;
29
- right: 0;
30
- bottom: 0;
31
- min-width: 100%;
32
- min-height: 100%;
33
- z-index: -1; /* Ensure video is in the background */
34
- object-fit: cover; /* Maintain aspect ratio and cover the entire screen */
35
- }
36
-
37
- .container {
38
- max-width: 800px;
39
- margin: 40px auto;
40
- padding: 30px;
41
- background: var(--card-background);
42
- border-radius: 15px;
43
- box-shadow: 0 10px 30px rgba(0, 0, 0, 0.1);
44
- backdrop-filter: blur(10px); /* Add a blur effect to make text more readable */
45
- }
46
-
47
- h1 {
48
- color: var(--primary-color);
49
- text-align: center;
50
- margin-bottom: 30px;
51
- font-size: 2.5em;
52
- }
53
-
54
- form {
55
- display: grid;
56
- gap: 20px;
57
- }
58
-
59
- label {
60
- font-weight: 500;
61
- display: block;
62
- margin-bottom: 5px;
63
- }
64
-
65
- input[type="number"],
66
- input[type="text"],
67
- input[type="file"] {
68
- width: 100%;
69
- padding: 10px;
70
- border: 1px solid #ddd;
71
- border-radius: 5px;
72
- font-size: 16px;
73
- }
74
-
75
- input[type="file"] {
76
- padding: 10px 0;
77
- }
78
-
79
- button {
80
- background-color: var(--primary-color);
81
- color: white;
82
- border: none;
83
- padding: 12px 20px;
84
- font-size: 18px;
85
- border-radius: 5px;
86
- cursor: pointer;
87
- transition: background-color 0.3s ease;
88
- }
89
-
90
- button:hover {
91
- background-color: #2980b9;
92
- }
93
-
94
- .generated-paper {
95
- margin-top: 40px;
96
- padding: 20px;
97
- background-color: #f9f9f9;
98
- border-radius: 10px;
99
- border: 1px solid #e0e0e0;
100
- }
101
-
102
- .generated-paper h2 {
103
- color: var(--secondary-color);
104
- margin-bottom: 20px;
105
- }
106
-
107
- @media (max-width: 600px) {
108
- .container {
109
- padding: 20px;
110
- }
111
- }
112
- .back-button {
113
- position: fixed;
114
- top: 20px;
115
- left: 20px;
116
- background-color: #3498db;
117
- color: white;
118
- border: none;
119
- border-radius: 50%;
120
- width: 50px;
121
- height: 50px;
122
- font-size: 24px;
123
- cursor: pointer;
124
- transition: all 0.3s ease;
125
- box-shadow: 0 2px 5px rgba(0,0,0,0.2);
126
- display: flex;
127
- justify-content: center;
128
- align-items: center;
129
- text-decoration: none;
130
- }
131
-
132
- .back-button:hover {
133
- background-color: #2980b9;
134
- transform: scale(1.1);
135
- }
136
-
137
- .back-button i {
138
- transition: transform 0.3s ease;
139
- }
140
-
141
- .back-button:hover i {
142
- transform: translateX(-5px);
143
- }
144
-
145
- </style>
146
- </head>
147
- <body>
148
- <video class="background-video" autoplay muted loop>
149
- <source src="../static/paper.mp4" type="video/mp4">
150
- Your browser does not support the video tag.
151
- </video>
152
- <a href="teacher" class="back-button" title="Back to Home">Back
153
- <i class="fas fa-arrow-left"></i>
154
- </a>
155
-
156
- <div class="container">
157
- <h1>Question Paper Generator</h1>
158
- <form action="/generate-paper" method="post" enctype="multipart/form-data">
159
- <div>
160
- <label for="no_of_questions">Number of questions:</label>
161
- <input type="number" id="no_of_questions" name="no_of_questions" required>
162
- </div>
163
-
164
- <div>
165
- <label for="total_marks">Total marks:</label>
166
- <input type="number" id="total_marks" name="total_marks" required>
167
- </div>
168
-
169
- <div>
170
- <label for="no_of_parts">Number of parts:</label>
171
- <input type="number" id="no_of_parts" name="no_of_parts" required>
172
- </div>
173
-
174
- <div>
175
- <label for="marks_per_part">Marks per part:</label>
176
- <input type="number" id="marks_per_part" name="marks_per_part" required>
177
- </div>
178
-
179
- <div>
180
- <label for="test_duration">Test duration:</label>
181
- <input type="text" id="test_duration" name="test_duration" placeholder="e.g., 2 hours" required>
182
- </div>
183
-
184
- <div>
185
- <label for="pdf_file">Curriculum PDF:</label>
186
- <input type="file" id="pdf_file" name="pdf_file" accept="application/pdf" required>
187
- </div>
188
-
189
- <button type="submit">Generate Question Paper</button>
190
- </form>
191
-
192
- {% if questions %}
193
- <div class="generated-paper">
194
- <h2>Generated Question Paper</h2>
195
- <p>{{ questions }}</p>
196
- </div>
197
- {% endif %}
198
- </div>
199
- </body>
200
- </html>
 
1
+ <!DOCTYPE html>
2
+ <html lang="en">
3
+ <head>
4
+ <meta charset="UTF-8">
5
+ <meta name="viewport" content="width=device-width, initial-scale=1.0">
6
+ <title>Professional Question Paper Generator</title>
7
+ <link href="https://fonts.googleapis.com/css2?family=Roboto:wght@300;400;500;700&display=swap" rel="stylesheet">
8
+ <style>
9
+ :root {
10
+ --primary-color: #3498db;
11
+ --secondary-color: #2c3e50;
12
+ --background-color: #f5f6fa;
13
+ --text-color: #333;
14
+ --card-background: rgba(255, 255, 255, 0.8);
15
+ }
16
+
17
+ body {
18
+ font-family: 'Roboto', sans-serif;
19
+ background-color: var(--background-color);
20
+ color: var(--text-color);
21
+ line-height: 1.6;
22
+ margin: 0;
23
+ padding: 0;
24
+ min-height: 100vh;
25
+ display: flex;
26
+ flex-direction: column;
27
+ align-items: center;
28
+ }
29
+
30
+ .background-video {
31
+ position: fixed;
32
+ right: 0;
33
+ bottom: 0;
34
+ min-width: 100%;
35
+ min-height: 100%;
36
+ z-index: -1;
37
+ object-fit: cover;
38
+ }
39
+
40
+ .container {
41
+ max-width: 1200px;
42
+ width: 95%;
43
+ margin: 40px auto;
44
+ padding: 30px;
45
+ background: var(--card-background);
46
+ border-radius: 15px;
47
+ box-shadow: 0 10px 30px rgba(0, 0, 0, 0.1);
48
+ backdrop-filter: blur(10px);
49
+ max-height: 90vh;
50
+ overflow-y: auto;
51
+ }
52
+
53
+ h1 {
54
+ color: var(--primary-color);
55
+ text-align: center;
56
+ margin-bottom: 30px;
57
+ font-size: 2.5em;
58
+ }
59
+
60
+ .content-wrapper {
61
+ display: flex;
62
+ gap: 30px;
63
+ }
64
+
65
+ .form-container {
66
+ flex: 1;
67
+ }
68
+
69
+ .generated-paper-container {
70
+ flex: 1;
71
+ }
72
+
73
+ form {
74
+ display: grid;
75
+ gap: 15px;
76
+ }
77
+
78
+ label {
79
+ font-weight: 500;
80
+ display: block;
81
+ margin-bottom: 5px;
82
+ }
83
+
84
+ input[type="number"],
85
+ input[type="text"],
86
+ input[type="file"] {
87
+ width: 100%;
88
+ padding: 8px;
89
+ border: 1px solid #ddd;
90
+ border-radius: 5px;
91
+ font-size: 14px;
92
+ }
93
+
94
+ input[type="file"] {
95
+ padding: 8px 0;
96
+ }
97
+
98
+ button {
99
+ background-color: var(--primary-color);
100
+ color: white;
101
+ border: none;
102
+ padding: 10px 15px;
103
+ font-size: 16px;
104
+ border-radius: 5px;
105
+ cursor: pointer;
106
+ transition: background-color 0.3s ease;
107
+ }
108
+
109
+ button:hover {
110
+ background-color: #2980b9;
111
+ }
112
+
113
+ .generated-paper {
114
+ margin-top: 0;
115
+ padding: 20px;
116
+ background-color: #f9f9f9;
117
+ border-radius: 10px;
118
+ border: 1px solid #e0e0e0;
119
+ height: 100%;
120
+ overflow-y: auto;
121
+ }
122
+
123
+ .generated-paper h2 {
124
+ color: var(--secondary-color);
125
+ margin-bottom: 20px;
126
+ }
127
+
128
+ @media (max-width: 900px) {
129
+ .content-wrapper {
130
+ flex-direction: column;
131
+ }
132
+ }
133
+
134
+ @media (max-width: 600px) {
135
+ .container {
136
+ padding: 20px;
137
+ }
138
+ }
139
+ </style>
140
+ </head>
141
+ <body>
142
+ <video class="background-video" autoplay muted loop>
143
+ <source src="../static/paper.mp4" type="video/mp4">
144
+ Your browser does not support the video tag.
145
+ </video>
146
+
147
+ <div class="container">
148
+ <h1>Question Paper Generator</h1>
149
+ <div class="content-wrapper">
150
+ <div class="form-container">
151
+ <form action="/generate-paper" method="post" enctype="multipart/form-data">
152
+ <div>
153
+ <label for="no_of_questions">Number of questions:</label>
154
+ <input type="number" id="no_of_questions" name="no_of_questions" required>
155
+ </div>
156
+
157
+ <div>
158
+ <label for="total_marks">Total marks:</label>
159
+ <input type="number" id="total_marks" name="total_marks" required>
160
+ </div>
161
+
162
+ <div>
163
+ <label for="no_of_parts">Number of parts:</label>
164
+ <input type="number" id="no_of_parts" name="no_of_parts" required>
165
+ </div>
166
+
167
+ <div>
168
+ <label for="marks_per_part">Marks per part:</label>
169
+ <input type="number" id="marks_per_part" name="marks_per_part" required>
170
+ </div>
171
+
172
+ <div>
173
+ <label for="test_duration">Test duration:</label>
174
+ <input type="text" id="test_duration" name="test_duration" placeholder="e.g., 2 hours" required>
175
+ </div>
176
+
177
+ <div>
178
+ <label for="pdf_file">Curriculum PDF:</label>
179
+ <input type="file" id="pdf_file" name="pdf_file" accept="application/pdf" required>
180
+ </div>
181
+
182
+ <button type="submit">Generate Question Paper</button>
183
+ </form>
184
+ </div>
185
+ <div class="generated-paper-container">
186
+ {% if questions %}
187
+ <div class="generated-paper">
188
+ <h2>Generated Question Paper</h2>
189
+ <p>{{ questions }}</p>
190
+ </div>
191
+ {% endif %}
192
+ </div>
193
+ </div>
194
+ </div>
195
+ </body>
196
+ </html>