Merge branch 'v2' into style-tweaks

src/app.d.ts

@@ -1,5 +1,5 @@
 // See https://kit.svelte.dev/docs/types#app
-import type {UserWithRoles} from '$server/auth/users';
+import type { UserWithRoles } from '$server/auth/users';
 import { PrismaClient } from '@prisma/client/index.d.ts';
 
 // for information about these interfaces
@@ -18,6 +18,10 @@ declare global {
 		// interface PageData {}
 		// interface Platform {}
 	}
+	interface Document {
+		// eslint-disable-next-line @typescript-eslint/no-explicit-any
+		startViewTransition: (callback: any) => void; // Add your custom property/method here
+	}
 }
 
 export {};

src/lib/LayoutDebug.svelte

@@ -14,7 +14,7 @@
 	</div>
 {/if}
 
-<style>
+<style lang="postcss">
 	:global(.layout) > .l-margin-debug {
 		pointer-events: none;
 		grid-column: l-margin / l-margin-end !important;

src/lib/Loading.svelte

@@ -23,7 +23,7 @@
 	</div>
 {/if}
 
-<style>
+<style lang="postcss">
 	.loader {
 		z-index: 10;
 		position: fixed;

src/lib/PodcastHero.svelte

@@ -40,7 +40,7 @@
 	</div>
 </section>
 
-<style>
+<style lang="postcss">
 	section {
 		background-image: url($assets/whitegrit.png),
 			radial-gradient(farthest-side circle at 50% 0%, #3a006b36 4% 4%, #000 100%);
@@ -66,6 +66,7 @@
 		max-width: 850px;
 		margin: 0 auto;
 	}
+
 	.zone {
 		padding-bottom: 2rem;
 	}

src/lib/PodcastLinks.svelte

@@ -10,9 +10,10 @@
 	{/each}
 </div>
 
+
 <p>social..</p>
 
-<style>
+<style lang="postcss">
 	div {
 		display: flex;
 		flex-wrap: wrap;

src/lib/hosts/Host.svelte

@@ -3,8 +3,8 @@
 	export let guest: boolean = false;
 	export let host: {
 		name: string;
-		github: string;
-		twitter: string;
+		github?: string;
+		twitter?: string;
 		slug?: string;
 	};
 </script>
@@ -25,7 +25,7 @@
 	</figcaption>
 </figure>
 
-<style>
+<style lang="postcss">
 	figure {
 		display: grid;
 		gap: 20px;

src/lib/hosts/HostSocialLink.svelte

@@ -2,15 +2,16 @@
 	import Icon from '$lib/Icon.svelte';
 	export let host: {
 		name: string;
-		github: string;
-		twitter: string;
+		github?: string | null;
+		twitter?: string | null;
 		slug?: string;
 	};
 </script>
 
 <a href={`https://x.com/${host.twitter}`} target="_blank" rel="noopener" class="social-icon">
 	<Icon name="x" title={`${host.name} on X`} />
 </a>
+
 <a href={`https://github.com/${host.github}`} target="_blank" rel="noopener" class="social-icon">
 	<Icon name="github" title={`${host.name} on GitHub`} />
 </a>

src/lib/player/Album.svelte

@@ -21,7 +21,7 @@
 	</svg>
 </div>
 
-<style>
+<style lang="postcss">
 	.album {
 		background-color: var(--black);
 		padding: 5px;

src/lib/player/CD.svelte

@@ -151,7 +151,7 @@
 	</svg>
 </div>
 
-<style>
+<style lang="postcss">
 	.case {
 		position: relative;
 		background: black;

src/lib/player/Visualizer.svelte

@@ -73,7 +73,7 @@
 	{/each}
 </div>
 
-<style>
+<style lang="postcss">
 	.visualizer {
 		gap: 5px;
 		height: 60px;

src/lib/search/SearchResults.svelte

@@ -17,7 +17,7 @@ Renders a list of search results
 	<p class="info">No results</p>
 {/if}
 
-<style>
+<style lang="postcss">
 	.info {
 		padding: 1rem;
 		font-size: 1.2rem;

src/lib/theme/ThemeToggle.svelte

@@ -4,7 +4,7 @@
 
 <button on:click={theme_maker.open}>🎨</button>
 
-<style>
+<style lang="postcss">
 	button {
 		background: transparent;
 		border: var(--yellow) solid 1px;

src/lib/transcript/Squiggle.svelte

@@ -20,7 +20,7 @@
 	/>
 </svg>
 
-<style>
+<style lang="postcss">
 	svg {
 		position: absolute;
 		top: 100%;

src/lib/transcript/TableOfContents.svelte

@@ -18,7 +18,7 @@
 	</ul>
 </div>
 
-<style>
+<style lang="postcss">
 	ul {
 		margin: 0;
 		padding: 0;

src/lib/transcript/Transcript.svelte

@@ -139,7 +139,7 @@
 	{/each}
 </div>
 
-<style>
+<style lang="postcss">
 	.timeline {
 		--highlight: var(--bg-2);
 		--future: var(--bg-2);
@@ -266,8 +266,6 @@
 
 	.timeline {
 		--gutter-border-size: 5px;
-		section {
-		}
 	}
 	.speaker {
 		font-size: var(--font-size-sm);

src/params/ThemeMaker.svelte

@@ -64,7 +64,7 @@
 <!-- Themes should be only in json or in a users settings. -->
 <!-- Saved as a cookie -->
 
-<style>
+<style lang="postcss">
 	section {
 		position: fixed;
 		top: 0;

src/routes/UserMenu.svelte

@@ -24,7 +24,7 @@
 	>
 {/if}
 
-<style>
+<style lang="postcss">
 	.avatar {
 		width: 50px;
 		height: 50px;

src/routes/about/+page.svelte

@@ -92,7 +92,7 @@
 	</div>
 </main>
 
-<style>
+<style lang="postcss">
 	img.avatar {
 		width: 150px;
 		border-radius: 8px;

src/routes/admin/shows/+page.server.ts

@@ -2,7 +2,7 @@ import { import_or_update_all_shows } from '$server/shows';
 import { error } from '@sveltejs/kit';
 import { get_transcript } from '$server/transcripts/deepgram';
 import { aiNoteRequestHandler } from '$server/ai/requestHandlers';
-import { PageServerLoad } from './$types';
+import type { PageServerLoad } from './$types';
 
 export const load: PageServerLoad = async ({ locals }) => {
 	return {

src/routes/admin/shows/+page.svelte

@@ -85,7 +85,7 @@
 	</tbody>
 </table>
 
-<style>
+<style lang="postcss">
 	table {
 		border: 1px solid black;
 		width: 100%;

src/routes/admin/shows/[show_number]/Dump.svelte

@@ -45,7 +45,7 @@
 	</tbody>
 </table>
 
-<style>
+<style lang="postcss">
 	table {
 		border: 1px solid black;
 		width: 100%;

src/routes/admin/transcripts/+page.svelte

@@ -1,6 +1,7 @@
 <script lang="ts">
 	import { enhance } from '$app/forms';
 	import { form_action } from '$lib/form_action';
+	import { ActionResult } from '@sveltejs/kit';
 	import type { PageData } from './$types';
 	import { format } from 'date-fns';
 

src/routes/guest/[name_slug]/+page.svelte

@@ -6,22 +6,26 @@
 	$: ({ guest } = data);
 </script>
 
-<section>
-	<header>
-		<img src={`https://github.com/${guest.github}.png`} alt={guest.name} />
-		<div>
-			<h1>{guest.name}</h1>
-			<div class="guest_socials">
-				<HostSocialLink link={`https://x.com/${guest.twitter}`} />
+{#if guest}
+	<section>
+		<header>
+			<img src={`https://github.com/${guest.github}.png`} alt={guest.name} />
+			<div>
+				<h1>{guest.name}</h1>
+				{#if guest.twitter}
+					<div class="guest_socials">
+						<HostSocialLink host={guest} />
+					</div>
+				{/if}
 			</div>
-		</div>
-	</header>
-	{#each guest.shows as { Show }}
-		<ShowCard show={Show} display="list" />
-	{/each}
-</section>
+		</header>
+		{#each guest.shows as { Show }}
+			<ShowCard show={Show} display="list" />
+		{/each}
+	</section>
+{/if}
 
-<style>
+<style lang="postcss">
 	header {
 		display: grid;
 		grid-template-columns: auto 1fr;

src/routes/og/[number=show_number]/Template.svelte

@@ -11,7 +11,7 @@
 	</footer>
 </div>
 
-<style>
+<style lang="postcss">
 	.og-template {
 		background: black;
 		color: white;