diff options
author | Dave Davenport <qball@blame.services> | 2022-04-06 00:04:30 +0200 |
---|---|---|
committer | Dave Davenport <qball@blame.services> | 2022-04-06 00:04:30 +0200 |
commit | 62ebde525fdcfee620cd4a9462014c7587b83103 (patch) | |
tree | 489bc6d71bb18b3ce66f7b475c625695b893fb39 /doc/rofi-theme.5.markdown | |
parent | 88a1d1cbf7f077c6f3ed712939adc83cfe96eaf1 (diff) |
[doc] Update drawings in rofi-theme
Diffstat (limited to 'doc/rofi-theme.5.markdown')
-rw-r--r-- | doc/rofi-theme.5.markdown | 168 |
1 files changed, 84 insertions, 84 deletions
diff --git a/doc/rofi-theme.5.markdown b/doc/rofi-theme.5.markdown index dce3b704..79715166 100644 --- a/doc/rofi-theme.5.markdown +++ b/doc/rofi-theme.5.markdown @@ -465,17 +465,18 @@ style property. Indicate a place on the window/monitor. -* Format: `(center|east|north|west|south|north east|north west|south west|south east)` - ``` - -north west | north | north east --------------|-------------|------------ - west | center | east --------------|-------------|------------ -south west | south | south east +┌─────────────┬─────────────┬─────────────┐ +│ north west │ north │ north east │ +├─────────────┼─────────────┼─────────────┤ +│ west │ center │ east │ +├─────────────┼─────────────┼─────────────┤ +│ south west │ south │ south east │ +└─────────────┴─────────────┴─────────────┘ ``` +* Format: `(center|east|north|west|south|north east|north west|south west|south east)` + ## Visibility It is possible to hide widgets: @@ -850,42 +851,42 @@ The box can be vertical or horizontal. This is loosely inspired by [GTK](http:// The current layout of **rofi** is structured as follows: ``` -|------------------------------------------------------------------------------------| -| window {BOX:vertical} | -| |-------------------------------------------------------------------------------| | -| | mainbox {BOX:vertical} | | -| | |---------------------------------------------------------------------------| | | -| | | inputbar {BOX:horizontal} | | | -| | | |---------| |-| |---------------------------------|---| |---| |---| |---| | | | -| | | | prompt | |:| | entry |#fr| | / | |#ns| |ci | | | | -| | | |---------| |_| |---------------------------------|---| |---| |---| |---| | | | -| | |---------------------------------------------------------------------------| | | -| | | | -| | |---------------------------------------------------------------------------| | | -| | | message | | | -| | | |-----------------------------------------------------------------------| | | | -| | | | textbox | | | | -| | | |-----------------------------------------------------------------------| | | | -| | |---------------------------------------------------------------------------| | | -| | | | -| | |-----------------------------------------------------------------------------| | -| | | listview | | -| | | |------------------------------------------------------------------------] | | -| | | | element | | | -| | | | |-----------------| |------------------------------------------------] | | | -| | | | |element-icon | |element-text | | | | -| | | | |-----------------| |------------------------------------------------| | | | -| | | |------------------------------------------------------------------------] | | -| | |-----------------------------------------------------------------------------| | -| | | | -| | |---------------------------------------------------------------------------| | | -| | | mode-switcher {BOX:horizontal} | | | -| | | |---------------| |---------------| |--------------| |---------------| | | | -| | | | Button | | Button | | Button | | Button | | | | -| | | |---------------| |---------------| |--------------| |---------------| | | | -| | |---------------------------------------------------------------------------| | | -| |-------------------------------------------------------------------------------| | -|------------------------------------------------------------------------------------| +┌────────────────────────────────────────────────────────────────────────────────────┐ +│ window {BOX:vertical} │ +│ ┌───────────────────────────────────────────────────────────────────────────────┐ │ +│ │ mainbox {BOX:vertical} │ │ +│ │ ┌───────────────────────────────────────────────────────────────────────────┐ │ │ +│ │ │ inputbar {BOX:horizontal} │ │ │ +│ │ │ ┌─────────┐ ┌─┐ ┌───────────────────────────────┐ ┌───┐ ┌───┐ ┌───┐ ┌───┐ │ │ │ +│ │ │ │ prompt │ │:│ │ entry │ │#fr│ │ / │ │#ns│ │ci │ │ │ │ +│ │ │ └─────────┘ └─┘ └───────────────────────────────┘ └───┘ └───┘ └───┘ └───┘ │ │ │ +│ │ └───────────────────────────────────────────────────────────────────────────┘ │ │ +│ │ │ │ +│ │ ┌───────────────────────────────────────────────────────────────────────────┐ │ │ +│ │ │ message │ │ │ +│ │ │ ┌───────────────────────────────────────────────────────────────────────┐ │ │ │ +│ │ │ │ textbox │ │ │ │ +│ │ │ └───────────────────────────────────────────────────────────────────────┘ │ │ │ +│ │ └───────────────────────────────────────────────────────────────────────────┘ │ │ +│ │ │ │ +│ │ ┌───────────────────────────────────────────────────────────────────────────┐ │ │ +│ │ │ listview │ │ │ +│ │ │ ┌─────────────────────────────────────────────────────────────────────┐ │ │ │ +│ │ │ │ element │ │ │ │ +│ │ │ │ ┌─────────────────┐ ┌─────────────────────────────────────────────┐ │ │ │ │ +│ │ │ │ │element─icon │ │element─text │ │ │ │ │ +│ │ │ │ └─────────────────┘ └─────────────────────────────────────────────┘ │ │ │ │ +│ │ │ └─────────────────────────────────────────────────────────────────────┘ │ │ │ +│ │ └───────────────────────────────────────────────────────────────────────────┘ │ │ +│ │ │ │ +│ │ ┌───────────────────────────────────────────────────────────────────────────┐ │ │ +│ │ │ mode─switcher {BOX:horizontal} │ │ │ +│ │ │ ┌───────────────┐ ┌───────────────┐ ┌──────────────┐ ┌───────────────┐ │ │ │ +│ │ │ │ Button │ │ Button │ │ Button │ │ Button │ │ │ │ +│ │ │ └───────────────┘ └───────────────┘ └──────────────┘ └───────────────┘ │ │ │ +│ │ └───────────────────────────────────────────────────────────────────────────┘ │ │ +│ └───────────────────────────────────────────────────────────────────────────────┘ │ +└────────────────────────────────────────────────────────────────────────────────────┘ ``` @@ -896,16 +897,15 @@ The current layout of **rofi** is structured as follows: ### Error message structure ``` -|-----------------------------------------------------------------------------------| -| window {BOX:vertical} | -| |------------------------------------------------------------------------------| | -| | error-message {BOX:vertical} | | -| | |-------------------------------------------------------------------------| | | -| | | textbox | | | -| | |-------------------------------------------------------------------------| | | -| |------------------------------------------------------------------------------| | -|-----------------------------------------------------------------------------------| - +┌──────────────────────────────────────────────────────────────────────────────────┐ +│ window {BOX:vertical} │ +│ ┌─────────────────────────────────────────────────────────────────────────────┐ │ +│ │ error─message {BOX:vertical} │ │ +│ │ ┌────────────────────────────────────────────────────────────────────────┐ │ │ +│ │ │ textbox │ │ │ +│ │ └────────────────────────────────────────────────────────────────────────┘ │ │ +│ └─────────────────────────────────────────────────────────────────────────────┘ │ +└──────────────────────────────────────────────────────────────────────────────────┘ ``` @@ -1049,18 +1049,18 @@ element selected { Just like CSS, **rofi** uses the box model for each widget. ``` -|-------------------------------------------------------------------| -| margin | -| |-------------------------------------------------------------| | -| | border | | -| | |---------------------------------------------------------| | | -| | | padding | | | -| | | |-----------------------------------------------------| | | | -| | | | content | | | | -| | | |-----------------------------------------------------| | | | -| | |---------------------------------------------------------| | | -| |-------------------------------------------------------------| | -|-------------------------------------------------------------------| +┌──────────────────────────────────────────────────────────────────┐ +│ margin │ +│ ┌────────────────────────────────────────────────────────────┐ │ +│ │ border │ │ +│ │ ┌────────────────────────────────────────────────────────┐ │ │ +│ │ │ padding │ │ │ +│ │ │ ┌────────────────────────────────────────────────────┐ │ │ │ +│ │ │ │ content │ │ │ │ +│ │ │ └────────────────────────────────────────────────────┘ │ │ │ +│ │ └────────────────────────────────────────────────────────┘ │ │ +│ └────────────────────────────────────────────────────────────┘ │ +└──────────────────────────────────────────────────────────────────┘ ``` Explanation of the different parts: @@ -1084,15 +1084,15 @@ Widgets that can pack more then one child widget (currently box and listview) ha This property sets the distance between the packed widgets (both horizontally and vertically). ``` -|---------------------------------------| -| |--------| s |--------| s |-------| | -| | child | p | child | p | child | | -| | | a | | a | | | -| | | c | | c | | | -| | | i | | i | | | -| | | n | | n | | | -| |--------| g |--------| g |-------| | -|---------------------------------------| +┌───────────────────────────────────────┐ +│ ┌────────┐ s ┌────────┐ s ┌────────┐ │ +│ │ child │ p │ child │ p │ child │ │ +│ │ │ a │ │ a │ │ │ +│ │ │ c │ │ c │ │ │ +│ │ │ i │ │ i │ │ │ +│ │ │ n │ │ n │ │ │ +│ └────────┘ g └────────┘ g └────────┘ │ +└───────────────────────────────────────┘ ``` ### Advanced box packing @@ -1100,15 +1100,15 @@ This property sets the distance between the packed widgets (both horizontally an More dynamic spacing can be achieved by adding dummy widgets, for example to make one widget centered: ``` -|----------------------------------------------------| -| |---------------| |--------| |---------------| | -| | dummy | | child | | dummy | | -| | expand: true; | | | | expand: true; | | -| | | | | | | | -| | | | | | | | -| | | | | | | | -| |---------------| |--------| |---------------| | -|----------------------------------------------------| +┌────────────────────────────────────────────────────┐ +│ ┌───────────────┐ ┌────────┐ ┌───────────────┐ │ +│ │ dummy │ │ child │ │ dummy │ │ +│ │ expand: true; │ │ │ │ expand: true; │ │ +│ │ │ │ │ │ │ │ +│ │ │ │ │ │ │ │ +│ │ │ │ │ │ │ │ +│ └───────────────┘ └────────┘ └───────────────┘ │ +└────────────────────────────────────────────────────┘ ``` If both dummy widgets are set to expand, `child` will be centered. Depending on the `expand` flag of child the |