quarkdown/mock/stacks.qd at main · iamgio/quarkdown · GitHub

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
# Layout stacks

Here positioning techniques will be used: rows, columns, grids and containers.

.row alignment:{center}
	A

	B

	C

	D

---

.row alignment:{spacearound}
	A

	B

	C

	D

---

.column
	A

	B

	C

---

.grid columns:{3}
	A

	B

	C

	D

	E

	F

<<<

.row alignment:{spacearound}
	.row
		Left

		##! Title

		Right

	---

	.column cross:{start}
		Top

		##! Title

		Bottom

---

.row alignment:{spacebetween} gap:{1cm}
	.container
		##! Container 1

		.loremipsum

	.container
		##! Container 2

		.loremipsum

---

<<<

.grid columns:{2} gap:{1cm}
	.repeat {4}
		.container
			##! Container .1

			.loremipsum

---

<<<

.var {skyimg}
	![Sky](images/sky.jpg)

.grid columns:{2} gap:{1cm}
	.column
		##! Some nice clouds!

		.row gap:{1cm}
			A

			B

			C

	.repeat {2}
		.skyimg

	.container
		There it is. In nature, dead trees are just as normal as live trees. Just a happy little shadow that lives in there. If you didn't have baby clouds, you wouldn't have big clouds.

		---

		That's it.

	.whitespace

	.clip {circle}
		.skyimg