arjunakurian commited on
Commit
31b84bf
1 Parent(s): dd0a8a6

Upload 5 files

Browse files
Files changed (5) hide show
  1. advice.html +30 -0
  2. index.html +60 -0
  3. out.html +39 -0
  4. questions.html +89 -0
  5. styles.css +262 -0
advice.html ADDED
@@ -0,0 +1,30 @@
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
1
+ <!DOCTYPE html>
2
+ <html>
3
+ <head>
4
+ <style>
5
+ body {
6
+ font-family: Arial, sans-serif;
7
+ margin: 0;
8
+ padding: 20px;
9
+ }
10
+
11
+ h1 {
12
+ text-align: center;
13
+ background-color: #4CAF50;
14
+ color: white;
15
+ padding: 10px;
16
+ border-radius: 10px; /* Adding border-radius for curved edges */
17
+ border: 2px solid black; /* Adding a black border */
18
+ }
19
+
20
+ ul {
21
+ list-style-type: disc;
22
+ padding-left: 20px;
23
+ }
24
+ </style>
25
+ </head>
26
+ <body>
27
+ <h1>Generated Advice</h1>
28
+ <p>{{ advice }}</p>
29
+ </body>
30
+ </html>
index.html ADDED
@@ -0,0 +1,60 @@
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
1
+ <!DOCTYPE html>
2
+ <html>
3
+ <head>
4
+ <style>
5
+ body {
6
+ font-family: Arial, sans-serif;
7
+ margin: 0;
8
+ padding: 20px;
9
+ }
10
+ h1 {
11
+ text-align: center;
12
+ }
13
+
14
+ form {
15
+ max-width: 400px;
16
+ margin: 0 auto;
17
+ padding: 20px;
18
+ border: 1px solid #ccc;
19
+ border-radius: 5px;
20
+ background-color: #f5f5f5;
21
+ }
22
+
23
+ label {
24
+ display: block;
25
+ margin-bottom: 10px;
26
+ }
27
+
28
+ input[type="number"] {
29
+ width: 100%;
30
+ padding: 10px;
31
+ border: 1px solid #ccc;
32
+ border-radius: 3px;
33
+ font-size: 16px;
34
+ }
35
+
36
+ input[type="submit"] {
37
+ width: 100%;
38
+ padding: 10px;
39
+ border: none;
40
+ border-radius: 3px;
41
+ background-color: #4CAF50;
42
+ color: #fff;
43
+ font-size: 16px;
44
+ cursor: pointer;
45
+ }
46
+
47
+ input[type="submit"]:hover {
48
+ background-color: #45a049;
49
+ }
50
+ </style>
51
+ </head>
52
+ <body>
53
+ <h1>Welcome</h1>
54
+ <form action="{{ url_for('advice') }}" method="post">
55
+ <label for="age">What is your age? (13+)</label>
56
+ <input type="number" name="age" id="age" required>
57
+ <input type="submit" value="Submit">
58
+ </form>
59
+ </body>
60
+ </html>
out.html ADDED
@@ -0,0 +1,39 @@
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
1
+ <!DOCTYPE html>
2
+ <html>
3
+ <body>
4
+ <h1>Generated Advice</h1>
5
+ If you are feeling yes, then it is probably best to consult with a therapist or counselor to get some professional advice.
6
+
7
+ There are many things that you can do in order to feel better. First, make sure that you are getting enough rest. It is important to get at least eight hours of sleep each night. Secondly, eat healthy foods and exercise regularly. This will help to boost your energy and mood. Finally, spend time with loved ones and friends. Doing things that make you happy can help to improve your overall feeling of wellbeing.
8
+
9
+ Assuming you would like tips for becoming a better cyclist:
10
+
11
+ 1. Get a bike that fits you. This may seem like an obvious one, but if your bike is too big or too small, it will make cycling significantly more difficult.
12
+ 2. Invest in some good quality cycling gear. This includes items like a helmet, gloves, and a comfortable pair of cycling shorts.
13
+ 3. Join a cycling club or group. This is a great way to meet other cyclists and to learn from more experienced riders.
14
+ 4. Train regularly. Like with any sport, regular training is essential for becoming a better cyclist. This could involve going on group rides, doing interval training, or simply riding for a certain amount of time each week.
15
+ 5. Enter some races. This is not a requirement, but if you're feeling competitive, racing can be a great way to push yourself to become a better cyclist.
16
+
17
+ If you are feeling unwell, it is important to seek medical advice from a healthcare professional.
18
+
19
+ If you are feeling no, it is important to reach out for help. There are many hotlines and resources available to help you. Here are some resources that may be helpful:
20
+
21
+ National Suicide Prevention Lifeline: 1-800-273-8255
22
+
23
+ Crisis Text Line: Text "HOME" to 741741
24
+
25
+ SAMHSA National Helpline: 1-800-662-4357
26
+
27
+ There are a few things you can do to improve your mood and outlook on life:
28
+
29
+ 1. Get regular exercise - even a moderate amount of exercise can help to improve your mood andenergy levels.
30
+
31
+ 2. Make sure to get enough sleep - Most people need around 8 hours of sleep per night.
32
+
33
+ 3. Eat a healthy diet - Eating nutritious foods can help to improve your mood and overall sense of wellbeing.
34
+
35
+ 4. Spend time with positive people - Surrounding yourself with positive people can help to improve your outlook on life.
36
+
37
+ 5. Take some time for yourself - Make sure to schedule in some time each week to relax and do something that you enjoy. This can help to reduce stress and improve your mood.
38
+ </body>
39
+ </html>
questions.html ADDED
@@ -0,0 +1,89 @@
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
1
+ <!DOCTYPE html>
2
+ <html>
3
+ <head>
4
+ <style>
5
+ body {
6
+ font-family: Arial, sans-serif;
7
+ margin: 0;
8
+ padding: 20px;
9
+ }
10
+ h1 {
11
+ text-align: center;
12
+ }
13
+ form {
14
+ max-width: 400px;
15
+ margin: 0 auto;
16
+ padding: 20px;
17
+ border: 1px solid #ccc;
18
+ border-radius: 5px;
19
+ background-color: #f5f5f5;
20
+ }
21
+ label {
22
+ display: block;
23
+ margin-bottom: 10px;
24
+ }
25
+ input[type="text"] {
26
+ width: 100%;
27
+ padding: 10px;
28
+ border: 1px solid #ccc;
29
+ border-radius: 3px;
30
+ font-size: 16px;
31
+ }
32
+ input[type="submit"] {
33
+ width: 100%;
34
+ padding: 10px;
35
+ border: none;
36
+ border-radius: 3px;
37
+ background-color: #4CAF50;
38
+ color: #fff;
39
+ font-size: 16px;
40
+ cursor: pointer;
41
+ }
42
+ input[type="submit"]:hover {
43
+ background-color: #45a049;
44
+ }
45
+ .next-button {
46
+ display: block;
47
+ width: 100%;
48
+ padding: 10px;
49
+ border: none;
50
+ border-radius: 3px;
51
+ background-color: #0084FF;
52
+ color: #fff;
53
+ font-size: 16px;
54
+ cursor: pointer;
55
+ transition: background-color 0.3s;
56
+ }
57
+ .next-button:hover {
58
+ background-color: #006ac1;
59
+ }
60
+ </style>
61
+ <script>
62
+ function showNextQuestion(currentQuestion) {
63
+ var currentQuestionDiv = document.getElementById(currentQuestion);
64
+ currentQuestionDiv.style.display = 'none';
65
+ var nextQuestionIndex = parseInt(currentQuestion.replace("question", "")) + 1;
66
+ var nextQuestionDiv = document.getElementById("question" + nextQuestionIndex);
67
+ nextQuestionDiv.style.display = 'block';
68
+ }
69
+ </script>
70
+ </head>
71
+ <body>
72
+ <h1>Answer the Questions</h1>
73
+ <form action="{{ url_for('show_questions', age=age) }}" method="post">
74
+ {% for question in questions %}
75
+ <div id="question{{ loop.index }}" {% if loop.index != 1 %}style="display: none;"{% endif %}>
76
+ <label for="answer{{ loop.index }}">{{ question }}</label>
77
+ <input type="text" name="answer{{ loop.index }}" required>
78
+ <br>
79
+ {% if loop.index != questions|length %}
80
+ <button type="button" class="next-button" onclick="showNextQuestion('question{{ loop.index }}')">Next</button>
81
+ {% else %}
82
+
83
+ <input type="submit" value="Submit">
84
+ {% endif %}
85
+ </div>
86
+ {% endfor %}
87
+ </form>
88
+ </body>
89
+ </html>
styles.css ADDED
@@ -0,0 +1,262 @@
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
1
+ @import url('https://fonts.googleapis.com/css2?family=Roboto&display=swap');
2
+ * {
3
+ box-sizing: border-box;
4
+ font-family: 'Roboto', sans-serif;
5
+ }
6
+
7
+ /* Styling the main container */
8
+ .container {
9
+ width: 80%;
10
+ margin: auto;
11
+ margin-top: 2rem;
12
+ letter-spacing: 0.5px;
13
+ height: 80%;
14
+ }
15
+
16
+ img {
17
+ width: 50px;
18
+ vertical-align: middle;
19
+ border-style: none;
20
+ border-radius: 100%;
21
+ }
22
+ /* Styling the msg-header container */
23
+ .msg-header {
24
+ border: 1px solid #ccc;
25
+ width: 100%;
26
+ height: 10%;
27
+ border-bottom: none;
28
+ display: inline-block;
29
+ background-color: #efefef;
30
+ margin: 0;
31
+ border-top-left-radius: 20px;
32
+ border-top-right-radius: 20px;
33
+ }
34
+ /* Styling the profile picture */
35
+ .msgimg {
36
+ margin-left: 2%;
37
+ float: left;
38
+ }
39
+
40
+ .container1 {
41
+ width: 270px;
42
+ height: auto;
43
+ float: left;
44
+ margin: 0;
45
+ }
46
+
47
+ /* styling user-name */
48
+ .active {
49
+ width: 150px;
50
+ float: left;
51
+ color: black;
52
+ font-weight: bold;
53
+ margin: 0 0 0 5px;
54
+ height: 10%;
55
+
56
+ }
57
+ /* Styling the inbox */
58
+ .chat-page {
59
+ padding: 0 0 50px 0;
60
+ }
61
+
62
+ .msg-inbox {
63
+ border: 1px solid #ccc;
64
+ overflow: hidden;
65
+ border-bottom-left-radius: 20px;
66
+ border-bottom-right-radius: 20px;
67
+ }
68
+
69
+
70
+ .chats {
71
+ padding: 30px 15px 0 25px;
72
+ }
73
+
74
+ .msg-page {
75
+ max-height: 500px;
76
+ overflow-y: auto;
77
+ }
78
+
79
+ /* Styling the msg-bottom container */
80
+ .msg-bottom {
81
+ border-top: 1px solid #ccc;
82
+ position: relative;
83
+ height: 11%;
84
+ background-color: rgb(239 239 239);
85
+ }
86
+ /* Styling the input field */
87
+ .input-group {
88
+ float: right;
89
+ margin-top: 13px;
90
+ margin-right: 20px;
91
+ outline: none !important;
92
+ border-radius: 20px;
93
+ width: 61% !important;
94
+ background-color: #fff;
95
+ position: relative;
96
+ display: flex;
97
+ flex-wrap: wrap;
98
+ align-items: stretch;
99
+ }
100
+
101
+ .input-group>.form-control {
102
+ position: relative;
103
+ flex: 1 1 auto;
104
+ width: 1%;
105
+ margin-bottom: 0;
106
+ }
107
+
108
+ .form-control {
109
+ border: none !important;
110
+ border-radius: 20px !important;
111
+ display: block;
112
+ height: calc(2.25rem + 2px);
113
+ padding: 0.375rem 0.75rem;
114
+ font-size: 1rem;
115
+ line-height: 1.5;
116
+ color: #495057;
117
+ background-color: #fff;
118
+ background-clip: padding-box;
119
+ transition: border-color .15s ease-in-out, box-shadow .15s ease-in-out;
120
+ }
121
+
122
+ .input-group-text {
123
+ background: transparent !important;
124
+ border: none !important;
125
+ display: flex;
126
+ align-items: center;
127
+ padding: 0.375rem 0.75rem;
128
+ margin-bottom: 0;
129
+ font-size: 1.5rem;
130
+ font-weight: b;
131
+ line-height: 1.5;
132
+ color: #495057;
133
+ text-align: center;
134
+ white-space: nowrap;
135
+ background-color: #e9ecef;
136
+ border: 1px solid #ced4da;
137
+ border-radius: 0.25rem;
138
+ font-weight: bold !important;
139
+ cursor: pointer;
140
+ }
141
+
142
+ input:focus {
143
+ outline: none;
144
+ border: none !important;
145
+ box-shadow: none !important;
146
+ }
147
+
148
+ .send-icon {
149
+ font-weight: bold !important;
150
+ }
151
+
152
+ /* Styling the avatar */
153
+ received-chats-img {
154
+ display: inline-block;
155
+ width: 50px;
156
+ float: left;
157
+ }
158
+
159
+ .received-msg {
160
+ display: inline-block;
161
+ padding: 0 0 0 10px;
162
+ vertical-align: top;
163
+ width: 92%;
164
+ }
165
+ .received-msg-inbox {
166
+ width: 57%;
167
+ }
168
+
169
+ .received-msg-inbox p {
170
+ background: #efefef none repeat scroll 0 0;
171
+ border-radius: 10px;
172
+ color: #646464;
173
+ font-size: 14px;
174
+ margin-left: 1rem;
175
+ padding: 1rem;
176
+ width: 100%;
177
+ box-shadow: rgb(0 0 0 / 25%) 0px 5px 5px 2px;
178
+ }
179
+ p {
180
+ overflow-wrap: break-word;
181
+ }
182
+
183
+ /* Styling the msg-sent time */
184
+ .time {
185
+ color: #777;
186
+ display: block;
187
+ font-size: 12px;
188
+ margin: 8px 0 0;
189
+ }
190
+ .outgoing-chats {
191
+ overflow: hidden;
192
+ margin: 26px 20px;
193
+ }
194
+
195
+ .outgoing-chats-msg p {
196
+ background-color: #3a12ff;
197
+ background-image: linear-gradient(45deg, #ee087f 0%, #DD2A7B 25%, #9858ac 50%, #8134AF 75%, #515BD4 100%);
198
+ color: #fff;
199
+ border-radius: 10px;
200
+ font-size: 14px;
201
+ color: #fff;
202
+ padding: 5px 10px 5px 12px;
203
+ width: 100%;
204
+ padding: 1rem;
205
+ box-shadow: rgb(0 0 0 / 25%) 0px 2px 5px 2px;
206
+ }
207
+ .outgoing-chats-msg {
208
+ float: right;
209
+ width: 46%;
210
+ }
211
+
212
+ /* Styling the avatar */
213
+ .outgoing-chats-img {
214
+ display: inline-block;
215
+ width: 50px;
216
+ float: right;
217
+ margin-right: 1rem;
218
+ }
219
+ @media only screen and (max-device-width: 850px) {
220
+ *,
221
+ .time {
222
+ font-size: 28px;
223
+ }
224
+ img {
225
+ width: 65px;
226
+ }
227
+ .msg-header {
228
+ height: 5%;
229
+ }
230
+ .msg-page {
231
+ max-height: none;
232
+ }
233
+ .received-msg-inbox p {
234
+ font-size: 28px;
235
+ }
236
+ .outgoing-chats-msg p {
237
+ font-size: 28px;
238
+ }
239
+ }
240
+
241
+ @media only screen and (max-device-width: 450px) {
242
+ *,
243
+ .time {
244
+ font-size: 28px;
245
+ }
246
+ img {
247
+ width: 65px;
248
+ }
249
+ .msg-header {
250
+ height: 5%;
251
+ }
252
+ .msg-page {
253
+ max-height: none;
254
+ }
255
+ .received-msg-inbox p {
256
+ font-size: 28px;
257
+ }
258
+ .outgoing-chats-msg p {
259
+ font-size: 28px;
260
+ }
261
+ }
262
+