diff --git a/src/textual/design.py b/src/textual/design.py index 79e8a10abc..a09b7531a2 100644 --- a/src/textual/design.py +++ b/src/textual/design.py @@ -13,9 +13,14 @@ NUMBER_OF_SHADES = 3 # Where no content exists -DEFAULT_DARK_BACKGROUND = "#121212" +DEFAULT_DARK_BACKGROUND = "#1e1e1e" # What text usually goes on top off -DEFAULT_DARK_SURFACE = "#1e1e1e" +DEFAULT_DARK_SURFACE = "#232323" +# TODO - update this +# # Where no content exists +# DEFAULT_DARK_BACKGROUND = "#121212" +# # What text usually goes on top off +# DEFAULT_DARK_SURFACE = "#1e1e1e" DEFAULT_LIGHT_SURFACE = "#f5f5f5" DEFAULT_LIGHT_BACKGROUND = "#efefef" @@ -193,7 +198,7 @@ def luminosity_range(spread) -> Iterable[tuple[str, float]]: # The cursor color for widgets such as OptionList, DataTable, etc. colors["cursor"] = accent.hex # The cursor should dim when the widget is blurred. - colors["cursor-blurred"] = accent.with_alpha(0.4).hex + colors["cursor-blurred"] = accent.with_alpha(0.3).hex # The border color for focused widgets which have a border. colors["border"] = accent.hex diff --git a/src/textual/screen.py b/src/textual/screen.py index 36c4de658b..629fe729d8 100644 --- a/src/textual/screen.py +++ b/src/textual/screen.py @@ -150,7 +150,7 @@ class Screen(Generic[ScreenResultType], Widget): layout: vertical; overflow-y: auto; - background: $surface; + background: $background; &:inline { height: auto; diff --git a/src/textual/widget.py b/src/textual/widget.py index ddcad1aa8c..e6ed0920ec 100644 --- a/src/textual/widget.py +++ b/src/textual/widget.py @@ -280,8 +280,8 @@ class Widget(DOMNode): scrollbar-background-hover: $panel-darken-2; scrollbar-background-active: $panel-darken-3; scrollbar-color: $primary-lighten-1; - scrollbar-color-active: $warning-darken-1; - scrollbar-color-hover: $primary-lighten-1; + scrollbar-color-active: $secondary; + scrollbar-color-hover: $primary-lighten-2; scrollbar-corner-color: $panel-darken-1; scrollbar-size-vertical: 2; scrollbar-size-horizontal: 1; diff --git a/src/textual/widgets/_data_table.py b/src/textual/widgets/_data_table.py index 53fdef4382..57cc6ceeb2 100644 --- a/src/textual/widgets/_data_table.py +++ b/src/textual/widgets/_data_table.py @@ -314,17 +314,14 @@ class DataTable(ScrollView, Generic[CellType], can_focus=True): """ DEFAULT_CSS = """ - DataTable:dark { - background: initial; - } DataTable { - background: $surface ; + background: $surface; color: $text; height: auto; max-height: 100%; &:dark { - background: initial; + background: $surface; & > .datatable--even-row { background: $primary 15%; } diff --git a/src/textual/widgets/_input.py b/src/textual/widgets/_input.py index c118600094..947e97cd8f 100644 --- a/src/textual/widgets/_input.py +++ b/src/textual/widgets/_input.py @@ -146,7 +146,7 @@ class Input(Widget, can_focus=True): DEFAULT_CSS = """ Input { - background: $boost; + background: $surface; color: $text; padding: 0 2; border: tall $border-blurred; diff --git a/src/textual/widgets/_list_item.py b/src/textual/widgets/_list_item.py index 03da9e1de2..166d2f1ca9 100644 --- a/src/textual/widgets/_list_item.py +++ b/src/textual/widgets/_list_item.py @@ -16,29 +16,22 @@ class ListItem(Widget, can_focus=False): documentation for more details on use. """ - SCOPED_CSS = False - DEFAULT_CSS = """ ListItem { color: $text; height: auto; - background: $background; overflow: hidden hidden; - } - ListItem > :disabled { - background: $background; - } - ListItem > Widget :hover { - background: $hover; - } - ListView > ListItem.--highlight { - background: $cursor-blurred; - } - ListView:focus > ListItem.--highlight { - background: $cursor; - } - ListItem > Widget { - height: auto; + background: $surface; + + & > :disabled { + background: $background; + } + & > Widget { + height: auto; + & :hover { + background: $hover; + } + } } """ diff --git a/src/textual/widgets/_list_view.py b/src/textual/widgets/_list_view.py index a60ddf8468..05d9272190 100644 --- a/src/textual/widgets/_list_view.py +++ b/src/textual/widgets/_list_view.py @@ -25,6 +25,18 @@ class ListView(VerticalScroll, can_focus=True, can_focus_children=False): index: The index in the list that's currently highlighted. """ + DEFAULT_CSS = """ + ListView { + background: transparent; + & > ListItem.--highlight { + background: $cursor-blurred; + } + &:focus > ListItem.--highlight { + background: $cursor; + } + } + """ + BINDINGS: ClassVar[list[BindingType]] = [ Binding("enter", "select_cursor", "Select", show=False), Binding("up", "cursor_up", "Cursor up", show=False), diff --git a/src/textual/widgets/_option_list.py b/src/textual/widgets/_option_list.py index efdf20fba5..b48bc86ff9 100644 --- a/src/textual/widgets/_option_list.py +++ b/src/textual/widgets/_option_list.py @@ -143,6 +143,7 @@ class OptionList(ScrollView, can_focus=True): overflow-x: hidden; border: tall transparent; padding: 0 1; + background: $surface ; } OptionList:focus { @@ -155,7 +156,7 @@ class OptionList(ScrollView, can_focus=True): OptionList > .option-list--option-highlighted { color: $text; - text-style: bold; + background: $cursor-blurred; } OptionList:focus > .option-list--option-highlighted { @@ -173,13 +174,11 @@ class OptionList(ScrollView, can_focus=True): OptionList > .option-list--option-hover-highlighted { background: $accent 60%; color: $text; - text-style: bold; } OptionList:focus > .option-list--option-hover-highlighted { background: $accent; color: $text; - text-style: bold; } """ diff --git a/src/textual/widgets/_text_area.py b/src/textual/widgets/_text_area.py index b147c27ee5..65699f0f30 100644 --- a/src/textual/widgets/_text_area.py +++ b/src/textual/widgets/_text_area.py @@ -93,7 +93,7 @@ class TextArea(ScrollView): height: 1fr; border: tall $background; padding: 0 1; - + background: $surface; & .text-area--gutter { color: $text 40%; }