Hugging Face's logo

Spaces:
arthrod
/
your-partner-not-your-judge
Sleeping

App Files Community
arthrod commited on
Commit
5b3339f
·
verified ·
1 Parent(s): 8f2b50c

Update app.py

Browse files
Files changed (1) hide show
  1. app.py +315 -0
app.py CHANGED
@@ -135,6 +135,111 @@ def _(mo):
135
 
136
  # Page 2 Content
137
  mo.Html("""
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
138
  <!-- Page 2 -->
139
  <div id="page2" class="page">
140
  <h2>A t:able Conversation!</h2>
@@ -159,6 +264,111 @@ def _(mo):
159
 
160
  # Page 3 Content
161
  mo.Html("""
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
162
  <!-- Page 3 -->
163
  <div id="page3" class="page">
164
  <h2>Bonus: Team Mascots!</h2>
@@ -214,6 +424,111 @@ def _(mo):
214
 
215
  # Page 4: Conclusion
216
  mo.Html("""
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
217
  <!-- Page 4: Conclusion -->
218
  <div id="page4" class="page">
219
  <h2>Collaboration Wins!</h2>
 
135
 
136
  # Page 2 Content
137
  mo.Html("""
138
+ <!DOCTYPE html>
139
+ <html lang="en">
140
+ <head>
141
+ <meta charset="UTF-8">
142
+ <meta name="viewport" content="width=device-width, initial-scale=1.0">
143
+ <title>Our t:able Legal Journey</title>
144
+ <style>
145
+ body {
146
+ font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";
147
+ background-color: #f8f9fa;
148
+ color: #333333;
149
+ display: flex;
150
+ justify-content: center;
151
+ align-items: center;
152
+ min-height: 100vh;
153
+ margin: 0;
154
+ padding: 20px;
155
+ box-sizing: border-box;
156
+ }
157
+ .container {
158
+ background-color: #ffffff;
159
+ padding: 30px 40px;
160
+ border-radius: 12px;
161
+ box-shadow: 0 6px 12px rgba(0, 0, 0, 0.08);
162
+ text-align: center;
163
+ max-width: 600px;
164
+ width: 100%;
165
+ overflow: hidden;
166
+ }
167
+ .page {
168
+ display: none;
169
+ animation: fadeIn 0.4s ease-in-out;
170
+ }
171
+ .page.active {
172
+ display: block;
173
+ }
174
+ @keyframes fadeIn {
175
+ from { opacity: 0; transform: translateY(8px); }
176
+ to { opacity: 1; transform: translateY(0); }
177
+ }
178
+ h2 {
179
+ color: #00A87E;
180
+ margin-bottom: 20px;
181
+ font-size: 1.8em;
182
+ font-weight: 600;
183
+ }
184
+ p {
185
+ font-size: 1.1em;
186
+ line-height: 1.6;
187
+ margin-bottom: 25px;
188
+ color: #555555;
189
+ }
190
+ svg {
191
+ max-width: 140px;
192
+ height: auto;
193
+ margin: 20px auto;
194
+ display: block;
195
+ }
196
+ .cat-gallery {
197
+ display: flex;
198
+ justify-content: space-around;
199
+ flex-wrap: wrap;
200
+ gap: 15px;
201
+ margin-bottom: 20px;
202
+ }
203
+ .cat-gallery svg {
204
+ max-width: 90px;
205
+ }
206
+ .navigation {
207
+ margin-top: 30px;
208
+ display: flex;
209
+ justify-content: space-between;
210
+ }
211
+ button {
212
+ background-color: #00A87E;
213
+ color: #ffffff;
214
+ border: none;
215
+ padding: 10px 22px;
216
+ border-radius: 8px;
217
+ font-family: inherit;
218
+ font-size: 1em;
219
+ font-weight: 500;
220
+ cursor: pointer;
221
+ transition: background-color 0.2s ease, transform 0.1s ease, box-shadow 0.1s ease;
222
+ box-shadow: 0 2px 4px rgba(0,0,0,0.05);
223
+ }
224
+ button:hover {
225
+ background-color: #008a68;
226
+ box-shadow: 0 4px 8px rgba(0,0,0,0.07);
227
+ }
228
+ button:active {
229
+ transform: translateY(1px);
230
+ box-shadow: 0 1px 2px rgba(0,0,0,0.05);
231
+ }
232
+ button:disabled {
233
+ background-color: #b2e0d4;
234
+ color: #6c757d;
235
+ cursor: not-allowed;
236
+ opacity: 0.8;
237
+ box-shadow: none;
238
+ }
239
+ </style>
240
+ </head>
241
+ <body>
242
+ <div class="container">
243
  <!-- Page 2 -->
244
  <div id="page2" class="page">
245
  <h2>A t:able Conversation!</h2>
 
264
 
265
  # Page 3 Content
266
  mo.Html("""
267
+ <!DOCTYPE html>
268
+ <html lang="en">
269
+ <head>
270
+ <meta charset="UTF-8">
271
+ <meta name="viewport" content="width=device-width, initial-scale=1.0">
272
+ <title>Our t:able Legal Journey</title>
273
+ <style>
274
+ body {
275
+ font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";
276
+ background-color: #f8f9fa;
277
+ color: #333333;
278
+ display: flex;
279
+ justify-content: center;
280
+ align-items: center;
281
+ min-height: 100vh;
282
+ margin: 0;
283
+ padding: 20px;
284
+ box-sizing: border-box;
285
+ }
286
+ .container {
287
+ background-color: #ffffff;
288
+ padding: 30px 40px;
289
+ border-radius: 12px;
290
+ box-shadow: 0 6px 12px rgba(0, 0, 0, 0.08);
291
+ text-align: center;
292
+ max-width: 600px;
293
+ width: 100%;
294
+ overflow: hidden;
295
+ }
296
+ .page {
297
+ display: none;
298
+ animation: fadeIn 0.4s ease-in-out;
299
+ }
300
+ .page.active {
301
+ display: block;
302
+ }
303
+ @keyframes fadeIn {
304
+ from { opacity: 0; transform: translateY(8px); }
305
+ to { opacity: 1; transform: translateY(0); }
306
+ }
307
+ h2 {
308
+ color: #00A87E;
309
+ margin-bottom: 20px;
310
+ font-size: 1.8em;
311
+ font-weight: 600;
312
+ }
313
+ p {
314
+ font-size: 1.1em;
315
+ line-height: 1.6;
316
+ margin-bottom: 25px;
317
+ color: #555555;
318
+ }
319
+ svg {
320
+ max-width: 140px;
321
+ height: auto;
322
+ margin: 20px auto;
323
+ display: block;
324
+ }
325
+ .cat-gallery {
326
+ display: flex;
327
+ justify-content: space-around;
328
+ flex-wrap: wrap;
329
+ gap: 15px;
330
+ margin-bottom: 20px;
331
+ }
332
+ .cat-gallery svg {
333
+ max-width: 90px;
334
+ }
335
+ .navigation {
336
+ margin-top: 30px;
337
+ display: flex;
338
+ justify-content: space-between;
339
+ }
340
+ button {
341
+ background-color: #00A87E;
342
+ color: #ffffff;
343
+ border: none;
344
+ padding: 10px 22px;
345
+ border-radius: 8px;
346
+ font-family: inherit;
347
+ font-size: 1em;
348
+ font-weight: 500;
349
+ cursor: pointer;
350
+ transition: background-color 0.2s ease, transform 0.1s ease, box-shadow 0.1s ease;
351
+ box-shadow: 0 2px 4px rgba(0,0,0,0.05);
352
+ }
353
+ button:hover {
354
+ background-color: #008a68;
355
+ box-shadow: 0 4px 8px rgba(0,0,0,0.07);
356
+ }
357
+ button:active {
358
+ transform: translateY(1px);
359
+ box-shadow: 0 1px 2px rgba(0,0,0,0.05);
360
+ }
361
+ button:disabled {
362
+ background-color: #b2e0d4;
363
+ color: #6c757d;
364
+ cursor: not-allowed;
365
+ opacity: 0.8;
366
+ box-shadow: none;
367
+ }
368
+ </style>
369
+ </head>
370
+ <body>
371
+ <div class="container">
372
  <!-- Page 3 -->
373
  <div id="page3" class="page">
374
  <h2>Bonus: Team Mascots!</h2>
 
424
 
425
  # Page 4: Conclusion
426
  mo.Html("""
427
+ <!DOCTYPE html>
428
+ <html lang="en">
429
+ <head>
430
+ <meta charset="UTF-8">
431
+ <meta name="viewport" content="width=device-width, initial-scale=1.0">
432
+ <title>Our t:able Legal Journey</title>
433
+ <style>
434
+ body {
435
+ font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";
436
+ background-color: #f8f9fa;
437
+ color: #333333;
438
+ display: flex;
439
+ justify-content: center;
440
+ align-items: center;
441
+ min-height: 100vh;
442
+ margin: 0;
443
+ padding: 20px;
444
+ box-sizing: border-box;
445
+ }
446
+ .container {
447
+ background-color: #ffffff;
448
+ padding: 30px 40px;
449
+ border-radius: 12px;
450
+ box-shadow: 0 6px 12px rgba(0, 0, 0, 0.08);
451
+ text-align: center;
452
+ max-width: 600px;
453
+ width: 100%;
454
+ overflow: hidden;
455
+ }
456
+ .page {
457
+ display: none;
458
+ animation: fadeIn 0.4s ease-in-out;
459
+ }
460
+ .page.active {
461
+ display: block;
462
+ }
463
+ @keyframes fadeIn {
464
+ from { opacity: 0; transform: translateY(8px); }
465
+ to { opacity: 1; transform: translateY(0); }
466
+ }
467
+ h2 {
468
+ color: #00A87E;
469
+ margin-bottom: 20px;
470
+ font-size: 1.8em;
471
+ font-weight: 600;
472
+ }
473
+ p {
474
+ font-size: 1.1em;
475
+ line-height: 1.6;
476
+ margin-bottom: 25px;
477
+ color: #555555;
478
+ }
479
+ svg {
480
+ max-width: 140px;
481
+ height: auto;
482
+ margin: 20px auto;
483
+ display: block;
484
+ }
485
+ .cat-gallery {
486
+ display: flex;
487
+ justify-content: space-around;
488
+ flex-wrap: wrap;
489
+ gap: 15px;
490
+ margin-bottom: 20px;
491
+ }
492
+ .cat-gallery svg {
493
+ max-width: 90px;
494
+ }
495
+ .navigation {
496
+ margin-top: 30px;
497
+ display: flex;
498
+ justify-content: space-between;
499
+ }
500
+ button {
501
+ background-color: #00A87E;
502
+ color: #ffffff;
503
+ border: none;
504
+ padding: 10px 22px;
505
+ border-radius: 8px;
506
+ font-family: inherit;
507
+ font-size: 1em;
508
+ font-weight: 500;
509
+ cursor: pointer;
510
+ transition: background-color 0.2s ease, transform 0.1s ease, box-shadow 0.1s ease;
511
+ box-shadow: 0 2px 4px rgba(0,0,0,0.05);
512
+ }
513
+ button:hover {
514
+ background-color: #008a68;
515
+ box-shadow: 0 4px 8px rgba(0,0,0,0.07);
516
+ }
517
+ button:active {
518
+ transform: translateY(1px);
519
+ box-shadow: 0 1px 2px rgba(0,0,0,0.05);
520
+ }
521
+ button:disabled {
522
+ background-color: #b2e0d4;
523
+ color: #6c757d;
524
+ cursor: not-allowed;
525
+ opacity: 0.8;
526
+ box-shadow: none;
527
+ }
528
+ </style>
529
+ </head>
530
+ <body>
531
+ <div class="container">
532
  <!-- Page 4: Conclusion -->
533
  <div id="page4" class="page">
534
  <h2>Collaboration Wins!</h2>