Skip to content

Commit 1f35569

Browse files
rigor789rigor789
authored
chore: snapshot v1.3.1 docs (#181)
1 parent 51de495 commit 1f35569

Some content is hidden

Large Commits have some content hidden by default. Use the searchbox below for content that may be hidden.

67 files changed

+11944
-512
lines changed

‎build/index.js

+2-1
Original file line numberDiff line numberDiff line change
@@ -40,6 +40,7 @@ Metalsmith(cwd)
4040
moment,
4141
localeMap: {
4242
'en': 'English',
43+
'es': 'Español',
4344
'ko': '한국어',
4445
'pt-BR': 'Português do Brasil',
4546
'ru': 'Русский'
@@ -115,7 +116,7 @@ Metalsmith(cwd)
115116
})
116117
.use(locales({
117118
defaultLocale: 'en',
118-
locales: ['en', 'ko', 'pt-BR', 'ru']
119+
locales: ['en', 'es', 'ko', 'pt-BR', 'ru']
119120
}))
120121
.use(versions({
121122
versions: [

‎build/plugins/order.js

-1
Original file line numberDiff line numberDiff line change
@@ -13,7 +13,6 @@ function plugin() {
1313
if (res) {
1414
const data = files[file];
1515
data.order = res[1];
16-
1716
data.slug = data.slug.replace(res[0], '');
1817

1918
// rename file to not include the order

‎content/docs/en/elements/components/date-picker.md

+1-1
Original file line numberDiff line numberDiff line change
@@ -11,7 +11,7 @@ contributors: [MisterBrownRSA, rigor789, ikoevska]
1111
---
1212

1313
```html
14-
<DatePicker @loaded="onDatePickerLoaded" @dateChange="onDateChanged" />
14+
<DatePicker :date="someDate" />
1515
```
1616

1717
`<DatePicker>` provides two-way data binding using `v-model`.

‎content/docs/en/elements/components/list-view.md

+1-1
Original file line numberDiff line numberDiff line change
@@ -9,7 +9,7 @@ contributors: [MisterBrownRSA, rigor789, eddyverbruggen, ikoevska]
99
```html
1010
<ListView for="item in listOfItems" @itemTap="onItemTap">
1111
<v-template>
12-
<!-- Shows the list item label in the default color and stye. -->
12+
<!-- Shows the list item label in the default color and style. -->
1313
<Label :text="item.text" />
1414
</v-template>
1515
</ListView>

‎content/docs/en/elements/dialogs/action.md

+1-1
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
11
---
22
title: ActionDialog
3-
apiRef: https://docs.nativescript.org/api-reference/modules/_ui_dialogs_#action
3+
apiRef: https://docs.nativescript.org/api-reference/modules/_ui_dialogs_#action
44
contributors: [MisterBrownRSA, rigor789, ikoevska]
55
---
66

‎content/docs/en/elements/layouts/absolute-layout.md

+22-13
Original file line numberDiff line numberDiff line change
@@ -1,14 +1,23 @@
11
---
22
title: AbsoluteLayout
33
apiRef: https://docs.nativescript.org/api-reference/modules/_ui_layouts_absolute_layout_
4-
contributors: [rigor789]
4+
docRef: https://docs.nativescript.org/ui/layouts/layout-containers#absolutelayout
5+
contributors: [rigor789, ikoevska]
56
---
67

7-
The AbsoluteLayout container is the simplest layout container in NativeScript. It uses absolute top-left coordinates to position its children. The AbsoluteLayout will not enforce any layout constraints on its children and will not resize them at runtime when its size changes.
8+
The `<AbsoluteLayout>` container is the simplest layout container in NativeScript.
89

9-
### Samples
10+
`<AbsoluteLayout>` has the following behavior:
1011

11-
#### A grid-like layout
12+
* Uses a pair of absolute left/top coordinates to position its children.
13+
* Doesn't enforce any layout constraints on its children.
14+
* Doesn't resize its children at runtime when its size changes.
15+
16+
## Examples
17+
18+
### A grid-like layout
19+
20+
The following example creates a simple grid. For more information about creating grid layouts, see [GridLayout](/en/docs/elements/layouts/grid-layout).
1221

1322
```html
1423
<AbsoluteLayout backgroundColor="#3c495e">
@@ -20,7 +29,9 @@ The AbsoluteLayout container is the simplest layout container in NativeScript. I
2029
```
2130
<img class="md:w-1/2 lg:w-1/3" src="https://art.nativescript-vue.org/layouts/absolute_layout_grid.svg" />
2231

23-
#### Overlapping elements
32+
### Overlapping elements
33+
34+
The following example creates a group of overlapping items.
2435

2536
```html
2637
<AbsoluteLayout backgroundColor="#3c495e">
@@ -30,17 +41,15 @@ The AbsoluteLayout container is the simplest layout container in NativeScript. I
3041
```
3142
<img class="md:w-1/2 lg:w-1/3" src="https://art.nativescript-vue.org/layouts/absolute_layout_overlap.svg" />
3243

33-
3444
## Props
3545

36-
AbsoluteLayout has no props.
46+
None.
3747

38-
## Additional Children Props
48+
## Additional children props
3949

40-
When an element is a direct child of the AbsoluteLayout, the following
41-
props get a meaning:
50+
When an element is a direct child of `<AbsoluteLayout>`, you can work with the following additional properties.
4251

43-
| name | type | description |
52+
| Name | Type | Description |
4453
|------|------|-------------|
45-
| `top` | `Number` | A value representing the distance from the top of the parent AbsoluteLayout
46-
| `left` | `Number` | A value representing the distance from the left of the parent AbsoluteLayout
54+
| `top` | `Number` | Gets or sets the distance, in pixels, between the top edge of the child and the top edge of its parent.
55+
| `left` | `Number` | Gets or sets the distance, in pixels, between the left edge of the child and the left edge of its parent.

‎content/docs/en/elements/layouts/dock-layout.md

+39-13
Original file line numberDiff line numberDiff line change
@@ -1,14 +1,22 @@
11
---
22
title: DockLayout
33
apiRef: https://docs.nativescript.org/api-reference/modules/_ui_layouts_dock_layout_
4-
contributors: [rigor789]
4+
contributors: [rigor789, ikoevska]
55
---
66

7-
DockLayout is a layout that provides a docking mechanism for child elements to the `left`, `right`, `top`, `bottom` or center of the layout. To define the docking side of a child element, use its `dock` property. To dock a child element to the center of the DockLayout, it must be the **last child** of the DockLayout and the `stretchLastChild` property of the DockLayout must be set to `true`.
7+
`<DockLayout>` is a layout container that lets you dock child elements to the sides or the center of the layout.
88

9-
### Samples
9+
`<DockLayout>` has the following behavior:
1010

11-
#### Dock to every side without stretching last child
11+
* Uses the `dock` property to dock its children to the `left`, `right`, `top`, `bottom` or center of the layout.<br/>To dock a child element to the center, it must be the **last child** of the container and you must set the `stretchLastChild` property of the parent to `true`.
12+
* Enforces layout constraints to its children.
13+
* Resizes its children at runtime when its size changes.
14+
15+
## Examples
16+
17+
### Dock to every side without stretching the last child
18+
19+
The following example creates a frame-like layout consisting of 4 elements, position at the 4 edges of the screen.
1220

1321
```html
1422
<DockLayout stretchLastChild="false" backgroundColor="#3c495e">
@@ -20,7 +28,9 @@ DockLayout is a layout that provides a docking mechanism for child elements to t
2028
```
2129
<img class="md:w-1/2 lg:w-1/3" src="https://art.nativescript-vue.org/layouts/dock_layout_no_stretch.svg" />
2230

23-
#### Dock to every side with stretching last child
31+
### Dock to every side and stretch the last child
32+
33+
The following example shows how `stretchLastChild` affects the positioning of child elements in a `DockLayout` container. The last child (`bottom`) is stretched to take up all the remaining space after positioning the first three elements.
2434

2535
```html
2636
<DockLayout stretchLastChild="true" backgroundColor="#3c495e">
@@ -32,8 +42,25 @@ DockLayout is a layout that provides a docking mechanism for child elements to t
3242
```
3343
<img class="md:w-1/2 lg:w-1/3" src="https://art.nativescript-vue.org/layouts/dock_layout_stretch.svg" />
3444

35-
#### Multiple children on the same side
45+
### Dock to every side and the center
46+
47+
The following example creates a `<DockLayout>` of 5 elements. The first four wrap the center element in a frame.
48+
49+
```html
50+
<DockLayout stretchLastChild="true" backgroundColor="#3c495e">
51+
<Label text="left" dock="left" width="40" backgroundColor="#43b883"/>
52+
<Label text="top" dock="top" height="40" backgroundColor="#289062"/>
53+
<Label text="right" dock="right" width="40" backgroundColor="#43b883"/>
54+
<Label text="bottom" dock="bottom" height="40" backgroundColor="#289062"/>
55+
<Label text="center" backgroundColor="#1c6b48" />
56+
</DockLayout>
57+
```
58+
<img class="md:w-1/2 lg:w-1/3" src="https://art.nativescript-vue.org/layouts/dock_layout_all_sides_and_stretch.svg" />
59+
60+
### Dock multiple children to the same side
3661

62+
The following example creates a single line of 4 elements that stretch across the entire height and width of the screen.
63+
3764
```html
3865
<DockLayout stretchLastChild="true" backgroundColor="#3c495e">
3966
<Label text="left 1" dock="left" width="40" backgroundColor="#43b883"/>
@@ -46,15 +73,14 @@ DockLayout is a layout that provides a docking mechanism for child elements to t
4673

4774
## Props
4875

49-
| name | type | description |
76+
| Name | Type | Description |
5077
|------|------|-------------|
51-
`stretchLastChild` | `Boolean` | Enables/Disables stretching the last child to fit the remaining space.
78+
| `stretchLastChild` | `Boolean` | Enables or disables stretching the last child to fit the remaining space.
5279

53-
## Additional Children Props
80+
## Additional children props
5481

55-
When an element is a direct child of the DockLayout, the following
56-
props get a meaning:
82+
When an element is a direct child of `<DockLayout>`, you can work with the following additional properties.
5783

58-
| name | type | description |
84+
| Name | Type | Description |
5985
|------|------|-------------|
60-
`dock` | `String` | Specifies which side to dock the element to. Values can be: `top`, `right`, `bottom`, `left`
86+
| `dock` | `String` | Specifies which side to dock the element to.<br/>Valid values: `top`, `right`, `bottom`, or `left`.

0 commit comments

Comments
 (0)