this repo has no description
1<script lang="ts">
2 function getError(): string {
3 const params = new URLSearchParams(window.location.hash.split('?')[1] || '')
4 return params.get('error') || 'Unknown error'
5 }
6
7 function getErrorDescription(): string | null {
8 const params = new URLSearchParams(window.location.hash.split('?')[1] || '')
9 return params.get('error_description')
10 }
11
12 function handleBack() {
13 window.history.back()
14 }
15
16 let error = $derived(getError())
17 let errorDescription = $derived(getErrorDescription())
18</script>
19
20<div class="oauth-error-container">
21 <h1>Authorization Error</h1>
22
23 <div class="error-box">
24 <div class="error-code">{error}</div>
25 {#if errorDescription}
26 <div class="error-description">{errorDescription}</div>
27 {/if}
28 </div>
29
30 <button type="button" onclick={handleBack}>
31 Go Back
32 </button>
33</div>
34
35<style>
36 .oauth-error-container {
37 max-width: 400px;
38 margin: 4rem auto;
39 padding: 2rem;
40 text-align: center;
41 }
42
43 h1 {
44 margin: 0 0 1.5rem 0;
45 color: var(--error-text);
46 }
47
48 .error-box {
49 padding: 1.5rem;
50 background: var(--error-bg);
51 border: 1px solid var(--error-border);
52 border-radius: 8px;
53 margin-bottom: 1.5rem;
54 }
55
56 .error-code {
57 font-family: monospace;
58 font-size: 1rem;
59 color: var(--error-text);
60 margin-bottom: 0.5rem;
61 }
62
63 .error-description {
64 color: var(--text-secondary);
65 font-size: 0.875rem;
66 }
67
68 button {
69 padding: 0.75rem 1.5rem;
70 background: var(--accent);
71 color: white;
72 border: none;
73 border-radius: 4px;
74 font-size: 1rem;
75 cursor: pointer;
76 }
77
78 button:hover {
79 background: var(--accent-hover);
80 }
81</style>