Skip to content

Decoration ​

box and text chrome. The ui-gallery page Decoration, painted with no terminal and no window at each of the documented profiles:

bash
ui-gallery --render --page decoration --profile full|enhanced|baseline
 sparkles:ui box and text chrome                                                    tokyo-night 
   Welcome           ▕ Decoration · box and text chrome                                        █
   Primitives        ▕                                                                         █
   Layout            ▕                                                                         █
   Tracks            ▕ A decoration is slot-referencing and presentation-free: it names which  █
   Text              ▕ slot the border colour comes from, and the palette resolves it with     █
   Themes            ▕ everything else.                                                        █
   Slots             ▕                                                                         █
 ▸ Decoration        ▕ ┌─────────────────────────────────────────────────────────────────────┐ █
   Effects           ▕ │ borders                                                             │ █
   Grid              ▕ │ solid          ┌───────────┐                                        │ ░
   Components        ▕ │                │ content   │                                        │ ░
   Tree              ▕ │                └───────────┘                                        │ ░
   Property tree     ▕ │                                                                     │ ░
   Table             ▕ │ rounded        ╭───────────╮                                        │ ░
   Scrolling         ▕ │                │ content   │                                        │ ░
   State             ▕ │                ╰───────────╯                                        │ ░
   Split             ▕ │                                                                     │ ░
   Dock              ▕ │ heavy (2px)    ┏━━━━━━━━━━━┓                                        │ ░
   Terminal          ▕ │                ┃ content   ┃                                        │ ░
                     ▕ │                ┗━━━━━━━━━━━┛                                        │ ░
                     ▕ │                                                                     │ ░
                     ▕ │ dotted         ┌┈┈┈┈┈┈┈┈┈┈┈┐                                        │ ░
                     ▕ │                ┊ content   ┊                                        │ ░
                     ▕ │                └┈┈┈┈┈┈┈┈┈┈┈┘                                        │ ░
                     ▕ │                                                                     │ ░
                     ▕ │ dashed         ┌╌╌╌╌╌╌╌╌╌╌╌┐                                        │ ░
                     ▕ │                ╎ content   ╎                                        │ ░
                     ▕ │                └╌╌╌╌╌╌╌╌╌╌╌┘                                        │ ░
                     ▕ │                                                                     │ ░
                     ▕                                                                          
 pages                                                                          ? keys   q quit 
 sparkles:ui box and text chrome                                                    tokyo-night 
   Welcome           ▕ Decoration · box and text chrome                                        █
   Primitives        ▕                                                                         █
   Layout            ▕                                                                         █
   Tracks            ▕ A decoration is slot-referencing and presentation-free: it names which  █
   Text              ▕ slot the border colour comes from, and the palette resolves it with     █
   Themes            ▕ everything else.                                                        █
   Slots             ▕                                                                         █
 ▸ Decoration        ▕ ┌─────────────────────────────────────────────────────────────────────┐ █
   Effects           ▕ │ borders                                                             │ █
   Grid              ▕ │ solid          ┌───────────┐                                        │ ░
   Components        ▕ │                │ content   │                                        │ ░
   Tree              ▕ │                └───────────┘                                        │ ░
   Property tree     ▕ │                                                                     │ ░
   Table             ▕ │ rounded        ╭───────────╮                                        │ ░
   Scrolling         ▕ │                │ content   │                                        │ ░
   State             ▕ │                ╰───────────╯                                        │ ░
   Split             ▕ │                                                                     │ ░
   Dock              ▕ │ heavy (2px)    ┏━━━━━━━━━━━┓                                        │ ░
   Terminal          ▕ │                ┃ content   ┃                                        │ ░
                     ▕ │                ┗━━━━━━━━━━━┛                                        │ ░
                     ▕ │                                                                     │ ░
                     ▕ │ dotted         ┌┈┈┈┈┈┈┈┈┈┈┈┐                                        │ ░
                     ▕ │                ┊ content   ┊                                        │ ░
                     ▕ │                └┈┈┈┈┈┈┈┈┈┈┈┘                                        │ ░
                     ▕ │                                                                     │ ░
                     ▕ │ dashed         ┌╌╌╌╌╌╌╌╌╌╌╌┐                                        │ ░
                     ▕ │                ╎ content   ╎                                        │ ░
                     ▕ │                └╌╌╌╌╌╌╌╌╌╌╌┘                                        │ ░
                     ▕ │                                                                     │ ░
                     ▕                                                                          
 pages                                                                          ? keys   q quit 
 sparkles:ui box and text chrome                                                    tokyo-night 
   Welcome           | Decoration * box and text chrome                                        #
   Primitives        |                                                                         #
   Layout            |                                                                         #
   Tracks            | A decoration is slot-referencing and presentation-free: it names which  #
   Text              | slot the border colour comes from, and the palette resolves it with     #
   Themes            | everything else.                                                        #
   Slots             |                                                                         #
 > Decoration        | +---------------------------------------------------------------------+ #
   Effects           | | borders                                                             | #
   Grid              | | solid          +-----------+                                        | |
   Components        | |                | content   |                                        | |
   Tree              | |                +-----------+                                        | |
   Property tree     | |                                                                     | |
   Table             | | rounded        +-----------+                                        | |
   Scrolling         | |                | content   |                                        | |
   State             | |                +-----------+                                        | |
   Split             | |                                                                     | |
   Dock              | | heavy (2px)    +-----------+                                        | |
   Terminal          | |                | content   |                                        | |
                     | |                +-----------+                                        | |
                     | |                                                                     | |
                     | | dotted         +...........+                                        | |
                     | |                : content   :                                        | |
                     | |                +...........+                                        | |
                     | |                                                                     | |
                     | | dashed         +-----------+                                        | |
                     | |                | content   |                                        | |
                     | |                +-----------+                                        | |
                     | |                                                                     | |
                     |                                                                          
 pages                                                                          ? keys   q quit 

What each profile gives up ​

The frame's degradation report: one line per substitution, and the capability the target lacked. full is empty when the page asks for nothing a terminal cannot do.

text
radius-as-glyph ×1 (radius)
alpha-flattened ×3 (alpha)
text
color-folded ×70 (colorDepth)
radius-as-glyph ×1 (radius)
alpha-flattened ×3 (alpha)
text
color-dropped ×70 (colorDepth)
ascii-border ×7 (unicode)
ascii-scrollbar ×1 (unicode)
ascii-glyph ×2 (unicode)
radius-dropped ×1 (radius)
alpha-flattened ×3 (alpha)

These are the files dub test :ui-gallery compares every render against, so a change to this page that is not re-blessed fails CI.