diff --git a/src/textual/_styles_cache.py b/src/textual/_styles_cache.py
index 25762f782..46027383e 100644
--- a/src/textual/_styles_cache.py
+++ b/src/textual/_styles_cache.py
@@ -304,8 +304,6 @@ class StylesCache:
Returns:
New list of segments
"""
- if styles.text_opacity != 1.0:
- segments = TextOpacity.process_segments(segments, styles.text_opacity)
if styles.tint.a:
segments = Tint.process_segments(segments, styles.tint)
if styles.opacity != 1.0:
@@ -405,6 +403,8 @@ class StylesCache:
line = [make_blank(content_width, inner)]
if inner:
line = Segment.apply_style(line, inner)
+ if styles.text_opacity != 1.0:
+ line = TextOpacity.process_segments(line, styles.text_opacity)
line = line_pad(line, pad_left, pad_right, inner)
if border_left or border_right:
diff --git a/src/textual/widgets/_button.py b/src/textual/widgets/_button.py
index bcac77b91..e47797ba3 100644
--- a/src/textual/widgets/_button.py
+++ b/src/textual/widgets/_button.py
@@ -16,7 +16,7 @@ from ..widgets import Static
ButtonVariant = Literal["default", "primary", "success", "warning", "error"]
"""The names of the valid button variants.
-These are the variants that can be used with a [Button][textual.widgets.Button].
+These are the variants that can be used with a [`Button`][textual.widgets.Button].
"""
_VALID_BUTTON_VARIANTS = {"default", "primary", "success", "warning", "error"}
@@ -281,7 +281,8 @@ class Button(Static, can_focus=True):
disabled: Whether the button is disabled or not.
Returns:
- A Button widget of the 'success' variant.
+ A [`Button`][textual.widgets.Button] widget of the 'success'
+ [variant][textual.widgets.button.ButtonVariant].
"""
return Button(
label=label,
@@ -313,7 +314,8 @@ class Button(Static, can_focus=True):
disabled: Whether the button is disabled or not.
Returns:
- A Button widget of the 'warning' variant.
+ A [`Button`][textual.widgets.Button] widget of the 'warning'
+ [variant][textual.widgets.button.ButtonVariant].
"""
return Button(
label=label,
@@ -345,7 +347,8 @@ class Button(Static, can_focus=True):
disabled: Whether the button is disabled or not.
Returns:
- A Button widget of the 'error' variant.
+ A [`Button`][textual.widgets.Button] widget of the 'error'
+ [variant][textual.widgets.button.ButtonVariant].
"""
return Button(
label=label,
diff --git a/tests/snapshot_tests/__snapshots__/test_snapshots.ambr b/tests/snapshot_tests/__snapshots__/test_snapshots.ambr
index 1fe2e6519..797ec93b5 100644
--- a/tests/snapshot_tests/__snapshots__/test_snapshots.ambr
+++ b/tests/snapshot_tests/__snapshots__/test_snapshots.ambr
@@ -1057,162 +1057,162 @@
font-weight: 700;
}
- .terminal-2059425018-matrix {
+ .terminal-619468389-matrix {
font-family: Fira Code, monospace;
font-size: 20px;
line-height: 24.4px;
font-variant-east-asian: full-width;
}
- .terminal-2059425018-title {
+ .terminal-619468389-title {
font-size: 18px;
font-weight: bold;
font-family: arial;
}
- .terminal-2059425018-r1 { fill: #e1e1e1 }
- .terminal-2059425018-r2 { fill: #c5c8c6 }
- .terminal-2059425018-r3 { fill: #e1e1e1;font-weight: bold }
- .terminal-2059425018-r4 { fill: #454a50 }
- .terminal-2059425018-r5 { fill: #313437 }
- .terminal-2059425018-r6 { fill: #24292f;font-weight: bold }
- .terminal-2059425018-r7 { fill: #7c7d7e;font-weight: bold }
- .terminal-2059425018-r8 { fill: #000000 }
- .terminal-2059425018-r9 { fill: #101011 }
- .terminal-2059425018-r10 { fill: #507bb3 }
- .terminal-2059425018-r11 { fill: #324f70 }
- .terminal-2059425018-r12 { fill: #dde6ed;font-weight: bold }
- .terminal-2059425018-r13 { fill: #75828b;font-weight: bold }
- .terminal-2059425018-r14 { fill: #001541 }
- .terminal-2059425018-r15 { fill: #0c1e39 }
- .terminal-2059425018-r16 { fill: #7ae998 }
- .terminal-2059425018-r17 { fill: #4f9262 }
- .terminal-2059425018-r18 { fill: #0a180e;font-weight: bold }
- .terminal-2059425018-r19 { fill: #192e1f;font-weight: bold }
- .terminal-2059425018-r20 { fill: #008139 }
- .terminal-2059425018-r21 { fill: #156034 }
- .terminal-2059425018-r22 { fill: #ffcf56 }
- .terminal-2059425018-r23 { fill: #a4823a }
- .terminal-2059425018-r24 { fill: #211505;font-weight: bold }
- .terminal-2059425018-r25 { fill: #3a2a13;font-weight: bold }
- .terminal-2059425018-r26 { fill: #b86b00 }
- .terminal-2059425018-r27 { fill: #825210 }
- .terminal-2059425018-r28 { fill: #e76580 }
- .terminal-2059425018-r29 { fill: #904354 }
- .terminal-2059425018-r30 { fill: #f5e5e9;font-weight: bold }
- .terminal-2059425018-r31 { fill: #978186;font-weight: bold }
- .terminal-2059425018-r32 { fill: #780028 }
- .terminal-2059425018-r33 { fill: #5b132a }
+ .terminal-619468389-r1 { fill: #e1e1e1 }
+ .terminal-619468389-r2 { fill: #c5c8c6 }
+ .terminal-619468389-r3 { fill: #e1e1e1;font-weight: bold }
+ .terminal-619468389-r4 { fill: #454a50 }
+ .terminal-619468389-r5 { fill: #35383c }
+ .terminal-619468389-r6 { fill: #24292f;font-weight: bold }
+ .terminal-619468389-r7 { fill: #7c7d7e;font-weight: bold }
+ .terminal-619468389-r8 { fill: #000000 }
+ .terminal-619468389-r9 { fill: #0c0c0c }
+ .terminal-619468389-r10 { fill: #507bb3 }
+ .terminal-619468389-r11 { fill: #3c5577 }
+ .terminal-619468389-r12 { fill: #dde6ed;font-weight: bold }
+ .terminal-619468389-r13 { fill: #75828b;font-weight: bold }
+ .terminal-619468389-r14 { fill: #001541 }
+ .terminal-619468389-r15 { fill: #0c1833 }
+ .terminal-619468389-r16 { fill: #7ae998 }
+ .terminal-619468389-r17 { fill: #559767 }
+ .terminal-619468389-r18 { fill: #0a180e;font-weight: bold }
+ .terminal-619468389-r19 { fill: #192e1f;font-weight: bold }
+ .terminal-619468389-r20 { fill: #008139 }
+ .terminal-619468389-r21 { fill: #0c592e }
+ .terminal-619468389-r22 { fill: #ffcf56 }
+ .terminal-619468389-r23 { fill: #a5883f }
+ .terminal-619468389-r24 { fill: #211505;font-weight: bold }
+ .terminal-619468389-r25 { fill: #3a2a13;font-weight: bold }
+ .terminal-619468389-r26 { fill: #b86b00 }
+ .terminal-619468389-r27 { fill: #7a4c0c }
+ .terminal-619468389-r28 { fill: #e76580 }
+ .terminal-619468389-r29 { fill: #964858 }
+ .terminal-619468389-r30 { fill: #f5e5e9;font-weight: bold }
+ .terminal-619468389-r31 { fill: #978186;font-weight: bold }
+ .terminal-619468389-r32 { fill: #780028 }
+ .terminal-619468389-r33 { fill: #540c24 }
-
+
-
+
-
+
-
+
-
+
-
+
-
+
-
+
-
+
-
+
-
+
-
+
-
+
-
+
-
+
-
+
-
+
-
+
-
+
-
+
-
+
-
+
-
+
-
+
- ButtonsApp
+ ButtonsApp
-
+
-
-
- Standard ButtonsDisabled Buttons
-
- ▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔
- DefaultDefault
- ▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁
-
- ▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔
- Primary!Primary!
- ▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁
-
- ▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔
- Success!Success!
- ▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁
-
- ▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔
- Warning!Warning!
- ▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁
-
- ▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔
- Error!Error!
- ▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁
-
+
+
+ Standard ButtonsDisabled Buttons
+
+ ▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔
+ DefaultDefault
+ ▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁
+
+ ▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔
+ Primary!Primary!
+ ▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁
+
+ ▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔
+ Success!Success!
+ ▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁
+
+ ▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔
+ Warning!Warning!
+ ▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁
+
+ ▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔
+ Error!Error!
+ ▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁
+
@@ -13761,161 +13761,161 @@
font-weight: 700;
}
- .terminal-3590440526-matrix {
+ .terminal-65653754-matrix {
font-family: Fira Code, monospace;
font-size: 20px;
line-height: 24.4px;
font-variant-east-asian: full-width;
}
- .terminal-3590440526-title {
+ .terminal-65653754-title {
font-size: 18px;
font-weight: bold;
font-family: arial;
}
- .terminal-3590440526-r1 { fill: #454a50 }
- .terminal-3590440526-r2 { fill: #507bb3 }
- .terminal-3590440526-r3 { fill: #7ae998 }
- .terminal-3590440526-r4 { fill: #ffcf56 }
- .terminal-3590440526-r5 { fill: #e76580 }
- .terminal-3590440526-r6 { fill: #c5c8c6 }
- .terminal-3590440526-r7 { fill: #e2e3e3;font-weight: bold }
- .terminal-3590440526-r8 { fill: #dde6ed;font-weight: bold }
- .terminal-3590440526-r9 { fill: #0a180e;font-weight: bold }
- .terminal-3590440526-r10 { fill: #211505;font-weight: bold }
- .terminal-3590440526-r11 { fill: #f5e5e9;font-weight: bold }
- .terminal-3590440526-r12 { fill: #000000 }
- .terminal-3590440526-r13 { fill: #001541 }
- .terminal-3590440526-r14 { fill: #008139 }
- .terminal-3590440526-r15 { fill: #b86b00 }
- .terminal-3590440526-r16 { fill: #780028 }
- .terminal-3590440526-r17 { fill: #313437 }
- .terminal-3590440526-r18 { fill: #324f70 }
- .terminal-3590440526-r19 { fill: #4f9262 }
- .terminal-3590440526-r20 { fill: #a4823a }
- .terminal-3590440526-r21 { fill: #904354 }
- .terminal-3590440526-r22 { fill: #7c7d7e;font-weight: bold }
- .terminal-3590440526-r23 { fill: #75828b;font-weight: bold }
- .terminal-3590440526-r24 { fill: #192e1f;font-weight: bold }
- .terminal-3590440526-r25 { fill: #3a2a13;font-weight: bold }
- .terminal-3590440526-r26 { fill: #978186;font-weight: bold }
- .terminal-3590440526-r27 { fill: #101011 }
- .terminal-3590440526-r28 { fill: #0c1e39 }
- .terminal-3590440526-r29 { fill: #156034 }
- .terminal-3590440526-r30 { fill: #825210 }
- .terminal-3590440526-r31 { fill: #5b132a }
+ .terminal-65653754-r1 { fill: #454a50 }
+ .terminal-65653754-r2 { fill: #507bb3 }
+ .terminal-65653754-r3 { fill: #7ae998 }
+ .terminal-65653754-r4 { fill: #ffcf56 }
+ .terminal-65653754-r5 { fill: #e76580 }
+ .terminal-65653754-r6 { fill: #c5c8c6 }
+ .terminal-65653754-r7 { fill: #e2e3e3;font-weight: bold }
+ .terminal-65653754-r8 { fill: #dde6ed;font-weight: bold }
+ .terminal-65653754-r9 { fill: #0a180e;font-weight: bold }
+ .terminal-65653754-r10 { fill: #211505;font-weight: bold }
+ .terminal-65653754-r11 { fill: #f5e5e9;font-weight: bold }
+ .terminal-65653754-r12 { fill: #000000 }
+ .terminal-65653754-r13 { fill: #001541 }
+ .terminal-65653754-r14 { fill: #008139 }
+ .terminal-65653754-r15 { fill: #b86b00 }
+ .terminal-65653754-r16 { fill: #780028 }
+ .terminal-65653754-r17 { fill: #35383c }
+ .terminal-65653754-r18 { fill: #3c5577 }
+ .terminal-65653754-r19 { fill: #559767 }
+ .terminal-65653754-r20 { fill: #a5883f }
+ .terminal-65653754-r21 { fill: #964858 }
+ .terminal-65653754-r22 { fill: #7c7d7e;font-weight: bold }
+ .terminal-65653754-r23 { fill: #75828b;font-weight: bold }
+ .terminal-65653754-r24 { fill: #192e1f;font-weight: bold }
+ .terminal-65653754-r25 { fill: #3a2a13;font-weight: bold }
+ .terminal-65653754-r26 { fill: #978186;font-weight: bold }
+ .terminal-65653754-r27 { fill: #0c0c0c }
+ .terminal-65653754-r28 { fill: #0c1833 }
+ .terminal-65653754-r29 { fill: #0c592e }
+ .terminal-65653754-r30 { fill: #7a4c0c }
+ .terminal-65653754-r31 { fill: #540c24 }
-
+
-
+
-
+
-
+
-
+
-
+
-
+
-
+
-
+
-
+
-
+
-
+
-
+
-
+
-
+
-
+
-
+
-
+
-
+
-
+
-
+
-
+
-
+
-
+
- WidgetDisableTestApp
+ WidgetDisableTestApp
-
+
-
- ▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔
- ButtonButtonButtonButtonButton
- ▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁
- ▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔
- ButtonButtonButtonButtonButton
- ▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁
- ▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔
- ButtonButtonButtonButtonButton
- ▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁
- ▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔
- ButtonButtonButtonButtonButton
- ▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁
- ▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔
- ButtonButtonButtonButtonButton
- ▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁
- ▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔
- ButtonButtonButtonButtonButton
- ▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁
- ▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔
- ButtonButtonButtonButtonButton
- ▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁
- ▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔
- ButtonButtonButtonButtonButton
- ▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁
+
+ ▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔
+ ButtonButtonButtonButtonButton
+ ▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁
+ ▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔
+ ButtonButtonButtonButtonButton
+ ▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁
+ ▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔
+ ButtonButtonButtonButtonButton
+ ▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁
+ ▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔
+ ButtonButtonButtonButtonButton
+ ▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁
+ ▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔
+ ButtonButtonButtonButtonButton
+ ▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁
+ ▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔
+ ButtonButtonButtonButtonButton
+ ▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁
+ ▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔
+ ButtonButtonButtonButtonButton
+ ▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁
+ ▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔▔
+ ButtonButtonButtonButtonButton
+ ▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁