From 7e7b161b14937ba0081bd7e6c823410adf39497c Mon Sep 17 00:00:00 2001 From: bryantgillespie Date: Thu, 11 Jun 2026 16:49:39 -0400 Subject: [PATCH] Fix broken docs media references --- content/frameworks/01.nextjs/11.pagination-infinite-scroll.md | 4 ++-- content/frameworks/03.astro/02.authentication.md | 2 +- content/frameworks/09.flask/01.data-fetching.md | 2 +- ...n-ai-open-source-santa-roast-app-with-directus-and-nuxt.md | 4 ++-- ...preview-files-in-live-preview-with-google-docs-previews.md | 2 +- 5 files changed, 7 insertions(+), 7 deletions(-) diff --git a/content/frameworks/01.nextjs/11.pagination-infinite-scroll.md b/content/frameworks/01.nextjs/11.pagination-infinite-scroll.md index bc518df5..0aeebce5 100644 --- a/content/frameworks/01.nextjs/11.pagination-infinite-scroll.md +++ b/content/frameworks/01.nextjs/11.pagination-infinite-scroll.md @@ -260,7 +260,7 @@ export default async function Home({ searchParams }) { With this, you can now navigate between pages from the UI: -![Demonstrates how the pagination functionality works by navigating between different pages using the pagination navs at the bottom of the page](/img/f5f3a41e-37d5-4860-9273-f47d0d5adfeb.webp) +![Demonstrates how the pagination functionality works by navigating between different pages using the pagination navs at the bottom of the page](/img/f5f3a41e-37d5-4860-9273-f47d0d5adfeb.gif) ## Implementing Infinite Scrolling @@ -447,7 +447,7 @@ const handleObserver = (entries) => { Here in the `useEffect` hook the Intersection Observer API is used to observe the `` element of the loading indicator. At initial mount and when the `` enters and exists the viewport, the `handleObserver()` callback function is called which will then call `fetchMorePosts()` to fetch new posts and update the state whenever there are more posts and the `` element enters the viewport. With this, the infinite scrolling should now be working: -![Demonstrates the infinte scrolling functionality. When the page is scrolled down to the bottom, the loading indicator is displayed, and new posts are displayed afterwards. Finally, when the bottom of the page is reached again the text No more posts is displayed.](/img/f6dd7960-6296-4242-abc2-5a1232f06143.webp) +![Demonstrates the infinte scrolling functionality. When the page is scrolled down to the bottom, the loading indicator is displayed, and new posts are displayed afterwards. Finally, when the bottom of the page is reached again the text No more posts is displayed.](/img/f6dd7960-6296-4242-abc2-5a1232f06143.gif) ## Which To Use As with most topics, the answer is "it depends". Paginated lists tend to have better performance Search Engine Optimization (SEO) as all page content (typically smaller) is initially loaded on the page. Infinite scrolling is better at maintaining attention and exploration diff --git a/content/frameworks/03.astro/02.authentication.md b/content/frameworks/03.astro/02.authentication.md index 25869ee6..4774dfda 100644 --- a/content/frameworks/03.astro/02.authentication.md +++ b/content/frameworks/03.astro/02.authentication.md @@ -624,7 +624,7 @@ const posts = await client.request(readItems('posts')); This will display all the posts created by the logged-in user on the dashboard page. -![All post in Dashboard Page](/img/all-posts.png) +![All post in Dashboard Page](/img/all-post.png) ### Edit a Post diff --git a/content/frameworks/09.flask/01.data-fetching.md b/content/frameworks/09.flask/01.data-fetching.md index dc05364f..c0a615c2 100644 --- a/content/frameworks/09.flask/01.data-fetching.md +++ b/content/frameworks/09.flask/01.data-fetching.md @@ -335,7 +335,7 @@ def post_page(slug): Now navigate to one of your posts listed on the previous page an see the result. -![Post page displaying post data that came from Directus posts collection](/img/6465a004-0e06-43b6-adbd-dbcd2aff62e0?cache-buster=2024-11-14T10:18:16.419Z&key=system-large-contain) +![Post page displaying post data that came from Directus posts collection](/img/6465a004-0e06-43b6-adbd-dbcd2aff62e0.webp) ## Add Navigation diff --git a/content/tutorials/2.projects/how-i-built-an-ai-open-source-santa-roast-app-with-directus-and-nuxt.md b/content/tutorials/2.projects/how-i-built-an-ai-open-source-santa-roast-app-with-directus-and-nuxt.md index 3dd7ed5e..53a35639 100644 --- a/content/tutorials/2.projects/how-i-built-an-ai-open-source-santa-roast-app-with-directus-and-nuxt.md +++ b/content/tutorials/2.projects/how-i-built-an-ai-open-source-santa-roast-app-with-directus-and-nuxt.md @@ -75,7 +75,7 @@ All communication to the frontend is through a single Directus user name “Sant The `Elves` policy has create, read, and update permissions on `profiles` and `likes`. And also read permissions for the `directus_` system collections in order to generate types using a helper Node script. -![Access policies in the Salty Santa Directus project](/img-salty-santa-6.png) +![Access policies in the Salty Santa Directus project](/img/os-salty-santa-6.png) If you ever use this same pattern, just make sure you’re only using static access tokens for server-to-server comms. You don’t want to expose those to anyone on the frontend because of the elevated permissions that might be attached. @@ -634,7 +634,7 @@ Once you sent your letter to Santa, we’d send the generated text to their API But fear not - here’s a sample of what could have been. diff --git a/content/tutorials/3.tips-and-tricks/preview-files-in-live-preview-with-google-docs-previews.md b/content/tutorials/3.tips-and-tricks/preview-files-in-live-preview-with-google-docs-previews.md index e2b39dc0..fbd269dc 100644 --- a/content/tutorials/3.tips-and-tricks/preview-files-in-live-preview-with-google-docs-previews.md +++ b/content/tutorials/3.tips-and-tricks/preview-files-in-live-preview-with-google-docs-previews.md @@ -19,7 +19,7 @@ Using the file interface, you can store all types of files inside items in your ``` 5. Using the variable tool in the **Preview URL** interface, add in the image `ID` just before the `?` character in the URL. -![Using the plus button to the right of the text box presents all fields within the candidate collection. Select ID with the cursor positioned just before the question mark.](/img/d4018c0d-65e1-42f7-a957-660069934abc.webp) +![Using the plus button to the right of the text box presents all fields within the candidate collection. Select ID with the cursor positioned just before the question mark.](/img/d4018c0d-65e1-42f7-a957-660069934abc.gif) Open up a record in your collection and select the **Live Preview** button in the top-right. Now you can preview the file inside Directus without having to download it first!