Linking external / local css

I am trying to link an external/local CSS, however, it doesn’t seem to be linked.

I followed the example in this link: https://dash.plot.ly/external-resources

app.py

external_stylesheets = [
    dbc.themes.SLATE,
    {
        'href': 'custom.css',
        'rel': 'stylesheet',
    }
]

app = dash.Dash(
            meta_tags=[
                {"name": "viewport", "content": "width=device-width, initial-scale=1"}
            ],
            external_stylesheets=external_stylesheets,
      )

when I load the app, the custom.css from /assets folder is empty.

custom.css

.tabs {
  background-color: #444,
  color: #adb5bd,
  verticalAlign: middle,
  font-size: 0.9375rem
}

.map-style {
  padding: 11% 0px 0px 5px;
}

.prop-style {
  padding: 0% 0px 0px 2em;
}

.price-style {
  padding: 5% 0px 0px 0.4em;
}

.market-style {
  padding: 5% 0px 0px 0.4em;
}

.date-picker-range {
  width: 300px;
}

I have also tried /assets/custom.css and it still doesn’t work. My questions, how do you link a local css with dash-bootstrap-component style.

3 posts - 2 participants

Read full topic