Add Black Border to SidebarPanel and MainPanel - R Shiny - html

Question

How would I add a black boarder to the main panel and side bar panel for the MRE? I would like the panels to stand out slightly more. I have adjusted background color on my app but think adding a black boarder will make each panel stand out better.
UI
library(shiny)
library(shinyalert)
# Define UI for application that draws a histogram
shinyUI(fluidPage(
# Application title
titlePanel("Old Faithful Geyser Data"),
# Sidebar with a slider input for number of bins
sidebarLayout(
sidebarPanel(
),
# Show a plot of the generated distribution
mainPanel(
DT::dataTableOutput("cap_table"),
)
)
))
Server
library(shiny)
library(shinyalert)
data <- data.frame(x=rnorm(10),y=rnorm(10))
# Define server logic required to draw a histogram
shinyServer(function(input, output) {
# render data selection
output$cap_table <- DT::renderDataTable(data)
})

Answer 1

You may consider adding custom css to your app. I right click the app when it's running to "inspect" the css class that I would like to change.
Here is an example using in-line code.
Here is a link to consider other approaches such as sourcing a css file. https://shiny.rstudio.com/articles/css.html
library(shiny)
library(DT)
# Define UI for application that draws a histogram
ui <- shinyUI(
fluidPage(
tags$head(
# Note the wrapping of the string in HTML()
tags$style(HTML(".well {
border: 1px solid #000000;
}")),
tags$style(HTML(".col-sm-8 {
border: 1px solid #000000;
}"))
),
# Application title
titlePanel("Old Faithful Geyser Data"),
# Sidebar with a slider input for number of bins
sidebarLayout(
sidebarPanel(
),
# Show a plot of the generated distribution
mainPanel(
DT::dataTableOutput("cap_table"),
)
)
))
data <- data.frame(x=rnorm(10),y=rnorm(10))
# Define server logic required to draw a histogram
server <- shinyServer(function(input, output) {
# render data selection
output$cap_table <- DT::renderDataTable(data)
})
shinyApp(ui = ui, server = server)