plotly / dash-daq

Control components for Dash
MIT License
141 stars 40 forks source link

DarkThemeProvider doesn't change colour of input boxes #8

Closed shammamah-zz closed 2 years ago

shammamah-zz commented 6 years ago

It appears as though custom CSS is required (e.g., in this app https://dash-daq-stepper-motor.herokuapp.com) to change the background colour of input boxes. Otherwise the background stays white, but the text colour changes, and this makes things hard to read (e.g., in this app https://dash-daq-pressure-gauge.herokuapp.com).

bpostlethwaite commented 6 years ago

@shammamah can you link to this custom CSS? Where is it and where did it come from? Can we embed it inside the dash-daq CSS?

bpostlethwaite commented 6 years ago

@plotly/dash-apps feel free to comment further as well!

shammamah-zz commented 6 years ago

Here's the CSS stylesheet that @matthewchan15 created: https://cdn.rawgit.com/matthewchan15/dash-css-style-sheets/94fdb056/dash-daq-dark.css

bpostlethwaite commented 6 years ago

@matthewchan15 how did you create this? If we are fixing Input boxes and Dropdowns why are there so many other things in this?

mtwichan commented 6 years ago

@bpostlethwaite the style sheet is from: "http://dash-daq.netlify.com/#DarkThemeProvider" , where this style sheet is imported for the dark theme provider. Here is the direct link to the style sheet: "https://codepen.io/anon/pen/BYEPbO.css". From my understanding, somebody is working on this stylesheet, and the CSS in this effects the input boxes, sliders, buttons, dropdowns, etc of all components. For this case it did not work for the plotly polar plot, so I had to edit the CSS directly in my app,py, for the plot. When I originally used the given stylesheet there were some issues so I had to edit it to make it work properly, which is why I have my own copy.