shiny.tailwind icon indicating copy to clipboard operation
shiny.tailwind copied to clipboard

Tailwind not rendering in RStudio Window

Open thedivtagguy opened this issue 3 years ago • 2 comments
trafficstars

Hi! Thank you for a great package, I was looking out for something like this for a long time. I've been giving it a go and I don't know if you've covered for this somewhere, but the Tailwind CSS does not load when used with 'Run in Window' or 'Run in Viewer Pane' and only works when opened in browser.

In browser: image

Works perfectly.

In Window: image

This looks the same when run in the viewer pane.

Is it possible to fix this? How do bootstrap styles run correctly but not tailwind? If it is possible to fix this, that would solve a big hitch in using this package in production.

My code is as follows:

library(shiny)
library(tidyverse)

# Define UI for application that draws a histogram
ui <-
    div(
        class = "px-4 py-10 max-w-3xl mx-auto sm:px-6 sm:py-12 lg:max-w-4xl lg:py-16 lg:px-8 xl:max-w-6xl",

        # Load Tailwind CSS Just-in-time
          shiny.tailwind::use_tailwind(),

        # Title
        div(
            class = "flex flex-col w-full text-center py-12",
            h1(class = "text-3xl font-extrabold text-black tracking-tight sm:text-4xl md:text-5xl md:leading-[3.5rem]",
               "Hi!"),
            h3(class = "text-2xl font-bold text-black tracking-loose sm:text-xl md:text-md", "Select"),
        ),

        # Plot
        div(class = "block shadow-md py-4 px-4 mt-4",
            tableOutput("data"),
            uiOutput("list")),



    )

server <- function(input, output) {

 # Removing useless code
 

    output$data <- renderTable(({
        descriptions %>%
            select(Id, Name, Description, Source, Download_command) %>%
            rename("Download Code" = "Download_command")

    }))



}

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

And my app directory looks like this: image

thedivtagguy avatar Dec 02 '21 10:12 thedivtagguy

Hi there, the site looks beautiful. I'm glad you find my little package useful :-)

This is definitely a problem I'm aware of. I've tried to figure out solutions, but I haven't figured it out yet. I'll try again as I don't personally mind going half screen with RStudio and half screen with Firefox.

I think it has to do with the javascript having to be local, but I think I've tried that: https://support.rstudio.com/hc/en-us/articles/202133558-Extending-the-RStudio-IDE-with-the-Viewer-Pane

I'll ping you if I figure it out.

kylebutts avatar Dec 02 '21 15:12 kylebutts

@thedivtagguy Sorry for being super super delayed on this. I wasn't able to figure it out and still am not, but will keep trying as I think it's definitely a DX pain point. But, note that in VSCode this works well!

CleanShot 2022-06-03 at 11 40 08@2x

kylebutts avatar Jun 03 '22 17:06 kylebutts

I doubt you care @thedivtagguy, but it works in positron, so I'm calling this done 👍🏼

kylebutts avatar Jul 05 '24 22:07 kylebutts