style headers

R/style_bootstrap.R

@@ -27,6 +27,12 @@ style_bootstrap <- function(x,
   ival <- if (is.null(i)) seq_len(meta(x, "nrows")) else i
   jval <- if (is.null(j)) seq_len(meta(x, "ncols")) else j
 
+  # only columns means we also want to style headers 
+  if (is.null(i) && !is.null(j)) {
+    ival <- c(-1 * rev(seq_len(meta(x)$nhead) - 1), ival)
+  }
+
+
   # order may be important for recycling 
   settings <- expand.grid(i = ival, j = jval, tabularray = "")
   if (is.null(i) && !is.null(j)) {

inst/templates/bootstrap.html

@@ -41,6 +41,14 @@
       var table = document.getElementById("$tinytable_TABLE_ID");
       table.rows[i].cells[j].classList.add(css_id);
     }
+    function styleHeaderCell(i, j, css_id) {
+      var table = document.getElementById("$tinytable_TABLE_ID");
+      var headerRow = table.tHead.rows[i];
+      var headerRow = table.querySelector("thead tr");
+      if (headerRow) {
+        headerRow.cells[j].classList.add(css_id);
+      }
+    }
     function insertSpanRow(i, colspan, content) {
       var table = document.getElementById('$tinytable_TABLE_ID');
       var newRow = table.insertRow(i);

inst/tinytest/test-html.R

@@ -20,6 +20,14 @@ tab <- tt(x, theme = "striped") |>
   style_tt(color = "orange")
 expect_equal_to_reference(clean(tab), "_tinysnapshot/html-striped_orange.rds")
 
+
+# Issue #92: header alignment
+k <- structure(list(Column1 = c("Some text", "123"), Column2 = c("Some text", 
+"456")), row.names = c(NA, -2L), class = "data.frame")
+tab <- tt(k, width = 1) |> style_tt(j = 2, align = "r")
+expect_equal_to_reference(clean(tab), "_tinysnapshot/html-issue92.rds")
+
+
 # tutorial.qmd: vectorized settings
 tab <- tt(x) |>
   style_tt(

vignettes/tutorial.qmd

@@ -448,12 +448,19 @@ colnames(k) <- NULL
 tt(k)
 ```
 
-The header is row 0, and can thus be styled as expected:
+The first is row 0, and higher level headers (ex: column spanning labels) have negative indices like -1. They can be styled as expected:
 
 ```{r}
 tt(x) |> style_tt(i = 0, color = "white", background = "black")
 ```
 
+When styling columns without specifying `i`, the headers are styled in accordance with the rest of the column:
+
+```{r}
+tt(x) |> style_tt(j = 2:3, color = "white", background = "black")
+```
+
+
 ## Conditional styling
 
 We can use the standard `which` function from Base `R` to create indices and apply conditional stying on rows. And we can use a regular expression in `j` to apply conditional styling on columns: