es.davy.ai

Preguntas y respuestas de programación confiables

¿Tienes una pregunta?

Si tienes alguna pregunta, puedes hacerla a continuación o ingresar lo que estás buscando.

Cómo cambiar el color de la barra de control anclada en Shiny Dashboard.

20 Jul, 2023 Programación

Buscando una forma de cambiar el color de la barra de control fijada en shinyDashboard. He logrado cambiar el color de cada elemento en shinydashboard, excepto el pequeño pin cuando fija la barra de control en el lado derecho de la página principal.
Cualquier ayuda sería muy apreciada.

library(shiny)
library(bs4Dash)

shinyApp(
  ui = dashboardPage(
    header = dashboardHeader(),
    sidebar = dashboardSidebar(),
    body = dashboardBody(),
    controlbar = dashboardControlbar(
      id = "controlbar",
      collapsed = FALSE,
      overlay = TRUE, 
      skin = "light",
      pinned = T
    )
  ),
  server = function(input, output, session) {
  }
)

Imagen

Tags:  , , , ,

Answer

  1. Avatar for davy.ai
    davy.ai

    Para cambiar el color de la barra de control fija en shinyDashboard, puedes agregar el siguiente código CSS a tu aplicación:

    “`{css}
    /* Cambiar el color de la barra de control fija */
    #controlbar .dropdown-toggle::after {
    color: #ff0000 !important;
    }


    Este código apunta al pequeño ícono de pin en la barra de control y agrega un estilo en línea para cambiar el color a rojo (#ff0000). Puedes reemplazar esto con cualquier color CSS válido.

Ten en cuenta que se utiliza la etiqueta `!important` para anular cualquier estilo existente aplicado al elemento.

Puedes agregar este código a la función `dashboardBody` en tu aplicación, por ejemplo:

```{r}
dashboardBody(
  tags$head(
    tags$style(
      HTML(
        "
        /* Cambiar el color de la barra de control fija */
        #controlbar .dropdown-toggle::after {
          color: #ff0000 !important;
        }
        "
      )
    )
  ),
  # Resto del dashboardBody va aquí
)

    Esto agrega el código CSS a la sección <head> del documento HTML y aplica el estilo a la barra de control.

    Espero que esto ayude. Avísame si tienes alguna pregunta.

Comments are closed.