🪻 distributed transcription service
thistle.dunkirk.sh
dunkirk.sh
1<!DOCTYPE html>
2<html lang="en">
3
4<head>
5 <meta charset="UTF-8">
6 <meta name="viewport" content="width=device-width, initial-scale=1.0">
7 <title>Transcribe - Thistle</title>
8 <link rel="apple-touch-icon" sizes="180x180" href="../../public/favicon/apple-touch-icon.png">
9 <link rel="icon" type="image/png" sizes="32x32" href="../../public/favicon/favicon-32x32.png">
10 <link rel="icon" type="image/png" sizes="16x16" href="../../public/favicon/favicon-16x16.png">
11 <link rel="manifest" href="../../public/favicon/site.webmanifest">
12 <link rel="stylesheet" href="../styles/main.css">
13 <style>
14 .page-header {
15 text-align: center;
16 margin-bottom: 3rem;
17 }
18
19 .page-title {
20 font-size: 2.5rem;
21 font-weight: 700;
22 color: var(--text);
23 margin-bottom: 0.5rem;
24 }
25
26 .page-subtitle {
27 font-size: 1.125rem;
28 color: var(--text);
29 opacity: 0.8;
30 }
31 </style>
32</head>
33
34<body>
35 <header>
36 <div class="header-content">
37 <a href="/" class="site-title">
38 <img src="../../public/favicon/favicon-32x32.png" alt="Thistle logo">
39 <span>Thistle - Transcription</span>
40 </a>
41 <auth-component></auth-component>
42 </div>
43 </header>
44
45 <main>
46 <div style="margin-bottom: 1rem;">
47 <a href="/classes" style="color: var(--paynes-gray); text-decoration: none; font-size: 0.875rem;">
48 ← Back to classes
49 </a>
50 </div>
51
52 <div class="page-header">
53 <h1 class="page-title">Upload Transcription</h1>
54 <p class="page-subtitle">Upload your audio files and get accurate transcripts powered by Whisper</p>
55 </div>
56
57 <transcription-component></transcription-component>
58 </main>
59
60 <script type="module" src="../components/auth.ts"></script>
61 <script type="module" src="../components/transcription.ts"></script>
62</body>
63
64</html>