mirror of
https://github.com/Textualize/textual.git
synced 2025-10-17 02:38:12 +03:00
Scrolling nested containers (#538)
* Scrolling nested containers * Return boolean if any scrolling occurred in any descendant in scroll_to_widget
This commit is contained in:
@@ -42,7 +42,7 @@ App > Screen {
|
||||
background: $primary-background-darken-2;
|
||||
color: $text-primary-darken-2 ;
|
||||
border-right: outer $primary-darken-3;
|
||||
content-align: center middle;
|
||||
content-align: center middle;
|
||||
}
|
||||
|
||||
#sidebar .user {
|
||||
@@ -71,14 +71,13 @@ App > Screen {
|
||||
color: $text-background;
|
||||
background: $background;
|
||||
layout: vertical;
|
||||
overflow-y: scroll;
|
||||
overflow-y: scroll;
|
||||
}
|
||||
|
||||
|
||||
Tweet {
|
||||
height: 12;
|
||||
width: 80;
|
||||
|
||||
margin: 1 3;
|
||||
background: $panel;
|
||||
color: $text-panel;
|
||||
@@ -106,9 +105,8 @@ Tweet {
|
||||
|
||||
height: 34;
|
||||
width: 100%;
|
||||
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
TweetHeader {
|
||||
height:1;
|
||||
@@ -136,12 +134,12 @@ Tweet.scroll-horizontal TweetBody {
|
||||
/* border-top: hidden $accent-darken-3; */
|
||||
border: tall $accent-darken-2;
|
||||
/* border-left: tall $accent-darken-1; */
|
||||
|
||||
|
||||
|
||||
/* padding: 1 0 0 0 ; */
|
||||
|
||||
transition: background 200ms in_out_cubic, color 300ms in_out_cubic;
|
||||
|
||||
|
||||
}
|
||||
|
||||
.button:hover {
|
||||
@@ -151,10 +149,10 @@ Tweet.scroll-horizontal TweetBody {
|
||||
height: 3;
|
||||
border: tall $accent-darken-1;
|
||||
/* border-left: tall $accent-darken-3; */
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
}
|
||||
|
||||
#footer {
|
||||
@@ -194,11 +192,11 @@ Error {
|
||||
background: $error;
|
||||
color: $text-error;
|
||||
border-top: hkey $error-darken-2;
|
||||
border-bottom: hkey $error-darken-2;
|
||||
border-bottom: hkey $error-darken-2;
|
||||
margin: 1 3;
|
||||
|
||||
|
||||
text-style: bold;
|
||||
align-horizontal: center;
|
||||
align-horizontal: center;
|
||||
}
|
||||
|
||||
Warning {
|
||||
@@ -207,7 +205,7 @@ Warning {
|
||||
background: $warning;
|
||||
color: $text-warning-fade-1;
|
||||
border-top: hkey $warning-darken-2;
|
||||
border-bottom: hkey $warning-darken-2;
|
||||
border-bottom: hkey $warning-darken-2;
|
||||
margin: 1 2;
|
||||
text-style: bold;
|
||||
align-horizontal: center;
|
||||
@@ -215,12 +213,12 @@ Warning {
|
||||
|
||||
Success {
|
||||
width: 80;
|
||||
height:3;
|
||||
height:3;
|
||||
box-sizing: border-box;
|
||||
background: $success-lighten-3;
|
||||
color: $text-success-lighten-3-fade-1;
|
||||
border-top: hkey $success;
|
||||
border-bottom: hkey $success;
|
||||
border-bottom: hkey $success;
|
||||
margin: 1 2;
|
||||
text-style: bold;
|
||||
align-horizontal: center;
|
||||
|
||||
@@ -100,6 +100,8 @@ class BasicApp(App, css_path="basic.css"):
|
||||
|
||||
def on_mount(self):
|
||||
"""Build layout here."""
|
||||
|
||||
self.scroll_to_target = Tweet(TweetBody())
|
||||
self.mount(
|
||||
header=Static(
|
||||
Text.from_markup(
|
||||
@@ -110,6 +112,7 @@ class BasicApp(App, css_path="basic.css"):
|
||||
Tweet(TweetBody()),
|
||||
Widget(
|
||||
Static(Syntax(CODE, "python"), classes="code"),
|
||||
self.scroll_to_target,
|
||||
classes="scrollable",
|
||||
),
|
||||
Error(),
|
||||
@@ -150,6 +153,9 @@ class BasicApp(App, css_path="basic.css"):
|
||||
tweet_body.short_lorem = not tweet_body.short_lorem
|
||||
tweet_body.refresh(layout=True)
|
||||
|
||||
def key_v(self):
|
||||
self.get_child(id="content").scroll_to_widget(self.scroll_to_target)
|
||||
|
||||
|
||||
app = BasicApp()
|
||||
|
||||
|
||||
Reference in New Issue
Block a user