alihan/textual
1
0
Fork 0
mirror of https://github.com/Textualize/textual.git synced 2025-10-17 02:38:12 +03:00
Code Issues Packages Projects Releases Wiki Activity

Improve text-align example.

Browse Source 
Replace statics with labels; change to a 2 x 2 grid layout to make it easier to see the difference between 'center' and 'justify'; increase readability by setting 'color: auto' in the labels.
This commit is contained in:
Rodrigo Girão Serrão
2023-01-06 10:40:31 +00:00
parent 7743feadff
commit 042bc3b3fe
3 changed files with 27 additions and 28 deletions
Download Patch File Download Diff File Expand all files Collapse all files

27
docs/examples/styles/text_align.css
View File

@@ -1,24 +1,29 @@
#one { #one {
text-align: left; text-align: left;
background: lightblue; background: lightblue;
} }
#two { #two {
text-align: center; text-align: center;
background: indianred; background: indianred;
} }
#three { #three {
text-align: right; text-align: right;
background: palegreen; background: palegreen;
} }
#four { #four {
text-align: justify; text-align: justify;
background: palevioletred; background: palevioletred;
} }
Static { Label {
padding: 1; padding: 1 2;
height: 100%;
color: auto;
}
Grid {
grid-size: 2 2;
} }

26
docs/examples/styles/text_align.py
View File

@@ -1,7 +1,6 @@
from __future__ import annotations from textual.app import App
from textual.containers import Grid
from textual.app import App, ComposeResult from textual.widgets import Label
from textual.widgets import Static
TEXT = ( TEXT = (
"I must not fear. Fear is the mind-killer. Fear is the little-death that " "I must not fear. Fear is the mind-killer. Fear is the little-death that "
@@ -11,18 +10,13 @@ TEXT = (
class TextAlign(App): class TextAlign(App):
def compose(self) -> ComposeResult: def compose(self):
left = Static("[b]Left aligned[/]\n" + TEXT, id="one") yield Grid(
yield left Label("[b]Left aligned[/]\n" + TEXT, id="one"),
Label("[b]Center aligned[/]\n" + TEXT, id="two"),
right = Static("[b]Center aligned[/]\n" + TEXT, id="two") Label("[b]Right aligned[/]\n" + TEXT, id="three"),
yield right Label("[b]Justified[/]\n" + TEXT, id="four"),
)
center = Static("[b]Right aligned[/]\n" + TEXT, id="three")
yield center
full = Static("[b]Justified[/]\n" + TEXT, id="four")
yield full
app = TextAlign(css_path="text_align.css") app = TextAlign(css_path="text_align.css")

2
docs/styles/text_align.md
View File

@@ -35,7 +35,7 @@ This example shows, from top to bottom: `left`, `center`, `right`, and `justify`
=== "text_align.css" === "text_align.css"
```css ```css hl_lines="2 7 12 17"
--8<-- "docs/examples/styles/text_align.css" --8<-- "docs/examples/styles/text_align.css"
``` ```