🪻 distributed transcription service
thistle.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="icon"
9 href="data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 100'><text y='0.9em' font-size='90'>🪻</text></svg>">
10 <link rel="stylesheet" href="../styles/main.css">
11 <style>
12 .page-header {
13 text-align: center;
14 margin-bottom: 3rem;
15 }
16
17 .page-title {
18 font-size: 2.5rem;
19 font-weight: 700;
20 color: var(--text);
21 margin-bottom: 0.5rem;
22 }
23
24 .page-subtitle {
25 font-size: 1.125rem;
26 color: var(--text);
27 opacity: 0.8;
28 }
29 </style>
30</head>
31
32<body>
33 <header>
34 <div class="header-content">
35 <a href="/" class="site-title">
36 <span>🪻</span>
37 <span>Thistle - Transcription</span>
38 </a>
39 <auth-component></auth-component>
40 </div>
41 </header>
42
43 <main>
44 <div style="margin-bottom: 1rem;">
45 <a href="/classes" style="color: var(--paynes-gray); text-decoration: none; font-size: 0.875rem;">
46 ← Back to classes
47 </a>
48 </div>
49
50 <div class="page-header">
51 <h1 class="page-title">Upload Transcription</h1>
52 <p class="page-subtitle">Upload your audio files and get accurate transcripts powered by Whisper</p>
53 </div>
54
55 <transcription-component></transcription-component>
56 </main>
57
58 <script type="module" src="../components/auth.ts"></script>
59 <script type="module" src="../components/transcription.ts"></script>
60</body>
61
62</html>