theme.flatly

theme.flatly

flatly Bootswatch theme

Visit https://bootswatch.com/flatly/ to see Bootswatch's demo of the flatly theme.

This theme object is a subclass of Theme and can be further customized with the Theme methods. Note that customizing Shiny themes requires the libsass package.

Examples

Shinyswatch themes must be provided to the theme argument of any Shiny UI page function, e.g. page_fluid or page_sidebar, or to page_opts in Shiny Express.

Shiny Express

from shiny.express import ui
import shinyswatch

ui.page_opts(theme=shinyswatch.flatly)

Shiny Core

from shiny import App, render, ui

import shinyswatch

app_ui = ui.page_fluid(
    ui.input_slider("num", "Number:", min=10, max=100, value=30),
    ui.output_text_verbatim("slider_val"),
    theme=shinyswatch.theme.darkly,
)


def server(input):
    @render.text
    def slider_val():
        return f"{input.num()}"


app = App(app_ui, server)

Attributes

Name	Type	Description
name		Name of the theme.
colors		A class containing the color variables used in the theme.

Returns

Type	Description
`htmltools`.`HTMLDependency`	When called, returns an HTMLDependency of a full Shiny Bootswatch (flatly) theme.

Examples

#| '!! shinylive warning !!': |
#|   shinylive does not work in self-contained HTML documents.
#|   Please set `embed-resources: false` in your metadata.
#| standalone: true
#| components: [editor, viewer]
#| layout: vertical
#| viewerHeight: 800
## file: app.py
import pandas as pd
from shiny import App, render, ui

import shinyswatch

app_ui = ui.page_navbar(
    ui.nav_panel(
        "Navbar 1",
        ui.layout_sidebar(
            ui.sidebar(
                ui.input_file("file", "File input:"),
                ui.input_text("txt", "Text input:", "general"),
                ui.input_slider("slider", "Slider input:", 1, 100, 30),
                ui.tags.h5("Default actionButton:"),
                ui.input_action_button("action", "Search"),
                ui.tags.h5("actionButton with CSS class:"),
                ui.input_action_button(
                    "action2", "Action button", class_="btn-primary"
                ),
            ),
            ui.navset_tab(
                ui.nav_panel(
                    "Tab 1",
                    ui.tags.h4("Table"),
                    ui.output_table("table"),
                    ui.tags.h4("Verbatim text output"),
                    ui.output_text_verbatim("txtout"),
                    ui.tags.h1("Header 1"),
                    ui.tags.h2("Header 2"),
                    ui.tags.h3("Header 3"),
                    ui.tags.h4("Header 4"),
                    ui.tags.h5("Header 5"),
                ),
                ui.nav_panel("Tab 2", "Tab 2 content"),
                ui.nav_panel("Tab 3", "Tab 3 content"),
            ),
        ),
    ),
    ui.nav_panel("Plot", "Plot content"),
    ui.nav_panel("Table", "Table content"),
    title="shinyswatch",
    theme=shinyswatch.theme.flatly,
)


def server(input, output, session):
    @output
    @render.text
    def txtout():
        return f"{input.txt()}, {input.slider()}, {input.slider()}"

    @output
    @render.table
    def table():
        cars = pd.DataFrame({"speed": [4, 4, 7, 7], "dist": [2, 10, 4, 22]})
        return cars


app = App(app_ui, server)


## file: requirements.txt
Jinja2
pandas
shiny
shinyswatch