search

ashokkrish / CougarStats

5 stars 2 forks source link

Dark Mode toggle button position #36

Open ashokkrish opened 2 days ago

ashokkrish commented 2 days ago

@bryce-carson

I would like the toggle

image

moved to the top right corner.

Also by default I want the Dark Mode OFF.

bryce-carson commented 1 day ago

Append to DOM element with id mainPanel, set style of appended element to margin-left: auto.

bryce-carson commented 1 day ago

div.container-fluid:has-child('li#main-banner') should do it too.

How to render HTML from R, but not insert into DOM? Need the following HTML to hack into UI with JS:

  tags$div(style = "margin-left: auto",
           prettySwitch(inputId = "togglemode",
                        label = "Dark Mode",
                        value = FALSE,
                        fill = TRUE,
                        status = "primary"))
bryce-carson commented 1 day ago

Just run the function... that's it.

ashokkrish commented 1 day ago

@bryce-carson I added the above to ui.R and got this

image

I was hoping to isolate the toggle button and place it on the far right of the page. But if think this is a right placement I will leave it here for now.

bryce-carson commented 1 day ago

@ashokkrish, okay; good try. I'm working on this. I'll have it correct in a moment; I made those comments for myself as notes in case I didn't return to the issue or got distracted by something.

bryce-carson commented 1 day ago

This solution isn't working as expected. I'll investigate it more some other time, after #33 and the other discussed feature are working.