Skip to content

Commit 95dcea5

Browse files
committed
Update properties panel arcades
1 parent 5e206ce commit 95dcea5

File tree

1 file changed

+54
-2
lines changed

1 file changed

+54
-2
lines changed

docs/workspace/properties-panel.md

Lines changed: 54 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -17,7 +17,7 @@ The Properties Panel allows you to edit widget properties in real-time, providin
1717
height: 0,
1818
width: '100%'}}>
1919
<iframe
20-
src="https://demo.arcade.software/6AJA10eoZEfsJPrjKyrp?embed&show_copy_link=true"
20+
src="https://demo.arcade.software/ylwlUjH3jbhrogoB0riK?embed&show_copy_link=true"
2121
title=""
2222
style={{
2323
position: 'absolute',
@@ -44,13 +44,65 @@ The Properties Panel can be quickly accessed by double clicking any widget in t
4444

4545
:::note[Switching to Code]
4646
To switch from the visual property editor to a code-based property editor, hover near the property and click the "Switch to Code View" button. You can also cmd+click this button to jump to the specific line in the code editor where the property is defined.
47+
48+
<div style={{
49+
position: 'relative',
50+
paddingBottom: 'calc(50.67989417989418% + 41px)', // Keeps the aspect ratio and additional padding
51+
height: 0,
52+
width: '100%'}}>
53+
<iframe
54+
src="https://demo.arcade.software/3VzSt8gjrJw5tGwlIZFX?embed&show_copy_link=true"
55+
title=""
56+
style={{
57+
position: 'absolute',
58+
top: 0,
59+
left: 0,
60+
width: '100%',
61+
height: '100%',
62+
colorScheme: 'light'
63+
}}
64+
frameBorder="0"
65+
loading="lazy"
66+
webkitAllowFullScreen
67+
mozAllowFullScreen
68+
allowFullScreen
69+
allow="clipboard-write">
70+
</iframe>
71+
</div>
72+
<p></p>
73+
4774
:::
4875

4976

5077
## Adding Hidden Properties
5178
Some properties for widgets are hidden by default. However, any property that's accessible in the underlying widget can be set from the property panel.
5279
If you are looking for a hidden property, you can search for it or add it using the "+ Add Property" button at the top of the Property panel.
5380

81+
<div style={{
82+
position: 'relative',
83+
paddingBottom: 'calc(50.67989417989418% + 41px)', // Keeps the aspect ratio and additional padding
84+
height: 0,
85+
width: '100%'}}>
86+
<iframe
87+
src="https://demo.arcade.software/teMRY5B8qPfkeYrHwYRd?embed&show_copy_link=true"
88+
title=""
89+
style={{
90+
position: 'absolute',
91+
top: 0,
92+
left: 0,
93+
width: '100%',
94+
height: '100%',
95+
colorScheme: 'light'
96+
}}
97+
frameBorder="0"
98+
loading="lazy"
99+
webkitAllowFullScreen
100+
mozAllowFullScreen
101+
allowFullScreen
102+
allow="clipboard-write">
103+
</iframe>
104+
</div>
105+
<p></p>
54106

55107
## Modifiers
56108

@@ -91,7 +143,7 @@ Modifier widgets are hidden from the "Simplified View" in the [**widget tree**](
91143
height: 0,
92144
width: '100%'}}>
93145
<iframe
94-
src="https://demo.arcade.software/JPPGJVEhgwSBhviyKmUs?embed&show_copy_link=true"
146+
src="https://demo.arcade.software/NTeLIjTN1QAfLyyx4BVB?embed&show_copy_link=true"
95147
title=""
96148
style={{
97149
position: 'absolute',

0 commit comments

Comments
 (0)