Add .include-dark class and update alt text for PR #1815 screenshots

- Add .include-dark to tools.png, myblog.png, and 4 about-page images
  (trestles, solana, marquee, broadside) so dark variants render
- Replace Twitter references with Bluesky in alt text
- Use concise alt text matching manifest descriptions
- jolla and navbar-tools already updated in prior commits

Author: cderv

docs/websites/website-about.qmd

@@ -70,19 +70,19 @@ Here is a preview of each of the templates:
 
 ### trestles
 
-![](images/about-trestles.png){.border fig-alt="Screenshot of About page with trestles template. On the left-hand side there is a rectangular photo above the author's name, and two buttons (one for twitter, and one for github below). On the right hand side there is a paragraph of body text followed by headered sections for Education and Experience."}
+![](images/about-trestles.png){.border .include-dark fig-alt="Screenshot of an About page using the trestles template. It has a headshot of the author and links on the left and the body of the about page on the right."}
 
 ### solana
 
-![](images/about-solana.png){.border fig-alt="Screenshot of About page with solana template. The left-hand side has the name as a main header with buttons for twitter and github below it. Below the buttons there is a paragraph of body text, followed by headered sections for Education and Experience. In the upper right-hand column there is a rectangular image."}
+![](images/about-solana.png){.border .include-dark fig-alt="Screenshot of an About page using the solana template. It has the author name, links, and body on the left and a rectangular headshot on the right."}
 
 ### marquee
 
-![](images/about-marquee.png){.border fig-alt="Screenshot of About page with marquee template. A large square image is at the top. Beneath that the author's name is a header, and there is a paragraph of body text, followed by headered sections for Education and Experience. Centered at the bottom of the page are links to Twitter and GitHub with their respective icons next to them."}
+![](images/about-marquee.png){.border .include-dark fig-alt="Screenshot of an About page using the marquee template. It has a large image at the top, followed by the author name, body, and links below."}
 
 ### broadside
 
-![](images/about-broadside.png){.border fig-alt="Screenshot of About page with broadside template. The left side is a rectangular image. On the right-hand side the author's name is a header, and there is a paragraph of body text, followed by headered sections for Education and Experience. Centered at the bottom of the page are links to Twitter and GitHub with their respective icons next to them."}
+![](images/about-broadside.png){.border .include-dark fig-alt="Screenshot of an About page using the broadside template. It has the author image on the left and the name, body, and links on the right."}
 :::
 
 ### Image

docs/websites/website-blog.qmd

@@ -108,7 +108,7 @@ In the following sections we'll take a closer look at the various components of
 
 The home page is a [listing page](website-listings.qmd) for all of the documents in the `posts` directory:
 
-![](images/myblog.png){.border fig-alt="Screenshot of a blog page. There is a navigation bar at the top with the blog title ('myblog') on the left, and on the right: 'About', a GitHub icon, a Twitter icon, and a Search icon. The body has two posts listed with titles, tags, description and preview ordered by date. On the right of the body are categories with counts of posts next to them."}
+![](images/myblog.png){.border .include-dark fig-alt="Screenshot of a blog listing page with a navbar showing the blog name, About link, GitHub and Bluesky icons, and two blog posts with thumbnail images and categories."}
 
 Here's the source code for the home page:
 

docs/websites/website-navigation.qmd

@@ -273,7 +273,7 @@ website:
             href:  https://bugs.com
 ```
 
-![](images/tools.png){fig-alt="The top section of a Quarto sidebar containing a Twitter and Github logo. The Github logo is selected and a menu is underneath it with two items: 'Source Code' and 'Report a Bug'"}
+![](images/tools.png){.border .include-dark fig-alt="A Quarto sidebar showing the site title with Bluesky and GitHub icons. The GitHub icon is selected and a dropdown menu shows two items: 'Source Code' and 'Report a Bug'. Below are a search box and navigation sections."}
 :::
 
 ## Hybrid Navigation