├── .Rbuildignore ├── .gitignore ├── .travis.yml ├── DESCRIPTION ├── LICENSE ├── LICENSE.md ├── NAMESPACE ├── NEWS.md ├── R ├── collapse.R ├── construct-areas.R ├── construct-style.R ├── grid-colwise.R ├── grid-item.R ├── grid-layout.R ├── grid-rowwise.R ├── helpers.R └── re-export.R ├── README.Rmd ├── README.md ├── _pkgdown.yml ├── codecov.yml ├── cssgrid.Rproj ├── docs ├── LICENSE-text.html ├── LICENSE.html ├── articles │ ├── cssgrid.html │ ├── index.html │ ├── responsive.html │ └── responsive_files │ │ ├── crosstalk-1.0.0 │ │ ├── css │ │ │ └── crosstalk.css │ │ └── js │ │ │ ├── crosstalk.js │ │ │ ├── crosstalk.js.map │ │ │ ├── crosstalk.min.js │ │ │ └── crosstalk.min.js.map │ │ ├── figure-html │ │ ├── items-1.png │ │ ├── items-2.png │ │ ├── items-3.png │ │ ├── items-4.png │ │ ├── items-5.png │ │ ├── items-6.png │ │ ├── items-7.png │ │ ├── items-8.png │ │ ├── unnamed-chunk-2-1.png │ │ ├── unnamed-chunk-4-1.png │ │ ├── unnamed-chunk-4-2.png │ │ ├── unnamed-chunk-4-3.png │ │ ├── unnamed-chunk-4-4.png │ │ ├── unnamed-chunk-4-5.png │ │ ├── unnamed-chunk-4-6.png │ │ ├── unnamed-chunk-4-7.png │ │ └── unnamed-chunk-4-8.png │ │ ├── htmlwidgets-1.3 │ │ └── htmlwidgets.js │ │ ├── jquery-1.11.3 │ │ ├── jquery-AUTHORS.txt │ │ ├── jquery.js │ │ ├── jquery.min.js │ │ └── jquery.min.map │ │ ├── plotly-binding-4.9.0 │ │ └── plotly.js │ │ ├── plotly-htmlwidgets-css-1.46.1 │ │ └── plotly-htmlwidgets.css │ │ ├── plotly-main-1.46.1 │ │ └── plotly-latest.min.js │ │ └── typedarray-0.1 │ │ └── typedarray.min.js ├── authors.html ├── docsearch.css ├── docsearch.js ├── index.html ├── link.svg ├── news │ └── index.html ├── pkgdown.css ├── pkgdown.js ├── pkgdown.yml └── reference │ ├── collapse_areas.html │ ├── construct_areas.html │ ├── grid_item.html │ ├── grid_layout.html │ ├── grid_rowwise.html │ ├── hello.html │ ├── index.html │ └── reexports.html ├── man ├── construct_areas.Rd ├── grid_item.Rd ├── grid_layout.Rd ├── grid_rowwise.Rd └── reexports.Rd ├── tests ├── testthat.R └── testthat │ ├── test-collapse.R │ ├── test-construct-areas.R │ ├── test-construct-style.R │ ├── test-construct-styles.R │ ├── test-grid-col.R │ ├── test-grid-item.R │ ├── test-grid-layout.R │ ├── test-grid-rowwise.R │ └── test-helpers.R └── vignettes ├── .gitignore ├── cssgrid.Rmd ├── responsive.Rmd └── responsive_files ├── crosstalk-1.0.0 ├── css │ └── crosstalk.css └── js │ ├── crosstalk.js │ ├── crosstalk.js.map │ ├── crosstalk.min.js │ └── crosstalk.min.js.map ├── htmlwidgets-1.3 └── htmlwidgets.js ├── jquery-1.11.3 ├── jquery-AUTHORS.txt ├── jquery.js ├── jquery.min.js └── jquery.min.map ├── plotly-binding-4.9.0 └── plotly.js ├── plotly-htmlwidgets-css-1.46.1 └── plotly-htmlwidgets.css ├── plotly-main-1.46.1 └── plotly-latest.min.js └── typedarray-0.1 └── typedarray.min.js /.Rbuildignore: -------------------------------------------------------------------------------- 1 | ^.*\.Rproj$ 2 | ^\.Rproj\.user$ 3 | ^README\.Rmd$ 4 | ^LICENSE\.md$ 5 | ^_pkgdown\.yml$ 6 | ^docs$ 7 | ^pkgdown$ 8 | ^\.travis\.yml$ 9 | ^codecov\.yml$ 10 | -------------------------------------------------------------------------------- /.gitignore: -------------------------------------------------------------------------------- 1 | .Ruserdata 2 | /vignettes/*_cache/ 3 | 4 | # History files 5 | .Rhistory 6 | .Rapp.history 7 | 8 | # Session Data files 9 | .RData 10 | 11 | # Example code in package build process 12 | *-Ex.R 13 | 14 | # Output files from R CMD build 15 | /*.tar.gz 16 | 17 | # Output files from R CMD check 18 | /*.Rcheck/ 19 | 20 | # RStudio files 21 | .Rproj.user/ 22 | 23 | # produced vignettes 24 | vignettes/*.html 25 | vignettes/*.pdf 26 | 27 | # OAuth2 token, see https://github.com/hadley/httr/releases/tag/v0.3 28 | .httr-oauth 29 | 30 | # knitr and R markdown default cache directories 31 | /*_cache/ 32 | /cache/ 33 | 34 | # Temporary files created by R markdown 35 | *.utf8.md 36 | *.knit.md 37 | .Rproj.user 38 | inst/doc 39 | -------------------------------------------------------------------------------- /.travis.yml: -------------------------------------------------------------------------------- 1 | # R for travis: see documentation at https://docs.travis-ci.com/user/languages/r 2 | 3 | language: R 4 | sudo: true 5 | cache: packages 6 | latex: false 7 | fortran: false 8 | 9 | jobs: 10 | include: 11 | - r: release 12 | - r: devel 13 | - os: osx 14 | r: release 15 | r_binary_packages: 16 | - covr 17 | warnings_are_errors: false 18 | after_success: 19 | - Rscript -e 'covr::codecov()' 20 | -------------------------------------------------------------------------------- /DESCRIPTION: -------------------------------------------------------------------------------- 1 | Package: cssgrid 2 | Type: Package 3 | Title: Easy CSS Grid Layout For R Markdown And Shiny 4 | Version: 0.1.0 5 | Author: Atsushi Yasumoto [aut, cph, cre] () 6 | Authors@R: c( 7 | person( 8 | given = "Atsushi", family = "Yasumoto", 9 | role = c("aut", "cph", "cre"), 10 | email = "atusy.rpkg@gmail.com", 11 | comment = c(ORCID = "0000-0002-8335-495X") 12 | ) 13 | ) 14 | Maintainer: Atsushi Yasumoto 15 | Description: Easy CSS grid layout for R Markdown and Shiny. 16 | URL: https://github.com/atusy/cssgrid/ 17 | BugReports: https://github.com/atusy/cssgrid/issues 18 | License: MIT + file LICENSE 19 | Encoding: UTF-8 20 | LazyData: true 21 | Roxygen: list(markdown = TRUE) 22 | RoxygenNote: 6.1.1 23 | Imports: 24 | htmltools 25 | Suggests: 26 | testthat (>= 2.1.0), 27 | knitr, 28 | rmarkdown, 29 | ggplot2, 30 | dplyr, 31 | purrr, 32 | shiny, 33 | plotly, 34 | covr 35 | VignetteBuilder: knitr 36 | Collate: 37 | 'collapse.R' 38 | 'construct-areas.R' 39 | 'construct-style.R' 40 | 'grid-rowwise.R' 41 | 'grid-colwise.R' 42 | 'grid-item.R' 43 | 'grid-layout.R' 44 | 'helpers.R' 45 | 're-export.R' 46 | -------------------------------------------------------------------------------- /LICENSE: -------------------------------------------------------------------------------- 1 | YEAR: 2019 2 | COPYRIGHT HOLDER: Atsushi Yasumoto 3 | -------------------------------------------------------------------------------- /LICENSE.md: -------------------------------------------------------------------------------- 1 | # MIT License 2 | 3 | Copyright (c) 2019 Atsushi Yasumoto 4 | 5 | Permission is hereby granted, free of charge, to any person obtaining a copy 6 | of this software and associated documentation files (the "Software"), to deal 7 | in the Software without restriction, including without limitation the rights 8 | to use, copy, modify, merge, publish, distribute, sublicense, and/or sell 9 | copies of the Software, and to permit persons to whom the Software is 10 | furnished to do so, subject to the following conditions: 11 | 12 | The above copyright notice and this permission notice shall be included in all 13 | copies or substantial portions of the Software. 14 | 15 | THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR 16 | IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, 17 | FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE 18 | AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER 19 | LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, 20 | OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE 21 | SOFTWARE. 22 | -------------------------------------------------------------------------------- /NAMESPACE: -------------------------------------------------------------------------------- 1 | # Generated by roxygen2: do not edit by hand 2 | 3 | S3method(construct_areas,data.frame) 4 | S3method(construct_areas,default) 5 | S3method(construct_areas,grid_areas) 6 | S3method(construct_areas,matrix) 7 | export(construct_areas) 8 | export(div) 9 | export(grid_colwise) 10 | export(grid_item) 11 | export(grid_layout) 12 | export(grid_rowwise) 13 | export(tagList) 14 | export(tags) 15 | importFrom(htmltools,div) 16 | importFrom(htmltools,tagList) 17 | importFrom(htmltools,tags) 18 | -------------------------------------------------------------------------------- /NEWS.md: -------------------------------------------------------------------------------- 1 | # cssgrid 0.1.0 2 | 3 | - Added 4 | - `grid_layout()` that creates a CSS Grid Layout container for general purpose 5 | - `grid_item()` that creates items in a CSS Grid Layout container. 6 | - `grid_rowwise()` that creates a single rowwise layout with CSS Grid. 7 | - `grid_colwise()` that creates a single columnwise layout with CSS Grid. 8 | - `construct_areas()` that creates CSS values for `grid-template-areas`. 9 | This function is implicitly used by `grid_layout()`, but can also be used 10 | explicitly and specify the returned value to `areas` argument of `grid_layout()`. 11 | - Achieved 100% code coverage 12 | -------------------------------------------------------------------------------- /R/collapse.R: -------------------------------------------------------------------------------- 1 | #' Collapse character vectors into a string 2 | #' 3 | #' @param ... Vectors to be collapsed 4 | #' @param sep A string as a separator 5 | #' 6 | #' @noRd 7 | collapse <- function(..., sep = " ") { 8 | x <- c(...) 9 | if (is.null(x)) return(NULL) 10 | paste(x, collapse = sep) 11 | } 12 | -------------------------------------------------------------------------------- /R/construct-areas.R: -------------------------------------------------------------------------------- 1 | #' Construct grid-template-areas property 2 | #' 3 | #' @param x NULL, an atomic vector, a matrix, or a data frame 4 | #' @param ... discarded 5 | #' 6 | #' @export 7 | construct_areas <- function(x = NULL, ...) UseMethod("construct_areas") 8 | 9 | #' A helper function for construct_areas 10 | #' @noRd 11 | collapse_areas <- function(x) collapse(paste0("'", x, "'")) 12 | 13 | as_grid_areas <- function(x) structure(x, class = c("grid_areas", class(x))) 14 | 15 | #' @rdname construct_areas 16 | #' @export 17 | construct_areas.grid_areas <- function(x = NULL, ...) x 18 | 19 | #' @rdname construct_areas 20 | #' @export 21 | construct_areas.default <- function(x = NULL, ...) { 22 | if (is.null(x)) return(NULL) 23 | if (!(is.atomic(x) & is.vector(x))) { 24 | stop("x must be either NULL, an atomic vector, a matrix, or a data frame") 25 | } 26 | as_grid_areas(collapse_areas(x)) 27 | } 28 | 29 | #' @rdname construct_areas 30 | #' @export 31 | construct_areas.data.frame <- function(x, ...) { 32 | as_grid_areas(collapse_areas(Reduce(paste, x))) 33 | } 34 | 35 | #' @rdname construct_areas 36 | #' @export 37 | construct_areas.matrix <- function(x, ...) { 38 | as_grid_areas(collapse_areas(apply(x, 1L, collapse))) 39 | } 40 | -------------------------------------------------------------------------------- /R/construct-style.R: -------------------------------------------------------------------------------- 1 | #' Construct a style attribute 2 | #' @param ... 3 | #' Single strings for named arguments or named vectors for unnamed arguments 4 | #' @noRd 5 | construct_style <- function(...) { 6 | val <- c(...) 7 | use <- val != "" 8 | if (length(val[use]) == 0) return(NULL) 9 | 10 | var <- names(val) 11 | 12 | if (is.null(var) | any(var == "")) stop("Arguments must be named") 13 | 14 | paste0(collapse( 15 | paste0(var[use], ": ", unlist(val[use], use.names = FALSE)), sep = "; " 16 | ), ";") 17 | } 18 | -------------------------------------------------------------------------------- /R/grid-colwise.R: -------------------------------------------------------------------------------- 1 | #' @include grid-rowwise.R 2 | #' @rdname grid_rowwise 3 | #' @aliases grid_colwise 4 | #' @export 5 | grid_colwise <- function(..., rows = character(0L)) { 6 | n <- n_item(...) - sum(lengths(strsplit(rows, " +"))) 7 | rows <- c(rows, rep("auto", n * (n > 0))) 8 | grid_layout(..., rows = rows) 9 | } 10 | -------------------------------------------------------------------------------- /R/grid-item.R: -------------------------------------------------------------------------------- 1 | #' Construct an item to be contained by CSS grid layout 2 | #' 3 | #' @param row_start,row_end,row,column_start,column_end,column,area 4 | #' CSS properties of `gird-*`, whereas `grid-` is abbreviated, and hyphens are 5 | #' replaced by underscores. For example, the `row_start` argument is equivalent 6 | #' to the CSS's `grid-row-start` property. Specify a string as a value for the 7 | #' corresponding CSS property. 8 | #' @param col 9 | #' An alias of column 10 | #' @param justify_self,align_self 11 | #' Strings to specify values for the CSS's 12 | #' [`justify-self`](https://developer.mozilla.org/en-US/docs/Web/CSS/justify-self) 13 | #' and 14 | #' [`align-self`](https://developer.mozilla.org/en-US/docs/Web/CSS/align-self) 15 | #' properties. 16 | #' @param z_index,order 17 | #' A string to specify the corresponding CSS property (`z-index` and `order`, 18 | #' respectively) 19 | #' @inheritParams grid_layout 20 | #' 21 | #' @export 22 | grid_item <- function( 23 | ..., 24 | row_start = NULL, 25 | row_end = NULL, 26 | row = NULL, 27 | column_start = NULL, 28 | column_end = NULL, 29 | col = NULL, 30 | column = col, 31 | area = NULL, 32 | justify_self = NULL, 33 | align_self = NULL, 34 | z_index = NULL, 35 | order = NULL, 36 | style = NULL 37 | ) { 38 | div( 39 | ..., 40 | style = collapse(construct_style( 41 | "grid-row-start" = row_start, 42 | "grid-row-end" = row_end, 43 | "grid-row" = row, 44 | "grid-column-start" = column_start, 45 | "grid-column-end" = column_end, 46 | "grid-column" = col, 47 | "grid-area" = area, 48 | "justify-self" = justify_self, 49 | "align-self" = align_self, 50 | "z-index" = z_index, 51 | order = order 52 | ), style) 53 | ) 54 | } 55 | -------------------------------------------------------------------------------- /R/grid-layout.R: -------------------------------------------------------------------------------- 1 | #' Generate CSS grid 2 | #' 3 | #' @param ... Items in the container 4 | #' @param display 5 | #' Specifies the CSS's `display` property by `"display"`, `"inline-display"`. 6 | #' Partial matching is used. 7 | #' @param rows,cols,areas,flow,auto_cols 8 | #' Aliases of `template_rows`, `template_columns`, and `template_areas`, 9 | #' `auto_columns`, respectively` 10 | #' @param template_rows,template_columns 11 | #' A character vector to specify size of each rows and columns in the grid 12 | #' such as `"100px 1fr"` or `c("100px", "1fr")`. Default is `NULL`. 13 | #' @param template_areas 14 | #' A vector, a matrix, or a data frame. 15 | #' If a vector, separate names of each areas in a row by space, 16 | #' and separate columns by elements such as `c("a b", "c d")`. 17 | #' If a matrix or a data frame, names and positions of each elements indicate 18 | #' the name of area and the position of area, respectively. 19 | #' Default is `NULL`. 20 | #' @param template,auto_flow,auto_rows,auto_columns,row_gap,column_gap,gap,grid 21 | #' CSS properties of `gird-*`, whereas `grid-` is abbreviated, and hyphens 22 | #' are replaced by underscores. Specify string that muches the style of a 23 | #' certain CSS property. For example, the `template_rows` argument is 24 | #' equivalent to the CSS's `grid-template-rows` property. An exception is the 25 | #' `grid` argument which is equivalent to the CSS's `grid` property. The 26 | #' `auto_flow` argument can be specified by `""`, `"row"`, `"column"` or `"dense"`. 27 | #' Partial matching is used and `""` skip specifying `grid-flow`. For details, 28 | #' see documents of [CSS properties of CSS Grid Layout by Mozilla](https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_Grid_Layout#CSS_properties). 29 | #' Default values are `NULL` or `""`. 30 | #' @param justify_content,align_content,justify_items,align_items 31 | #' Arguments equivalent to the CSS's 32 | #' [`justify-content`](https://developer.mozilla.org/en-US/docs/Web/CSS/justify-content), 33 | #' [`align-content`](https://developer.mozilla.org/en-US/docs/Web/CSS/align-content), 34 | #' [`justify-items`](https://developer.mozilla.org/en-US/docs/Web/CSS/justify-items), 35 | #' [`align_items`](https://developer.mozilla.org/en-US/docs/Web/CSS/align-items) 36 | #' properties, respectively.` 37 | #' @param style Additional values of the style attribute such as `color: red;`. 38 | # @param itemize 39 | # Whether to automatically itemize `...` (Default: `FALSE``). 40 | # If `TRUE`, `...` are itemized by `div`. 41 | # Alternatively, a function can be specified as itemizer. 42 | #' 43 | #' @details 44 | #' Default values of `NULL` or `""` indicate the corresponding CSS properties 45 | #' are not specified. 46 | #' 47 | #' @importFrom htmltools tagList 48 | #' @export 49 | grid_layout <- function( 50 | ..., 51 | display = c("grid", "inline-grid"), 52 | grid = NULL, 53 | template = NULL, 54 | rows = template_rows, template_rows = NULL, 55 | cols = template_columns, template_columns = NULL, 56 | areas = template_areas, template_areas = NULL, 57 | flow = c("", "row", "column", "dense", "row dense", "column dense"), 58 | auto_flow = c("", "row", "column", "dense", "row dense", "column dense"), 59 | auto_rows = NULL, 60 | auto_cols = auto_columns, auto_columns = NULL, 61 | row_gap = NULL, 62 | column_gap = NULL, 63 | gap = NULL, 64 | justify_content = NULL, 65 | align_content = NULL, 66 | justify_items = NULL, 67 | align_items = NULL, 68 | style = NULL 69 | ) { 70 | display <- match.arg(display) 71 | flow <- match.arg(flow) 72 | if (flow == "") flow <- match.arg(auto_flow) 73 | force(c(rows, cols, areas)) 74 | 75 | tags$div( 76 | style = collapse(construct_style( 77 | display = display, 78 | # grid and grid-template are specified earlier because they reset some 79 | # properties specified prior to them 80 | "grid" = grid, 81 | "grid-template" = template, 82 | "grid-template-rows" = collapse(rows), 83 | "grid-template-columns" = collapse(cols), 84 | "grid-template-areas" = construct_areas(areas), 85 | "grid-auto-flow" = flow, 86 | "grid-auto-rows" = auto_rows, 87 | "grid-auto-columns" = auto_cols, 88 | "justify-content" = justify_content, 89 | "align-content" = align_content, 90 | "grid-row-gap" = row_gap, 91 | "grid-column-gap" = column_gap, 92 | "grid-gap" = gap, 93 | "justify-content" = justify_content, 94 | "align-content" = align_content, 95 | "justify-items" = justify_items, 96 | "align-items" = align_items 97 | ), style), 98 | ... 99 | ) 100 | } 101 | -------------------------------------------------------------------------------- /R/grid-rowwise.R: -------------------------------------------------------------------------------- 1 | #' Gird layout in single row or column 2 | #' 3 | #' @param ... 4 | #' Items in CSS Grid Layout and arguments passed to [`grid_layout`]. 5 | #' @param rows,cols 6 | #' Sizes of rows and columns in a character vector. 7 | #' If the given number of sizes are less than the number of items, 8 | #' then `"auto"` is used for items missing sizes. 9 | #' 10 | #' @name grid_rowwise 11 | #' @export 12 | grid_rowwise <- function(..., cols = character(0L)) { 13 | n <- n_item(...) - sum(lengths(strsplit(cols, " +"))) 14 | cols <- c(cols, rep("auto", n * (n > 0))) 15 | grid_layout(..., cols = cols) 16 | } 17 | -------------------------------------------------------------------------------- /R/helpers.R: -------------------------------------------------------------------------------- 1 | # Helper functions 2 | 3 | #' Check if each element has expected class(es) 4 | #' 5 | #' Vectorized 6 | #' 7 | #' @param x A vector, typicall a list. 8 | #' @param expected Expected class(es) 9 | #' @param by 10 | #' `"any"` (default) checks if an element has any one of expected class(es) and 11 | #' `"all"` checks if an element has all of the expected class(es). 12 | #' 13 | #' @noRd 14 | has_class <- function(x, expected, by = c("any", "all")) { 15 | .by <- match.fun(match.arg(by)) 16 | vapply(x, function(x) .by(expected %in% class(x)), TRUE) 17 | } 18 | 19 | #' Check if each element has valid names 20 | #' 21 | #' Valid names are characters except `""` and `Na_character`, who will cause 22 | #' error if trying to name with `c` or `list` (e.g., `c("" = 1)` and `c(NA = 2)` 23 | #' return errors). 24 | #' 25 | #' @param x A vector 26 | #' 27 | #' @noRd 28 | is_named <- function(x) { 29 | nm <- names(x) 30 | if (is.null(nm)) rep(FALSE, length(x)) else !(nm %in% c(NA_character_, "")) 31 | } 32 | 33 | #' Number of items contained by CSS Grid 34 | #' 35 | #' If [`tagList()`]` is given, it is not counted as 1 but by the number of its 36 | #' elements. 37 | #' 38 | #' @noRd 39 | n_item <- function(...) { 40 | ellipsis <- list(...) 41 | unnamed <- !is_named(ellipsis) 42 | is_tagList <- has_class(ellipsis, c("shiny.tag.list", "list"), by = "any") 43 | sum(unnamed & !is_tagList) + sum(lengths(ellipsis[unnamed & is_tagList])) 44 | } 45 | -------------------------------------------------------------------------------- /R/re-export.R: -------------------------------------------------------------------------------- 1 | #' @importFrom htmltools div tagList tags 2 | #' @export 3 | htmltools::div 4 | #' @export 5 | htmltools::tagList 6 | #' @export 7 | htmltools::tags 8 | -------------------------------------------------------------------------------- /README.Rmd: -------------------------------------------------------------------------------- 1 | --- 2 | output: github_document 3 | --- 4 | 5 | 6 | 7 | # cssgrid 8 | 9 | 10 | [![Travis build status](https://travis-ci.org/atusy/cssgrid.svg?branch=master)](https://travis-ci.org/atusy/cssgrid) 11 | [![Codecov test coverage](https://codecov.io/gh/atusy/cssgrid/branch/master/graph/badge.svg)](https://codecov.io/gh/atusy/cssgrid?branch=master) 12 | 13 | 14 | CSS Grid Layout for R Markdown and Shiny 15 | 16 | ## Installation 17 | 18 | ``` r 19 | source("https://install-github.me/atusy/cssgrid") 20 | ``` 21 | 22 | ## Examples 23 | 24 | Take a look at 25 | 26 | - Get Started \ 27 | 28 | 29 | - Responsive designs with cssgrid \ 30 | 31 | -------------------------------------------------------------------------------- /README.md: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | # cssgrid 5 | 6 | 7 | 8 | [![Travis build 9 | status](https://travis-ci.org/atusy/cssgrid.svg?branch=master)](https://travis-ci.org/atusy/cssgrid) 10 | [![Codecov test 11 | coverage](https://codecov.io/gh/atusy/cssgrid/branch/master/graph/badge.svg)](https://codecov.io/gh/atusy/cssgrid?branch=master) 12 | 13 | 14 | CSS Grid Layout for R Markdown and Shiny 15 | 16 | ## Installation 17 | 18 | ``` r 19 | source("https://install-github.me/atusy/cssgrid") 20 | ``` 21 | 22 | ## Examples 23 | 24 | Take a look at 25 | 26 | - Get Started 27 | 28 | 29 | - Responsive designs with cssgrid 30 | 31 | -------------------------------------------------------------------------------- /_pkgdown.yml: -------------------------------------------------------------------------------- 1 | destination: docs 2 | -------------------------------------------------------------------------------- /codecov.yml: -------------------------------------------------------------------------------- 1 | codecov: 2 | token: 061f50e5-99ee-4bbc-8d73-acf453cc2d92 3 | 4 | comment: false 5 | 6 | coverage: 7 | status: 8 | project: 9 | default: 10 | target: auto 11 | threshold: 1% 12 | patch: 13 | default: 14 | target: auto 15 | threshold: 1% 16 | -------------------------------------------------------------------------------- /cssgrid.Rproj: -------------------------------------------------------------------------------- 1 | Version: 1.0 2 | 3 | RestoreWorkspace: Default 4 | SaveWorkspace: Default 5 | AlwaysSaveHistory: Default 6 | 7 | EnableCodeIndexing: Yes 8 | UseSpacesForTab: Yes 9 | NumSpacesForTab: 2 10 | Encoding: UTF-8 11 | 12 | RnwWeave: Sweave 13 | LaTeX: pdfLaTeX 14 | 15 | AutoAppendNewline: Yes 16 | StripTrailingWhitespace: Yes 17 | 18 | BuildType: Package 19 | PackageUseDevtools: Yes 20 | PackageInstallArgs: --no-multiarch --with-keep.source 21 | PackageRoxygenize: rd,collate,namespace,vignette 22 | -------------------------------------------------------------------------------- /docs/LICENSE-text.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 | License • cssgrid 10 | 11 | 12 | 13 | 14 | 15 | 16 | 17 | 18 | 19 | 20 | 21 | 22 | 23 | 24 | 25 | 26 | 27 | 28 | 29 | 30 | 31 | 32 | 33 | 34 | 35 | 36 | 37 | 38 | 39 | 40 | 41 | 45 | 46 | 47 | 48 | 49 | 50 |
51 |
52 | 110 | 111 | 112 |
113 | 114 |
115 |
116 | 119 | 120 |
YEAR: 2019
121 | COPYRIGHT HOLDER: Atsushi Yasumoto
122 | 
123 | 124 |
125 | 126 |
127 | 128 | 129 |
130 | 133 | 134 |
135 |

Site built with pkgdown 1.3.0.

136 |
137 |
138 |
139 | 140 | 141 | 142 | 143 | 144 | 145 | -------------------------------------------------------------------------------- /docs/LICENSE.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 | MIT License • cssgrid 10 | 11 | 12 | 13 | 14 | 15 | 16 | 17 | 18 | 19 | 20 | 21 | 22 | 23 | 24 | 25 | 26 | 27 | 28 | 29 | 30 | 31 | 32 | 33 | 34 | 35 | 36 | 37 | 38 | 39 | 40 | 41 | 45 | 46 | 47 | 48 | 49 | 50 |
51 |
52 | 110 | 111 | 112 |
113 | 114 |
115 |
116 | 119 | 120 |
121 | 122 |

Copyright (c) 2019 Atsushi Yasumoto

123 |

Permission is hereby granted, free of charge, to any person obtaining a copy of this software and associated documentation files (the “Software”), to deal in the Software without restriction, including without limitation the rights to use, copy, modify, merge, publish, distribute, sublicense, and/or sell copies of the Software, and to permit persons to whom the Software is furnished to do so, subject to the following conditions:

124 |

The above copyright notice and this permission notice shall be included in all copies or substantial portions of the Software.

125 |

THE SOFTWARE IS PROVIDED “AS IS”, WITHOUT WARRANTY OF ANY KIND, EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE.

126 |
127 | 128 |
129 | 130 |
131 | 132 | 133 |
134 | 137 | 138 |
139 |

Site built with pkgdown 1.3.0.

140 |
141 |
142 |
143 | 144 | 145 | 146 | 147 | 148 | 149 | -------------------------------------------------------------------------------- /docs/articles/index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 | Articles • cssgrid 10 | 11 | 12 | 13 | 14 | 15 | 16 | 17 | 18 | 19 | 20 | 21 | 22 | 23 | 24 | 25 | 26 | 27 | 28 | 29 | 30 | 31 | 32 | 33 | 34 | 35 | 36 | 37 | 38 | 39 | 40 | 41 | 45 | 46 | 47 | 48 | 49 | 50 |
51 |
52 | 110 | 111 | 112 |
113 | 114 |
115 |
116 | 119 | 120 |
121 |

All vignettes

122 |

123 | 124 | 128 |
129 |
130 |
131 | 132 |
133 | 136 | 137 |
138 |

Site built with pkgdown 1.3.0.

139 |
140 |
141 |
142 | 143 | 144 | 145 | 146 | 147 | 148 | -------------------------------------------------------------------------------- /docs/articles/responsive_files/crosstalk-1.0.0/css/crosstalk.css: -------------------------------------------------------------------------------- 1 | /* Adjust margins outwards, so column contents line up with the edges of the 2 | parent of container-fluid. */ 3 | .container-fluid.crosstalk-bscols { 4 | margin-left: -30px; 5 | margin-right: -30px; 6 | white-space: normal; 7 | } 8 | 9 | /* But don't adjust the margins outwards if we're directly under the body, 10 | i.e. we were the top-level of something at the console. */ 11 | body > .container-fluid.crosstalk-bscols { 12 | margin-left: auto; 13 | margin-right: auto; 14 | } 15 | 16 | .crosstalk-input-checkboxgroup .crosstalk-options-group .crosstalk-options-column { 17 | display: inline-block; 18 | padding-right: 12px; 19 | vertical-align: top; 20 | } 21 | 22 | @media only screen and (max-width:480px) { 23 | .crosstalk-input-checkboxgroup .crosstalk-options-group .crosstalk-options-column { 24 | display: block; 25 | padding-right: inherit; 26 | } 27 | } 28 | -------------------------------------------------------------------------------- /docs/articles/responsive_files/crosstalk-1.0.0/js/crosstalk.min.js: -------------------------------------------------------------------------------- 1 | !function a(b,c,d){function e(g,h){if(!c[g]){if(!b[g]){var i="function"==typeof require&&require;if(!h&&i)return i(g,!0);if(f)return f(g,!0);var j=new Error("Cannot find module '"+g+"'");throw j.code="MODULE_NOT_FOUND",j}var k=c[g]={exports:{}};b[g][0].call(k.exports,function(a){var c=b[g][1][a];return e(c?c:a)},k,k.exports,a,b,c,d)}return c[g].exports}for(var f="function"==typeof require&&require,g=0;gb?1:void 0}Object.defineProperty(c,"__esModule",{value:!0});var f=function(){function a(a,b){for(var c=0;c0&&void 0!==arguments[0]?arguments[0]:this._allKeys,b=Object.keys(this._handles).length;if(0===b)this._value=null;else{this._value=[];for(var c=0;c?@\[\\\]^`{|}~])/g,"\\$1")}function f(a){var b=h(a);Object.keys(i).forEach(function(c){if(b.hasClass(c)&&!b.hasClass("crosstalk-input-bound")){var d=i[c];g(d,a)}})}function g(a,b){var c=h(b).find("script[type='application/json'][data-for='"+e(b.id)+"']"),d=JSON.parse(c[0].innerText),f=a.factory(b,d);h(b).data("crosstalk-instance",f),h(b).addClass("crosstalk-input-bound")}Object.defineProperty(c,"__esModule",{value:!0}),c.register=b;var h=a.jQuery,i={};a.Shiny&&!function(){var b=new a.Shiny.InputBinding,c=a.jQuery;c.extend(b,{find:function(a){return c(a).find(".crosstalk-input")},initialize:function(a){c(a).hasClass("crosstalk-input-bound")||f(a)},getId:function(a){return a.id},getValue:function(a){},setValue:function(a,b){},receiveMessage:function(a,b){},subscribe:function(a,b){c(a).data("crosstalk-instance").resume()},unsubscribe:function(a){c(a).data("crosstalk-instance").suspend()}}),a.Shiny.inputBindings.register(b,"crosstalk.inputBinding")}()}).call(this,"undefined"!=typeof global?global:"undefined"!=typeof self?self:"undefined"!=typeof window?window:{})},{}],7:[function(a,b,c){(function(b){"use strict";function c(a){if(a&&a.__esModule)return a;var b={};if(null!=a)for(var c in a)Object.prototype.hasOwnProperty.call(a,c)&&(b[c]=a[c]);return b.default=a,b}var d=a("./input"),e=c(d),f=a("./filter"),g=b.jQuery;e.register({className:"crosstalk-input-checkboxgroup",factory:function(a,b){var c=new f.FilterHandle(b.group),d=void 0,e=g(a);return e.on("change","input[type='checkbox']",function(){var a=e.find("input[type='checkbox']:checked");0===a.length?(d=null,c.clear()):!function(){var e={};a.each(function(){b.map[this.value].forEach(function(a){e[a]=!0})});var f=Object.keys(e);f.sort(),d=f,c.set(f)}()}),{suspend:function(){c.clear()},resume:function(){d&&c.set(d)}}}})}).call(this,"undefined"!=typeof global?global:"undefined"!=typeof self?self:"undefined"!=typeof window?window:{})},{"./filter":2,"./input":6}],8:[function(a,b,c){(function(b){"use strict";function c(a){if(a&&a.__esModule)return a;var b={};if(null!=a)for(var c in a)Object.prototype.hasOwnProperty.call(a,c)&&(b[c]=a[c]);return b.default=a,b}var d=a("./input"),e=c(d),f=a("./util"),g=c(f),h=a("./filter"),i=b.jQuery;e.register({className:"crosstalk-input-select",factory:function(a,b){var c=[{value:"",label:"(All)"}],d=g.dataframeToD3(b.items),e={options:c.concat(d),valueField:"value",labelField:"label",searchField:"label"},f=i(a).find("select")[0],j=i(f).selectize(e)[0].selectize,k=new h.FilterHandle(b.group),l=void 0;return j.on("change",function(){0===j.items.length?(l=null,k.clear()):!function(){var a={};j.items.forEach(function(c){b.map[c].forEach(function(b){a[b]=!0})});var c=Object.keys(a);c.sort(),l=c,k.set(c)}()}),{suspend:function(){k.clear()},resume:function(){l&&k.set(l)}}}})}).call(this,"undefined"!=typeof global?global:"undefined"!=typeof self?self:"undefined"!=typeof window?window:{})},{"./filter":2,"./input":6,"./util":11}],9:[function(a,b,c){(function(b){"use strict";function c(a){if(a&&a.__esModule)return a;var b={};if(null!=a)for(var c in a)Object.prototype.hasOwnProperty.call(a,c)&&(b[c]=a[c]);return b.default=a,b}function d(a,b){for(var c=a.toString();c.length=i&&m<=j&&k.push(b.keys[l])}k.sort(),d.set(k),p=k}}),{suspend:function(){d.clear()},resume:function(){p&&d.set(p)}}}})}).call(this,"undefined"!=typeof global?global:"undefined"!=typeof self?self:"undefined"!=typeof window?window:{})},{"./filter":2,"./input":6}],10:[function(a,b,c){"use strict";function d(a){if(a&&a.__esModule)return a;var b={};if(null!=a)for(var c in a)Object.prototype.hasOwnProperty.call(a,c)&&(b[c]=a[c]);return b.default=a,b}function e(a){return a&&a.__esModule?a:{default:a}}function f(a,b){if(!(a instanceof b))throw new TypeError("Cannot call a class as a function")}Object.defineProperty(c,"__esModule",{value:!0}),c.SelectionHandle=void 0;var g=function(){function a(a,b){for(var c=0;c0&&void 0!==arguments[0]?arguments[0]:null,c=arguments.length>1&&void 0!==arguments[1]?arguments[1]:null;f(this,a),this._eventRelay=new i.default,this._emitter=new m.SubscriptionTracker(this._eventRelay),this._group=null,this._var=null,this._varOnChangeSub=null,this._extraInfo=m.extend({sender:this},c),this.setGroup(b)}return g(a,[{key:"setGroup",value:function(a){var b=this;if(this._group!==a&&(this._group||a)&&(this._var&&(this._var.off("change",this._varOnChangeSub),this._var=null,this._varOnChangeSub=null),this._group=a,a)){this._var=(0,k.default)(a).var("selection");var c=this._var.on("change",function(a){b._eventRelay.trigger("change",a,b)});this._varOnChangeSub=c}}},{key:"_mergeExtraInfo",value:function(a){return m.extend({},this._extraInfo?this._extraInfo:null,a?a:null)}},{key:"set",value:function(a,b){this._var&&this._var.set(a,this._mergeExtraInfo(b))}},{key:"clear",value:function(a){this._var&&this.set(void 0,this._mergeExtraInfo(a))}},{key:"on",value:function(a,b){return this._emitter.on(a,b)}},{key:"off",value:function(a,b){return this._emitter.off(a,b)}},{key:"close",value:function(){this._emitter.removeAllListeners(),this.setGroup(null)}},{key:"value",get:function(){return this._var?this._var.get():null}}]),a}()},{"./events":1,"./group":4,"./util":11}],11:[function(a,b,c){"use strict";function d(a,b){if(!(a instanceof b))throw new TypeError("Cannot call a class as a function")}function e(a){for(var b=arguments.length,c=Array(b>1?b-1:0),d=1;d 4 | Gilles van den Hoven 5 | Michael Geary 6 | Stefan Petre 7 | Yehuda Katz 8 | Corey Jewett 9 | Klaus Hartl 10 | Franck Marcia 11 | Jörn Zaefferer 12 | Paul Bakaus 13 | Brandon Aaron 14 | Mike Alsup 15 | Dave Methvin 16 | Ed Engelhardt 17 | Sean Catchpole 18 | Paul Mclanahan 19 | David Serduke 20 | Richard D. Worth 21 | Scott González 22 | Ariel Flesler 23 | Jon Evans 24 | TJ Holowaychuk 25 | Michael Bensoussan 26 | Robert Katić 27 | Louis-Rémi Babé 28 | Earle Castledine 29 | Damian Janowski 30 | Rich Dougherty 31 | Kim Dalsgaard 32 | Andrea Giammarchi 33 | Mark Gibson 34 | Karl Swedberg 35 | Justin Meyer 36 | Ben Alman 37 | James Padolsey 38 | David Petersen 39 | Batiste Bieler 40 | Alexander Farkas 41 | Rick Waldron 42 | Filipe Fortes 43 | Neeraj Singh 44 | Paul Irish 45 | Iraê Carvalho 46 | Matt Curry 47 | Michael Monteleone 48 | Noah Sloan 49 | Tom Viner 50 | Douglas Neiner 51 | Adam J. Sontag 52 | Dave Reed 53 | Ralph Whitbeck 54 | Carl Fürstenberg 55 | Jacob Wright 56 | J. Ryan Stinnett 57 | unknown 58 | temp01 59 | Heungsub Lee 60 | Colin Snover 61 | Ryan W Tenney 62 | Pinhook 63 | Ron Otten 64 | Jephte Clain 65 | Anton Matzneller 66 | Alex Sexton 67 | Dan Heberden 68 | Henri Wiechers 69 | Russell Holbrook 70 | Julian Aubourg 71 | Gianni Alessandro Chiappetta 72 | Scott Jehl 73 | James Burke 74 | Jonas Pfenniger 75 | Xavi Ramirez 76 | Jared Grippe 77 | Sylvester Keil 78 | Brandon Sterne 79 | Mathias Bynens 80 | Timmy Willison 81 | Corey Frang 82 | Digitalxero 83 | Anton Kovalyov 84 | David Murdoch 85 | Josh Varner 86 | Charles McNulty 87 | Jordan Boesch 88 | Jess Thrysoee 89 | Michael Murray 90 | Lee Carpenter 91 | Alexis Abril 92 | Rob Morgan 93 | John Firebaugh 94 | Sam Bisbee 95 | Gilmore Davidson 96 | Brian Brennan 97 | Xavier Montillet 98 | Daniel Pihlstrom 99 | Sahab Yazdani 100 | avaly 101 | Scott Hughes 102 | Mike Sherov 103 | Greg Hazel 104 | Schalk Neethling 105 | Denis Knauf 106 | Timo Tijhof 107 | Steen Nielsen 108 | Anton Ryzhov 109 | Shi Chuan 110 | Berker Peksag 111 | Toby Brain 112 | Matt Mueller 113 | Justin 114 | Daniel Herman 115 | Oleg Gaidarenko 116 | Richard Gibson 117 | Rafaël Blais Masson 118 | cmc3cn <59194618@qq.com> 119 | Joe Presbrey 120 | Sindre Sorhus 121 | Arne de Bree 122 | Vladislav Zarakovsky 123 | Andrew E Monat 124 | Oskari 125 | Joao Henrique de Andrade Bruni 126 | tsinha 127 | Matt Farmer 128 | Trey Hunner 129 | Jason Moon 130 | Jeffery To 131 | Kris Borchers 132 | Vladimir Zhuravlev 133 | Jacob Thornton 134 | Chad Killingsworth 135 | Nowres Rafid 136 | David Benjamin 137 | Uri Gilad 138 | Chris Faulkner 139 | Elijah Manor 140 | Daniel Chatfield 141 | Nikita Govorov 142 | Wesley Walser 143 | Mike Pennisi 144 | Markus Staab 145 | Dave Riddle 146 | Callum Macrae 147 | Benjamin Truyman 148 | James Huston 149 | Erick Ruiz de Chávez 150 | David Bonner 151 | Akintayo Akinwunmi 152 | MORGAN 153 | Ismail Khair 154 | Carl Danley 155 | Mike Petrovich 156 | Greg Lavallee 157 | Daniel Gálvez 158 | Sai Lung Wong 159 | Tom H Fuertes 160 | Roland Eckl 161 | Jay Merrifield 162 | Allen J Schmidt Jr 163 | Jonathan Sampson 164 | Marcel Greter 165 | Matthias Jäggli 166 | David Fox 167 | Yiming He 168 | Devin Cooper 169 | Paul Ramos 170 | Rod Vagg 171 | Bennett Sorbo 172 | Sebastian Burkhard 173 | nanto 174 | Danil Somsikov 175 | Ryunosuke SATO 176 | Jean Boussier 177 | Adam Coulombe 178 | Andrew Plummer 179 | Mark Raddatz 180 | Dmitry Gusev 181 | Michał Gołębiowski 182 | Nguyen Phuc Lam 183 | Tom H Fuertes 184 | Brandon Johnson 185 | Jason Bedard 186 | Kyle Robinson Young 187 | Renato Oliveira dos Santos 188 | Chris Talkington 189 | Eddie Monge 190 | Terry Jones 191 | Jason Merino 192 | Jeremy Dunck 193 | Chris Price 194 | Amey Sakhadeo 195 | Anthony Ryan 196 | Dominik D. Geyer 197 | George Kats 198 | Lihan Li 199 | Ronny Springer 200 | Marian Sollmann 201 | Corey Frang 202 | Chris Antaki 203 | Noah Hamann 204 | David Hong 205 | Jakob Stoeck 206 | Christopher Jones 207 | Forbes Lindesay 208 | John Paul 209 | S. Andrew Sheppard 210 | Leonardo Balter 211 | Roman Reiß 212 | Benjy Cui 213 | Rodrigo Rosenfeld Rosas 214 | John Hoven 215 | Christian Kosmowski 216 | Liang Peng 217 | TJ VanToll 218 | -------------------------------------------------------------------------------- /docs/articles/responsive_files/plotly-htmlwidgets-css-1.46.1/plotly-htmlwidgets.css: -------------------------------------------------------------------------------- 1 | /* 2 | just here so that plotly works 3 | correctly with ioslides. 4 | see https://github.com/ropensci/plotly/issues/463 5 | */ 6 | 7 | slide:not(.current) .plotly.html-widget{ 8 | display: none; 9 | } 10 | -------------------------------------------------------------------------------- /docs/authors.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 | Authors • cssgrid 10 | 11 | 12 | 13 | 14 | 15 | 16 | 17 | 18 | 19 | 20 | 21 | 22 | 23 | 24 | 25 | 26 | 27 | 28 | 29 | 30 | 31 | 32 | 33 | 34 | 35 | 36 | 37 | 38 | 39 | 40 | 41 | 45 | 46 | 47 | 48 | 49 | 50 |
51 |
52 | 110 | 111 | 112 |
113 | 114 |
115 |
116 | 119 | 120 |
    121 |
  • 122 |

    Atsushi Yasumoto. Author, copyright holder, maintainer. ORCID 123 |

    124 |
  • 125 |
126 | 127 |
128 | 129 |
130 | 131 | 132 |
133 | 136 | 137 |
138 |

Site built with pkgdown 1.3.0.

139 |
140 |
141 |
142 | 143 | 144 | 145 | 146 | 147 | 148 | -------------------------------------------------------------------------------- /docs/docsearch.css: -------------------------------------------------------------------------------- 1 | /* Docsearch -------------------------------------------------------------- */ 2 | /* 3 | Source: https://github.com/algolia/docsearch/ 4 | License: MIT 5 | */ 6 | 7 | .algolia-autocomplete { 8 | display: block; 9 | -webkit-box-flex: 1; 10 | -ms-flex: 1; 11 | flex: 1 12 | } 13 | 14 | .algolia-autocomplete .ds-dropdown-menu { 15 | width: 100%; 16 | min-width: none; 17 | max-width: none; 18 | padding: .75rem 0; 19 | background-color: #fff; 20 | background-clip: padding-box; 21 | border: 1px solid rgba(0, 0, 0, .1); 22 | box-shadow: 0 .5rem 1rem rgba(0, 0, 0, .175); 23 | } 24 | 25 | @media (min-width:768px) { 26 | .algolia-autocomplete .ds-dropdown-menu { 27 | width: 175% 28 | } 29 | } 30 | 31 | .algolia-autocomplete .ds-dropdown-menu::before { 32 | display: none 33 | } 34 | 35 | .algolia-autocomplete .ds-dropdown-menu [class^=ds-dataset-] { 36 | padding: 0; 37 | background-color: rgb(255,255,255); 38 | border: 0; 39 | max-height: 80vh; 40 | } 41 | 42 | .algolia-autocomplete .ds-dropdown-menu .ds-suggestions { 43 | margin-top: 0 44 | } 45 | 46 | .algolia-autocomplete .algolia-docsearch-suggestion { 47 | padding: 0; 48 | overflow: visible 49 | } 50 | 51 | .algolia-autocomplete .algolia-docsearch-suggestion--category-header { 52 | padding: .125rem 1rem; 53 | margin-top: 0; 54 | font-size: 1.3em; 55 | font-weight: 500; 56 | color: #00008B; 57 | border-bottom: 0 58 | } 59 | 60 | .algolia-autocomplete .algolia-docsearch-suggestion--wrapper { 61 | float: none; 62 | padding-top: 0 63 | } 64 | 65 | .algolia-autocomplete .algolia-docsearch-suggestion--subcategory-column { 66 | float: none; 67 | width: auto; 68 | padding: 0; 69 | text-align: left 70 | } 71 | 72 | .algolia-autocomplete .algolia-docsearch-suggestion--content { 73 | float: none; 74 | width: auto; 75 | padding: 0 76 | } 77 | 78 | .algolia-autocomplete .algolia-docsearch-suggestion--content::before { 79 | display: none 80 | } 81 | 82 | .algolia-autocomplete .ds-suggestion:not(:first-child) .algolia-docsearch-suggestion--category-header { 83 | padding-top: .75rem; 84 | margin-top: .75rem; 85 | border-top: 1px solid rgba(0, 0, 0, .1) 86 | } 87 | 88 | .algolia-autocomplete .ds-suggestion .algolia-docsearch-suggestion--subcategory-column { 89 | display: block; 90 | padding: .1rem 1rem; 91 | margin-bottom: 0.1; 92 | font-size: 1.0em; 93 | font-weight: 400 94 | /* display: none */ 95 | } 96 | 97 | .algolia-autocomplete .algolia-docsearch-suggestion--title { 98 | display: block; 99 | padding: .25rem 1rem; 100 | margin-bottom: 0; 101 | font-size: 0.9em; 102 | font-weight: 400 103 | } 104 | 105 | .algolia-autocomplete .algolia-docsearch-suggestion--text { 106 | padding: 0 1rem .5rem; 107 | margin-top: -.25rem; 108 | font-size: 0.8em; 109 | font-weight: 400; 110 | line-height: 1.25 111 | } 112 | 113 | .algolia-autocomplete .algolia-docsearch-footer { 114 | width: 110px; 115 | height: 20px; 116 | z-index: 3; 117 | margin-top: 10.66667px; 118 | float: right; 119 | font-size: 0; 120 | line-height: 0; 121 | } 122 | 123 | .algolia-autocomplete .algolia-docsearch-footer--logo { 124 | background-image: url("data:image/svg+xml;utf8,"); 125 | background-repeat: no-repeat; 126 | background-position: 50%; 127 | background-size: 100%; 128 | overflow: hidden; 129 | text-indent: -9000px; 130 | width: 100%; 131 | height: 100%; 132 | display: block; 133 | transform: translate(-8px); 134 | } 135 | 136 | .algolia-autocomplete .algolia-docsearch-suggestion--highlight { 137 | color: #FF8C00; 138 | background: rgba(232, 189, 54, 0.1) 139 | } 140 | 141 | 142 | .algolia-autocomplete .algolia-docsearch-suggestion--text .algolia-docsearch-suggestion--highlight { 143 | box-shadow: inset 0 -2px 0 0 rgba(105, 105, 105, .5) 144 | } 145 | 146 | .algolia-autocomplete .ds-suggestion.ds-cursor .algolia-docsearch-suggestion--content { 147 | background-color: rgba(192, 192, 192, .15) 148 | } 149 | -------------------------------------------------------------------------------- /docs/docsearch.js: -------------------------------------------------------------------------------- 1 | $(function() { 2 | 3 | // register a handler to move the focus to the search bar 4 | // upon pressing shift + "/" (i.e. "?") 5 | $(document).on('keydown', function(e) { 6 | if (e.shiftKey && e.keyCode == 191) { 7 | e.preventDefault(); 8 | $("#search-input").focus(); 9 | } 10 | }); 11 | 12 | $(document).ready(function() { 13 | // do keyword highlighting 14 | /* modified from https://jsfiddle.net/julmot/bL6bb5oo/ */ 15 | var mark = function() { 16 | 17 | var referrer = document.URL ; 18 | var paramKey = "q" ; 19 | 20 | if (referrer.indexOf("?") !== -1) { 21 | var qs = referrer.substr(referrer.indexOf('?') + 1); 22 | var qs_noanchor = qs.split('#')[0]; 23 | var qsa = qs_noanchor.split('&'); 24 | var keyword = ""; 25 | 26 | for (var i = 0; i < qsa.length; i++) { 27 | var currentParam = qsa[i].split('='); 28 | 29 | if (currentParam.length !== 2) { 30 | continue; 31 | } 32 | 33 | if (currentParam[0] == paramKey) { 34 | keyword = decodeURIComponent(currentParam[1].replace(/\+/g, "%20")); 35 | } 36 | } 37 | 38 | if (keyword !== "") { 39 | $(".contents").unmark({ 40 | done: function() { 41 | $(".contents").mark(keyword); 42 | } 43 | }); 44 | } 45 | } 46 | }; 47 | 48 | mark(); 49 | }); 50 | }); 51 | 52 | /* Search term highlighting ------------------------------*/ 53 | 54 | function matchedWords(hit) { 55 | var words = []; 56 | 57 | var hierarchy = hit._highlightResult.hierarchy; 58 | // loop to fetch from lvl0, lvl1, etc. 59 | for (var idx in hierarchy) { 60 | words = words.concat(hierarchy[idx].matchedWords); 61 | } 62 | 63 | var content = hit._highlightResult.content; 64 | if (content) { 65 | words = words.concat(content.matchedWords); 66 | } 67 | 68 | // return unique words 69 | var words_uniq = [...new Set(words)]; 70 | return words_uniq; 71 | } 72 | 73 | function updateHitURL(hit) { 74 | 75 | var words = matchedWords(hit); 76 | var url = ""; 77 | 78 | if (hit.anchor) { 79 | url = hit.url_without_anchor + '?q=' + escape(words.join(" ")) + '#' + hit.anchor; 80 | } else { 81 | url = hit.url + '?q=' + escape(words.join(" ")); 82 | } 83 | 84 | return url; 85 | } 86 | -------------------------------------------------------------------------------- /docs/index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | Easy CSS Grid Layout For R Markdown And Shiny • cssgrid 9 | 10 | 11 | 12 | 13 | 14 | 15 | 19 | 20 | 21 |
22 |
80 | 81 | 82 | 83 |
84 |
85 | 86 | 87 | 88 | 89 | 90 |
91 | 93 | 94 | 95 |

CSS Grid Layout for R Markdown and Shiny

96 |
97 |

98 | Installation

99 |
source("https://install-github.me/atusy/cssgrid")
100 |
101 |
102 |

103 | Example

104 |

markdown Examples does not work on README on GitHub.

105 |

Take a look at

106 | 110 |
111 |
112 |
113 | 114 | 146 | 147 |
148 | 149 | 150 |
153 | 154 |
155 |

Site built with pkgdown 1.3.0.

156 |
157 |
158 |
159 | 160 | 161 | 162 | 163 | 164 | -------------------------------------------------------------------------------- /docs/link.svg: -------------------------------------------------------------------------------- 1 | 2 | 3 | 5 | 8 | 12 | 13 | -------------------------------------------------------------------------------- /docs/news/index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 | Changelog • cssgrid 10 | 11 | 12 | 13 | 14 | 15 | 16 | 17 | 18 | 19 | 20 | 21 | 22 | 23 | 24 | 25 | 26 | 27 | 28 | 29 | 30 | 31 | 32 | 33 | 34 | 35 | 36 | 37 | 38 | 39 | 40 | 41 | 45 | 46 | 47 | 48 | 49 | 50 |
51 |
52 | 110 | 111 | 112 |
113 | 114 |
115 |
116 | 120 | 121 |
122 |

123 | cssgrid 0.1.0

124 |
    125 |
  • Added 126 |
      127 |
    • 128 | grid_layout() that creates a CSS Grid Layout container for general purpose
    • 129 |
    • 130 | grid_item() that creates items in a CSS Grid Layout container.
    • 131 |
    • 132 | grid_rowwise() that creates a single rowwise layout with CSS Grid.
    • 133 |
    • 134 | grid_colwise() that creates a single columnwise layout with CSS Grid.
    • 135 |
    • 136 | construct_areas() that creates CSS values for grid-template-areas. This function is implicitly used by grid_layout(), but can also be used explicitly and specify the returned value to areas argument of grid_layout().
    • 137 |
    138 |
  • 139 |
  • Achieved 100% code coverage
  • 140 |
141 |
142 |
143 | 144 | 152 | 153 |
154 | 155 |
156 | 159 | 160 |
161 |

Site built with pkgdown 1.3.0.

162 |
163 |
164 |
165 | 166 | 167 | 168 | 169 | 170 | 171 | -------------------------------------------------------------------------------- /docs/pkgdown.css: -------------------------------------------------------------------------------- 1 | /* Sticky footer */ 2 | 3 | /** 4 | * Basic idea: https://philipwalton.github.io/solved-by-flexbox/demos/sticky-footer/ 5 | * Details: https://github.com/philipwalton/solved-by-flexbox/blob/master/assets/css/components/site.css 6 | * 7 | * .Site -> body > .container 8 | * .Site-content -> body > .container .row 9 | * .footer -> footer 10 | * 11 | * Key idea seems to be to ensure that .container and __all its parents__ 12 | * have height set to 100% 13 | * 14 | */ 15 | 16 | html, body { 17 | height: 100%; 18 | } 19 | 20 | body > .container { 21 | display: flex; 22 | height: 100%; 23 | flex-direction: column; 24 | 25 | padding-top: 60px; 26 | } 27 | 28 | body > .container .row { 29 | flex: 1 0 auto; 30 | } 31 | 32 | footer { 33 | margin-top: 45px; 34 | padding: 35px 0 36px; 35 | border-top: 1px solid #e5e5e5; 36 | color: #666; 37 | display: flex; 38 | flex-shrink: 0; 39 | } 40 | footer p { 41 | margin-bottom: 0; 42 | } 43 | footer div { 44 | flex: 1; 45 | } 46 | footer .pkgdown { 47 | text-align: right; 48 | } 49 | footer p { 50 | margin-bottom: 0; 51 | } 52 | 53 | img.icon { 54 | float: right; 55 | } 56 | 57 | img { 58 | max-width: 100%; 59 | } 60 | 61 | /* Fix bug in bootstrap (only seen in firefox) */ 62 | summary { 63 | display: list-item; 64 | } 65 | 66 | /* Typographic tweaking ---------------------------------*/ 67 | 68 | .contents .page-header { 69 | margin-top: calc(-60px + 1em); 70 | } 71 | 72 | /* Section anchors ---------------------------------*/ 73 | 74 | a.anchor { 75 | margin-left: -30px; 76 | display:inline-block; 77 | width: 30px; 78 | height: 30px; 79 | visibility: hidden; 80 | 81 | background-image: url(./link.svg); 82 | background-repeat: no-repeat; 83 | background-size: 20px 20px; 84 | background-position: center center; 85 | } 86 | 87 | .hasAnchor:hover a.anchor { 88 | visibility: visible; 89 | } 90 | 91 | @media (max-width: 767px) { 92 | .hasAnchor:hover a.anchor { 93 | visibility: hidden; 94 | } 95 | } 96 | 97 | 98 | /* Fixes for fixed navbar --------------------------*/ 99 | 100 | .contents h1, .contents h2, .contents h3, .contents h4 { 101 | padding-top: 60px; 102 | margin-top: -40px; 103 | } 104 | 105 | /* Static header placement on mobile devices */ 106 | @media (max-width: 767px) { 107 | .navbar-fixed-top { 108 | position: absolute; 109 | } 110 | .navbar { 111 | padding: 0; 112 | } 113 | } 114 | 115 | 116 | /* Sidebar --------------------------*/ 117 | 118 | #sidebar { 119 | margin-top: 30px; 120 | } 121 | #sidebar h2 { 122 | font-size: 1.5em; 123 | margin-top: 1em; 124 | } 125 | 126 | #sidebar h2:first-child { 127 | margin-top: 0; 128 | } 129 | 130 | #sidebar .list-unstyled li { 131 | margin-bottom: 0.5em; 132 | } 133 | 134 | .orcid { 135 | height: 16px; 136 | vertical-align: middle; 137 | } 138 | 139 | /* Reference index & topics ----------------------------------------------- */ 140 | 141 | .ref-index th {font-weight: normal;} 142 | 143 | .ref-index td {vertical-align: top;} 144 | .ref-index .icon {width: 40px;} 145 | .ref-index .alias {width: 40%;} 146 | .ref-index-icons .alias {width: calc(40% - 40px);} 147 | .ref-index .title {width: 60%;} 148 | 149 | .ref-arguments th {text-align: right; padding-right: 10px;} 150 | .ref-arguments th, .ref-arguments td {vertical-align: top;} 151 | .ref-arguments .name {width: 20%;} 152 | .ref-arguments .desc {width: 80%;} 153 | 154 | /* Nice scrolling for wide elements --------------------------------------- */ 155 | 156 | table { 157 | display: block; 158 | overflow: auto; 159 | } 160 | 161 | /* Syntax highlighting ---------------------------------------------------- */ 162 | 163 | pre { 164 | word-wrap: normal; 165 | word-break: normal; 166 | border: 1px solid #eee; 167 | } 168 | 169 | pre, code { 170 | background-color: #f8f8f8; 171 | color: #333; 172 | } 173 | 174 | pre code { 175 | overflow: auto; 176 | word-wrap: normal; 177 | white-space: pre; 178 | } 179 | 180 | pre .img { 181 | margin: 5px 0; 182 | } 183 | 184 | pre .img img { 185 | background-color: #fff; 186 | display: block; 187 | height: auto; 188 | } 189 | 190 | code a, pre a { 191 | color: #375f84; 192 | } 193 | 194 | a.sourceLine:hover { 195 | text-decoration: none; 196 | } 197 | 198 | .fl {color: #1514b5;} 199 | .fu {color: #000000;} /* function */ 200 | .ch,.st {color: #036a07;} /* string */ 201 | .kw {color: #264D66;} /* keyword */ 202 | .co {color: #888888;} /* comment */ 203 | 204 | .message { color: black; font-weight: bolder;} 205 | .error { color: orange; font-weight: bolder;} 206 | .warning { color: #6A0366; font-weight: bolder;} 207 | 208 | /* Clipboard --------------------------*/ 209 | 210 | .hasCopyButton { 211 | position: relative; 212 | } 213 | 214 | .btn-copy-ex { 215 | position: absolute; 216 | right: 0; 217 | top: 0; 218 | visibility: hidden; 219 | } 220 | 221 | .hasCopyButton:hover button.btn-copy-ex { 222 | visibility: visible; 223 | } 224 | 225 | /* mark.js ----------------------------*/ 226 | 227 | mark { 228 | background-color: rgba(255, 255, 51, 0.5); 229 | border-bottom: 2px solid rgba(255, 153, 51, 0.3); 230 | padding: 1px; 231 | } 232 | 233 | /* vertical spacing after htmlwidgets */ 234 | .html-widget { 235 | margin-bottom: 10px; 236 | } 237 | -------------------------------------------------------------------------------- /docs/pkgdown.js: -------------------------------------------------------------------------------- 1 | /* http://gregfranko.com/blog/jquery-best-practices/ */ 2 | (function($) { 3 | $(function() { 4 | 5 | $("#sidebar") 6 | .stick_in_parent({offset_top: 40}) 7 | .on('sticky_kit:bottom', function(e) { 8 | $(this).parent().css('position', 'static'); 9 | }) 10 | .on('sticky_kit:unbottom', function(e) { 11 | $(this).parent().css('position', 'relative'); 12 | }); 13 | 14 | $('body').scrollspy({ 15 | target: '#sidebar', 16 | offset: 60 17 | }); 18 | 19 | $('[data-toggle="tooltip"]').tooltip(); 20 | 21 | var cur_path = paths(location.pathname); 22 | var links = $("#navbar ul li a"); 23 | var max_length = -1; 24 | var pos = -1; 25 | for (var i = 0; i < links.length; i++) { 26 | if (links[i].getAttribute("href") === "#") 27 | continue; 28 | // Ignore external links 29 | if (links[i].host !== location.host) 30 | continue; 31 | 32 | var nav_path = paths(links[i].pathname); 33 | 34 | var length = prefix_length(nav_path, cur_path); 35 | if (length > max_length) { 36 | max_length = length; 37 | pos = i; 38 | } 39 | } 40 | 41 | // Add class to parent
  • , and enclosing
  • if in dropdown 42 | if (pos >= 0) { 43 | var menu_anchor = $(links[pos]); 44 | menu_anchor.parent().addClass("active"); 45 | menu_anchor.closest("li.dropdown").addClass("active"); 46 | } 47 | }); 48 | 49 | function paths(pathname) { 50 | var pieces = pathname.split("/"); 51 | pieces.shift(); // always starts with / 52 | 53 | var end = pieces[pieces.length - 1]; 54 | if (end === "index.html" || end === "") 55 | pieces.pop(); 56 | return(pieces); 57 | } 58 | 59 | // Returns -1 if not found 60 | function prefix_length(needle, haystack) { 61 | if (needle.length > haystack.length) 62 | return(-1); 63 | 64 | // Special case for length-0 haystack, since for loop won't run 65 | if (haystack.length === 0) { 66 | return(needle.length === 0 ? 0 : -1); 67 | } 68 | 69 | for (var i = 0; i < haystack.length; i++) { 70 | if (needle[i] != haystack[i]) 71 | return(i); 72 | } 73 | 74 | return(haystack.length); 75 | } 76 | 77 | /* Clipboard --------------------------*/ 78 | 79 | function changeTooltipMessage(element, msg) { 80 | var tooltipOriginalTitle=element.getAttribute('data-original-title'); 81 | element.setAttribute('data-original-title', msg); 82 | $(element).tooltip('show'); 83 | element.setAttribute('data-original-title', tooltipOriginalTitle); 84 | } 85 | 86 | if(ClipboardJS.isSupported()) { 87 | $(document).ready(function() { 88 | var copyButton = ""; 89 | 90 | $(".examples, div.sourceCode").addClass("hasCopyButton"); 91 | 92 | // Insert copy buttons: 93 | $(copyButton).prependTo(".hasCopyButton"); 94 | 95 | // Initialize tooltips: 96 | $('.btn-copy-ex').tooltip({container: 'body'}); 97 | 98 | // Initialize clipboard: 99 | var clipboardBtnCopies = new ClipboardJS('[data-clipboard-copy]', { 100 | text: function(trigger) { 101 | return trigger.parentNode.textContent; 102 | } 103 | }); 104 | 105 | clipboardBtnCopies.on('success', function(e) { 106 | changeTooltipMessage(e.trigger, 'Copied!'); 107 | e.clearSelection(); 108 | }); 109 | 110 | clipboardBtnCopies.on('error', function() { 111 | changeTooltipMessage(e.trigger,'Press Ctrl+C or Command+C to copy'); 112 | }); 113 | }); 114 | } 115 | })(window.jQuery || window.$) 116 | -------------------------------------------------------------------------------- /docs/pkgdown.yml: -------------------------------------------------------------------------------- 1 | pandoc: 2.7.2 2 | pkgdown: 1.3.0 3 | pkgdown_sha: ~ 4 | articles: 5 | cssgrid: cssgrid.html 6 | responsive: responsive.html 7 | 8 | -------------------------------------------------------------------------------- /docs/reference/collapse_areas.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 | A helper function for construct_areas — collapse_areas • cssgrid 10 | 11 | 12 | 13 | 14 | 15 | 16 | 17 | 18 | 19 | 20 | 21 | 22 | 23 | 24 | 25 | 26 | 27 | 28 | 29 | 30 | 31 | 32 | 33 | 34 | 35 | 36 | 37 | 38 | 39 | 40 | 41 | 42 | 43 | 44 | 48 | 49 | 50 | 51 | 52 | 53 |
    54 |
    55 | 93 | 94 | 95 |
    96 | 97 |
    98 |
    99 | 104 | 105 |
    106 | 107 |

    A helper function for construct_areas

    108 | 109 |
    110 | 111 |
    collapse_areas(x)
    112 | 113 | 114 |
    115 | 121 |
    122 | 123 |
    124 | 127 | 128 |
    129 |

    Site built with pkgdown 1.3.0.

    130 |
    131 |
    132 |
    133 | 134 | 135 | 136 | 137 | 138 | 139 | -------------------------------------------------------------------------------- /docs/reference/construct_areas.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 | Construct grid-template-areas property — construct_areas • cssgrid 10 | 11 | 12 | 13 | 14 | 15 | 16 | 17 | 18 | 19 | 20 | 21 | 22 | 23 | 24 | 25 | 26 | 27 | 28 | 29 | 30 | 31 | 32 | 33 | 34 | 35 | 36 | 37 | 38 | 39 | 40 | 41 | 42 | 43 | 44 | 48 | 49 | 50 | 51 | 52 | 53 |
    54 |
    55 | 113 | 114 | 115 |
    116 | 117 |
    118 |
    119 | 124 | 125 |
    126 | 127 |

    Construct grid-template-areas property

    128 | 129 |
    130 | 131 |
    construct_areas(x = NULL, ...)
    132 | 
    133 | # S3 method for grid_areas
    134 | construct_areas(x = NULL, ...)
    135 | 
    136 | # S3 method for default
    137 | construct_areas(x = NULL, ...)
    138 | 
    139 | # S3 method for data.frame
    140 | construct_areas(x, ...)
    141 | 
    142 | # S3 method for matrix
    143 | construct_areas(x, ...)
    144 | 145 |

    Arguments

    146 | 147 | 148 | 149 | 150 | 151 | 152 | 153 | 154 | 155 | 156 |
    x

    NULL, an atomic vector, a matrix, or a data frame

    ...

    discarded

    157 | 158 | 159 |
    160 | 167 |
    168 | 169 |
    170 | 173 | 174 |
    175 |

    Site built with pkgdown 1.3.0.

    176 |
    177 |
    178 |
    179 | 180 | 181 | 182 | 183 | 184 | 185 | -------------------------------------------------------------------------------- /docs/reference/grid_item.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 | Construct an item to be contained by CSS grid layout — grid_item • cssgrid 10 | 11 | 12 | 13 | 14 | 15 | 16 | 17 | 18 | 19 | 20 | 21 | 22 | 23 | 24 | 25 | 26 | 27 | 28 | 29 | 30 | 31 | 32 | 33 | 34 | 35 | 36 | 37 | 38 | 39 | 40 | 41 | 42 | 43 | 44 | 48 | 49 | 50 | 51 | 52 | 53 |
    54 |
    55 | 113 | 114 | 115 |
    116 | 117 |
    118 |
    119 | 124 | 125 |
    126 | 127 |

    Construct an item to be contained by CSS grid layout

    128 | 129 |
    130 | 131 |
    grid_item(..., row_start = NULL, row_end = NULL, row = NULL,
    132 |   column_start = NULL, column_end = NULL, col = NULL, column = col,
    133 |   area = NULL, justify_self = NULL, align_self = NULL,
    134 |   z_index = NULL, order = NULL, style = NULL)
    135 | 136 |

    Arguments

    137 | 138 | 139 | 140 | 141 | 142 | 143 | 144 | 145 | 149 | 150 | 151 | 152 | 153 | 154 | 155 | 156 | 161 | 162 | 163 | 164 | 166 | 167 | 168 | 169 | 170 | 171 |
    ...

    Items in the container

    row_start, row_end, row, column_start, column_end, column, area

    CSS properties of gird-*, whereas grid- is abbreviated, and hyphens are 146 | replaced by underscores. For example, the row_start argument is equivalent 147 | to the CSS's grid-row-start property. Specify a string as a value for the 148 | corresponding CSS property.

    col

    An alias of column

    justify_self, align_self

    Strings to specify values for the CSS's 157 | justify-self 158 | and 159 | align-self 160 | properties.

    z_index, order

    A string to specify the corresponding CSS property (z-index and order, 165 | respectively)

    style

    Additional values of the style attribute such as color: red;.

    172 | 173 | 174 |
    175 | 182 |
    183 | 184 |
    185 | 188 | 189 |
    190 |

    Site built with pkgdown 1.3.0.

    191 |
    192 |
    193 |
    194 | 195 | 196 | 197 | 198 | 199 | 200 | -------------------------------------------------------------------------------- /docs/reference/grid_layout.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 | Generate CSS grid — grid_layout • cssgrid 10 | 11 | 12 | 13 | 14 | 15 | 16 | 17 | 18 | 19 | 20 | 21 | 22 | 23 | 24 | 25 | 26 | 27 | 28 | 29 | 30 | 31 | 32 | 33 | 34 | 35 | 36 | 37 | 38 | 39 | 40 | 41 | 42 | 43 | 44 | 48 | 49 | 50 | 51 | 52 | 53 |
    54 |
    55 | 113 | 114 | 115 |
    116 | 117 |
    118 |
    119 | 124 | 125 |
    126 | 127 |

    Generate CSS grid

    128 | 129 |
    130 | 131 |
    grid_layout(..., display = c("grid", "inline-grid"), grid = NULL,
    132 |   template = NULL, rows = template_rows, template_rows = NULL,
    133 |   cols = template_columns, template_columns = NULL,
    134 |   areas = template_areas, template_areas = NULL, flow = c("", "row",
    135 |   "column", "dense", "row dense", "column dense"), auto_flow = c("",
    136 |   "row", "column", "dense", "row dense", "column dense"),
    137 |   auto_rows = NULL, auto_cols = auto_columns, auto_columns = NULL,
    138 |   row_gap = NULL, column_gap = NULL, gap = NULL,
    139 |   justify_content = NULL, align_content = NULL, justify_items = NULL,
    140 |   align_items = NULL, style = NULL)
    141 | 142 |

    Arguments

    143 | 144 | 145 | 146 | 147 | 148 | 149 | 150 | 151 | 153 | 154 | 155 | 156 | 165 | 166 | 167 | 168 | 170 | 171 | 172 | 173 | 175 | 176 | 177 | 178 | 184 | 185 | 186 | 187 | 193 | 194 | 195 | 196 | 197 | 198 |
    ...

    Items in the container

    display

    Specifies the CSS's display property by "display", "inline-display". 152 | Partial matching is used.

    template, auto_flow, auto_rows, auto_columns, row_gap, column_gap, gap, grid

    CSS properties of gird-*, whereas grid- is abbreviated, and hyphens 157 | are replaced by underscores. Specify string that muches the style of a 158 | certain CSS property. For example, the template_rows argument is 159 | equivalent to the CSS's grid-template-rows property. An exception is the 160 | grid argument which is equivalent to the CSS's grid property. The 161 | auto_flow argument can be specified by "", "row", "column" or "dense". 162 | Partial matching is used and "" skip specifying grid-flow. For details, 163 | see documents of CSS properties of CSS Grid Layout by Mozilla. 164 | Default values are NULL or "".

    rows, cols, areas, flow, auto_cols

    Aliases of template_rows, template_columns, and template_areas, 169 | auto_columns, respectively`

    template_rows, template_columns

    A character vector to specify size of each rows and columns in the grid 174 | such as "100px 1fr" or c("100px", "1fr"). Default is NULL.

    template_areas

    A vector, a matrix, or a data frame. 179 | If a vector, separate names of each areas in a row by space, 180 | and separate columns by elements such as c("a b", "c d"). 181 | If a matrix or a data frame, names and positions of each elements indicate 182 | the name of area and the position of area, respectively. 183 | Default is NULL.

    justify_content, align_content, justify_items, align_items

    Arguments equivalent to the CSS's 188 | justify-content, 189 | align-content, 190 | justify-items, 191 | align_items 192 | properties, respectively.`

    style

    Additional values of the style attribute such as color: red;.

    199 | 200 |

    Details

    201 | 202 |

    Default values of NULL or "" indicate the corresponding CSS properties 203 | are not specified.

    204 | 205 | 206 |
    207 | 216 |
    217 | 218 |
    219 | 222 | 223 |
    224 |

    Site built with pkgdown 1.3.0.

    225 |
    226 |
    227 |
    228 | 229 | 230 | 231 | 232 | 233 | 234 | -------------------------------------------------------------------------------- /docs/reference/grid_rowwise.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 | Gird layout in single row or column — grid_rowwise • cssgrid 10 | 11 | 12 | 13 | 14 | 15 | 16 | 17 | 18 | 19 | 20 | 21 | 22 | 23 | 24 | 25 | 26 | 27 | 28 | 29 | 30 | 31 | 32 | 33 | 34 | 35 | 36 | 37 | 38 | 39 | 40 | 41 | 42 | 43 | 44 | 48 | 49 | 50 | 51 | 52 | 53 |
    54 |
    55 | 113 | 114 | 115 |
    116 | 117 |
    118 |
    119 | 124 | 125 |
    126 | 127 |

    Gird layout in single row or column

    128 | 129 |
    130 | 131 |
    grid_rowwise(..., cols = character(0L))
    132 | 
    133 | grid_colwise(..., rows = character(0L))
    134 | 135 |

    Arguments

    136 | 137 | 138 | 139 | 140 | 141 | 142 | 143 | 144 | 147 | 148 |
    ...

    Items in CSS Grid Layout and arguments passed to grid_layout.

    rows, cols

    Sizes of rows and columns in a character vector. 145 | If the given number of sizes are less than the number of items, 146 | then "auto" is used for items missing sizes.

    149 | 150 | 151 |
    152 | 159 |
    160 | 161 |
    162 | 165 | 166 |
    167 |

    Site built with pkgdown 1.3.0.

    168 |
    169 |
    170 |
    171 | 172 | 173 | 174 | 175 | 176 | 177 | -------------------------------------------------------------------------------- /docs/reference/hello.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 | Hello, World! — hello • cssgrid 10 | 11 | 12 | 13 | 14 | 15 | 16 | 17 | 18 | 19 | 20 | 21 | 22 | 23 | 24 | 25 | 26 | 27 | 28 | 29 | 30 | 31 | 32 | 33 | 34 | 35 | 36 | 37 | 38 | 39 | 40 | 41 | 42 | 43 | 44 | 48 | 49 | 50 | 51 | 52 | 53 |
    54 |
    55 | 93 | 94 | 95 |
    96 | 97 |
    98 |
    99 | 104 | 105 |
    106 | 107 |

    Prints 'Hello, world!'.

    108 | 109 |
    110 | 111 |
    hello()
    112 | 113 | 114 |

    Examples

    115 |
    hello()
    #> Error in hello(): could not find function "hello"
    116 |
    117 | 125 |
    126 | 127 |
    128 | 131 | 132 |
    133 |

    Site built with pkgdown 1.3.0.

    134 |
    135 |
    136 |
    137 | 138 | 139 | 140 | 141 | 142 | 143 | -------------------------------------------------------------------------------- /docs/reference/index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 | Function reference • cssgrid 10 | 11 | 12 | 13 | 14 | 15 | 16 | 17 | 18 | 19 | 20 | 21 | 22 | 23 | 24 | 25 | 26 | 27 | 28 | 29 | 30 | 31 | 32 | 33 | 34 | 35 | 36 | 37 | 38 | 39 | 40 | 41 | 45 | 46 | 47 | 48 | 49 | 50 |
    51 |
    52 | 110 | 111 | 112 |
    113 | 114 |
    115 |
    116 | 119 | 120 | 121 | 122 | 123 | 124 | 125 | 126 | 127 | 128 | 129 | 130 | 134 | 135 | 136 | 137 | 140 | 141 | 142 | 143 | 146 | 147 | 148 | 149 | 152 | 153 | 154 | 155 | 158 | 159 | 160 | 161 |
    131 |

    All functions

    132 |

    133 |
    138 |

    construct_areas()

    139 |

    Construct grid-template-areas property

    144 |

    grid_item()

    145 |

    Construct an item to be contained by CSS grid layout

    150 |

    grid_layout()

    151 |

    Generate CSS grid

    156 |

    grid_rowwise() grid_colwise()

    157 |

    Gird layout in single row or column

    162 |
    163 | 164 | 170 |
    171 | 172 |
    173 | 176 | 177 |
    178 |

    Site built with pkgdown 1.3.0.

    179 |
    180 |
    181 |
    182 | 183 | 184 | 185 | 186 | 187 | 188 | -------------------------------------------------------------------------------- /docs/reference/reexports.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 | Objects exported from other packages — reexports • cssgrid 10 | 11 | 12 | 13 | 14 | 15 | 16 | 17 | 18 | 19 | 20 | 21 | 22 | 23 | 24 | 25 | 26 | 27 | 28 | 29 | 30 | 31 | 32 | 33 | 34 | 35 | 40 | 41 | 42 | 43 | 44 | 45 | 46 | 47 | 48 | 52 | 53 | 54 | 55 | 56 | 57 |
    58 |
    59 | 117 | 118 | 119 |
    120 | 121 |
    122 |
    123 | 128 | 129 |
    130 | 131 |

    These objects are imported from other packages. Follow the links 132 | below to see their documentation.

    133 |
    134 |
    htmltools

    div, tagList, tags

    135 |
    136 | 137 |
    138 | 139 | 140 | 141 |
    142 | 148 |
    149 | 150 |
    151 | 154 | 155 |
    156 |

    Site built with pkgdown 1.3.0.

    157 |
    158 |
    159 |
    160 | 161 | 162 | 163 | 164 | 165 | 166 | -------------------------------------------------------------------------------- /man/construct_areas.Rd: -------------------------------------------------------------------------------- 1 | % Generated by roxygen2: do not edit by hand 2 | % Please edit documentation in R/construct-areas.R 3 | \name{construct_areas} 4 | \alias{construct_areas} 5 | \alias{construct_areas.grid_areas} 6 | \alias{construct_areas.default} 7 | \alias{construct_areas.data.frame} 8 | \alias{construct_areas.matrix} 9 | \title{Construct grid-template-areas property} 10 | \usage{ 11 | construct_areas(x = NULL, ...) 12 | 13 | \method{construct_areas}{grid_areas}(x = NULL, ...) 14 | 15 | \method{construct_areas}{default}(x = NULL, ...) 16 | 17 | \method{construct_areas}{data.frame}(x, ...) 18 | 19 | \method{construct_areas}{matrix}(x, ...) 20 | } 21 | \arguments{ 22 | \item{x}{NULL, an atomic vector, a matrix, or a data frame} 23 | 24 | \item{...}{discarded} 25 | } 26 | \description{ 27 | Construct grid-template-areas property 28 | } 29 | -------------------------------------------------------------------------------- /man/grid_item.Rd: -------------------------------------------------------------------------------- 1 | % Generated by roxygen2: do not edit by hand 2 | % Please edit documentation in R/grid-item.R 3 | \name{grid_item} 4 | \alias{grid_item} 5 | \title{Construct an item to be contained by CSS grid layout} 6 | \usage{ 7 | grid_item(..., row_start = NULL, row_end = NULL, row = NULL, 8 | column_start = NULL, column_end = NULL, col = NULL, column = col, 9 | area = NULL, justify_self = NULL, align_self = NULL, 10 | z_index = NULL, order = NULL, style = NULL) 11 | } 12 | \arguments{ 13 | \item{...}{Items in the container} 14 | 15 | \item{row_start, row_end, row, column_start, column_end, column, area}{CSS properties of \code{gird-*}, whereas \code{grid-} is abbreviated, and hyphens are 16 | replaced by underscores. For example, the \code{row_start} argument is equivalent 17 | to the CSS's \code{grid-row-start} property. Specify a string as a value for the 18 | corresponding CSS property.} 19 | 20 | \item{col}{An alias of column} 21 | 22 | \item{justify_self, align_self}{Strings to specify values for the CSS's 23 | \href{https://developer.mozilla.org/en-US/docs/Web/CSS/justify-self}{justify-self} 24 | and 25 | \href{https://developer.mozilla.org/en-US/docs/Web/CSS/align-self}{align-self} 26 | properties.} 27 | 28 | \item{z_index, order}{A string to specify the corresponding CSS property (\code{z-index} and \code{order}, 29 | respectively)} 30 | 31 | \item{style}{Additional values of the style attribute such as \code{color: red;}.} 32 | } 33 | \description{ 34 | Construct an item to be contained by CSS grid layout 35 | } 36 | -------------------------------------------------------------------------------- /man/grid_layout.Rd: -------------------------------------------------------------------------------- 1 | % Generated by roxygen2: do not edit by hand 2 | % Please edit documentation in R/grid-layout.R 3 | \name{grid_layout} 4 | \alias{grid_layout} 5 | \title{Generate CSS grid} 6 | \usage{ 7 | grid_layout(..., display = c("grid", "inline-grid"), grid = NULL, 8 | template = NULL, rows = template_rows, template_rows = NULL, 9 | cols = template_columns, template_columns = NULL, 10 | areas = template_areas, template_areas = NULL, flow = c("", "row", 11 | "column", "dense", "row dense", "column dense"), auto_flow = c("", 12 | "row", "column", "dense", "row dense", "column dense"), 13 | auto_rows = NULL, auto_cols = auto_columns, auto_columns = NULL, 14 | row_gap = NULL, column_gap = NULL, gap = NULL, 15 | justify_content = NULL, align_content = NULL, justify_items = NULL, 16 | align_items = NULL, style = NULL) 17 | } 18 | \arguments{ 19 | \item{...}{Items in the container} 20 | 21 | \item{display}{Specifies the CSS's \code{display} property by \code{"display"}, \code{"inline-display"}. 22 | Partial matching is used.} 23 | 24 | \item{template, auto_flow, auto_rows, auto_columns, row_gap, column_gap, gap, grid}{CSS properties of \code{gird-*}, whereas \code{grid-} is abbreviated, and hyphens 25 | are replaced by underscores. Specify string that muches the style of a 26 | certain CSS property. For example, the \code{template_rows} argument is 27 | equivalent to the CSS's \code{grid-template-rows} property. An exception is the 28 | \code{grid} argument which is equivalent to the CSS's \code{grid} property. The 29 | \code{auto_flow} argument can be specified by \code{""}, \code{"row"}, \code{"column"} or \code{"dense"}. 30 | Partial matching is used and \code{""} skip specifying \code{grid-flow}. For details, 31 | see documents of \href{https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_Grid_Layout#CSS_properties}{CSS properties of CSS Grid Layout by Mozilla}. 32 | Default values are \code{NULL} or \code{""}.} 33 | 34 | \item{rows, cols, areas, flow, auto_cols}{Aliases of \code{template_rows}, \code{template_columns}, and \code{template_areas}, 35 | \code{auto_columns}, respectively`} 36 | 37 | \item{template_rows, template_columns}{A character vector to specify size of each rows and columns in the grid 38 | such as \code{"100px 1fr"} or \code{c("100px", "1fr")}. Default is \code{NULL}.} 39 | 40 | \item{template_areas}{A vector, a matrix, or a data frame. 41 | If a vector, separate names of each areas in a row by space, 42 | and separate columns by elements such as \code{c("a b", "c d")}. 43 | If a matrix or a data frame, names and positions of each elements indicate 44 | the name of area and the position of area, respectively. 45 | Default is \code{NULL}.} 46 | 47 | \item{justify_content, align_content, justify_items, align_items}{Arguments equivalent to the CSS's 48 | \href{https://developer.mozilla.org/en-US/docs/Web/CSS/justify-content}{justify-content}, 49 | \href{https://developer.mozilla.org/en-US/docs/Web/CSS/align-content}{align-content}, 50 | \href{https://developer.mozilla.org/en-US/docs/Web/CSS/justify-items}{justify-items}, 51 | \href{https://developer.mozilla.org/en-US/docs/Web/CSS/align-items}{align_items} 52 | properties, respectively.`} 53 | 54 | \item{style}{Additional values of the style attribute such as \code{color: red;}.} 55 | } 56 | \description{ 57 | Generate CSS grid 58 | } 59 | \details{ 60 | Default values of \code{NULL} or \code{""} indicate the corresponding CSS properties 61 | are not specified. 62 | } 63 | -------------------------------------------------------------------------------- /man/grid_rowwise.Rd: -------------------------------------------------------------------------------- 1 | % Generated by roxygen2: do not edit by hand 2 | % Please edit documentation in R/grid-rowwise.R, R/grid-colwise.R 3 | \name{grid_rowwise} 4 | \alias{grid_rowwise} 5 | \alias{grid_colwise} 6 | \title{Gird layout in single row or column} 7 | \usage{ 8 | grid_rowwise(..., cols = character(0L)) 9 | 10 | grid_colwise(..., rows = character(0L)) 11 | } 12 | \arguments{ 13 | \item{...}{Items in CSS Grid Layout and arguments passed to \code{\link{grid_layout}}.} 14 | 15 | \item{rows, cols}{Sizes of rows and columns in a character vector. 16 | If the given number of sizes are less than the number of items, 17 | then \code{"auto"} is used for items missing sizes.} 18 | } 19 | \description{ 20 | Gird layout in single row or column 21 | } 22 | -------------------------------------------------------------------------------- /man/reexports.Rd: -------------------------------------------------------------------------------- 1 | % Generated by roxygen2: do not edit by hand 2 | % Please edit documentation in R/re-export.R 3 | \docType{import} 4 | \name{reexports} 5 | \alias{reexports} 6 | \alias{div} 7 | \alias{tagList} 8 | \alias{tags} 9 | \title{Objects exported from other packages} 10 | \keyword{internal} 11 | \description{ 12 | These objects are imported from other packages. Follow the links 13 | below to see their documentation. 14 | 15 | \describe{ 16 | \item{htmltools}{\code{\link[htmltools]{div}}, \code{\link[htmltools]{tagList}}, \code{\link[htmltools]{tags}}} 17 | }} 18 | 19 | -------------------------------------------------------------------------------- /tests/testthat.R: -------------------------------------------------------------------------------- 1 | library(testthat) 2 | library(cssgrid) 3 | 4 | test_check("cssgrid") 5 | -------------------------------------------------------------------------------- /tests/testthat/test-collapse.R: -------------------------------------------------------------------------------- 1 | test_that("Collapse vectors into a string", { 2 | expect_identical(collapse(), NULL) 3 | expect_identical(collapse(NULL), NULL) 4 | expect_identical(collapse(NULL, 1), "1") 5 | expect_identical(collapse(1, 2), "1 2") 6 | expect_identical(collapse(1, 2, sep = ","), "1,2") 7 | expect_identical(collapse(c(1, 2)), "1 2") 8 | expect_identical(collapse(c(1, 2), 2), "1 2 2") 9 | }) 10 | -------------------------------------------------------------------------------- /tests/testthat/test-construct-areas.R: -------------------------------------------------------------------------------- 1 | test_that("Construct grid-template-areas property", { 2 | ans <- structure("'a b' 'a c'", class = c("grid_areas", "character")) 3 | 4 | test <- lapply( 5 | list( 6 | c("a b", "a c"), 7 | matrix(c("a", "a", "b", "c"), nrow = 2L, ncol = 2L), 8 | data.frame(x1 = c("a", "a"), x2 = c("b", "c")), 9 | NULL 10 | ), 11 | construct_areas 12 | ) 13 | 14 | n <- length(test) 15 | 16 | lapply(test[-n], expect_equal, ans) 17 | expect_equal(test[[n]], NULL) 18 | }) 19 | 20 | test_that("Construction fails if list is given", { 21 | expect_error(construct_areas(list())) 22 | }) 23 | 24 | test_that("Returns as is if input is grid_areas class object", { 25 | x <- structure("foo", class = "grid_areas") 26 | expect_identical(construct_areas(x), x) 27 | }) 28 | -------------------------------------------------------------------------------- /tests/testthat/test-construct-style.R: -------------------------------------------------------------------------------- 1 | test_that("NULL if no arguments", { 2 | expect_null(construct_style()) 3 | }) 4 | 5 | test_that("Error if there is unnamed arguments", { 6 | expect_error(construct_style("bar")) 7 | expect_error(construct_style(foo = "bar", "buzz")) 8 | }) 9 | 10 | test_that('Skip property when value is ""', { 11 | expect_null(construct_style(foo = "")) 12 | expect_identical(construct_style(foo = "", fizz = "buzz"), "fizz: buzz;") 13 | expect_identical(construct_style(fizz = "buzz", foo = ""), "fizz: buzz;") 14 | }) 15 | 16 | test_that("Style can be produced from strings, vectors, or mixed", { 17 | expect_equal(construct_style(foo = "bar"), "foo: bar;") 18 | expect_equal(construct_style(foo = "bar", fizz = "buzz"), "foo: bar; fizz: buzz;") 19 | expect_equal(construct_style(c(foo = "bar", fizz = "buzz")), "foo: bar; fizz: buzz;") 20 | expect_equal( 21 | construct_style(c(foo = "bar", fizz = "buzz"), hoge = "fuga"), 22 | "foo: bar; fizz: buzz; hoge: fuga;" 23 | ) 24 | }) 25 | -------------------------------------------------------------------------------- /tests/testthat/test-construct-styles.R: -------------------------------------------------------------------------------- 1 | test_that("style attributes", { 2 | expect_identical(construct_style(foo = "bar"), "foo: bar;") 3 | expect_identical( 4 | construct_style(foo = "bar", hoge = "fuga"), "foo: bar; hoge: fuga;" 5 | ) 6 | expect_identical(construct_style(c(foo = "bar")), "foo: bar;") 7 | expect_identical( 8 | construct_style(c(foo = "bar", hoge = "fuga")), "foo: bar; hoge: fuga;" 9 | ) 10 | expect_equal( 11 | construct_style(c(foo = "bar", hoge = "fuga"), fizz = "buzz"), 12 | "foo: bar; hoge: fuga; fizz: buzz;" 13 | ) 14 | }) 15 | -------------------------------------------------------------------------------- /tests/testthat/test-grid-col.R: -------------------------------------------------------------------------------- 1 | items <- tagList(div("a"), div("b"), div("c")) 2 | expected <- div( 3 | items, 4 | style = "display: grid; grid-template-rows: 1fr 2fr auto;" 5 | ) 6 | test_that("Simple usage", { 7 | expect_identical(grid_colwise(items, rows = "1fr 2fr auto"), expected) 8 | expect_identical(grid_colwise(items, rows = c("1fr", "2fr", "auto")), expected) 9 | }) 10 | 11 | test_that("Missing rows is treated as auto", { 12 | expect_identical(grid_colwise(items, rows = c("1fr", "2fr")), expected) 13 | }) 14 | 15 | test_that("Additional styles", { 16 | style = "border: solid black;" 17 | expected2 <- expected3 <- expected 18 | expected2$attribs$style <- paste(expected$attribs$style, style) 19 | expect_identical( 20 | grid_colwise(items, rows = c("1fr 2fr auto"), style = style), expected2 21 | ) 22 | 23 | expected3$attribs$style <- paste(expected$attribs$style, "grid-row-gap: 10px;") 24 | expect_identical( 25 | grid_colwise(items, rows = c("1fr 2fr auto"), row_gap = "10px"), expected3 26 | ) 27 | expect_identical( 28 | grid_colwise(items, rows = c("1fr 2fr"), row_gap = "10px"), expected3 29 | ) 30 | }) 31 | -------------------------------------------------------------------------------- /tests/testthat/test-grid-item.R: -------------------------------------------------------------------------------- 1 | test_that("No argument", { 2 | object <- grid_item() 3 | expect_identical(object, div(style = NULL)) 4 | }) 5 | 6 | test_that("Unnamed arguments become div", { 7 | expect_identical(grid_item("a"), div("a", style = NULL)) 8 | }) 9 | 10 | test_that("Named arguments as ellipsis becomes attribs", { 11 | expect_identical(grid_item(class = "foo"), div(class = "foo")) 12 | }) 13 | 14 | test_that("Arguments other than ellipsis", { 15 | object <- grid_item( 16 | row_start = 1, 17 | row_end = 2, 18 | row = "1 / 2", 19 | column_start = 1, 20 | column_end = 2, 21 | col = "1 / 2", 22 | area = "area", 23 | justify_self = "start", 24 | align_self = "end", 25 | z_index = 1, 26 | order = 1, 27 | style = "width: auto;" 28 | ) 29 | expected <- div(style = "grid-row-start: 1; grid-row-end: 2; grid-row: 1 / 2; grid-column-start: 1; grid-column-end: 2; grid-column: 1 / 2; grid-area: area; justify-self: start; align-self: end; z-index: 1; order: 1; width: auto;") 30 | expect_identical(object, expected) 31 | 32 | # Without additional style 33 | object <- grid_item(row_start = 1, row_end = 2) 34 | expected <- div(style = "grid-row-start: 1; grid-row-end: 2;") 35 | expect_identical(object, expected) 36 | }) 37 | 38 | test_that("Alias arguments have priorities", { 39 | expect_identical( 40 | grid_item(col = "1 / 2", column = "1 / 3"), 41 | div(style = "grid-column: 1 / 2;") 42 | ) 43 | }) 44 | -------------------------------------------------------------------------------- /tests/testthat/test-grid-layout.R: -------------------------------------------------------------------------------- 1 | A <- div("A", area = "A") 2 | B <- div("B", area = "B") 3 | C <- div("C", area = "C") 4 | 5 | style <- "display: grid;" 6 | 7 | test_that("Arguments display and flow can be partially matched", { 8 | expect_equal( 9 | grid_layout(display = "g", flow = "row"), 10 | div(style = "display: grid; grid-auto-flow: row;") 11 | ) 12 | }) 13 | 14 | test_that("Ellipsis", { 15 | # items 16 | expect_equal(grid_layout(A), div(A, style = style)) 17 | expect_equal(grid_layout(A, B), div(A, B, style = style)) 18 | 19 | # class 20 | expect_equal(grid_layout(class = "foo"), div(style = style, class = "foo")) 21 | }) 22 | 23 | test_that("Specify arguments other than ellipsis and style", { 24 | object <- grid_layout( 25 | display = c("grid", "inline-grid"), 26 | grid = paste( 27 | '"title tiltle" 50px', 28 | '"sidebar content 1fr"', 29 | '/ 100px 1fr', 30 | sep = "\n" 31 | ), 32 | # OR "auto-flow 100px / 200px 200px 200px" 33 | template = c("50px 1fr / 100px 1fr"), # rows / cols 34 | # OR 35 | # "title title" 100px 36 | # "sidebar content" 1fr 37 | # / 100px 1fr 38 | template_rows = "50px 1fr", 39 | template_columns = "100px 1fr", 40 | template_areas = c("title title", 41 | "sidebar content"), 42 | auto_flow = "row", 43 | auto_rows = "1px", 44 | auto_columns = "1px", 45 | row_gap = "1px", 46 | column_gap = "1px", 47 | gap = "1px 1px", 48 | justify_content = "start", 49 | align_content = "start", 50 | justify_items = "start", 51 | align_items = "start", 52 | style = NULL 53 | ) 54 | 55 | expected <- div(style = 'display: grid; grid: "title tiltle" 50px\n"sidebar content 1fr"\n/ 100px 1fr; grid-template: 50px 1fr / 100px 1fr; grid-template-rows: 50px 1fr; grid-template-columns: 100px 1fr; grid-template-areas: \'title title\' \'sidebar content\'; grid-auto-flow: row; grid-auto-rows: 1px; grid-auto-columns: 1px; justify-content: start; align-content: start; grid-row-gap: 1px; grid-column-gap: 1px; grid-gap: 1px 1px; justify-content: start; align-content: start; justify-items: start; align-items: start;') 56 | 57 | expect_identical(object, expected) 58 | }) 59 | 60 | test_that("Aliases have priorities", { 61 | alias <- "1fr" 62 | original <- "1fr 2fr" 63 | expect_identical( 64 | grid_layout( 65 | rows = alias, template_rows = original, 66 | cols = alias, template_columns = original, 67 | areas = "area", template_areas = '"A B" "C D"', 68 | auto_cols = "1px", auto_columns = "2px" 69 | ), 70 | div(style = "display: grid; grid-template-rows: 1fr; grid-template-columns: 1fr; grid-template-areas: 'area'; grid-auto-columns: 1px;") 71 | ) 72 | }) 73 | -------------------------------------------------------------------------------- /tests/testthat/test-grid-rowwise.R: -------------------------------------------------------------------------------- 1 | items <- tagList(div("a"), div("b"), div("c")) 2 | expected <- div( 3 | items, 4 | style = "display: grid; grid-template-columns: 1fr 2fr auto;" 5 | ) 6 | test_that("Simple usage", { 7 | expect_identical(grid_rowwise(items, cols = "1fr 2fr auto"), expected) 8 | expect_identical(grid_rowwise(items, cols = c("1fr", "2fr", "auto")), expected) 9 | }) 10 | 11 | test_that("Missing cols is treated as auto", { 12 | expect_identical(grid_rowwise(items, cols = c("1fr", "2fr")), expected) 13 | }) 14 | 15 | test_that("Additional styles", { 16 | style = "border: solid black;" 17 | expected2 <- expected3 <- expected 18 | expected2$attribs$style <- paste(expected$attribs$style, style) 19 | expect_identical( 20 | grid_rowwise(items, cols = c("1fr 2fr auto"), style = style), expected2 21 | ) 22 | 23 | expected3$attribs$style <- paste(expected$attribs$style, "grid-column-gap: 10px;") 24 | expect_identical( 25 | grid_rowwise(items, cols = c("1fr 2fr auto"), column_gap = "10px"), expected3 26 | ) 27 | expect_identical( 28 | grid_rowwise(items, cols = c("1fr 2fr"), column_gap = "10px"), expected3 29 | ) 30 | }) 31 | -------------------------------------------------------------------------------- /tests/testthat/test-helpers.R: -------------------------------------------------------------------------------- 1 | test_that("has_class", { 2 | x <- list(1, "a", structure(1, class = c("foo", "numeric"))) 3 | expect_identical(has_class(x, "numeric", "any"), c(TRUE, FALSE, TRUE)) 4 | expect_identical(has_class(x, c("foo", "numeric"), "all"), c(FALSE, FALSE, TRUE)) 5 | }) 6 | 7 | test_that("is_named", { 8 | x <- structure(1:3, .Names = c("a", NA_character_, "")) 9 | expect_identical(is_named(x), c(TRUE, FALSE, FALSE)) 10 | y <- 1:3 11 | expect_identical(is_named(y), c(FALSE, FALSE, FALSE)) 12 | }) 13 | 14 | test_that("n_item", { 15 | expect_equal(n_item("a", "b"), 2L) 16 | expect_equal(n_item(list("a", "b")), 2L) 17 | expect_equal(n_item(tagList("a", "b")), 2L) 18 | expect_equal(n_item(list("a", "b"), "c"), 3L) 19 | }) 20 | -------------------------------------------------------------------------------- /vignettes/.gitignore: -------------------------------------------------------------------------------- 1 | *.html 2 | *.R 3 | -------------------------------------------------------------------------------- /vignettes/cssgrid.Rmd: -------------------------------------------------------------------------------- 1 | --- 2 | title: Get started 3 | output: rmarkdown::html_vignette 4 | vignette: > 5 | %\VignetteIndexEntry{cssgrid} 6 | %\VignetteEngine{knitr::rmarkdown} 7 | %\VignetteEncoding{UTF-8} 8 | --- 9 | 10 | ```{css css, echo = FALSE} 11 | body {box-sizing: border-box;} 12 | .cssgrid p {margin: 0;} 13 | ``` 14 | 15 | ```{r knit-opt, include = FALSE} 16 | knitr::opts_chunk$set( 17 | collapse = TRUE, 18 | comment = "#>", 19 | eval = TRUE 20 | ) 21 | ``` 22 | 23 | ```{r setup, include=FALSE} 24 | library(cssgrid) 25 | knitr::opts_chunk$set(echo = TRUE) 26 | ``` 27 | 28 | ```{r cssgrid, echo = FALSE} 29 | i <- function(x, ...) grid_item(x, ..., style = "border: solid black; text-align: center;") 30 | txt <- function(x) div(x, style = "margin: 0;", class="foo") 31 | grid_layout( 32 | i(txt("C"), area = "a"), i(txt("S"), area = "b"), i(txt("S"), area = "c"), 33 | i(txt("grid"), area = "d"), 34 | cols = "1.5rem 1.5rem 1.5rem", rows = "1lh 1lh", 35 | areas = c("a b c", "d d d"), 36 | gap = ".5rem", class = "cssgrid" 37 | ) 38 | ``` 39 | 40 |

    41 | 42 | ```{r} 43 | library(cssgrid) 44 | ``` 45 | 46 | # Simple examples 47 | 48 | ```{r area, results = 'asis'} 49 | style <- "border: solid black;" 50 | grid_layout( 51 | grid_item("A", area = "a", style = style), 52 | grid_item("B", area = "b", style = style), 53 | grid_item("C", area = "c", style = style), 54 | cols = c("1fr 2fr"), rows = c("1fr 1fr"), areas = c("a b", "a c"), 55 | style = style 56 | ) 57 | ``` 58 | 59 |

    60 | 61 | ```{r row-col} 62 | grid_layout( 63 | grid_item("A", row = "1 / 3", col = "1 / 2", style = style), 64 | grid_item("B", row = "1 / 2", col = "2 / 3", style = style), 65 | grid_item("C", row = "2 / 3", col = "2 / 3", style = style), 66 | cols = c("1fr 2fr"), rows = c("1fr 1fr"), style = style 67 | ) 68 | ``` 69 | 70 | ## Tidyverse style coding 71 | 72 | ```{r df, results = 'asis'} 73 | library(magrittr) 74 | tibble::tibble( 75 | content = list( 76 | tags$h1("Title"), tags$h2("Sidebar"), tags$h2("Article A"), tags$h2("Article B") 77 | ), 78 | area = c("title", "side", "A", "B"), 79 | style = style 80 | ) %>% 81 | purrr::pmap(function(content, ...) grid_item(content, ...)) %>% 82 | # tagList %>% 83 | grid_layout( 84 | cols = c("1fr 2fr"), rows = c("auto, 1fr 1fr"), 85 | areas = c( 86 | "title title", 87 | "side A", 88 | "side B" 89 | ), 90 | style = style 91 | ) 92 | ``` 93 |

    94 | 95 | # Shiny UI 96 | 97 | Valid units for sizing elements in `shiny` package are limited to 98 | `px`, `%`, `em`, `pt`, `in`, `cm`, `mm`, `ex`, or `pc`. 99 | 100 | Thus, there is a difficulty when layouting one element with certain size and the other fitting to the rest of area, or split the rest of the area for more elements with variety of ratios. 101 | 102 | This is what CSS Grid Layout supports by the `fr` unit. 103 | 104 | ```{css, echo = FALSE} 105 | .form-group .form-control {width: 100%;} 106 | ``` 107 | 108 | ## Read button has auto width, and the rest of area is dominated by text input 109 | 110 | ```{r} 111 | grid_layout( 112 | shiny::textInput("url", "URL", "https://example.com", width = "100%"), 113 | shiny::actionButton("read", "Read"), 114 | rows = "auto", cols = "1fr auto", column_gap = "10px" 115 | ) 116 | ``` 117 | 118 | ## Send button has auto width, and the rest of area is divided into 1:2 ratios 119 | 120 | `grid_rowwise` is an alternative to `grid_layout` when layouting in 1 row. 121 | 122 | `grid_rowwise` will add column size "auto" in case additional grids are required. 123 | 124 | ```{r} 125 | items <- tagList( 126 | shiny::textInput("to", "To", width = "100%"), 127 | shiny::textInput("message", "Message", width = "100%"), 128 | shiny::actionButton("read", "Send") 129 | ) 130 | grid_rowwise(items, cols = "1fr 2fr auto", column_gap = "10px") 131 | # This one misses cols for 3rd item, which will be treated as "auto". 132 | # Thus the result becomes identical to the above. 133 | grid_rowwise(items, cols = "1fr 2fr", column_gap = "10px") 134 | ``` 135 | -------------------------------------------------------------------------------- /vignettes/responsive.Rmd: -------------------------------------------------------------------------------- 1 | --- 2 | title: "Responsive designs with cssgrid" 3 | output: 4 | rmarkdown::html_vignette: 5 | self_contained: FALSE 6 | vignette: > 7 | %\VignetteIndexEntry{Responsive designs with cssgrid} 8 | %\VignetteEngine{knitr::rmarkdown} 9 | %\VignetteEncoding{UTF-8} 10 | --- 11 | 12 | ```{r setup-knit, include = FALSE} 13 | knitr::opts_chunk$set( 14 | collapse = TRUE, 15 | comment = "#>" 16 | ) 17 | ``` 18 | 19 | ```{r setup} 20 | library(cssgrid) 21 | library(ggplot2) 22 | library(dplyr, warn.conflicts = FALSE) 23 | library(purrr) 24 | library(plotly, warn.conflicts = FALSE) 25 | ``` 26 | 27 | # Prepare plots 28 | 29 | ```{r prepare, items, cache = TRUE} 30 | plots <- diamonds %>% 31 | group_split(clarity) %>% 32 | map(~ { 33 | ggplot(.x) + 34 | aes(price, fill = clarity) + 35 | geom_density(show.legend = FALSE) + 36 | scale_fill_discrete(drop = FALSE) + 37 | labs(y = NULL) + 38 | theme_minimal() + 39 | facet_wrap(~ clarity) 40 | }) %>% 41 | map(plotly::ggplotly) %>% 42 | map(plotly::layout, showlegend = FALSE) %>% 43 | tagList 44 | ``` 45 | 46 | # Print plots with CSS Grid Layout with auto-fill 47 | 48 | Change the window width and you'll see plots are re-arranged. 49 | 50 | ```{r print} 51 | grid_layout(plots, auto_rows = "1fr", cols = "repeat(auto-fill, 6cm)") 52 | ``` 53 | -------------------------------------------------------------------------------- /vignettes/responsive_files/crosstalk-1.0.0/css/crosstalk.css: -------------------------------------------------------------------------------- 1 | /* Adjust margins outwards, so column contents line up with the edges of the 2 | parent of container-fluid. */ 3 | .container-fluid.crosstalk-bscols { 4 | margin-left: -30px; 5 | margin-right: -30px; 6 | white-space: normal; 7 | } 8 | 9 | /* But don't adjust the margins outwards if we're directly under the body, 10 | i.e. we were the top-level of something at the console. */ 11 | body > .container-fluid.crosstalk-bscols { 12 | margin-left: auto; 13 | margin-right: auto; 14 | } 15 | 16 | .crosstalk-input-checkboxgroup .crosstalk-options-group .crosstalk-options-column { 17 | display: inline-block; 18 | padding-right: 12px; 19 | vertical-align: top; 20 | } 21 | 22 | @media only screen and (max-width:480px) { 23 | .crosstalk-input-checkboxgroup .crosstalk-options-group .crosstalk-options-column { 24 | display: block; 25 | padding-right: inherit; 26 | } 27 | } 28 | -------------------------------------------------------------------------------- /vignettes/responsive_files/crosstalk-1.0.0/js/crosstalk.min.js: -------------------------------------------------------------------------------- 1 | !function a(b,c,d){function e(g,h){if(!c[g]){if(!b[g]){var i="function"==typeof require&&require;if(!h&&i)return i(g,!0);if(f)return f(g,!0);var j=new Error("Cannot find module '"+g+"'");throw j.code="MODULE_NOT_FOUND",j}var k=c[g]={exports:{}};b[g][0].call(k.exports,function(a){var c=b[g][1][a];return e(c?c:a)},k,k.exports,a,b,c,d)}return c[g].exports}for(var f="function"==typeof require&&require,g=0;gb?1:void 0}Object.defineProperty(c,"__esModule",{value:!0});var f=function(){function a(a,b){for(var c=0;c0&&void 0!==arguments[0]?arguments[0]:this._allKeys,b=Object.keys(this._handles).length;if(0===b)this._value=null;else{this._value=[];for(var c=0;c?@\[\\\]^`{|}~])/g,"\\$1")}function f(a){var b=h(a);Object.keys(i).forEach(function(c){if(b.hasClass(c)&&!b.hasClass("crosstalk-input-bound")){var d=i[c];g(d,a)}})}function g(a,b){var c=h(b).find("script[type='application/json'][data-for='"+e(b.id)+"']"),d=JSON.parse(c[0].innerText),f=a.factory(b,d);h(b).data("crosstalk-instance",f),h(b).addClass("crosstalk-input-bound")}Object.defineProperty(c,"__esModule",{value:!0}),c.register=b;var h=a.jQuery,i={};a.Shiny&&!function(){var b=new a.Shiny.InputBinding,c=a.jQuery;c.extend(b,{find:function(a){return c(a).find(".crosstalk-input")},initialize:function(a){c(a).hasClass("crosstalk-input-bound")||f(a)},getId:function(a){return a.id},getValue:function(a){},setValue:function(a,b){},receiveMessage:function(a,b){},subscribe:function(a,b){c(a).data("crosstalk-instance").resume()},unsubscribe:function(a){c(a).data("crosstalk-instance").suspend()}}),a.Shiny.inputBindings.register(b,"crosstalk.inputBinding")}()}).call(this,"undefined"!=typeof global?global:"undefined"!=typeof self?self:"undefined"!=typeof window?window:{})},{}],7:[function(a,b,c){(function(b){"use strict";function c(a){if(a&&a.__esModule)return a;var b={};if(null!=a)for(var c in a)Object.prototype.hasOwnProperty.call(a,c)&&(b[c]=a[c]);return b.default=a,b}var d=a("./input"),e=c(d),f=a("./filter"),g=b.jQuery;e.register({className:"crosstalk-input-checkboxgroup",factory:function(a,b){var c=new f.FilterHandle(b.group),d=void 0,e=g(a);return e.on("change","input[type='checkbox']",function(){var a=e.find("input[type='checkbox']:checked");0===a.length?(d=null,c.clear()):!function(){var e={};a.each(function(){b.map[this.value].forEach(function(a){e[a]=!0})});var f=Object.keys(e);f.sort(),d=f,c.set(f)}()}),{suspend:function(){c.clear()},resume:function(){d&&c.set(d)}}}})}).call(this,"undefined"!=typeof global?global:"undefined"!=typeof self?self:"undefined"!=typeof window?window:{})},{"./filter":2,"./input":6}],8:[function(a,b,c){(function(b){"use strict";function c(a){if(a&&a.__esModule)return a;var b={};if(null!=a)for(var c in a)Object.prototype.hasOwnProperty.call(a,c)&&(b[c]=a[c]);return b.default=a,b}var d=a("./input"),e=c(d),f=a("./util"),g=c(f),h=a("./filter"),i=b.jQuery;e.register({className:"crosstalk-input-select",factory:function(a,b){var c=[{value:"",label:"(All)"}],d=g.dataframeToD3(b.items),e={options:c.concat(d),valueField:"value",labelField:"label",searchField:"label"},f=i(a).find("select")[0],j=i(f).selectize(e)[0].selectize,k=new h.FilterHandle(b.group),l=void 0;return j.on("change",function(){0===j.items.length?(l=null,k.clear()):!function(){var a={};j.items.forEach(function(c){b.map[c].forEach(function(b){a[b]=!0})});var c=Object.keys(a);c.sort(),l=c,k.set(c)}()}),{suspend:function(){k.clear()},resume:function(){l&&k.set(l)}}}})}).call(this,"undefined"!=typeof global?global:"undefined"!=typeof self?self:"undefined"!=typeof window?window:{})},{"./filter":2,"./input":6,"./util":11}],9:[function(a,b,c){(function(b){"use strict";function c(a){if(a&&a.__esModule)return a;var b={};if(null!=a)for(var c in a)Object.prototype.hasOwnProperty.call(a,c)&&(b[c]=a[c]);return b.default=a,b}function d(a,b){for(var c=a.toString();c.length=i&&m<=j&&k.push(b.keys[l])}k.sort(),d.set(k),p=k}}),{suspend:function(){d.clear()},resume:function(){p&&d.set(p)}}}})}).call(this,"undefined"!=typeof global?global:"undefined"!=typeof self?self:"undefined"!=typeof window?window:{})},{"./filter":2,"./input":6}],10:[function(a,b,c){"use strict";function d(a){if(a&&a.__esModule)return a;var b={};if(null!=a)for(var c in a)Object.prototype.hasOwnProperty.call(a,c)&&(b[c]=a[c]);return b.default=a,b}function e(a){return a&&a.__esModule?a:{default:a}}function f(a,b){if(!(a instanceof b))throw new TypeError("Cannot call a class as a function")}Object.defineProperty(c,"__esModule",{value:!0}),c.SelectionHandle=void 0;var g=function(){function a(a,b){for(var c=0;c0&&void 0!==arguments[0]?arguments[0]:null,c=arguments.length>1&&void 0!==arguments[1]?arguments[1]:null;f(this,a),this._eventRelay=new i.default,this._emitter=new m.SubscriptionTracker(this._eventRelay),this._group=null,this._var=null,this._varOnChangeSub=null,this._extraInfo=m.extend({sender:this},c),this.setGroup(b)}return g(a,[{key:"setGroup",value:function(a){var b=this;if(this._group!==a&&(this._group||a)&&(this._var&&(this._var.off("change",this._varOnChangeSub),this._var=null,this._varOnChangeSub=null),this._group=a,a)){this._var=(0,k.default)(a).var("selection");var c=this._var.on("change",function(a){b._eventRelay.trigger("change",a,b)});this._varOnChangeSub=c}}},{key:"_mergeExtraInfo",value:function(a){return m.extend({},this._extraInfo?this._extraInfo:null,a?a:null)}},{key:"set",value:function(a,b){this._var&&this._var.set(a,this._mergeExtraInfo(b))}},{key:"clear",value:function(a){this._var&&this.set(void 0,this._mergeExtraInfo(a))}},{key:"on",value:function(a,b){return this._emitter.on(a,b)}},{key:"off",value:function(a,b){return this._emitter.off(a,b)}},{key:"close",value:function(){this._emitter.removeAllListeners(),this.setGroup(null)}},{key:"value",get:function(){return this._var?this._var.get():null}}]),a}()},{"./events":1,"./group":4,"./util":11}],11:[function(a,b,c){"use strict";function d(a,b){if(!(a instanceof b))throw new TypeError("Cannot call a class as a function")}function e(a){for(var b=arguments.length,c=Array(b>1?b-1:0),d=1;d 4 | Gilles van den Hoven 5 | Michael Geary 6 | Stefan Petre 7 | Yehuda Katz 8 | Corey Jewett 9 | Klaus Hartl 10 | Franck Marcia 11 | Jörn Zaefferer 12 | Paul Bakaus 13 | Brandon Aaron 14 | Mike Alsup 15 | Dave Methvin 16 | Ed Engelhardt 17 | Sean Catchpole 18 | Paul Mclanahan 19 | David Serduke 20 | Richard D. Worth 21 | Scott González 22 | Ariel Flesler 23 | Jon Evans 24 | TJ Holowaychuk 25 | Michael Bensoussan 26 | Robert Katić 27 | Louis-Rémi Babé 28 | Earle Castledine 29 | Damian Janowski 30 | Rich Dougherty 31 | Kim Dalsgaard 32 | Andrea Giammarchi 33 | Mark Gibson 34 | Karl Swedberg 35 | Justin Meyer 36 | Ben Alman 37 | James Padolsey 38 | David Petersen 39 | Batiste Bieler 40 | Alexander Farkas 41 | Rick Waldron 42 | Filipe Fortes 43 | Neeraj Singh 44 | Paul Irish 45 | Iraê Carvalho 46 | Matt Curry 47 | Michael Monteleone 48 | Noah Sloan 49 | Tom Viner 50 | Douglas Neiner 51 | Adam J. Sontag 52 | Dave Reed 53 | Ralph Whitbeck 54 | Carl Fürstenberg 55 | Jacob Wright 56 | J. Ryan Stinnett 57 | unknown 58 | temp01 59 | Heungsub Lee 60 | Colin Snover 61 | Ryan W Tenney 62 | Pinhook 63 | Ron Otten 64 | Jephte Clain 65 | Anton Matzneller 66 | Alex Sexton 67 | Dan Heberden 68 | Henri Wiechers 69 | Russell Holbrook 70 | Julian Aubourg 71 | Gianni Alessandro Chiappetta 72 | Scott Jehl 73 | James Burke 74 | Jonas Pfenniger 75 | Xavi Ramirez 76 | Jared Grippe 77 | Sylvester Keil 78 | Brandon Sterne 79 | Mathias Bynens 80 | Timmy Willison 81 | Corey Frang 82 | Digitalxero 83 | Anton Kovalyov 84 | David Murdoch 85 | Josh Varner 86 | Charles McNulty 87 | Jordan Boesch 88 | Jess Thrysoee 89 | Michael Murray 90 | Lee Carpenter 91 | Alexis Abril 92 | Rob Morgan 93 | John Firebaugh 94 | Sam Bisbee 95 | Gilmore Davidson 96 | Brian Brennan 97 | Xavier Montillet 98 | Daniel Pihlstrom 99 | Sahab Yazdani 100 | avaly 101 | Scott Hughes 102 | Mike Sherov 103 | Greg Hazel 104 | Schalk Neethling 105 | Denis Knauf 106 | Timo Tijhof 107 | Steen Nielsen 108 | Anton Ryzhov 109 | Shi Chuan 110 | Berker Peksag 111 | Toby Brain 112 | Matt Mueller 113 | Justin 114 | Daniel Herman 115 | Oleg Gaidarenko 116 | Richard Gibson 117 | Rafaël Blais Masson 118 | cmc3cn <59194618@qq.com> 119 | Joe Presbrey 120 | Sindre Sorhus 121 | Arne de Bree 122 | Vladislav Zarakovsky 123 | Andrew E Monat 124 | Oskari 125 | Joao Henrique de Andrade Bruni 126 | tsinha 127 | Matt Farmer 128 | Trey Hunner 129 | Jason Moon 130 | Jeffery To 131 | Kris Borchers 132 | Vladimir Zhuravlev 133 | Jacob Thornton 134 | Chad Killingsworth 135 | Nowres Rafid 136 | David Benjamin 137 | Uri Gilad 138 | Chris Faulkner 139 | Elijah Manor 140 | Daniel Chatfield 141 | Nikita Govorov 142 | Wesley Walser 143 | Mike Pennisi 144 | Markus Staab 145 | Dave Riddle 146 | Callum Macrae 147 | Benjamin Truyman 148 | James Huston 149 | Erick Ruiz de Chávez 150 | David Bonner 151 | Akintayo Akinwunmi 152 | MORGAN 153 | Ismail Khair 154 | Carl Danley 155 | Mike Petrovich 156 | Greg Lavallee 157 | Daniel Gálvez 158 | Sai Lung Wong 159 | Tom H Fuertes 160 | Roland Eckl 161 | Jay Merrifield 162 | Allen J Schmidt Jr 163 | Jonathan Sampson 164 | Marcel Greter 165 | Matthias Jäggli 166 | David Fox 167 | Yiming He 168 | Devin Cooper 169 | Paul Ramos 170 | Rod Vagg 171 | Bennett Sorbo 172 | Sebastian Burkhard 173 | nanto 174 | Danil Somsikov 175 | Ryunosuke SATO 176 | Jean Boussier 177 | Adam Coulombe 178 | Andrew Plummer 179 | Mark Raddatz 180 | Dmitry Gusev 181 | Michał Gołębiowski 182 | Nguyen Phuc Lam 183 | Tom H Fuertes 184 | Brandon Johnson 185 | Jason Bedard 186 | Kyle Robinson Young 187 | Renato Oliveira dos Santos 188 | Chris Talkington 189 | Eddie Monge 190 | Terry Jones 191 | Jason Merino 192 | Jeremy Dunck 193 | Chris Price 194 | Amey Sakhadeo 195 | Anthony Ryan 196 | Dominik D. Geyer 197 | George Kats 198 | Lihan Li 199 | Ronny Springer 200 | Marian Sollmann 201 | Corey Frang 202 | Chris Antaki 203 | Noah Hamann 204 | David Hong 205 | Jakob Stoeck 206 | Christopher Jones 207 | Forbes Lindesay 208 | John Paul 209 | S. Andrew Sheppard 210 | Leonardo Balter 211 | Roman Reiß 212 | Benjy Cui 213 | Rodrigo Rosenfeld Rosas 214 | John Hoven 215 | Christian Kosmowski 216 | Liang Peng 217 | TJ VanToll 218 | -------------------------------------------------------------------------------- /vignettes/responsive_files/plotly-htmlwidgets-css-1.46.1/plotly-htmlwidgets.css: -------------------------------------------------------------------------------- 1 | /* 2 | just here so that plotly works 3 | correctly with ioslides. 4 | see https://github.com/ropensci/plotly/issues/463 5 | */ 6 | 7 | slide:not(.current) .plotly.html-widget{ 8 | display: none; 9 | } 10 | --------------------------------------------------------------------------------