如何将 bslib::card() 中的展开按钮(其中 full_screen = TRUE)移动到右上角?

问题描述 投票:0回答:1

我有一个闪亮的应用程序,我在

bslib::card()
中放置了一张桌子。

我希望这个表是可扩展的,所以我添加了参数

full_screen = TRUE

默认情况下,“展开”按钮位于右下角。

如何编辑代码以将此按钮放置在卡片的右上角(甚至左上角)?

这是一些可重现的代码:

library(shiny)
library(bslib)

# Define UI
ui <- fluidPage(
  theme = bs_theme(bootswatch = "minty"),
  titlePanel("Table in a card()"),
  
  sidebarLayout(
    sidebarPanel(
      textInput("filter_name", "Filter by Name", ""),
    ),
    
    mainPanel(
      card(
        title = "Data Table",
        full_screen = TRUE,
        tableOutput("mytable")
      )
    )
  )
)

# Define server logic
server <- function(input, output) {
  # Generate sample data
  data <- data.frame(
    Name = c("John", "Jane", "Alice", "Bob", "Charlie", "David"),
    Age = c(25, 30, 35, 40, 45, 50),
    Score = c(80, 75, 90, 85, 88, 92)
  )
  
  # Render table
  output$mytable <- renderTable({
    filtered_data <- data
    if (!is.null(input$filter_name) && input$filter_name != "") {
      filtered_data <- data[data$Name == input$filter_name, ]
    }
    filtered_data
  })
}

# Run application
shinyApp(ui = ui, server = server)

css r button shiny expand
1个回答
0
投票

将以下样式插入到您的

fluidPage
中:

  tags$head(tags$style(
    HTML(
      "
        .bslib-full-screen-enter {
          bottom: var(--bslib-full-screen-enter-bottom);
        }
      "
    )
  )), 

如果您想将其放在左上角,请添加

right: var(--bslib-full-screen-enter-right)

© www.soinside.com 2019 - 2024. All rights reserved.