cssrshinyshinywidgetsbslib

Is it possible to reduce space around shinyWidgets radioGroupButtons and shiny fileInput?

Is it possible to adjust space around specific instances of radioGroupButtons and fileInput?

For example, how could the fileInput1 and radioGroupButtons1 be made stacked one on top of the other?

library(shiny)
library(shinyWidgets)
library(bslib)

# UI
ui = page_fillable(
  fileInput("fileInput1", label = NULL),
  radioGroupButtons("radioGroupButtons1", choices = c("TSV", "CSV", "XLSX")),
  
  fileInput("fileInput2", label = NULL),
  radioGroupButtons("radioGroupButtons2", choices = c("PDF", "PNG", "JPEG"))
)

# Server
server = function(input, output, session)
{
}

shinyApp(ui, server)
Solution

  • smartse reminded me there is a progress bar at the bottom of the fileInput element. The arrangement I was looking for can be achieved by adjusting its margin:

    library(shiny)
library(shinyWidgets)
library(bslib)

# UI
ui = page_fillable(

  # Adjust margin of progress bar
  tags$style("#fileInput1_progress { margin: -24px; }"),

  fileInput("fileInput1", label = NULL),
  radioGroupButtons("radioGroupButtons1", choices = c("TSV", "CSV", "XLSX")),
  
  fileInput("fileInput2", label = NULL),
  radioGroupButtons("radioGroupButtons2", choices = c("PDF", "PNG", "JPEG"))
)

# Server
server = function(input, output, session)
{
}

shinyApp(ui, server)