Easy CSS Styling for Shiny
Switch branches/tags
Nothing to show
Clone or download
Fetching latest commit…
Cannot retrieve the latest commit at this time.
Permalink
Type Name Latest commit message Commit time
Failed to load latest commit information.
R
data-raw
readme-fig
tests
.Rbuildignore
.gitignore
DESCRIPTION
LICENSE
LICENSE.md
NAMESPACE
NEWS.md
README.Rmd
README.md
handydandy.Rproj

README.md

lifecycle

handydandy

The goal of {handydandy} is to provide an easy to use API for bringing style to a shiny app with CSS.

Installation

You can install the dev version of {handydandy} with:

remotes::install_github("ColinFay/handydandy")

Example

Add, update, remove css elements

library(handydandy)

# Create a new dandy
css <- Dandy$new()

# It's easy to add a new style, you need to pass 
# + a selector
# + a list of property = value

css$add_style("body", list("font-family" = "Helvetica",
                         "color" = "#24292e"))
css$add_style("h2", list("font-size" = "3 em",
                       "color" = "#911414",
                       "text-align" = "center"))
css
#> <style type="text/css"> body { font-family: Helvetica; color: #24292e } h2 { font-size: 3 em; color: #911414; text-align: center } </style>

# Easy to update
css$update_style("body","color","#911414")
css
#> <style type="text/css"> body { font-family: Helvetica; color: #911414 } h2 { font-size: 3 em; color: #911414; text-align: center } </style>

# Or to remove one 
css$remove_style("body")
css
#> <style type="text/css"> h2 { font-size: 3 em; color: #911414; text-align: center } </style>

# You can also simply remove one part of your tag
css$remove_style("h2", "color")
css
#> <style type="text/css"> h2 { font-size: 3 em; text-align: center } </style>

In a shiny app

The idea of course is to use it in shiny app:

css <- Dandy$new()

css$add_style("body", list("font-family" = "Helvetica",
                         "color" = "#24292e"))
css$add_style("h2", list("color" = "#911414",
                       "text-align" = "center"))
css$add_style("h3", list("color" = "#2E2E8F",
                       "text-align" = "center"))


ui <- fluidPage(
  # Give swag to your app
  css$swag(),
  textInput("lol","lol", "lol"),
  textOutput("lolilol"),
  h2("lol"),
  h3("pouet")
)

server <- function(input, output, session) {
  output$lolilol <- renderText({
    input$lol
  })
}

shinyApp(ui, server)