start detail page webinars fdnd-agency#31

src/routes/webinars/[slug]/+page.server.js

@@ -0,0 +1,13 @@
+import fetchJson from "$lib/fetch-json"
+
+const baseURL = 'https://fdnd-agency.directus.app/items/'
+
+export async function load({params}) {
+  const url = `${baseURL}/avl_webinars?fields=*.*.*&filter[slug][_eq]=${params.slug}`
+
+  const webinar = await fetchJson(url)
+
+  return {
+    webinar: webinar.data[0]
+  }
+}

src/routes/webinars/[slug]/+page.svelte

@@ -0,0 +1,31 @@
+<script>
+  export let data; 
+</script>
+
+<video controls width="250">
+  <source src="https://fdnd-agency.directus.app/assets/{data.webinar.video.id}">
+  <track kind="captions">
+</video>
+
+<h1>{data.webinar.title}</h1>
+
+<div class='description'>
+  {@html data.webinar.description}
+</div>
+
+<style>
+  .description :global(p) {
+    padding-block: .2rem;
+  }
+
+  video {
+    width: 90vw;
+    margin: var(--margin-center);
+  }
+
+  @media screen and (min-width: 600px){
+    video {
+      width: 50vw;
+    }
+  }
+</style>