Skip to content

Commit 1f89812

Browse files
grego952grego952
authored
Add border to screenshots (#3757)
1 parent f5be867 commit 1f89812

Some content is hidden

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

55 files changed

+111
-144
lines changed

‎docs/extensibility/110-presets.md‎

Lines changed: 11 additions & 13 deletions
Original file line numberDiff line numberDiff line change
@@ -13,25 +13,23 @@ The **presets** section contains a list of objects that define which preset and
1313
## Example
1414

1515
```yaml
16-
- name: template
16+
- name: Cash Delivery
1717
default: true
1818
value:
1919
metadata:
20-
name: my-name
20+
name: delivery-cash
2121
spec:
22-
description: A set description
23-
- name: preset
22+
description: Delivery with cash payment
23+
- name: Card Pickup
2424
value:
2525
metadata:
26-
name: second-one
26+
name: card-pickup
2727
spec:
2828
data: regex
29-
description: A different description
30-
items:
31-
- name: item-1
32-
value: 10
33-
- name: item-2
34-
value: 11
35-
- name: item-3
36-
value: 5
29+
description: Self-pickup and card payment
30+
orderDetails:
31+
paymentMethod: CARD
32+
realization: SELF-PICKUP
3733
```
34+
35+
<img src="./assets/Presets.png" alt="Example of a preset" width="50%">

‎docs/extensibility/120-resource-extensions.md‎

Lines changed: 42 additions & 39 deletions
Large diffs are not rendered by default.

‎docs/extensibility/160-wizard-extensions.md‎

Lines changed: 0 additions & 41 deletions
This file was deleted.

‎docs/extensibility/20-list-columns.md‎

Lines changed: 12 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -21,15 +21,21 @@ This table lists the available parameters of the **data.list** section in your r
2121
See the following example:
2222

2323
```yaml
24-
- source: spec.url
24+
- name: Description
25+
- source: spec.description
2526
search: true
2627
sort:
2728
default: true
2829
compareFunction: '$compareStrings($first, $second)'
29-
- source: spec.priority
30+
- name: State
31+
- source: status.messages[-1].state
3032
widget: Badge
31-
- source: "$join(spec.toppings.name, ', ')"
32-
- name: quantityIsMore
33+
- name: Toppings price
34+
source: $sum(spec.toppings.price)
35+
sort:
36+
default: true
37+
search: true
38+
- name: Toppings details
3339
source:
3440
'$filter(spec.toppings, function ($v, $i, $a) { $v.quantity > $average($a.quantity)
3541
})'
@@ -39,6 +45,8 @@ See the following example:
3945
- source: "$join(spec.volumes['configMap' in $keys($)].name, ', ')" # List volume names of volumes that have a ConfigMap
4046
```
4147
48+
<img src="./assets/listColumns.png" alt="Example of list column">
49+
4250
## Related Links
4351
4452
- [Widgets available for the list and details pages](./50-list-and-details-widgets.md)

‎docs/extensibility/30-details-summary.md‎

Lines changed: 1 addition & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -13,8 +13,7 @@ This table lists the available parameters of the **data.details.header**, **data
1313
| Parameter | Required | Type | Description |
1414
| --------------------- | -------- | ----------------------------------------------- | -------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- |
1515
| **source** | **Yes** | string or [JSONata](100-jsonata.md) expression | Used to fetch data for the widget. In its simplest form, it's the path to the value. Not required for presentational widgets. |
16-
| **name** | **Yes** | string | Name for the primary label of this field. Required for most widgets (except for some rare cases that don't display a label). This can be a key to use from the [**translation** section](150-translations.md |
17-
| ). |
16+
| **name** | **Yes** | string | Name for the primary label of this field. Required for most widgets (except for some rare cases that don't display a label). This can be a key to use from the [**translation** section](150-translations.md). |
1817
| **widget** | No | string | A widget to render the defined entry. By default the value is displayed verbatim. For more information about the available widgets, see [List and Details Widgets](./50-list-and-details-widgets.md). |
1918
| **valuePreprocessor** | No | string | Name of the [value preprocessor](130-additional-sections-resources.md#value-preprocessors). |
2019
| **visibility** | No | boolean or [JSONata](100-jsonata.md) expression | By default all fields are visible; however, you can use the **visibility** property to control a single item display. <br>- If set to `false` explicitly, the field doesn't render. <br> - If set to any string, this property is treated as [JSONata](100-jsonata.md) format, determining if the field should be visible based on the current value given as `$value`. <br> - If not set, the field always renders. |

‎docs/extensibility/50-list-and-details-widgets.md‎

Lines changed: 27 additions & 27 deletions
Original file line numberDiff line numberDiff line change
@@ -59,7 +59,7 @@ See the following example:
5959
description: status.message
6060
```
6161
62-
<img src="./assets/display-widgets/Badge.png" alt="Example of a badge widget" width="50%" style="border: 1px solid #D2D5D9">
62+
<img src="./assets/display-widgets/Badge.png" alt="Example of a badge widget" width="50%">
6363
<br/><br/>
6464
6565
### `ControlledBy`
@@ -81,7 +81,7 @@ This is an example of kind and name link:
8181
placeholder: '-'
8282
```
8383

84-
<img src="./assets/display-widgets/ControlledBy.png" alt="Example of a ControlledBy widget" width="40%" style="border: 1px solid #D2D5D9">
84+
<img src="./assets/display-widgets/ControlledBy.png" alt="Example of a ControlledBy widget" width="40%">
8585

8686
This is an exaple of kind only:
8787

@@ -92,7 +92,7 @@ This is an exaple of kind only:
9292
kindOnly: true
9393
```
9494

95-
<img src="./assets/display-widgets/ControlledBy--kindOnly.png" alt="Example of a ControlledBy widget without name link" width="40%" style="border: 1px solid #D2D5D9">
95+
<img src="./assets/display-widgets/ControlledBy--kindOnly.png" alt="Example of a ControlledBy widget without name link" width="40%">
9696

9797
### `ConditionList`
9898

@@ -112,7 +112,7 @@ status:
112112
source: status.conditions
113113
```
114114

115-
<img src="./assets/display-widgets/ConditionList.png" alt="Example of a condition list widget" style="border: 1px solid #D2D5D9">
115+
<img src="./assets/display-widgets/ConditionList.png" alt="Example of a condition list widget">
116116

117117
This is an example of `ConditionList` with overriden statuses:
118118

@@ -139,7 +139,7 @@ status:
139139
- unknown
140140
```
141141

142-
<img src="./assets/display-widgets/ConditionListHighlights.png" alt="Example of a condition list widget with overriden statuses" style="border: 1px solid #D2D5D9">
142+
<img src="./assets/display-widgets/ConditionListHighlights.png" alt="Example of a condition list widget with overriden statuses">
143143

144144
### `ExternalLink`
145145

@@ -169,7 +169,7 @@ This is an example of source only usage:
169169
name: spec.servers.hosts
170170
```
171171

172-
<img src="./assets/display-widgets/ExternalLinks.png" alt="Example of a ExternalLink widget without linkFormula and textFormula" width="40%" style="border: 1px solid #D2D5D9">
172+
<img src="./assets/display-widgets/ExternalLinks.png" alt="Example of a ExternalLink widget without linkFormula and textFormula" width="40%">
173173

174174
### `ExternalLinkButton`
175175

@@ -190,7 +190,7 @@ See the following example:
190190
link: https://help.sap.com/docs/btp/sap-business-technology-platform/kyma-s-modular-approach
191191
```
192192

193-
<img src="./assets/display-widgets/ExternalLinkButton.png" alt="Example of a ExternalLinkButton widget" width="30%" style="border: 1px solid #D2D5D9">
193+
<img src="./assets/display-widgets/ExternalLinkButton.png" alt="Example of a ExternalLinkButton widget" width="30%">
194194

195195
### `JoinedArray`
196196

@@ -213,7 +213,7 @@ See the following example:
213213
separator: ' || '
214214
```
215215

216-
<img src="./assets/display-widgets/JoinedArray1.png" alt="Example of a joined array widget" width="40%" style="border: 1px solid #D2D5D9">
216+
<img src="./assets/display-widgets/JoinedArray1.png" alt="Example of a joined array widget" width="40%">
217217

218218
```yaml
219219
- name: Toppings
@@ -224,7 +224,7 @@ See the following example:
224224
widget: Badge
225225
```
226226

227-
<img src="./assets/display-widgets/JoinedArray2.png" alt="Example of a joined array widget" width="30%" style="border: 1px solid #D2D5D9">
227+
<img src="./assets/display-widgets/JoinedArray2.png" alt="Example of a joined array widget" width="30%">
228228

229229
### `Labels`
230230

@@ -245,7 +245,7 @@ See the following example:
245245
placeholder: '-'
246246
```
247247

248-
<img src="./assets/display-widgets/Lables.png" alt="Example of a Labels widget" width="30%" style="border: 1px solid #D2D5D9">
248+
<img src="./assets/display-widgets/Lables.png" alt="Example of a Labels widget" width="30%">
249249

250250
### `ResourceButton`
251251

@@ -272,7 +272,7 @@ This is an example for widget usage in the details section:
272272
icon: right-arrow
273273
```
274274

275-
<img src="./assets/display-widgets/ResourceButton.png" alt="Example of a ResourceButton widget" width="30%" style="border: 1px solid #D2D5D9">
275+
<img src="./assets/display-widgets/ResourceButton.png" alt="Example of a ResourceButton widget" width="30%">
276276

277277
### `ResourceLink`
278278

@@ -299,7 +299,7 @@ This is an example of the `ResourceLink` widget usage in the details section:
299299
kind: $item.spec.ownerReferences[0].kind
300300
```
301301

302-
<img src="./assets/display-widgets/ResourceLink.png" alt="Example of a ResourceLink widget" width="40%" style="border: 1px solid #D2D5D9">
302+
<img src="./assets/display-widgets/ResourceLink.png" alt="Example of a ResourceLink widget" width="40%">
303303

304304
### `Text`
305305

@@ -320,7 +320,7 @@ See the following example:
320320
placeholder: '-'
321321
```
322322

323-
<img src="./assets/display-widgets/Text.png" alt="Example of a text widget" width="40%" style="border: 1px solid #D2D5D9">
323+
<img src="./assets/display-widgets/Text.png" alt="Example of a text widget" width="40%">
324324

325325
## Block Widgets
326326

@@ -349,7 +349,7 @@ See the following example:
349349
disableMargin: true
350350
```
351351

352-
<img src="./assets/display-widgets/Alert.png" alt="Example of a text widget" width="70%" style="border: 1px solid #D2D5D9">
352+
<img src="./assets/display-widgets/Alert.png" alt="Example of a text widget" width="70%">
353353

354354
### `CodeViewer`
355355

@@ -369,7 +369,7 @@ See the following example:
369369
language: "$root.spec.language = 'JavaScript' ? 'javascript' : 'yaml'"
370370
```
371371

372-
<img src="./assets/display-widgets/CodeViewer.png" alt="Example of a CodeViewer widget" style="border: 1px solid #D2D5D9">
372+
<img src="./assets/display-widgets/CodeViewer.png" alt="Example of a CodeViewer widget">
373373

374374
### `Columns`
375375

@@ -398,7 +398,7 @@ See the following example:
398398
- source: spec.other-value
399399
```
400400

401-
<img src="./assets/display-widgets/Columns.png" alt="Example of a columns widget" style="border: 1px solid #D2D5D9">
401+
<img src="./assets/display-widgets/Columns.png" alt="Example of a columns widget">
402402

403403
### `EventList`
404404

@@ -422,7 +422,7 @@ See the following examples:
422422
defaultType: information
423423
```
424424

425-
<img src="./assets/display-widgets/EventList-InvolvedObject.png" alt="Example of a EventList widget" style="border: 1px solid #D2D5D9">
425+
<img src="./assets/display-widgets/EventList-InvolvedObject.png" alt="Example of a EventList widget">
426426

427427
---
428428

@@ -434,7 +434,7 @@ See the following examples:
434434
hideInvolvedObjects: true
435435
```
436436

437-
<img src="./assets/display-widgets/EventList-Hidden.png" alt="Example of a EventList widget with hidden involved objects" style="border: 1px solid #D2D5D9">
437+
<img src="./assets/display-widgets/EventList-Hidden.png" alt="Example of a EventList widget with hidden involved objects">
438438

439439
### `FeaturedCard`
440440

@@ -480,7 +480,7 @@ injections: |-
480480
location: ClusterOverview
481481
```
482482

483-
<img src="./assets/display-widgets/FeaturedCard.png" alt="Example of a FeaturedCard widget" style="border: 1px solid #D2D5D9">
483+
<img src="./assets/display-widgets/FeaturedCard.png" alt="Example of a FeaturedCard widget">
484484

485485
### `Panel`
486486

@@ -512,7 +512,7 @@ See the following example:
512512
- source: '$parent.entry2'
513513
```
514514

515-
<img src="./assets/display-widgets/Panel.png" alt="Example of a panel widget" style="border: 1px solid #D2D5D9">
515+
<img src="./assets/display-widgets/Panel.png" alt="Example of a panel widget">
516516

517517
See the following example:
518518

@@ -577,7 +577,7 @@ See the following examples"
577577
searchFunction: '$filter(spec.containers, function($c){ $contains($c.image, $input) })'
578578
```
579579

580-
<img src="./assets/display-widgets/ResourceList.png" alt="Example of a ResourceList widget" style="border: 1px solid #D2D5D9">
580+
<img src="./assets/display-widgets/ResourceList.png" alt="Example of a ResourceList widget">
581581

582582
---
583583

@@ -601,7 +601,7 @@ See the following examples"
601601
default: true
602602
```
603603

604-
<img src="./assets/display-widgets/ResourceListChildren.png" alt="Example of a ResourceList widget with children" style="border: 1px solid #D2D5D9">
604+
<img src="./assets/display-widgets/ResourceListChildren.png" alt="Example of a ResourceList widget with children">
605605

606606
### `ResourceRefs`
607607

@@ -621,7 +621,7 @@ See the following example:
621621
kind: Secret
622622
```
623623

624-
<img src="./assets/display-widgets/ResourceRefs.png" alt="Example of a ResourceRefs widget" style="border: 1px solid #D2D5D9">
624+
<img src="./assets/display-widgets/ResourceRefs.png" alt="Example of a ResourceRefs widget">
625625

626626
### `StatisticalCard`
627627

@@ -678,7 +678,7 @@ injections: |-
678678
location: ClusterOverview
679679
```
680680

681-
<img src="./assets/display-widgets/StatisticalCard.png" alt="Example of a StatisticalCard widget" style="border: 1px solid #D2D5D9" width="50%">
681+
<img src="./assets/display-widgets/StatisticalCard.png" alt="Example of a StatisticalCard widget" width="50%">
682682

683683
### `Table`
684684

@@ -715,7 +715,7 @@ See the following example:
715715
searchFunction: '$filter($item.price, function($p){ $p > $number($input) }'
716716
```
717717

718-
<img src="./assets/display-widgets/Table.png" alt="Example of a table widget" style="border: 1px solid #D2D5D9" width="40%">
718+
<img src="./assets/display-widgets/Table.png" alt="Example of a table widget" width="40%">
719719

720720
### `Tabs`
721721

@@ -737,7 +737,7 @@ See the following example:
737737
source: '...'
738738
```
739739

740-
<img src="./assets/display-widgets/Tabs.png" alt="Example of a tabs widget" style="border: 1px solid #D2D5D9">
740+
<img src="./assets/display-widgets/Tabs.png" alt="Example of a tabs widget">
741741

742742
## Radial Chart
743743

@@ -779,4 +779,4 @@ injections: |-
779779
location: ClusterOverview
780780
```
781781

782-
<img src="./assets/display-widgets/RadialChart.png" alt="Example of a RadialChart widget" style="border: 1px solid #D2D5D9" width="30%">
782+
<img src="./assets/display-widgets/RadialChart.png" alt="Example of a RadialChart widget" width="30%">

0 commit comments

Comments
 (0)