div ui card not rendered correctly when using dashboardPage

[appsilon]

div ui card not rendered correctly when using dashboardPage

[filipstachura]

Hi @markusdumke !

Thank you for using shiny.semantic 👍

The package itself does not play well with bootstrap which is default for shinydashboard.

Short term solution: override bootstrap CSS classes with style="min-height: 0px;":

div(class = "ui card", div(class = "content", style="min-height: 0px;", div(class = "right floated meta", "14h"), 
                                          img(class = "ui avatar image", src = "http://semantic-ui.com/images/avatar/large/elliot.jpg"), 
                                          "Elliot"), div(class = "image", img(src = "http://semantic-ui.com/images/wireframe/image.png")), 
                   div(class = "content", style="min-height: 0px;", span(class = "right floated", uiicon("heart outline like"), 
                     "17 likes"), uiicon("comment"), "3 comments"), div(class = "extra content", style="min-height: 0px;",
                              div(class = "ui large transparent left icon input", uiicon("heart ouline"), 
                                  tags$input(type = "text", placeholder = "Add Comment...")))))

Long term solution: We are working on one line replacement for shinydashboard based on semantic here: https://github.com/Appsilon/semantic.dashboard This is still WIP but we are actively working on this with all standard components already ported to our package (e.g. tabPanel, infoBox, etc.).

Hope this helps!

[filipstachura]

Please re-open if anything is unclear. We are going to post update here on beta release of https://github.com/Appsilon/semantic.dashboard.

[dokato]

Hi @markusdumke , this is just to let you know that first version of semantic.dashboard was published recently and is available on CRAN: https://cran.r-project.org/web/packages/semantic.dashboard/index.html