chore: replace layout images (#8)

Author: janoshrubos

ui-and-styling.md

@@ -129,7 +129,7 @@ The following example creates a simple grid. For more information about creating
 </AbsoluteLayout>
 ```
 
-<img class="md:w-1/2 lg:w-1/3" src="https://art.nativescript-vue.org/layouts/absolute_layout_grid.svg" />
+<img class="md:w-1/2 lg:w-1/3" src="https://art.nativescript.org/layouts/absolute_layout_grid.svg" />
 
 #### Example: Overlapping elements
 
@@ -156,7 +156,7 @@ The following example creates a group of overlapping items.
 </AbsoluteLayout>
 ```
 
-<img class="md:w-1/2 lg:w-1/3" src="https://art.nativescript-vue.org/layouts/absolute_layout_overlap.svg" />
+<img class="md:w-1/2 lg:w-1/3" src="https://art.nativescript.org/layouts/absolute_layout_overlap.svg" />
 
 #### Props
 
@@ -199,7 +199,7 @@ The following example creates a frame-like layout consisting of 4 elements, posi
 </DockLayout>
 ```
 
-<img class="md:w-1/2 lg:w-1/3" src="https://art.nativescript-vue.org/layouts/dock_layout_no_stretch.svg" />
+<img class="md:w-1/2 lg:w-1/3" src="https://art.nativescript.org/layouts/dock_layout_no_stretch.svg" />
 
 #### Example: Dock to every side and stretch the last child
 
@@ -214,7 +214,7 @@ The following example shows how `stretchLastChild` affects the positioning of ch
 </DockLayout>
 ```
 
-<img class="md:w-1/2 lg:w-1/3" src="https://art.nativescript-vue.org/layouts/dock_layout_stretch.svg" />
+<img class="md:w-1/2 lg:w-1/3" src="https://art.nativescript.org/layouts/dock_layout_stretch.svg" />
 
 #### Example: Dock to every side and the center
 
@@ -230,7 +230,7 @@ The following example creates a `<DockLayout>` of 5 elements. The first four wra
 </DockLayout>
 ```
 
-<img class="md:w-1/2 lg:w-1/3" src="https://art.nativescript-vue.org/layouts/dock_layout_all_sides_and_stretch.svg" />
+<img class="md:w-1/2 lg:w-1/3" src="https://art.nativescript.org/layouts/dock_layout_all_sides_and_stretch.svg" />
 
 #### Example: Dock multiple children to the same side
 
@@ -245,7 +245,7 @@ The following example creates a single line of 4 elements that stretch across th
 </DockLayout>
 ```
 
-<img class="md:w-1/2 lg:w-1/3" src="https://art.nativescript-vue.org/layouts/dock_layout_multiple_on_same_side.svg" />
+<img class="md:w-1/2 lg:w-1/3" src="https://art.nativescript.org/layouts/dock_layout_multiple_on_same_side.svg" />
 
 #### Props
 
@@ -293,7 +293,7 @@ The following example creates a simple 2-by-2 grid with fixed column widths and
 </GridLayout>
 ```
 
-<img class="md:w-1/2 lg:w-1/3" src="https://art.nativescript-vue.org/layouts/grid_layout.svg" />
+<img class="md:w-1/2 lg:w-1/3" src="https://art.nativescript.org/layouts/grid_layout.svg" />
 
 #### Example: Grid layout with star sizing
 
@@ -308,7 +308,7 @@ The following example creates a grid with responsive design, where space is allo
 </GridLayout>
 ```
 
-<img class="md:w-1/2 lg:w-1/3" src="https://art.nativescript-vue.org/layouts/grid_layout_star_sizing.svg" />
+<img class="md:w-1/2 lg:w-1/3" src="https://art.nativescript.org/layouts/grid_layout_star_sizing.svg" />
 
 #### Example: Grid layout with fixed and auto sizing
 
@@ -323,7 +323,7 @@ The following example create a grid with one auto-sized column and one column wi
 </GridLayout>
 ```
 
-<img class="md:w-1/2 lg:w-1/3" src="https://art.nativescript-vue.org/layouts/grid_layout_fixed_auto.svg" />
+<img class="md:w-1/2 lg:w-1/3" src="https://art.nativescript.org/layouts/grid_layout_fixed_auto.svg" />
 
 #### Example: Grid layout with mixed sizing and merged cells
 
@@ -341,7 +341,7 @@ The following example creates a complex grid with responsive design, mixed width
 </GridLayout>
 ```
 
-<img class="md:w-1/2 lg:w-1/3" src="https://art.nativescript-vue.org/layouts/grid_layout_complex.svg" />
+<img class="md:w-1/2 lg:w-1/3" src="https://art.nativescript.org/layouts/grid_layout_complex.svg" />
 
 #### Props
 
@@ -386,7 +386,7 @@ The following example creates a vertical stack of 3 equally-sized elements. Item
 </StackLayout>
 ```
 
-<img class="md:w-1/2 lg:w-1/3" src="https://art.nativescript-vue.org/layouts/stack_layout_vertical.svg" />
+<img class="md:w-1/2 lg:w-1/3" src="https://art.nativescript.org/layouts/stack_layout_vertical.svg" />
 
 #### Example: Horizontal stacking
 
@@ -400,7 +400,7 @@ The following example creates a horizontal stack of 3 equally-sized elements. It
 </StackLayout>
 ```
 
-<img class="md:w-1/2 lg:w-1/3" src="https://art.nativescript-vue.org/layouts/stack_layout_horizontal.svg" />
+<img class="md:w-1/2 lg:w-1/3" src="https://art.nativescript.org/layouts/stack_layout_horizontal.svg" />
 
 #### Example: Stack layout with horizontally aligned children
 
@@ -438,7 +438,7 @@ The following example creates a diagonal stack of items with responsive sizes. I
 </StackLayout>
 ```
 
-<img class="md:w-1/2 lg:w-1/3" src="https://art.nativescript-vue.org/layouts/stack_layout_vertical_align_children.svg" />
+<img class="md:w-1/2 lg:w-1/3" src="https://art.nativescript.org/layouts/stack_layout_vertical_align_children.svg" />
 
 #### Example: Horizontal stack layout with vertically aligned children
 
@@ -476,7 +476,7 @@ The following example creates a diagonal stack of items with responsive sizes. I
 </StackLayout>
 ```
 
-<img class="md:w-1/2 lg:w-1/3" src="https://art.nativescript-vue.org/layouts/stack_layout_horizontal_align_children.svg" />
+<img class="md:w-1/2 lg:w-1/3" src="https://art.nativescript.org/layouts/stack_layout_horizontal_align_children.svg" />
 
 #### Props
 
@@ -624,7 +624,7 @@ The following example creates a row of equally-sized items. When the row runs ou
 </WrapLayout>
 ```
 
-<img class="md:w-1/2 lg:w-1/3" src="https://art.nativescript-vue.org/layouts/wrap_layout_horizontal.svg" />
+<img class="md:w-1/2 lg:w-1/3" src="https://art.nativescript.org/layouts/wrap_layout_horizontal.svg" />
 
 #### Example: Vertical wrap layout
 
@@ -639,7 +639,7 @@ The following example creates a column of equally-sized items. When the row runs
 </WrapLayout>
 ```
 
-<img class="md:w-1/2 lg:w-1/3" src="https://art.nativescript-vue.org/layouts/wrap_layout_vertical.svg" />
+<img class="md:w-1/2 lg:w-1/3" src="https://art.nativescript.org/layouts/wrap_layout_vertical.svg" />
 
 #### Props
 
@@ -672,7 +672,7 @@ The following example creates a row of three equally-sized elements that span ac
 </FlexboxLayout>
 ```
 
-<img class="md:w-1/2 lg:w-1/3" src="https://art.nativescript-vue.org/layouts/flexbox_layout_row_stretch.svg" />
+<img class="md:w-1/2 lg:w-1/3" src="https://art.nativescript.org/layouts/flexbox_layout_row_stretch.svg" />
 
 #### Example: Column flex layout
 
@@ -686,7 +686,7 @@ The following example creates a column of three equally-sized elements that span
 </FlexboxLayout>
 ```
 
-<img class="md:w-1/2 lg:w-1/3" src="https://art.nativescript-vue.org/layouts/flexbox_layout_column_stretch.svg" />
+<img class="md:w-1/2 lg:w-1/3" src="https://art.nativescript.org/layouts/flexbox_layout_column_stretch.svg" />
 
 #### Example: Row flex layout with items aligned to `flex-start`
 
@@ -700,7 +700,7 @@ The following example creates a row of three items placed at the top of the scre
 </FlexboxLayout>
 ```
 
-<img class="md:w-1/2 lg:w-1/3" src="https://art.nativescript-vue.org/layouts/flexbox_layout_row_flex-start.svg" />
+<img class="md:w-1/2 lg:w-1/3" src="https://art.nativescript.org/layouts/flexbox_layout_row_flex-start.svg" />
 
 #### Example: Row flex layout with custom order
 
@@ -714,7 +714,7 @@ The following example creates a row of three items placed at the top of the scre
 </FlexboxLayout>
 ```
 
-<img class="md:w-1/2 lg:w-1/3" src="https://art.nativescript-vue.org/layouts/flexbox_layout_row_custom_order.svg" />
+<img class="md:w-1/2 lg:w-1/3" src="https://art.nativescript.org/layouts/flexbox_layout_row_custom_order.svg" />
 
 #### Example: Row flex layout with wrapping
 
@@ -729,7 +729,7 @@ The following example creates four items with enabled line wrapping. When the ro
 </FlexboxLayout>
 ```
 
-<img class="md:w-1/2 lg:w-1/3" src="https://art.nativescript-vue.org/layouts/flexbox_layout_wrap.svg" />
+<img class="md:w-1/2 lg:w-1/3" src="https://art.nativescript.org/layouts/flexbox_layout_wrap.svg" />
 
 #### Example: Column flex layout with reverse order and items with a different `alignSelf`
 
@@ -764,7 +764,7 @@ The following example shows how to use:
 </FlexboxLayout>
 ```
 
-<img class="md:w-1/2 lg:w-1/3" src="https://art.nativescript-vue.org/layouts/flexbox_layout_column_reverse_space_around_align_self.svg" />
+<img class="md:w-1/2 lg:w-1/3" src="https://art.nativescript.org/layouts/flexbox_layout_column_reverse_space_around_align_self.svg" />
 
 #### Props