Add logo, when present, to the header of all pages (#1584)

r-lib · Mar 25, 2021 · 9a5a8f5 · 9a5a8f5
1 parent ff86fa3
commit 9a5a8f5
Show file tree

Hide file tree

Showing 18 changed files with 104 additions and 4 deletions.
diff --git a/R/build-home-citation.R b/R/build-home-citation.R
@@ -69,5 +69,8 @@ build_citation_authors <- function(pkg = ".") {
     source = source
   )
 
+  data$before <- markdown_block(pkg$meta$authors$before, pkg = pkg)
+  data$after <- markdown_block(pkg$meta$authors$after, pkg = pkg)
+
   render_page(pkg, "citation-authors", data, "authors.html")
 }
diff --git a/R/build-home-index.R b/R/build-home-index.R
@@ -26,7 +26,8 @@ build_home_index <- function(pkg = ".", quiet = TRUE) {
     tweak_homepage_html,
     strip_header = strip_header,
     sidebar = !isFALSE(pkg$meta$home$sidebar),
-    bs_version = pkg$bs_version
+    bs_version = pkg$bs_version,
+    logo = logo_path(pkg, depth = 0)
   )
 
   invisible()

diff --git a/R/build-home-md.R b/R/build-home-md.R
@@ -22,7 +22,12 @@ render_md <- function(pkg, filename) {
   cat_line("Reading ", src_path(path_rel(filename, pkg$src_path)))
 
   render_page(pkg, "title-body",
-    data = list(pagetitle = attr(body, "title"), body = body),
+    data = list(
+      pagetitle = attr(body, "title"),
+      body = body,
+      filename = filename,
+      source = repo_source(pkg, fs::path_rel(filename, pkg$src_path))
+    ),
     path = path_ext_set(basename(filename), "html")
   )
 }
diff --git a/R/html-tweak.R b/R/html-tweak.R
@@ -190,7 +190,8 @@ tweak_rmarkdown_html <- function(html, input_path, pkg = pkg) {
 tweak_homepage_html <- function(html,
                                 strip_header = FALSE,
                                 sidebar = TRUE,
-                                bs_version = 3) {
+                                bs_version = 3,
+                                logo = NULL) {
 
   html <- tweak_sidebar_html(html, sidebar = sidebar)
 
@@ -207,7 +208,25 @@ tweak_homepage_html <- function(html,
     page_header <- xml2::read_html(page_header_text) %>% xml2::xml_find_first("//div")
     xml2::xml_replace(header, page_header)
   }
+  # logo
+  if (!is.null(logo) && bs_version > 3) {
+    # Remove logo if added to h1
+    xml2::xml_remove(
+      xml2::xml_find_first(
+        html,
+        ".//h1/img[contains(@src, 'logo')]"
+      )
+    )
 
+    # Add logo
+    xml2::xml_find_first(html,".//div[contains(@class,'contents')]") %>%
+      xml2::xml_child() %>%
+      xml2::xml_add_sibling(
+        "img", src = "package-logo.png",
+        id = "logo-low", alt = "", width = "120",
+        .where = "before"
+      )
+  }
   # Fix relative image links
   imgs <- xml2::xml_find_all(html, ".//img")
   urls <- xml2::xml_attr(imgs, "src")

diff --git a/R/init.R b/R/init.R
@@ -57,6 +57,14 @@ copy_assets <- function(pkg = ".") {
   pkg <- as_pkgdown(pkg)
   template <- purrr::pluck(pkg$meta, "template", .default = list())
 
+  # Copy logo
+  if (pkg$has_logo) {
+    file.copy(
+      find_logo(pkg$src_path),
+      file.path(pkg$dst_path, "package-logo.png")
+    )
+  }
+
   # Copy default assets
   if (!identical(template$default_assets, FALSE)) {
     copy_asset_dir(pkg, path_pkgdown("assets", paste0("BS", pkg$bs_version)))

diff --git a/R/package.r b/R/package.r
@@ -67,6 +67,7 @@ as_pkgdown <- function(pkg = ".", override = list()) {
     )
 
   pkg_list$bs_version <- get_bs_version(pkg_list)
+  pkg_list$has_logo <- has_logo(pkg_list)
 
   structure(
     pkg_list,

diff --git a/R/render.r b/R/render.r
@@ -27,6 +27,11 @@ render_page <- function(pkg = ".", name, data, path = "", depth = NULL, quiet =
     depth <- length(strsplit(path, "/")[[1]]) - 1L
   }
 
+  data$logo <- list(
+    src = logo_path(pkg, depth = depth),
+    id = if (is.null(data$source)) "logo-low" else "logo-high"
+  )
+
   data <- utils::modifyList(data, data_template(pkg, depth = depth))
   data$pkgdown <- list(
     version = utils::packageDescription("pkgdown", fields = "Version")
@@ -465,3 +470,20 @@ check_bootswatch_theme <- function(bootswatch_theme, bs_version, pkg) {
 pkgdown_bslib_defaults <- function() {
   list(`navbar-nav-link-padding-x` = "1rem")
 }
+
+logo_path <- function(pkg, depth) {
+  if (!has_logo(pkg)) {
+    return(NULL)
+  }
+ path <- "package-logo.png"
+
+  if (depth == 0) {
+    return(path)
+  }
+
+  paste0(
+    paste0(rep("..", depth), collapse = "/"), # as many levels up as depth
+    "/",
+    path
+  )
+}
diff --git a/inst/assets/BS4/pkgdown.css b/inst/assets/BS4/pkgdown.css
@@ -249,7 +249,7 @@ mark {
 
 
 /* TOC heading */
-h2[data-toc-skip] {
+h2[data-toc-skip], #pkgdown-sidebar h2[data-toc-skip] {
   font-size: x-large;
 }
 
@@ -343,6 +343,7 @@ a:hover {
 
 a.footnote-ref {
   cursor: pointer;
+}
 /* Reference index & topics ----------------------------------------------- */
 
 .ref-index th {font-weight: normal;}
@@ -365,3 +366,32 @@ table {
 .fab {
     font-family: "Font Awesome 5 Brands" !important;
 }
+
+/* logo homepage */
+#logo-high {
+  float: right;
+  width: 100px;
+  margin-left: 30px;
+  margin-top: 25px;
+}
+
+@media (max-width: 767px) {
+  #logo-high {
+  float: none;
+  width: 100px;
+}
+}
+
+#logo-low {
+  float: right;
+  width: 100px;
+  margin-left: 30px;
+  margin-top: 2px;
+}
+
+@media (max-width: 767px) {
+  #logo-low {
+  float: none;
+  width: 100px;
+}
+}
diff --git a/inst/templates/BS4/content-article-index.html b/inst/templates/BS4/content-article-index.html
@@ -1,5 +1,6 @@
 <div class="row">
   <div class="col-md-9 contents">
+    {{#logo}}<img src="{{logo.src}}" id="{{logo.id}}" alt="" >{{/logo}}
     <div class='pb-2 mt-4 mb-2 border-bottom'>
       <h1 class="display-4">Articles</h1>
     </div>

diff --git a/inst/templates/BS4/content-article.html b/inst/templates/BS4/content-article.html
@@ -4,6 +4,7 @@
 
 <div class="row">
   <div class="col-md-9 contents">
+    {{#logo}}<img src="{{logo.src}}" id="{{logo.id}}" alt="" >{{/logo}}
     <div class="page-header pb-2 mt-4 mb-2 border-bottom toc-ignore">
       <h1 class="display-4" data-toc-skip>$title$</h1>
       $if(subtitle)$

diff --git a/inst/templates/BS4/content-authors.html b/inst/templates/BS4/content-authors.html
@@ -1,5 +1,6 @@
 <div class="row">
   <div class="contents col-md-9">
+    {{#logo}}<img src="{{logo.src}}" id="{{logo.id}}" alt="" >{{/logo}}
     <div class='pb-2 mt-4 mb-2 border-bottom'>
       <h1 class="display-4">Authors</h1>
     </div>

diff --git a/inst/templates/BS4/content-citation-authors.html b/inst/templates/BS4/content-citation-authors.html
@@ -1,5 +1,6 @@
 <div class="row">
   <div class="contents col-md-9">
+    {{#logo}}<img src="{{logo.src}}" id="{{logo.id}}" alt="" >{{/logo}}
     <div class="page-header">
       <h1 class="display-4">Citation</h1>
       {{#source}}<small class="dont-index">{{{.}}}</small>{{/source}}

diff --git a/inst/templates/BS4/content-news-index.html b/inst/templates/BS4/content-news-index.html
@@ -1,5 +1,6 @@
 <div class="row">
   <div class="contents col-md-9">
+    {{#logo}}<img src="{{logo.src}}" id="{{logo.id}}" alt="" >{{/logo}}
     <div class='pb-2 mt-4 mb-2 border-bottom'>
       <h1 class="display-4">Release notes</h1>
     </div>

diff --git a/inst/templates/BS4/content-news.html b/inst/templates/BS4/content-news.html
@@ -1,5 +1,6 @@
 <div class="row">
   <div class="col-md-9 contents">
+    {{#logo}}<img src="{{logo.src}}" id="{{logo.id}}" alt="" >{{/logo}}
     <div class='pb-2 mt-4 mb-2 border-bottom'>
       <h1 class="display-4" data-toc-skip>Changelog <small>{{version}}</small></h1>
       {{#source}}<small>{{{.}}}</small>{{/source}}

diff --git a/inst/templates/BS4/content-reference-index.html b/inst/templates/BS4/content-reference-index.html
@@ -1,5 +1,6 @@
 <div class="row">
   <div class="contents col-md-9">
+    {{#logo}}<img src="{{logo.src}}" id="{{logo.id}}" alt="" >{{/logo}}
     <div class='pb-2 mt-4 mb-2 border-bottom'>
       <h1 class="display-4">Reference</h1>
     </div>

diff --git a/inst/templates/BS4/content-reference-topic.html b/inst/templates/BS4/content-reference-topic.html
@@ -1,5 +1,6 @@
 <div class="row">
   <div class="col-md-9 contents">
+    {{#logo}}<img src="{{logo.src}}" id="{{logo.id}}" alt="" >{{/logo}}
     <div class="page-header pb-2 mt-4 mb-2 border-bottom toc-ignore">
     <h1 class="display-4">{{{title}}}</h1>
     {{#source}}<small class="dont-index">{{{.}}}</small>{{/source}}

diff --git a/inst/templates/BS4/content-title-body.html b/inst/templates/BS4/content-title-body.html
@@ -1,7 +1,9 @@
 <div class="row">
   <div class="contents col-md-9">
+    {{#logo}}<img src="{{logo.src}}" id="{{logo.id}}" alt="" >{{/logo}}
     <div class='pb-2 mt-4 mb-2 border-bottom'>
       <h1 class="display-4">{{pagetitle}}</h1>
+      {{#source}}<small class="dont-index">{{{.}}}</small>{{/source}}
     </div>
 
 {{{body}}}

diff --git a/inst/templates/BS4/content-tutorial-index.html b/inst/templates/BS4/content-tutorial-index.html
@@ -1,5 +1,6 @@
 <div class="row">
   <div class="contents col-md-9">
+    {{#logo}}<img src="{{logo.src}}" id="{{logo.id}}" alt="" >{{/logo}}
     <div class='pb-2 mt-4 mb-2 border-bottom'>
       <h1 class="display-4">Tutorials</h1>
     </div>