examples to show how to apply css (#21)

Author: AngelFelizR

examples/chapter-06/4-ways-to-apply-css/01-external-css-file.R

@@ -0,0 +1,13 @@
+library(shiny)
+
+ui <- fluidPage(
+  # 1. EXTERNAL
+  tags$link(rel = "stylesheet", type="text/css", href="style.css"),
+
+  tags$h2("Heading Level 2"),
+  tags$p("This is a paragraph"),
+)
+
+server <- function(input, output, session) {}
+
+shinyApp(ui, server)

examples/chapter-06/4-ways-to-apply-css/02-internal-css.R

@@ -0,0 +1,20 @@
+library(shiny)
+
+ui <- fluidPage(
+
+  # 2. INTERNAL
+  tags$head(
+    tags$style(
+      "p {
+        color: purple;
+      }"
+      )
+  ),
+
+  tags$h2("Heading Level 2"),
+  tags$p("This is a paragraph"),
+)
+
+server <- function(input, output, session) {}
+
+shinyApp(ui, server)

examples/chapter-06/4-ways-to-apply-css/03-inline-css.R

@@ -0,0 +1,15 @@
+library(shiny)
+
+ui <- fluidPage(
+
+  tags$h2("Heading Level 2"),
+  tags$p("This is a paragraph"),
+
+  # 3. INLINE
+  tags$p("Second paragraph", style = "color:darkgreen;")
+
+)
+
+server <- function(input, output, session) {}
+
+shinyApp(ui, server)

examples/chapter-06/4-ways-to-apply-css/04-create-dependency.R

@@ -0,0 +1,24 @@
+library(shiny)
+
+#  4. DEPENDENCY
+color_dependency <- function() {
+  htmltools::htmlDependency(
+    name = "p_color",
+    version = "1.0.0",
+    src = "www/",
+    stylesheet = "style.css"
+  )
+}
+
+ui <- fluidPage(
+
+  tags$h2("Heading Level 2"),
+  tags$p("This is a paragraph")
+
+)
+
+ui_dep <- tagList(ui, color_dependency())
+
+server <- function(input, output, session) {}
+
+shinyApp(ui_dep, server)

examples/chapter-06/4-ways-to-apply-css/www/style.css

@@ -0,0 +1,3 @@
+p {
+ color: purple;
+}