私は、次のui.Rファイル持っている光沢のある

Question

で特定のタブから幅スタイリングを削除する：

library("shiny") 
library("plotly") 
library("shinythemes") 
library("shinyjs") 

shinyUI <- fluidPage(title = "LoL Analysis", theme = shinytheme('sandstone'), 

      tags$head(
      tags$link(rel = "stylesheet", type = "text/css", href = "style.css") 
      ), 

      navbarPage(strong("League of Legends"), 
       tabPanel("Project Overview"), 
       tabPanel("Player Analysis", 
       sidebarLayout(
        sidebarPanel(
        selectInput(inputId = "role", 
         label = "Choose a role:", 
         choice = c("Top", "Jungle","Middle", "ADC", "Support", 
         selected = "Middle")), 
        br(), 
        uiOutput("firstdropdown"), 
        br(), 
        uiOutput("seconddropdown") 
        ), 
        mainPanel(
        h2("Overview"), 
        p("Some long paragraph") 

        ) 
       ) 
       ), 
       tabPanel("How to win more games?", class = "two", 
         mainPanel(
          h2("Overview"), 
          p("Some long paragraph"), 
         )), 
       tabPanel("Sources/Contact Us") 
      ) 
) 

をそして、ここでのstyle.cssです：

.col-sm-8{ 
    width: 100%; 
} 
h2{ 
    color: white; 
    background: slategray; 
    padding: 10px; 
} 

私が午前問題は、ということですタブの下にサイドバーのレイアウトがあります。 "Player Analysis"では、幅を100％にしたくありません。 （メインパネルのデフォルトの幅だけです）。しかし、「プロジェクトの概要」と「もっとタブに勝つ方法」では、サイドパネルがないため幅が100％になるのは嫌です。私はCSSについてよく知らないけど、 "two"というクラスを作成して、代わりにCSSでtwo.col-sm-8{}を試してみましたが、これはうまくいきませんでした。どんな助けも本当にありがとう！

Answer 1

こんにちは、いくつかの選択肢があります。あなたの問題は、mainPanelがcol-sm-8というクラスのdivを作成することに由来します。

最初の解決策は、mainPanelを完全にスキップして、コンテンツをfluidRowに入れるだけです。これは、たとえば、画面の全幅を表示します。

あなたがmainPanelを維持したいが、とにかく画面の幅全体を使用したいとあなたはこのクラスは却下されますmainPanelにクラスcol-md-12を追加することができますアプリは、ほとんどの場合、大画面上で実行することがわかっている場合は、2番目のソリューション中画面から大画面にはcol-sm-8クラスがあり、画面全体の幅がわかります。私は以下の例で両方を実装しました

library(shinythemes) 
library(shinyjs) 
library(shiny) 
ui <- fluidPage(title = "LoL Analysis", theme = shinytheme('sandstone'), 

        tags$head(
         tags$link(rel = "stylesheet", type = "text/css", href = "style.css") 
        ), 

        navbarPage(strong("League of Legends"), 
           tabPanel("Project Overview", 
             fluidRow(
              div("sometext") 
             )), 
           tabPanel("Player Analysis", 
             sidebarLayout(
              sidebarPanel(
              selectInput(inputId = "role", 
                 label = "Choose a role:", 
                 choice = c("Top", "Jungle","Middle", "ADC", "Support", 
                    selected = "Middle")), 
              br(), 
              uiOutput("firstdropdown"), 
              br(), 
              uiOutput("seconddropdown") 
              ), 
              mainPanel(
              h2("Overview"), 
              p("Some long paragraph") 

              ) 
             ) 
           ), 
           tabPanel("How to win more games?", class = "two", 
             mainPanel(
              class = "col-md-12 col-sm-12", 
              h2("Overview"), 
              p("Some long paragraph") 
             )), 
           tabPanel("Sources/Contact Us") 
        ) 
) 

srv <- function(input, output){ 

} 

shinyApp(ui, srv) 

希望します。