docs: Updates for pkgdown 2.1.0

DESCRIPTION

@@ -111,7 +111,7 @@ Config/testthat/parallel: true
 Config/testthat/start-first: zzzz-bs-sass, fonts, zzz-precompile, theme-*, rmd-*
 Encoding: UTF-8
 Roxygen: list(markdown = TRUE)
-RoxygenNote: 7.3.1
+RoxygenNote: 7.3.2
 Collate:
     'accordion.R'
     'breakpoints.R'

_pkgdown.yml

@@ -22,20 +22,16 @@ template:
     docsearch:
       api_key: 53fd87c79a13e431b4298611470d023a
       index_name: bslib
-  includes:
-    in_header: >
-      <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap-icons@latest/font/bootstrap-icons.css">
+  light-switch: true
 
 navbar:
   bg: info
   type: light
   structure:
     left:  [get-started, examples, theming, components, layouts]
-    right: [reference, news, github, dark-mode]
+    right: [reference, news, github, lightswitch]
   components:
     home: ~
-    dark-mode:
-      href: "#dark-mode"
 
     get-started:
       text: Get Started
@@ -86,6 +82,7 @@ navbar:
 
     github:
       icon: bi-github
+      aria-label: GitHub
       href: https://github.com/rstudio/bslib
 
 news:

vignettes/any-project/index.Rmd

@@ -139,6 +139,7 @@ output:
 
 ::: col-md-6
 ```{r, echo = FALSE}
+#| fig.alt: RStudio "New Template" dialog showing three theming-related templates from bslib.
 knitr::include_graphics("rstudio-templates.png")
 ```
 :::

vignettes/cards/index.Rmd

@@ -375,6 +375,7 @@ card(
   full_screen = TRUE,
   card_image(
     file = "shiny-hex.svg",
+    alt = "Shiny's hex sticker",
     href = "https://github.com/rstudio/shiny"
   ),
   card_body(

vignettes/custom-components/index.Rmd

@@ -64,6 +64,7 @@ shinyApp(ui, function(input, output) {})
 ```
 
 ```{r, echo = FALSE, out.width="67%"}
+#| fig.alt: Two custom person components, one each for Andrew Carnegie and John D. Rockefeller.
 knitr::include_graphics("person.png")
 ```
 

vignettes/theming/index.Rmd

@@ -82,6 +82,7 @@ knitr::include_graphics("themer.gif")
 When running the theming widget locally, you'll see output like this in your R console (in R Markdown, you'll see YAML output instead of R code) to reproduce the theming changes:
 
 ```{r, echo = FALSE, out.width="80%"}
+#| fig.alt: Console output showing the R code to reproduce the theming changes.
 knitr::include_graphics("themer-code.png")
 ```
 
@@ -108,6 +109,7 @@ output:
 </div>
 
 ```{r, echo = FALSE}
+#| fig.alt: A screenshot of the minty Bootswatch theme.
 knitr::include_graphics("bootswatch.png")
 ```
 
@@ -153,6 +155,7 @@ output:
 :::
 
 ```{r, echo = FALSE}
+#| fig.alt: A screenshot showing a dark mode theme with custom fonts.
 knitr::include_graphics("custom-dark-mode.png")
 ```
 
@@ -199,6 +202,7 @@ output:
 </div>
 
 ```{r, echo = FALSE, out.width="67%"}
+#| fig.alt: A progress bar indicator colored orange.
 knitr::include_graphics("progress-orange.png")
 ```
 
@@ -275,6 +279,7 @@ bs_theme(
 ```
 
 ```{r, echo = FALSE}
+#| fig.alt: A screenshot showing a Shiny app with a video game style thanks to NES.css.
 knitr::include_graphics("nes.png")
 ```
 
@@ -342,6 +347,7 @@ shinyApp(ui, server)
 ```
 
 ```{r, echo = FALSE, out.width="50%"}
+#| fig.alt: An animation showing a dark mode switch in a Shiny app toggling on and off.
 knitr::include_graphics("dark-mode.gif")
 ```
 

vignettes/utility-classes/index.Rmd

@@ -30,6 +30,7 @@ tabsetPanel(
 ```
 
 ```{r, echo = FALSE, out.width="67%"}
+#| fig.alt: A tabset panel without padding or borders, showing plain text placed directly against the tab's bottom border.
 knitr::include_graphics("tab-before.png")
 ```
 
@@ -46,6 +47,7 @@ tabsetPanel(
 ```
 
 ```{r, echo = FALSE, out.width="67%"}
+#| fig.alt: A tabset panel with padding and borders, showing a border around the tab content and padding between the tab content and the tab's border.
 knitr::include_graphics("tab-after.png")
 ```
 
@@ -63,16 +65,19 @@ tabsetPanel(
 ```
 
 ```{r, echo = FALSE, out.width="67%"}
+#| fig.alt: Tabs using a pills style where the tab controls look like buttons.
 knitr::include_graphics("pills.png")
 ```
 
 It's also worth noting that you can also add these classes to [rmarkdown tabsets](https://bookdown.org/yihui/rmarkdown-cookbook/html-tabs.html), like so:
 
 ```{r, echo = FALSE, out.width="50%"}
+#| fig.alt: Source code for an rmarkdown tabset, see the previous link for the code.
 knitr::include_graphics("rmarkdown-tabs-source.png")
 ```
 
 ```{r, echo = FALSE}
+#| fig.alt: Screenshot of a rendered rmarkdown tabset.
 knitr::include_graphics("rmarkdown-tabs.png")
 ```
 
@@ -91,6 +96,7 @@ fluidPage(
 ```
 
 ```{r, echo = FALSE, out.width="67%"}
+#| fig.alt: Tabs using a pills style where the tab controls look like buttons and are horizontally centered.
 knitr::include_graphics("pills.png")
 ```
 
@@ -122,6 +128,7 @@ shinyApp(
 ```
 
 ```{r, echo = FALSE, out.width="67%"}
+#| fig.alt: A card component with an orage header and a table of the mtcars dataset in the card body.
 knitr::include_graphics("DT-card.png")
 ```
 
@@ -134,5 +141,6 @@ bs_theme("theme-colors" = "('flair': orange)")
 ```
 
 ```{r, echo = FALSE, out.width="67%"}
+#| fig.alt: A card component with an orange header and a table of the mtcars dataset in the card body.
 knitr::include_graphics("DT-card-custom.png")
 ```