EVOLUTION-MANAGER

Edit File: inlineCSS.html

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"><html xmlns="http://www.w3.org/1999/xhtml"><head><title>R: Add inline CSS</title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<link rel="stylesheet" type="text/css" href="R.css" />
</head><body>

<table width="100%" summary="page for inlineCSS {shinyjs}"><tr><td>inlineCSS {shinyjs}</td><td style="text-align: right;">R Documentation</td></tr></table>

<h2>Add inline CSS</h2>

<h3>Description</h3>

<p>Add inline CSS to a Shiny app. This is simply a convenience function that
gets called from a Shiny app's UI to make it less tedious to add inline CSS.
If there are many CSS rules, it is recommended to use an external stylesheet.<br /><br />
CSS is a simple way to describe how elements on a web page should be
displayed (position, colour, size, etc.).  You can learn the basics
at <a href="https://www.w3schools.com/css/">W3Schools</a>.
</p>

<h3>Usage</h3>

<pre>
inlineCSS(rules)
</pre>

<h3>Arguments</h3>

<table summary="R argblock">
<tr valign="top"><td><code>rules</code></td>
<td>
<p>The CSS rules to add. Can either be a string with valid
CSS code, or a named list of the form
<code>list(selector = declarations)</code>, where <code>selector</code> is a valid
CSS selector and <code>declarations</code> is a string or vector of declarations.
See examples for clarification.</p>
</td></tr>
</table>

<h3>Value</h3>

<p>Inline CSS code that is automatically inserted to the app's
<code>&lt;head&gt;</code> tag.
</p>

<h3>Examples</h3>

<pre>
if (interactive()) {
  library(shiny)

# Method 1 - passing a string of valid CSS
  shinyApp(
    ui = fluidPage(
      inlineCSS("#big { font-size:30px; }
                 .red { color: red; border: 1px solid black;}"),
      p(id = "big", "This will be big"),
      p(class = "red", "This will be red and bordered")
    ),
    server = function(input, output) {}
  )

# Method 2 - passing a list of CSS selectors/declarations
  # where each declaration is a full declaration block
  shinyApp(
    ui = fluidPage(
      inlineCSS(list(
        "#big" = "font-size:30px",
        ".red" = "color: red; border: 1px solid black;"
      )),
      p(id = "big", "This will be big"),
      p(class = "red", "This will be red and bordered")
    ),
    server = function(input, output) {}
  )

# Method 3 - passing a list of CSS selectors/declarations
  # where each declaration is a vector of declarations
  shinyApp(
    ui = fluidPage(
      inlineCSS(list(
        "#big" = "font-size:30px",
        ".red" = c("color: red", "border: 1px solid black")
      )),
      p(id = "big", "This will be big"),
      p(class = "red", "This will be red and bordered")
    ),
    server = function(input, output) {}
  )
}
</pre>

<hr /><div style="text-align: center;">[Package <em>shinyjs</em> version 2.1.0 <a href="00Index.html">Index</a>]</div>
</body></html>