bootstrap 5 version difference from github actions

[Enki WANG]

Dear developers,

When running the pkgdown::build_site_github_pages(new_process = FALSE, install = FALSE) in local windows laptop, the output website uses the deps/bootstrap-5.2.2, but the result from git actions run on the ubuntu-latest uses the deps/bootstrap-5.3.1, it led to different navbar color.

After coping the bootstrap.min.css from 5.2.2 to 5.3.1, they will have same color, I had try to use the 5.2.2 in _pkgdown.yml but it did not work.

I wonder if we can specify the bootstrap version,

Thank you very much!

• _pkgdown.yml

template:
  bootstrap: 5
  bslib:
    primary: "#7A00E6"
    navbar-bg: "#7A00E6"
    navbar-light-brand-color: "#FFFFFF"
    navbar-light-brand-hover-color: "#FFFFFF"
    navbar-light-color: "#FFFFFF"
    navbar-light-hover-color: "#FFFFFF"
    navbar-light-active-color: "#FFFFFF"
    dropdown-link-hover-color: "#FFFFFF"
    dropdown-link-hover-bg: "#7A00E6"

navbar:
  bg: navbar-bg

• pkgdown.ymal

# Simple workflow for deploying static content to GitHub Pages
name: Deploy pkgdown to Github Pages

on:
  # Runs on pushes targeting the default branch
  push:
    branches:
      - main
  pull_request:
    branches:
      - main
  release:
    types: [published]
  # Allows you to run this workflow manually from the Actions tab
  workflow_dispatch:

# Sets permissions of the GITHUB_TOKEN to allow deployment to GitHub Pages
permissions:
  contents: read
  pages: write
  id-token: write

# Allow only one concurrent deployment, skipping runs queued between the run in-progress and latest queued.
# However, do NOT cancel in-progress runs as we want to allow these production deployments to complete.
concurrency:
  group: "pages"
  cancel-in-progress: false

jobs:
  # Build job
  build:
    runs-on: ubuntu-latest
    steps:
      - uses: actions/checkout@v3

      - name: Set up R
        uses: r-lib/actions/setup-r@v2
        with:
          r-version: 4.2.1
          use-public-rspm: true

      - uses: r-lib/actions/setup-r-dependencies@v2
        with:
          extra-packages: any::pkgdown, local::.
          needs: website

      - name: Build site
        run: pkgdown::build_site_github_pages(new_process = FALSE, install = FALSE)
        shell: Rscript {0}

      - name: Upload artifact
        uses: actions/upload-pages-artifact@v2
        with:
          path: ./docs

  # Single deploy job since we're just deploying
  deploy:
    environment:
      name: github-pages
      url: ${{ steps.deployment.outputs.page_url }}
    runs-on: ubuntu-latest
    needs: build
    steps:
      - name: Deploy to GitHub Pages
        id: deployment
        uses: actions/deploy-pages@v2

[Enki WANG]

I found that the update from bslib

The default version of Bootstrap is now v5.3.1, upgraded from v5.2.2.

https://github.com/rstudio/bslib/blob/56e8beaec4ed030cb16345abba09ea9baaea459c/NEWS.md?plain=1#L25

The previous navbar background color setting navbar-bg will not work.

.navbar {
    background-color: #7A00E6;
}

[John Benninghoff]

Have you tried the workaround from #2376?

template:
  bootstrap: 5
  bslib:
    preset: bootstrap

[Enki WANG]

Thank you very much.

I found the following configuration work well for setting the navbar background color, refer to https://github.com/rstudio/bslib/blob/56e8beaec4ed030cb16345abba09ea9baaea459c/_pkgdown.yml#L27-L29

template:
  bootstrap: 5
  bslib:
    primary: "#7A00E6"
    info: "#7A00E6"
navbar:
  bg: info
  type: light

[Jay Hesselberth]

Duplicate of #2376. Please re-open if those fixes don't address this issue.