drawio_dsl 0.5.4 → 0.5.5

Sign up to get free protection for your applications and to get access to all the features.
checksums.yaml CHANGED
@@ -1,7 +1,7 @@
1
1
  ---
2
2
  SHA256:
3
- metadata.gz: 2d6fffe48aaf84daa93f524d7cdd7076086aefd2ba002d3eb3f467abf9969c6c
4
- data.tar.gz: 8bc996b2641cf14da1265e0be9bea906d576b6896e550696ce41b5e616c7bfb1
3
+ metadata.gz: 60804927795dfee66047328d57be2b2fbdb924622652f30551df7e89ec041ad1
4
+ data.tar.gz: d65e52b32cf6addeca5a34ab932ea8514b79a6c0d5ae0de937fe61039c8099aa
5
5
  SHA512:
6
- metadata.gz: b044bb993eb97fd0e75219d8360165992e117000856b12faeb1e57090f6b92d0b1aa81f5b34417ee5ebe957da4f3460fd6e754d484706f958c1f7380b99e38f5
7
- data.tar.gz: 7aba17264073ae548906a11e388932f626bd32ef2fcfe054b3fd20019019c8e77422601c9746ff18ae6239c0ea9cc9ed6d99590c77d8a3e05a9ff5c226be99df
6
+ metadata.gz: 7a7a8ac91696f596df2c25efa00ff308a7cd601bd7a5a40fb4de090538a96cf741d639b52e0f5e195140e10c0e107780b9c50323e1625ad4f64c3bc63f9becaa
7
+ data.tar.gz: 999205f96a80dff96d0d4645c921392e8a49a65bc25e1cbcd7950bb4c772f1fe636e42309be5bbf01ff484312c346985a78715aa53ccbc795b3e871896af9f93
@@ -1,8 +1,7 @@
1
1
  KManager.action :todo_drawio_dsl do
2
2
  action do
3
3
 
4
- # :rounded, :shadow, :sketch, :glass
5
- director = DrawioDsl::Drawio
4
+ DrawioDsl::Drawio
6
5
  .init(k_builder, on_exist: :write, on_action: :execute)
7
6
  .diagram(rounded: 1, glass: 1)
8
7
  .page('In progress', theme: :style_03, margin_left: 0, margin_top: 0) do
@@ -42,15 +41,17 @@ KManager.action :todo_drawio_dsl do
42
41
 
43
42
  grid_layout(y:90, direction: :horizontal, grid_h: 80, grid_w: 320, wrap_at: 3, grid: 0)
44
43
 
45
- square(w: 300, h: 60, title: 'add save as .drawio')
44
+ square(w: 300, h: 60, title: 'write samples into docs folder and display in readme')
45
+ square(w: 300, h: 60, title: 'add export as .PNG, needs to take a page number as the PNG will not support multiple pages')
46
46
  square(w: 300, h: 60, title: 'add export as .SVG, needs to take a page number as the SVG will not support multiple pages')
47
+ square(w: 300, h: 60, title: 'add save as .drawio')
47
48
 
48
49
  end
49
50
  .cd(:spec)
50
51
  .save('project-plans/drawio_dsl.drawio')
51
52
  .cd(:docs)
52
- .export_svg('project_in_progress.svg', page: 1)
53
- .export_svg('project_todo.svg' , page: 2)
54
- .export_svg('project_done.svg' , page: 3)
53
+ .export_svg('project_in_progress', page: 1)
54
+ .export_svg('project_todo' , page: 2)
55
+ .export_svg('project_done' , page: 3)
55
56
  end
56
57
  end
@@ -1,7 +1,7 @@
1
1
  KManager.action :bootstrap do
2
2
  action do
3
- director = DrawioDsl::Drawio
4
- .init(k_builder)
3
+ DrawioDsl::Drawio
4
+ .init(k_builder, on_exist: :write, on_action: :execute)
5
5
  .diagram(theme: :style_01)
6
6
  .page('PgMargin-default') do
7
7
  grid_layout(wrap_at: 4)
@@ -36,11 +36,7 @@ KManager.action :bootstrap do
36
36
  square
37
37
  circle
38
38
  end
39
-
40
- diagram = DrawioDsl::XmlBuilder.new(director.builder.diagram)
41
-
42
-
43
- File.write('../spec/.samples/drawio/10-page-margin.xml', diagram.build)
44
- File.write('../spec/.samples/drawio/10-page-margin.drawio', diagram.build)
39
+ .cd(:spec)
40
+ .save('.samples/10-page-margin.drawio')
45
41
  end
46
42
  end
@@ -8,11 +8,12 @@ KManager.action :bootstrap do
8
8
  # KConfig.configuration.drawio.rectangle.w = KConfig.configuration.drawio.rectangle.w / 4
9
9
  # KConfig.configuration.drawio.rectangle.h = KConfig.configuration.drawio.rectangle.h / 4
10
10
 
11
- director = DrawioDsl::Drawio
12
- .init(k_builder)
11
+ DrawioDsl::Drawio
12
+ .init(k_builder, on_exist: :write, on_action: :execute)
13
13
  .diagram(theme: :style_01)
14
14
  .page('Horizontal', margin_left: 0, margin_top: 0) do
15
15
  grid_layout(wrap_at: 3, direction: :horizontal)
16
+ h4(title: 'Horizontal')
16
17
  circle(title: '01')
17
18
  square(title: '02')
18
19
  circle(title: '03')
@@ -23,6 +24,7 @@ KManager.action :bootstrap do
23
24
  end
24
25
  .page('Vertical', margin_left: 0, margin_top: 0) do
25
26
  grid_layout(wrap_at: 3, direction: :vertical)
27
+ h4(title: 'Vertical')
26
28
  circle(title: '01')
27
29
  square(title: '02')
28
30
  circle(title: '03')
@@ -31,10 +33,10 @@ KManager.action :bootstrap do
31
33
  square(title: '06')
32
34
  circle(title: '07')
33
35
  end
34
-
35
- diagram = DrawioDsl::XmlBuilder.new(director.builder.diagram)
36
-
37
- File.write('../spec/.samples/drawio/15-grid-direction.xml', diagram.build)
38
- File.write('../spec/.samples/drawio/15-grid-direction.drawio', diagram.build)
36
+ .cd(:spec)
37
+ .save('.samples/15-grid-direction.drawio')
38
+ .cd(:docs)
39
+ .export_svg('samples/grid-direction-horizontal', page: 1)
40
+ .export_svg('samples/grid-direction-vertical', page: 2)
39
41
  end
40
42
  end
@@ -9,10 +9,7 @@ KManager.action :bootstrap do
9
9
  # KConfig.configuration.drawio.rectangle.h = KConfig.configuration.drawio.rectangle.h / 4
10
10
 
11
11
  director = DrawioDsl::Drawio
12
- .init(k_builder,
13
- on_exist: :skip, # %i[skip write compare]
14
- on_action: :queue # %i[queue execute]
15
- )
12
+ .init(k_builder, on_exist: :write, on_action: :execute)
16
13
  .diagram(theme: :style_01)
17
14
  .page('Grid-Center', margin_left: 0, margin_top: 0) do
18
15
  grid_layout(wrap_at: 3)
@@ -64,10 +61,10 @@ KManager.action :bootstrap do
64
61
  square
65
62
  circle
66
63
  end
67
-
68
- diagram = DrawioDsl::XmlBuilder.new(director.builder.diagram)
69
-
70
- File.write('../spec/.samples/drawio/16-grid-alignment.xml', diagram.build)
71
- File.write('../spec/.samples/drawio/16-grid-alignment.drawio', diagram.build)
64
+ .cd(:spec)
65
+ .save('.samples/16-grid-alignment.drawio')
66
+ .cd(:docs)
67
+ # note: there is no difference between center and top/bottom/left/right using SVG/PNG
68
+ .export_svg('samples/grid-alignment', page: 1)
72
69
  end
73
70
  end
@@ -3,62 +3,60 @@ KManager.action :bootstrap do
3
3
 
4
4
  # :rounded, :shadow, :sketch, :glass
5
5
  director = DrawioDsl::Drawio
6
- .init(k_builder)
6
+ .init(k_builder, on_exist: :write, on_action: :execute)
7
7
  .diagram(theme: :style_06)
8
8
  .page('Style-Plain', margin_left: 0, margin_top: 0) do
9
- grid_layout(wrap_at: 4)
10
- circle
11
- square
12
- circle
13
- square
14
- circle
15
- square
16
- circle
9
+ grid_layout(wrap_at: 5)
10
+
11
+ KConfig.configuration.drawio.shapes.members.each do |shape|
12
+ next if shape == :shape
13
+
14
+ send(shape, title: shape.to_s, shape: shape)
15
+ end
17
16
  end
18
17
  .page('Style-Shadow', shadow: 1, margin_left: 0, margin_top: 0) do
19
- grid_layout(wrap_at: 4)
20
- circle
21
- square
22
- circle
23
- square
24
- circle
25
- square
26
- circle
18
+ grid_layout(wrap_at: 5)
19
+
20
+ KConfig.configuration.drawio.shapes.members.each do |shape|
21
+ next if shape == :shape
22
+
23
+ send(shape, title: shape.to_s, shape: shape)
24
+ end
27
25
  end
28
26
  .page('Style-Rounded', rounded: 1, margin_left: 0, margin_top: 0) do
29
- grid_layout(wrap_at: 4)
30
- circle
31
- square
32
- circle
33
- square
34
- circle
35
- square
36
- circle
27
+ grid_layout(wrap_at: 5)
28
+
29
+ KConfig.configuration.drawio.shapes.members.each do |shape|
30
+ next if shape == :shape
31
+
32
+ send(shape, title: shape.to_s, shape: shape)
33
+ end
37
34
  end
38
35
  .page('Style-Glass', glass: 1, margin_left: 0, margin_top: 0) do
39
- grid_layout(wrap_at: 4)
40
- circle
41
- square
42
- circle
43
- square
44
- circle
45
- square
46
- circle
36
+ grid_layout(wrap_at: 5)
37
+
38
+ KConfig.configuration.drawio.shapes.members.each do |shape|
39
+ next if shape == :shape
40
+
41
+ send(shape, title: shape.to_s, shape: shape)
42
+ end
47
43
  end
48
44
  .page('Style-Sketch', sketch: 1, margin_left: 0, margin_top: 0) do
49
- grid_layout(wrap_at: 4)
50
- circle
51
- square
52
- circle
53
- square
54
- circle
55
- square
56
- circle
57
- end
45
+ grid_layout(wrap_at: 5)
58
46
 
59
- diagram = DrawioDsl::XmlBuilder.new(director.builder.diagram)
47
+ KConfig.configuration.drawio.shapes.members.each do |shape|
48
+ next if shape == :shape
60
49
 
61
- File.write('../spec/.samples/drawio/20-styles.xml', diagram.build)
62
- File.write('../spec/.samples/drawio/20-styles.drawio', diagram.build)
50
+ send(shape, title: shape.to_s, shape: shape)
51
+ end
52
+ end
53
+ .cd(:spec)
54
+ .save('.samples/20-styles.drawio')
55
+ .cd(:docs)
56
+ .export_svg('samples/styles-plain', page: 1)
57
+ .export_svg('samples/styles-shadow', page: 2)
58
+ .export_svg('samples/styles-rounded', page: 3)
59
+ .export_svg('samples/styles-glass', page: 4)
60
+ .export_svg('samples/styles-sketch', page: 5)
63
61
  end
64
62
  end
@@ -2,23 +2,36 @@ KManager.action :bootstrap do
2
2
  action do
3
3
 
4
4
  # :rounded, :shadow, :sketch, :glass
5
- director = DrawioDsl::Drawio
6
- .init(k_builder)
5
+ DrawioDsl::Drawio
6
+ .init(k_builder, on_exist: :write, on_action: :execute)
7
7
  .diagram(theme: :style_06)
8
8
  .page('Style-Plain', margin_left: 0, margin_top: 0, rounded: 1, background: '#FFEADB') do
9
9
  grid_layout(wrap_at: 8)
10
10
 
11
- square(title: 'The quick brown fox jumps over the lazy dog')
12
- circle(title: 'Mary had a little lamb')
11
+ KConfig.configuration.drawio.themes.keys.each do |theme|
12
+ square(title: theme.to_s, theme: theme)
13
+ end
14
+ end
15
+ .page('Style-Plain', margin_left: 0, margin_top: 0, rounded: 1, background: '#FFEADB') do
16
+ grid_layout(wrap_at: 8)
13
17
 
14
18
  KConfig.configuration.drawio.themes.keys.each do |theme|
15
- random(title: theme.to_s, theme: theme)
19
+ circle(title: theme.to_s, theme: theme)
16
20
  end
17
21
  end
22
+ .page('Style-Plain', margin_left: 0, margin_top: 0, rounded: 1, background: '#FFEADB') do
23
+ grid_layout(wrap_at: 8)
18
24
 
19
- diagram = DrawioDsl::XmlBuilder.new(director.builder.diagram)
25
+ KConfig.configuration.drawio.themes.keys.each do |theme|
26
+ random(title: theme.to_s, theme: theme)
27
+ end
28
+ end
29
+ .cd(:spec)
30
+ .save('.samples/25-themes.drawio')
31
+ .cd(:docs)
32
+ .export_svg('samples/themes-square', page: 1)
33
+ .export_svg('samples/themes-circle', page: 2)
34
+ .export_svg('samples/themes-random', page: 3)
20
35
 
21
- File.write('../spec/.samples/drawio/25-themes.xml', diagram.build)
22
- File.write('../spec/.samples/drawio/25-themes.drawio', diagram.build)
23
36
  end
24
37
  end
@@ -3,7 +3,7 @@ KManager.action :bootstrap do
3
3
 
4
4
  # :rounded, :shadow, :sketch, :glass
5
5
  director = DrawioDsl::Drawio
6
- .init(k_builder)
6
+ .init(k_builder, on_exist: :write, on_action: :execute)
7
7
  .diagram(theme: :style_03)
8
8
  .page('Shapes', margin_left: 0, margin_top: 0, rounded: 1) do
9
9
  grid_layout(direction: :vertical, grid_h: 120, grid_w: 400, wrap_at: 10, grid: 0)
@@ -43,10 +43,9 @@ KManager.action :bootstrap do
43
43
  square(theme: :style_02, w: 240, h: 140, title: '10. TAKE ACTION: Once a decision is made as to the action that should happen in respect of the breach the council can then decide as to what the appropriate action is: WARNING, CIVIL, CRIMINAL and then proceed from there => it is important to keep the complainant informed throughout the entire process to be able to explain why you have taken the course you've taken and to be able to justify it')
44
44
 
45
45
  end
46
-
47
- diagram = DrawioDsl::XmlBuilder.new(director.builder.diagram)
48
-
49
- File.write('../spec/.samples/drawio/50-willoughby-council.xml', diagram.build)
50
- File.write('../spec/.samples/drawio/50-willoughby-council.drawio', diagram.build)
46
+ .cd(:spec)
47
+ .save('.samples/50-willoughby-council.drawio')
48
+ .cd(:docs)
49
+ .export_svg('samples/willoughby-council', page: 1)
51
50
  end
52
51
  end
data/CHANGELOG.md CHANGED
@@ -1,3 +1,11 @@
1
+ ## [0.5.4](https://github.com/klueless-io/drawio_dsl/compare/v0.5.3...v0.5.4) (2022-03-08)
2
+
3
+
4
+ ### Bug Fixes
5
+
6
+ * add generated project plan ([fa36f25](https://github.com/klueless-io/drawio_dsl/commit/fa36f25ff6f6d137ed3b1a3b141097305d4b6c19))
7
+ * add generated project plan ([7faf9b0](https://github.com/klueless-io/drawio_dsl/commit/7faf9b03da5b1aaf8461c73eb375b506aca05124))
8
+
1
9
  ## [0.5.3](https://github.com/klueless-io/drawio_dsl/compare/v0.5.2...v0.5.3) (2022-03-08)
2
10
 
3
11
 
data/README.md CHANGED
@@ -32,15 +32,16 @@ gem install drawio_dsl
32
32
 
33
33
  As a Developer, I to use natural language to build diagrams quickly, so that I can create visual documentation
34
34
 
35
- See all [stories](./STORIES.md)
35
+ See [project plan](./docs/project-plan.md)
36
36
 
37
+ ## Samples
38
+
39
+ See all [samples](./docs/samples/samples.md)
37
40
 
38
41
  ## Usage
39
42
 
40
43
  See all [usage examples](./USAGE.md)
41
44
 
42
-
43
-
44
45
  ## Development
45
46
 
46
47
  Checkout the repo
@@ -1,3 +1,3 @@
1
1
  <?xml version="1.0" encoding="UTF-8"?>
2
2
  <!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">
3
- <svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" version="1.1" width="742px" height="122px" viewBox="-0.5 -0.5 742 122"><defs><linearGradient x1="0%" y1="0%" x2="0%" y2="100%" id="mx-gradient-ffffff-0.9-ffffff-0.1-s-0"><stop offset="0%" style="stop-color: rgb(255, 255, 255); stop-opacity: 0.9;"/><stop offset="100%" style="stop-color: rgb(255, 255, 255); stop-opacity: 0.1;"/></linearGradient></defs><g><rect x="290" y="0" width="400" height="80" rx="12" ry="12" fill="none" stroke="none" pointer-events="all"/><g transform="translate(-0.5 -0.5)"><switch><foreignObject pointer-events="none" width="100%" height="100%" requiredFeatures="http://www.w3.org/TR/SVG11/feature#Extensibility" style="overflow: visible; text-align: left;"><div xmlns="http://www.w3.org/1999/xhtml" style="display: flex; align-items: unsafe flex-start; justify-content: unsafe flex-start; width: 398px; height: 1px; padding-top: 7px; margin-left: 292px;"><div data-drawio-colors="color: #333333; " style="box-sizing: border-box; font-size: 0px; text-align: left;"><div style="display: inline-block; font-size: 28px; font-family: Helvetica; color: rgb(51, 51, 51); line-height: 1.2; pointer-events: all; font-weight: bold; white-space: normal; overflow-wrap: normal;">DrawIO DSL</div></div></div></foreignObject><text x="292" y="35" fill="#333333" font-family="Helvetica" font-size="28px" font-weight="bold">DrawIO DSL</text></switch></g><rect x="340" y="40" width="400" height="80" rx="12" ry="12" fill="none" stroke="none" pointer-events="all"/><g transform="translate(-0.5 -0.5)"><switch><foreignObject pointer-events="none" width="100%" height="100%" requiredFeatures="http://www.w3.org/TR/SVG11/feature#Extensibility" style="overflow: visible; text-align: left;"><div xmlns="http://www.w3.org/1999/xhtml" style="display: flex; align-items: unsafe flex-start; justify-content: unsafe flex-start; width: 398px; height: 1px; padding-top: 47px; margin-left: 342px;"><div data-drawio-colors="color: #333333; " style="box-sizing: border-box; font-size: 0px; text-align: left;"><div style="display: inline-block; font-size: 16px; font-family: Helvetica; color: rgb(51, 51, 51); line-height: 1.2; pointer-events: all; font-weight: bold; white-space: normal; overflow-wrap: normal;">Done</div></div></div></foreignObject><text x="342" y="63" fill="#333333" font-family="Helvetica" font-size="16px" font-weight="bold">Done</text></switch></g><rect x="0" y="10" width="300" height="60" rx="9" ry="9" fill="#f8cecc" stroke="#b85450" pointer-events="all"/><path d="M 10.15 9 Q -1 9 -1 20.15 L -1 34 Q 150 52 301 34 L 301 20.15 Q 301 9 289.85 9 Z" fill="url(#mx-gradient-ffffff-0.9-ffffff-0.1-s-0)" stroke="none" pointer-events="all"/><g transform="translate(-0.5 -0.5)"><switch><foreignObject pointer-events="none" width="100%" height="100%" requiredFeatures="http://www.w3.org/TR/SVG11/feature#Extensibility" style="overflow: visible; text-align: left;"><div xmlns="http://www.w3.org/1999/xhtml" style="display: flex; align-items: unsafe center; justify-content: unsafe center; width: 298px; height: 1px; padding-top: 40px; margin-left: 1px;"><div data-drawio-colors="color: #333333; " style="box-sizing: border-box; font-size: 0px; text-align: center;"><div style="display: inline-block; font-size: 12px; font-family: Helvetica; color: rgb(51, 51, 51); line-height: 1.2; pointer-events: all; white-space: normal; overflow-wrap: normal;">add save as .drawio</div></div></div></foreignObject><text x="150" y="44" fill="#333333" font-family="Helvetica" font-size="12px" text-anchor="middle">add save as .drawio</text></switch></g><rect x="320" y="10" width="300" height="60" rx="9" ry="9" fill="#f8cecc" stroke="#b85450" pointer-events="all"/><path d="M 330.15 9 Q 319 9 319 20.15 L 319 34 Q 470 52 621 34 L 621 20.15 Q 621 9 609.85 9 Z" fill="url(#mx-gradient-ffffff-0.9-ffffff-0.1-s-0)" stroke="none" pointer-events="all"/><g transform="translate(-0.5 -0.5)"><switch><foreignObject pointer-events="none" width="100%" height="100%" requiredFeatures="http://www.w3.org/TR/SVG11/feature#Extensibility" style="overflow: visible; text-align: left;"><div xmlns="http://www.w3.org/1999/xhtml" style="display: flex; align-items: unsafe center; justify-content: unsafe center; width: 298px; height: 1px; padding-top: 40px; margin-left: 321px;"><div data-drawio-colors="color: #333333; " style="box-sizing: border-box; font-size: 0px; text-align: center;"><div style="display: inline-block; font-size: 12px; font-family: Helvetica; color: rgb(51, 51, 51); line-height: 1.2; pointer-events: all; white-space: normal; overflow-wrap: normal;">add export as .SVG, needs to take a page number as the SVG will not support multiple pages</div></div></div></foreignObject><text x="470" y="44" fill="#333333" font-family="Helvetica" font-size="12px" text-anchor="middle">add export as .SVG, needs to take a page number as...</text></switch></g></g><switch><g requiredFeatures="http://www.w3.org/TR/SVG11/feature#Extensibility"/><a transform="translate(0,-5)" xlink:href="https://www.diagrams.net/doc/faq/svg-export-text-problems" target="_blank"><text text-anchor="middle" font-size="10px" x="50%" y="100%">Text is not SVG - cannot display</text></a></switch></svg>
3
+ <svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" version="1.1" width="942px" height="152px" viewBox="-0.5 -0.5 942 152"><defs><linearGradient x1="0%" y1="0%" x2="0%" y2="100%" id="mx-gradient-ffffff-0.9-ffffff-0.1-s-0"><stop offset="0%" style="stop-color: rgb(255, 255, 255); stop-opacity: 0.9;"/><stop offset="100%" style="stop-color: rgb(255, 255, 255); stop-opacity: 0.1;"/></linearGradient></defs><g><rect x="290" y="0" width="400" height="80" rx="12" ry="12" fill="none" stroke="none" pointer-events="all"/><g transform="translate(-0.5 -0.5)"><switch><foreignObject pointer-events="none" width="100%" height="100%" requiredFeatures="http://www.w3.org/TR/SVG11/feature#Extensibility" style="overflow: visible; text-align: left;"><div xmlns="http://www.w3.org/1999/xhtml" style="display: flex; align-items: unsafe flex-start; justify-content: unsafe flex-start; width: 398px; height: 1px; padding-top: 7px; margin-left: 292px;"><div data-drawio-colors="color: #333333; " style="box-sizing: border-box; font-size: 0px; text-align: left;"><div style="display: inline-block; font-size: 28px; font-family: Helvetica; color: rgb(51, 51, 51); line-height: 1.2; pointer-events: all; font-weight: bold; white-space: normal; overflow-wrap: normal;">DrawIO DSL</div></div></div></foreignObject><text x="292" y="35" fill="#333333" font-family="Helvetica" font-size="28px" font-weight="bold">DrawIO DSL</text></switch></g><rect x="340" y="40" width="400" height="80" rx="12" ry="12" fill="none" stroke="none" pointer-events="all"/><g transform="translate(-0.5 -0.5)"><switch><foreignObject pointer-events="none" width="100%" height="100%" requiredFeatures="http://www.w3.org/TR/SVG11/feature#Extensibility" style="overflow: visible; text-align: left;"><div xmlns="http://www.w3.org/1999/xhtml" style="display: flex; align-items: unsafe flex-start; justify-content: unsafe flex-start; width: 398px; height: 1px; padding-top: 47px; margin-left: 342px;"><div data-drawio-colors="color: #333333; " style="box-sizing: border-box; font-size: 0px; text-align: left;"><div style="display: inline-block; font-size: 16px; font-family: Helvetica; color: rgb(51, 51, 51); line-height: 1.2; pointer-events: all; font-weight: bold; white-space: normal; overflow-wrap: normal;">Done</div></div></div></foreignObject><text x="342" y="63" fill="#333333" font-family="Helvetica" font-size="16px" font-weight="bold">Done</text></switch></g><rect x="0" y="10" width="300" height="60" rx="9" ry="9" fill="#f8cecc" stroke="#b85450" pointer-events="all"/><path d="M 10.15 9 Q -1 9 -1 20.15 L -1 34 Q 150 52 301 34 L 301 20.15 Q 301 9 289.85 9 Z" fill="url(#mx-gradient-ffffff-0.9-ffffff-0.1-s-0)" stroke="none" pointer-events="all"/><g transform="translate(-0.5 -0.5)"><switch><foreignObject pointer-events="none" width="100%" height="100%" requiredFeatures="http://www.w3.org/TR/SVG11/feature#Extensibility" style="overflow: visible; text-align: left;"><div xmlns="http://www.w3.org/1999/xhtml" style="display: flex; align-items: unsafe center; justify-content: unsafe center; width: 298px; height: 1px; padding-top: 40px; margin-left: 1px;"><div data-drawio-colors="color: #333333; " style="box-sizing: border-box; font-size: 0px; text-align: center;"><div style="display: inline-block; font-size: 12px; font-family: Helvetica; color: rgb(51, 51, 51); line-height: 1.2; pointer-events: all; white-space: normal; overflow-wrap: normal;">write samples into docs folder and display in readme</div></div></div></foreignObject><text x="150" y="44" fill="#333333" font-family="Helvetica" font-size="12px" text-anchor="middle">write samples into docs folder and display in read...</text></switch></g><rect x="320" y="10" width="300" height="60" rx="9" ry="9" fill="#f8cecc" stroke="#b85450" pointer-events="all"/><path d="M 330.15 9 Q 319 9 319 20.15 L 319 34 Q 470 52 621 34 L 621 20.15 Q 621 9 609.85 9 Z" fill="url(#mx-gradient-ffffff-0.9-ffffff-0.1-s-0)" stroke="none" pointer-events="all"/><g transform="translate(-0.5 -0.5)"><switch><foreignObject pointer-events="none" width="100%" height="100%" requiredFeatures="http://www.w3.org/TR/SVG11/feature#Extensibility" style="overflow: visible; text-align: left;"><div xmlns="http://www.w3.org/1999/xhtml" style="display: flex; align-items: unsafe center; justify-content: unsafe center; width: 298px; height: 1px; padding-top: 40px; margin-left: 321px;"><div data-drawio-colors="color: #333333; " style="box-sizing: border-box; font-size: 0px; text-align: center;"><div style="display: inline-block; font-size: 12px; font-family: Helvetica; color: rgb(51, 51, 51); line-height: 1.2; pointer-events: all; white-space: normal; overflow-wrap: normal;">add export as .PNG, needs to take a page number as the PNG will not support multiple pages</div></div></div></foreignObject><text x="470" y="44" fill="#333333" font-family="Helvetica" font-size="12px" text-anchor="middle">add export as .PNG, needs to take a page number as...</text></switch></g><rect x="640" y="10" width="300" height="60" rx="9" ry="9" fill="#f8cecc" stroke="#b85450" pointer-events="all"/><path d="M 650.15 9 Q 639 9 639 20.15 L 639 34 Q 790 52 941 34 L 941 20.15 Q 941 9 929.85 9 Z" fill="url(#mx-gradient-ffffff-0.9-ffffff-0.1-s-0)" stroke="none" pointer-events="all"/><g transform="translate(-0.5 -0.5)"><switch><foreignObject pointer-events="none" width="100%" height="100%" requiredFeatures="http://www.w3.org/TR/SVG11/feature#Extensibility" style="overflow: visible; text-align: left;"><div xmlns="http://www.w3.org/1999/xhtml" style="display: flex; align-items: unsafe center; justify-content: unsafe center; width: 298px; height: 1px; padding-top: 40px; margin-left: 641px;"><div data-drawio-colors="color: #333333; " style="box-sizing: border-box; font-size: 0px; text-align: center;"><div style="display: inline-block; font-size: 12px; font-family: Helvetica; color: rgb(51, 51, 51); line-height: 1.2; pointer-events: all; white-space: normal; overflow-wrap: normal;">add export as .SVG, needs to take a page number as the SVG will not support multiple pages</div></div></div></foreignObject><text x="790" y="44" fill="#333333" font-family="Helvetica" font-size="12px" text-anchor="middle">add export as .SVG, needs to take a page number as...</text></switch></g><rect x="0" y="90" width="300" height="60" rx="9" ry="9" fill="#f8cecc" stroke="#b85450" pointer-events="all"/><path d="M 10.15 89 Q -1 89 -1 100.15 L -1 114 Q 150 132 301 114 L 301 100.15 Q 301 89 289.85 89 Z" fill="url(#mx-gradient-ffffff-0.9-ffffff-0.1-s-0)" stroke="none" pointer-events="all"/><g transform="translate(-0.5 -0.5)"><switch><foreignObject pointer-events="none" width="100%" height="100%" requiredFeatures="http://www.w3.org/TR/SVG11/feature#Extensibility" style="overflow: visible; text-align: left;"><div xmlns="http://www.w3.org/1999/xhtml" style="display: flex; align-items: unsafe center; justify-content: unsafe center; width: 298px; height: 1px; padding-top: 120px; margin-left: 1px;"><div data-drawio-colors="color: #333333; " style="box-sizing: border-box; font-size: 0px; text-align: center;"><div style="display: inline-block; font-size: 12px; font-family: Helvetica; color: rgb(51, 51, 51); line-height: 1.2; pointer-events: all; white-space: normal; overflow-wrap: normal;">add save as .drawio</div></div></div></foreignObject><text x="150" y="124" fill="#333333" font-family="Helvetica" font-size="12px" text-anchor="middle">add save as .drawio</text></switch></g></g><switch><g requiredFeatures="http://www.w3.org/TR/SVG11/feature#Extensibility"/><a transform="translate(0,-5)" xlink:href="https://www.diagrams.net/doc/faq/svg-export-text-problems" target="_blank"><text text-anchor="middle" font-size="10px" x="50%" y="100%">Text is not SVG - cannot display</text></a></switch></svg>
@@ -0,0 +1,3 @@
1
+ <?xml version="1.0" encoding="UTF-8"?>
2
+ <!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">
3
+ <svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" version="1.1" width="602px" height="602px" viewBox="-0.5 -0.5 602 602"><defs/><g><ellipse cx="80" cy="80" rx="80" ry="80" fill="#f5f5f5" stroke="#666666" pointer-events="all"/><rect x="220" y="0" width="160" height="160" fill="#f5f5f5" stroke="#666666" pointer-events="all"/><ellipse cx="520" cy="80" rx="80" ry="80" fill="#f5f5f5" stroke="#666666" pointer-events="all"/><rect x="0" y="220" width="160" height="160" fill="#f5f5f5" stroke="#666666" pointer-events="all"/><ellipse cx="300" cy="300" rx="80" ry="80" fill="#f5f5f5" stroke="#666666" pointer-events="all"/><rect x="440" y="220" width="160" height="160" fill="#f5f5f5" stroke="#666666" pointer-events="all"/><ellipse cx="80" cy="520" rx="80" ry="80" fill="#f5f5f5" stroke="#666666" pointer-events="all"/></g></svg>
@@ -0,0 +1,3 @@
1
+ <?xml version="1.0" encoding="UTF-8"?>
2
+ <!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">
3
+ <svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" version="1.1" width="602px" height="602px" viewBox="-0.5 -0.5 602 602"><defs/><g><ellipse cx="80" cy="80" rx="80" ry="80" fill="#f5f5f5" stroke="#666666" pointer-events="all"/><rect x="220" y="0" width="160" height="160" fill="#f5f5f5" stroke="#666666" pointer-events="all"/><ellipse cx="520" cy="80" rx="80" ry="80" fill="#f5f5f5" stroke="#666666" pointer-events="all"/><rect x="0" y="220" width="160" height="160" fill="#f5f5f5" stroke="#666666" pointer-events="all"/><ellipse cx="300" cy="300" rx="80" ry="80" fill="#f5f5f5" stroke="#666666" pointer-events="all"/><rect x="440" y="220" width="160" height="160" fill="#f5f5f5" stroke="#666666" pointer-events="all"/><ellipse cx="80" cy="520" rx="80" ry="80" fill="#f5f5f5" stroke="#666666" pointer-events="all"/></g></svg>
@@ -0,0 +1,3 @@
1
+ <?xml version="1.0" encoding="UTF-8"?>
2
+ <!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">
3
+ <svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" version="1.1" width="602px" height="602px" viewBox="-0.5 -0.5 602 602"><defs/><g><rect x="30" y="55" width="100" height="50" fill="none" stroke="none" pointer-events="all"/><g transform="translate(-0.5 -0.5)"><switch><foreignObject pointer-events="none" width="100%" height="100%" requiredFeatures="http://www.w3.org/TR/SVG11/feature#Extensibility" style="overflow: visible; text-align: left;"><div xmlns="http://www.w3.org/1999/xhtml" style="display: flex; align-items: unsafe flex-start; justify-content: unsafe flex-start; width: 98px; height: 1px; padding-top: 62px; margin-left: 32px;"><div data-drawio-colors="color: #333333; " style="box-sizing: border-box; font-size: 0px; text-align: left;"><div style="display: inline-block; font-size: 37px; font-family: Helvetica; color: rgb(51, 51, 51); line-height: 1.2; pointer-events: all; font-weight: bold; white-space: normal; overflow-wrap: normal;">Horizontal</div></div></div></foreignObject><text x="32" y="99" fill="#333333" font-family="Helvetica" font-size="37px" font-weight="bold">Horizo...</text></switch></g><ellipse cx="300" cy="80" rx="80" ry="80" fill="#f5f5f5" stroke="#666666" pointer-events="all"/><g transform="translate(-0.5 -0.5)"><switch><foreignObject pointer-events="none" width="100%" height="100%" requiredFeatures="http://www.w3.org/TR/SVG11/feature#Extensibility" style="overflow: visible; text-align: left;"><div xmlns="http://www.w3.org/1999/xhtml" style="display: flex; align-items: unsafe center; justify-content: unsafe center; width: 158px; height: 1px; padding-top: 80px; margin-left: 221px;"><div data-drawio-colors="color: #333333; " style="box-sizing: border-box; font-size: 0px; text-align: center;"><div style="display: inline-block; font-size: 12px; font-family: Helvetica; color: rgb(51, 51, 51); line-height: 1.2; pointer-events: all; white-space: normal; overflow-wrap: normal;">01</div></div></div></foreignObject><text x="300" y="84" fill="#333333" font-family="Helvetica" font-size="12px" text-anchor="middle">01</text></switch></g><rect x="440" y="0" width="160" height="160" fill="#f5f5f5" stroke="#666666" pointer-events="all"/><g transform="translate(-0.5 -0.5)"><switch><foreignObject pointer-events="none" width="100%" height="100%" requiredFeatures="http://www.w3.org/TR/SVG11/feature#Extensibility" style="overflow: visible; text-align: left;"><div xmlns="http://www.w3.org/1999/xhtml" style="display: flex; align-items: unsafe center; justify-content: unsafe center; width: 158px; height: 1px; padding-top: 80px; margin-left: 441px;"><div data-drawio-colors="color: #333333; " style="box-sizing: border-box; font-size: 0px; text-align: center;"><div style="display: inline-block; font-size: 12px; font-family: Helvetica; color: rgb(51, 51, 51); line-height: 1.2; pointer-events: all; white-space: normal; overflow-wrap: normal;">02</div></div></div></foreignObject><text x="520" y="84" fill="#333333" font-family="Helvetica" font-size="12px" text-anchor="middle">02</text></switch></g><ellipse cx="80" cy="300" rx="80" ry="80" fill="#f5f5f5" stroke="#666666" pointer-events="all"/><g transform="translate(-0.5 -0.5)"><switch><foreignObject pointer-events="none" width="100%" height="100%" requiredFeatures="http://www.w3.org/TR/SVG11/feature#Extensibility" style="overflow: visible; text-align: left;"><div xmlns="http://www.w3.org/1999/xhtml" style="display: flex; align-items: unsafe center; justify-content: unsafe center; width: 158px; height: 1px; padding-top: 300px; margin-left: 1px;"><div data-drawio-colors="color: #333333; " style="box-sizing: border-box; font-size: 0px; text-align: center;"><div style="display: inline-block; font-size: 12px; font-family: Helvetica; color: rgb(51, 51, 51); line-height: 1.2; pointer-events: all; white-space: normal; overflow-wrap: normal;">03</div></div></div></foreignObject><text x="80" y="304" fill="#333333" font-family="Helvetica" font-size="12px" text-anchor="middle">03</text></switch></g><rect x="220" y="220" width="160" height="160" fill="#f5f5f5" stroke="#666666" pointer-events="all"/><g transform="translate(-0.5 -0.5)"><switch><foreignObject pointer-events="none" width="100%" height="100%" requiredFeatures="http://www.w3.org/TR/SVG11/feature#Extensibility" style="overflow: visible; text-align: left;"><div xmlns="http://www.w3.org/1999/xhtml" style="display: flex; align-items: unsafe center; justify-content: unsafe center; width: 158px; height: 1px; padding-top: 300px; margin-left: 221px;"><div data-drawio-colors="color: #333333; " style="box-sizing: border-box; font-size: 0px; text-align: center;"><div style="display: inline-block; font-size: 12px; font-family: Helvetica; color: rgb(51, 51, 51); line-height: 1.2; pointer-events: all; white-space: normal; overflow-wrap: normal;">04</div></div></div></foreignObject><text x="300" y="304" fill="#333333" font-family="Helvetica" font-size="12px" text-anchor="middle">04</text></switch></g><ellipse cx="520" cy="300" rx="80" ry="80" fill="#f5f5f5" stroke="#666666" pointer-events="all"/><g transform="translate(-0.5 -0.5)"><switch><foreignObject pointer-events="none" width="100%" height="100%" requiredFeatures="http://www.w3.org/TR/SVG11/feature#Extensibility" style="overflow: visible; text-align: left;"><div xmlns="http://www.w3.org/1999/xhtml" style="display: flex; align-items: unsafe center; justify-content: unsafe center; width: 158px; height: 1px; padding-top: 300px; margin-left: 441px;"><div data-drawio-colors="color: #333333; " style="box-sizing: border-box; font-size: 0px; text-align: center;"><div style="display: inline-block; font-size: 12px; font-family: Helvetica; color: rgb(51, 51, 51); line-height: 1.2; pointer-events: all; white-space: normal; overflow-wrap: normal;">05</div></div></div></foreignObject><text x="520" y="304" fill="#333333" font-family="Helvetica" font-size="12px" text-anchor="middle">05</text></switch></g><rect x="0" y="440" width="160" height="160" fill="#f5f5f5" stroke="#666666" pointer-events="all"/><g transform="translate(-0.5 -0.5)"><switch><foreignObject pointer-events="none" width="100%" height="100%" requiredFeatures="http://www.w3.org/TR/SVG11/feature#Extensibility" style="overflow: visible; text-align: left;"><div xmlns="http://www.w3.org/1999/xhtml" style="display: flex; align-items: unsafe center; justify-content: unsafe center; width: 158px; height: 1px; padding-top: 520px; margin-left: 1px;"><div data-drawio-colors="color: #333333; " style="box-sizing: border-box; font-size: 0px; text-align: center;"><div style="display: inline-block; font-size: 12px; font-family: Helvetica; color: rgb(51, 51, 51); line-height: 1.2; pointer-events: all; white-space: normal; overflow-wrap: normal;">06</div></div></div></foreignObject><text x="80" y="524" fill="#333333" font-family="Helvetica" font-size="12px" text-anchor="middle">06</text></switch></g><ellipse cx="300" cy="520" rx="80" ry="80" fill="#f5f5f5" stroke="#666666" pointer-events="all"/><g transform="translate(-0.5 -0.5)"><switch><foreignObject pointer-events="none" width="100%" height="100%" requiredFeatures="http://www.w3.org/TR/SVG11/feature#Extensibility" style="overflow: visible; text-align: left;"><div xmlns="http://www.w3.org/1999/xhtml" style="display: flex; align-items: unsafe center; justify-content: unsafe center; width: 158px; height: 1px; padding-top: 520px; margin-left: 221px;"><div data-drawio-colors="color: #333333; " style="box-sizing: border-box; font-size: 0px; text-align: center;"><div style="display: inline-block; font-size: 12px; font-family: Helvetica; color: rgb(51, 51, 51); line-height: 1.2; pointer-events: all; white-space: normal; overflow-wrap: normal;">07</div></div></div></foreignObject><text x="300" y="524" fill="#333333" font-family="Helvetica" font-size="12px" text-anchor="middle">07</text></switch></g></g><switch><g requiredFeatures="http://www.w3.org/TR/SVG11/feature#Extensibility"/><a transform="translate(0,-5)" xlink:href="https://www.diagrams.net/doc/faq/svg-export-text-problems" target="_blank"><text text-anchor="middle" font-size="10px" x="50%" y="100%">Text is not SVG - cannot display</text></a></switch></svg>
@@ -0,0 +1,3 @@
1
+ <?xml version="1.0" encoding="UTF-8"?>
2
+ <!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">
3
+ <svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" version="1.1" width="602px" height="602px" viewBox="-0.5 -0.5 602 602"><defs/><g><rect x="30" y="55" width="100" height="50" fill="none" stroke="none" pointer-events="all"/><g transform="translate(-0.5 -0.5)"><switch><foreignObject pointer-events="none" width="100%" height="100%" requiredFeatures="http://www.w3.org/TR/SVG11/feature#Extensibility" style="overflow: visible; text-align: left;"><div xmlns="http://www.w3.org/1999/xhtml" style="display: flex; align-items: unsafe flex-start; justify-content: unsafe flex-start; width: 98px; height: 1px; padding-top: 62px; margin-left: 32px;"><div data-drawio-colors="color: #333333; " style="box-sizing: border-box; font-size: 0px; text-align: left;"><div style="display: inline-block; font-size: 37px; font-family: Helvetica; color: rgb(51, 51, 51); line-height: 1.2; pointer-events: all; font-weight: bold; white-space: normal; overflow-wrap: normal;">Vertical</div></div></div></foreignObject><text x="32" y="99" fill="#333333" font-family="Helvetica" font-size="37px" font-weight="bold">Vertic...</text></switch></g><ellipse cx="80" cy="300" rx="80" ry="80" fill="#f5f5f5" stroke="#666666" pointer-events="all"/><g transform="translate(-0.5 -0.5)"><switch><foreignObject pointer-events="none" width="100%" height="100%" requiredFeatures="http://www.w3.org/TR/SVG11/feature#Extensibility" style="overflow: visible; text-align: left;"><div xmlns="http://www.w3.org/1999/xhtml" style="display: flex; align-items: unsafe center; justify-content: unsafe center; width: 158px; height: 1px; padding-top: 300px; margin-left: 1px;"><div data-drawio-colors="color: #333333; " style="box-sizing: border-box; font-size: 0px; text-align: center;"><div style="display: inline-block; font-size: 12px; font-family: Helvetica; color: rgb(51, 51, 51); line-height: 1.2; pointer-events: all; white-space: normal; overflow-wrap: normal;">01</div></div></div></foreignObject><text x="80" y="304" fill="#333333" font-family="Helvetica" font-size="12px" text-anchor="middle">01</text></switch></g><rect x="0" y="440" width="160" height="160" fill="#f5f5f5" stroke="#666666" pointer-events="all"/><g transform="translate(-0.5 -0.5)"><switch><foreignObject pointer-events="none" width="100%" height="100%" requiredFeatures="http://www.w3.org/TR/SVG11/feature#Extensibility" style="overflow: visible; text-align: left;"><div xmlns="http://www.w3.org/1999/xhtml" style="display: flex; align-items: unsafe center; justify-content: unsafe center; width: 158px; height: 1px; padding-top: 520px; margin-left: 1px;"><div data-drawio-colors="color: #333333; " style="box-sizing: border-box; font-size: 0px; text-align: center;"><div style="display: inline-block; font-size: 12px; font-family: Helvetica; color: rgb(51, 51, 51); line-height: 1.2; pointer-events: all; white-space: normal; overflow-wrap: normal;">02</div></div></div></foreignObject><text x="80" y="524" fill="#333333" font-family="Helvetica" font-size="12px" text-anchor="middle">02</text></switch></g><ellipse cx="300" cy="80" rx="80" ry="80" fill="#f5f5f5" stroke="#666666" pointer-events="all"/><g transform="translate(-0.5 -0.5)"><switch><foreignObject pointer-events="none" width="100%" height="100%" requiredFeatures="http://www.w3.org/TR/SVG11/feature#Extensibility" style="overflow: visible; text-align: left;"><div xmlns="http://www.w3.org/1999/xhtml" style="display: flex; align-items: unsafe center; justify-content: unsafe center; width: 158px; height: 1px; padding-top: 80px; margin-left: 221px;"><div data-drawio-colors="color: #333333; " style="box-sizing: border-box; font-size: 0px; text-align: center;"><div style="display: inline-block; font-size: 12px; font-family: Helvetica; color: rgb(51, 51, 51); line-height: 1.2; pointer-events: all; white-space: normal; overflow-wrap: normal;">03</div></div></div></foreignObject><text x="300" y="84" fill="#333333" font-family="Helvetica" font-size="12px" text-anchor="middle">03</text></switch></g><rect x="220" y="220" width="160" height="160" fill="#f5f5f5" stroke="#666666" pointer-events="all"/><g transform="translate(-0.5 -0.5)"><switch><foreignObject pointer-events="none" width="100%" height="100%" requiredFeatures="http://www.w3.org/TR/SVG11/feature#Extensibility" style="overflow: visible; text-align: left;"><div xmlns="http://www.w3.org/1999/xhtml" style="display: flex; align-items: unsafe center; justify-content: unsafe center; width: 158px; height: 1px; padding-top: 300px; margin-left: 221px;"><div data-drawio-colors="color: #333333; " style="box-sizing: border-box; font-size: 0px; text-align: center;"><div style="display: inline-block; font-size: 12px; font-family: Helvetica; color: rgb(51, 51, 51); line-height: 1.2; pointer-events: all; white-space: normal; overflow-wrap: normal;">04</div></div></div></foreignObject><text x="300" y="304" fill="#333333" font-family="Helvetica" font-size="12px" text-anchor="middle">04</text></switch></g><ellipse cx="300" cy="520" rx="80" ry="80" fill="#f5f5f5" stroke="#666666" pointer-events="all"/><g transform="translate(-0.5 -0.5)"><switch><foreignObject pointer-events="none" width="100%" height="100%" requiredFeatures="http://www.w3.org/TR/SVG11/feature#Extensibility" style="overflow: visible; text-align: left;"><div xmlns="http://www.w3.org/1999/xhtml" style="display: flex; align-items: unsafe center; justify-content: unsafe center; width: 158px; height: 1px; padding-top: 520px; margin-left: 221px;"><div data-drawio-colors="color: #333333; " style="box-sizing: border-box; font-size: 0px; text-align: center;"><div style="display: inline-block; font-size: 12px; font-family: Helvetica; color: rgb(51, 51, 51); line-height: 1.2; pointer-events: all; white-space: normal; overflow-wrap: normal;">05</div></div></div></foreignObject><text x="300" y="524" fill="#333333" font-family="Helvetica" font-size="12px" text-anchor="middle">05</text></switch></g><rect x="440" y="0" width="160" height="160" fill="#f5f5f5" stroke="#666666" pointer-events="all"/><g transform="translate(-0.5 -0.5)"><switch><foreignObject pointer-events="none" width="100%" height="100%" requiredFeatures="http://www.w3.org/TR/SVG11/feature#Extensibility" style="overflow: visible; text-align: left;"><div xmlns="http://www.w3.org/1999/xhtml" style="display: flex; align-items: unsafe center; justify-content: unsafe center; width: 158px; height: 1px; padding-top: 80px; margin-left: 441px;"><div data-drawio-colors="color: #333333; " style="box-sizing: border-box; font-size: 0px; text-align: center;"><div style="display: inline-block; font-size: 12px; font-family: Helvetica; color: rgb(51, 51, 51); line-height: 1.2; pointer-events: all; white-space: normal; overflow-wrap: normal;">06</div></div></div></foreignObject><text x="520" y="84" fill="#333333" font-family="Helvetica" font-size="12px" text-anchor="middle">06</text></switch></g><ellipse cx="520" cy="300" rx="80" ry="80" fill="#f5f5f5" stroke="#666666" pointer-events="all"/><g transform="translate(-0.5 -0.5)"><switch><foreignObject pointer-events="none" width="100%" height="100%" requiredFeatures="http://www.w3.org/TR/SVG11/feature#Extensibility" style="overflow: visible; text-align: left;"><div xmlns="http://www.w3.org/1999/xhtml" style="display: flex; align-items: unsafe center; justify-content: unsafe center; width: 158px; height: 1px; padding-top: 300px; margin-left: 441px;"><div data-drawio-colors="color: #333333; " style="box-sizing: border-box; font-size: 0px; text-align: center;"><div style="display: inline-block; font-size: 12px; font-family: Helvetica; color: rgb(51, 51, 51); line-height: 1.2; pointer-events: all; white-space: normal; overflow-wrap: normal;">07</div></div></div></foreignObject><text x="520" y="304" fill="#333333" font-family="Helvetica" font-size="12px" text-anchor="middle">07</text></switch></g></g><switch><g requiredFeatures="http://www.w3.org/TR/SVG11/feature#Extensibility"/><a transform="translate(0,-5)" xlink:href="https://www.diagrams.net/doc/faq/svg-export-text-problems" target="_blank"><text text-anchor="middle" font-size="10px" x="50%" y="100%">Text is not SVG - cannot display</text></a></switch></svg>
@@ -0,0 +1,48 @@
1
+ # Samples
2
+
3
+ ## Grid flow - Horizontal
4
+
5
+ ![](grid-direction-horizontal.svg)
6
+
7
+ ## Grid flow - Vertical
8
+
9
+ ![](grid-direction-vertical.svg)
10
+
11
+ ## Styles
12
+
13
+ ## Plain
14
+
15
+ ![](styles-plain.svg)
16
+
17
+ ### Shadow
18
+
19
+ ![](styles-shadow.svg)
20
+
21
+ ### Rounded
22
+
23
+ ![](styles-rounded.svg)
24
+
25
+ ### Glass
26
+
27
+ ![](styles-glass.svg)
28
+
29
+ ### Sketch
30
+
31
+ ![](styles-sketch.svg)
32
+
33
+ ## Themes
34
+
35
+ ### As circles
36
+ ![](themes-circle.svg)
37
+
38
+ ### As squares
39
+
40
+ ![](themes-square.svg)
41
+
42
+ ### As random shapes
43
+
44
+ ![](themes-random.svg)
45
+
46
+ ## Copyright
47
+
48
+ Copyright (c) David Cruwys. See [MIT License](LICENSE.txt) for further details.