335 CSS

App

#| standalone: true
#| components: [viewer]
#| layout: horizontal
#| viewerHeight: 800
from shiny.express import ui

with ui.card():
    ui.card_header("Card header")
    "Card body"
## file: my-styles.css
/* my-styles.css */

.card-header {
    color: white;
    background: #2A2A2A !important;
}

/* ".card-header { color:white; background:#2A2A2A !important; }" */

Edit this app

#| standalone: true
#| components: [editor, viewer]
#| layout: horizontal
#| viewerHeight: 800
from shiny.express import ui

with ui.card():
    ui.card_header("Card header")
    "Card body"
## file: my-styles.css
/* my-styles.css */

.card-header {
    color: white;
    background: #2A2A2A !important;
}

/* ".card-header { color:white; background:#2A2A2A !important; }" */

The source code for this exercise is at https://github.com/posit-conf-2024/intro-to-shiny-for-python/tree/main/docs/apps/335-css.