[Question]
  [
In this challenge, we render Ascii user interfaces.
```
+----------------------+
|+-----------++-------+|
||<- Previous||Next ->||
|+-----------++-------+|
|== The title ==       |
|                      |
|Lorem ipsum dolor     |
|sit amet...           |
|+--------------+      |
||Post a comment|      |
|+--------------+      |
|+-----------------+   |
||User X commented:|   |
||                 |   |
||This is amazing! |   |
|+-----------------+   |
|+-----------------+   |
||User Y commented:|   |
||                 |   |
||lol              |   |
|+-----------------+   |
+----------------------+
```
Each drawing like this is made of one *element*, which can contain subelements. The possible elements are listed below:
1. Text element. Contains one or more lines of text.
2. Box element. Contains one subelement that is surrounded with borders. The borders have `+`s at the corners and `-`s and `|` at the edges.
3. Horizontal list. Contains one or more elements that are aligned horizontally.
4. Vertical list. Contains one or more elements that are aligned over each other vertically and to left horizontally.
Every element is a rectangle.
Each element, in addition to its content, has a property called *baseline*. The baseline is used to align the elements vertically: every element of a horizontal list is aligned such that their baselines are on the same line. In the example below, the baseline contain characters `aeg`. The baselines of the three box elements are (0-indexed) `1`, `3` and `2`.
```
   +-+   
   |c|+-+
+-+|d||f|
|a||e||g|
|b|+-+|h|
+-+   +-+
```
The baselines are determined with the following rules:
1. For text elements, the first line of text is the baseline, ie. `0`.
2. For box elements, the baseline is 1 + the baseline of the subelement.
3. For horizontal lists, the baseline is the maximum baseline in the list (`3` in the example above).
4. For vertical lists, the baseline is the baseline of an element, which must be specified in the input.
## Input
The input is a specification of an interface in some format (eg. lists, json). The example inputs have the following format:
1. A string element is a string: `"..."`
2. A box element is a list thats first element is `"b"`: `["b", subelement]`
3. A horizontal list is a list thats first element is `"h"`: `["h", items...]`
4. A vertical list is a list thats first element is `"v"` and the second element is the (0-indexed) number of the element thats baseline is used: `["v", n, items...]`
## Output
The output must contain the elements aligned using the rules I specified above. The output can be stdout, a list of strings or anything else meaningful.
## Scoring
This is [code-golf](/questions/tagged/code-golf "show questions tagged 'code-golf'"), the usual rules apply.
## Test cases
1
```
["b", ["v", 0, ["h", ["b", "<- Previous"], ["b", "Next ->"]], "== The title ==\n\nLorem ipsum dolor\nsit amet...", ["b", "Post a comment"], ["b", "User X commented:\n\nThis is amazing!"], ["b", "User Y commented:\n\nlol"]]]
+----------------------+
|+-----------++-------+|
||<- Previous||Next ->||
|+-----------++-------+|
|== The title ==       |
|                      |
|Lorem ipsum dolor     |
|sit amet...           |
|+--------------+      |
||Post a comment|      |
|+--------------+      |
|+-----------------+   |
||User X commented:|   |
||                 |   |
||This is amazing! |   |
|+-----------------+   |
|+-----------------+   |
||User Y commented:|   |
||                 |   |
||lol              |   |
|+-----------------+   |
+----------------------+
```
2
```
["h", ["b", ["v", 0, "a", "b"]], ["b", ["v", 2, "c", "d", "e"]], ["b", ["v", 1, "f", "g", "h"]]]
   +-+   
   |c|+-+
+-+|d||f|
|a||e||g|
|b|+-+|h|
+-+   +-+
```
3
```
["h", ["b", ["v", 0, ["b", ["h", "a\nb", "c"]], "d", "e", ["h", ["h", "f"], ["b", ["h", "g"]], "h"]]], ["b", "ijk\nl\nmn\no"], ["v", 2, ["b", "pqrst"], ["b", "uv\nw"], ["b", "x"]], ["b", ["b", ["b", "yz"]]]]
            +-----+        
            |pqrst|        
            +-----+        
            +--+           
            |uv|           
            |w |   +------+
+-----+     +--+   |+----+|
|+--+ |+---++-+    ||+--+||
||ac| ||ijk||x|    |||yz|||
||b | ||l  |+-+    ||+--+||
|+--+ ||mn |       |+----+|
|d    ||o  |       +------+
|e    |+---+               
| +-+ |                    
|f|g|h|                    
| +-+ |                    
+-----+                    
```
4
```
["h", "a * b = ", ["v", 0, "a + a + ... + a", "\\_____________/", "    b times"]]
a * b = a + a + ... + a
        \_____________/
            b times    
```
  
[Answer]
# [Python 3](https://docs.python.org/3/index.html), 721 694 693 671 661 bytes
**Edit:** Saved 27 bytes due to [@Arnold Palmer](https://codegolf.stackexchange.com/users/72137/arnold-palmer) and [@Step Hen](https://codegolf.stackexchange.com/users/65836/step-hen)
**Edit:** Saved 1 byte
**Edit:** Saved 22 bytes thanks to [@Arnold Palmer](https://codegolf.stackexchange.com/users/72137/arnold-palmer)
**Edit:** Saved 10 bytes
This could probably be golfed quite a bit
```
L,M,R,e=len,max,range,lambda t:([list(r)+[" "]*(M(map(L,t.split("\n")))-L(r))for r in t.split("\n")],0)if str==type(t)else b(t)if"h">t[0]else h(t)if"v">t[0]else v(t);F=lambda t:"\n".join(map("".join,e(t)[0]))
def h(t):
	t=[e(r)for r in t[1:]];Z=M(s[1]for s in t);X=M(L(s[0])-s[1]for s in t)+Z;u=[[]for i in R(X)]
	for a,b in t:u=[u[j]+[Z-b<=j<L(a)+Z-b and a[j-Z+b][i]or" "for i in R(L(a[0]))]for j in R(X)]
	return u,Z
def b(t):t,b=e(t[1]);u=[["+",*"-"*L(t[0]),"+"]];return u+[["|"]+r+["|"]for r in t]+u,1+b
def v(t):w=[e(r)for r in t[2:]];return[a[i]+[" "]*(M(L(a[0])for a,d in w)-L(a[i]))for a,c in w for i in R(L(a))],sum(L(x[0])for x in w[:t[1]])+w[t[1]][1]
```
[Try it online](https://tio.run/##dVTRbtowFH0uX@H5KSYOg@4tNNWe@kSnquqkDseaHDBgljhZ7ACt@u/s2gQIVIuUxD733ON7bq5SvdlVqb/t9xP6SJ@pTHKpaSF2tBZ6KWkuimwukI0Dlitjg5qEDCPM@8FjUIgqmFA7MFWubIBTjQkh0QQ4ZFHWqEZKo4sop0OiFsjYOknsWyUDS2RuJMpgoRZ4he8tG3IPrQ7QpgNtABo/JKeKnORgXSrtC8GHNXWikEFIby4XXibu3diESSjrXBUbxZyPp8ljYNiIO9x4nIxfAZsAChLRVSycjpuEMQ8pBz0Hr4T3btxe0MyTYmA0bM1DNo2yu2R9NwkEJEYZEnqOBFtH0zDjTPGyhjZ2lIDny/bq6456LW1Ta9TQqXfkehVbmiVgFMojviQcYtrHEe5PAtcuQgEAf8fUEBgfmId16N/nNvCwoaMw88KuvfH2U6Nu45MQE1D3@fO3FR/czx17676@I5EWnXkUXdoEj9Q0BSx3x/yd57HYOeIk3DK/gHsvd6KocmlQgsBEhiliMBQUDd1i5bcOxHcReqrlRpWNwfyE/pA7i6J76AVskgS9rCSyyuYSJUmqUz0pa1kgVUE5aF7mZZ1qoywShbSDweCs/lQaQNGsLAqpbeeAn0bW6PUYkPPYqb6sFEyMARnxrvTyyzX/1xU/L3OokNOuoZNLLFxe5i10Q7eAzlxo7h7yU3wE6MKFlu6x@v8Bx60LYZFqX@fs0LJW@9xrT1pgfpW2PNAPpxy9qvUf8JbqAiyWh5S28JZQ/a1Nt5nNJtXbzn53Yer8xG/v7qCjHyxQH2UwIJdtQyFyN3xHt3K8NP3dvb46DMGVwUwU0jjNXs@NYzt0biiP8wc/kapW2gYPQQvBH6aF8HfcHw2HpLf/Bw)
]