Broken project to implement a cross-protocol browser in textual
toolbar: Make mobile-friendly
| -rw-r--r-- | browset.css | 11 | ||||
| -rwxr-xr-x | browset.py | 12 |
2 files changed, 21 insertions, 2 deletions
diff --git a/browset.css b/browset.css index f738943..f3ebc9f 100644 --- a/browset.css +++ b/browset.css @@ -6,6 +6,17 @@ height: 3; dock: top; } +#toolbar.mobile { + grid-size: 2 1; + grid-columns: 4 1fr; + grid-gutter: 0; +} +#toolbar.mobile Button { + display: none; +} +#toolbar.mobile Button.mobile { + display: block; +} .header { content-align: center middle; } @@ -2,8 +2,8 @@ from textual.app import App, ComposeResult from textual.widgets import Input, Button, Static, Footer from textual.containers import Container -from rich.markdown import Markdown from textual.binding import Binding +from textual.events import Resize from mime.gemtext import Gemtext from mime.plaintext import Plaintext from mime.highlightedcode import HighlightedCode,mimetolexer @@ -33,7 +33,7 @@ class Browset(App): def compose(self) -> ComposeResult: yield Footer() yield Container( - Button("🔙", variant='primary', name='back'), # ⏪ + Button("🔙", variant='primary', name='back', classes='mobile'), # ⏪ Button("🔝", name='../'), # ⏫ Button("🔜", variant='primary', name='soon'), # ⏩ Button("🔄", variant='primary', name='refresh'), # 🔁 @@ -59,6 +59,14 @@ class Browset(App): url = GeminiProtocol.relativeURL(url, self.url) self._do_url(url) + + async def on_resize(self, event: Resize) -> None: + toolbar = self.query_one("#toolbar") + if event.size.width < 60: + toolbar.add_class('mobile') + else: + toolbar.remove_class('mobile') + def action_back(self): if len(self.history): self.fistory.append(self.url) |