Skip to content

Commit 9043d31

Browse files
hcourdenthcourdent
authored
Added videos to documentation + changed a git sidebar (windmill-labs#118)
1 parent c5bbaed commit 9043d31

File tree

8 files changed

+65
-10
lines changed

8 files changed

+65
-10
lines changed

‎docs/apps/4_app_component_library.md

Lines changed: 61 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -90,7 +90,16 @@ Below you will find details about each component.
9090

9191
Containers allow you to host other components in a box. Moving a container means moving all the components inside.
9292

93-
![Container](../assets/apps/4_app_component_library/container.png)
93+
<video
94+
className="border-2 rounded-xl object-cover w-full h-full"
95+
autoPlay
96+
loop
97+
controls
98+
id="main-video"
99+
src="/videos/container.mp4"
100+
alt="container component"
101+
/>
102+
<br/>
94103

95104
To add a component to a container, you can either click on `Insert` while you selected the container, or your can move an existing component by selecting it and from `Settings` go to `Move to other grid`.
96105

@@ -106,7 +115,16 @@ To add a component to a container, you can either click on `Insert` while you se
106115

107116
Tabs components allow you to host other components in several tabs of box, they are containers with tabs.
108117

109-
![Tabs](../assets/apps/4_app_component_library/tabs.png)
118+
<video
119+
className="border-2 rounded-xl object-cover w-full h-full"
120+
autoPlay
121+
loop
122+
controls
123+
id="main-video"
124+
src="/videos/tabs.mp4"
125+
alt="tabs component"
126+
/>
127+
<br/>
110128

111129
To add a component to a tabs component, you can either click on `Insert` while you selected the tabs component, or your can move an existing component by selecting it and from `Settings` go to `Move to other grid`.
112130

@@ -154,7 +172,16 @@ Divider Y is a vertical line.
154172

155173
The drawer is container called by a button. Once you click on the button, a side tab will appear on which you can display other components.
156174

157-
![Drawer](../assets/apps/4_app_component_library/drawer.png)
175+
<video
176+
className="border-2 rounded-xl object-cover w-full h-full"
177+
autoPlay
178+
loop
179+
controls
180+
id="main-video"
181+
src="/videos/drawer.mp4"
182+
alt="drawer component"
183+
/>
184+
<br/>
158185

159186
To add a component to a container, you can either click on `Insert` while you selected the opened drawer, or your can move an existing component by selecting it and from `Settings` go to `Move to other grid`.
160187

@@ -175,7 +202,16 @@ To add a component to a container, you can either click on `Insert` while you se
175202

176203
Container split in x number of panes vertically.
177204

178-
![Vertical Split Panes](../assets/apps/4_app_component_library/vertical_split_panes.png)
205+
<video
206+
className="border-2 rounded-xl object-cover w-full h-full"
207+
autoPlay
208+
loop
209+
controls
210+
id="main-video"
211+
src="/videos/vertical_split.mp4"
212+
alt="vertical split panes"
213+
/>
214+
<br/>
179215

180216
To add a component to a vertical split pane, you can either click on `Insert` while you selected the vertical split pane, or your can move an existing component by selecting it and from `Settings` go to `Move to other grid`.
181217

@@ -190,7 +226,17 @@ To add a component to a vertical split pane, you can either click on `Insert` wh
190226

191227
Container split in x number of panes horizontally.
192228

193-
![Horizontal Split Panes](../assets/apps/4_app_component_library/horizontal_split_panes.png)
229+
<video
230+
className="border-2 rounded-xl object-cover w-full h-full"
231+
autoPlay
232+
loop
233+
controls
234+
id="main-video"
235+
src="/videos/horizontal_split.mp4"
236+
alt="horizontal split panes"
237+
/>
238+
<br/>
239+
194240

195241
To add a component to a horizontal split pane, you can either click on `Insert` while you selected the horizontal split pane, or your can move an existing component by selecting it and from `Settings` go to `Move to other grid`.
196242

@@ -688,7 +734,16 @@ Search can be configured in the following ways:
688734

689735
The AgGrid table component allows you to display an agnostic grid table.
690736

691-
![AgGrid Table](../assets/apps/4_app_component_library/aggrid_table.png)
737+
<video
738+
className="border-2 rounded-xl object-cover w-full h-full"
739+
autoPlay
740+
loop
741+
controls
742+
id="main-video"
743+
src="/videos/aggrid_table.mp4"
744+
alt="aggrid table"
745+
/>
746+
<br/>
692747

693748
#### AgGird Table Input
694749

‎sidebars.js

Lines changed: 4 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -39,14 +39,14 @@ const sidebars = {
3939
},
4040
{
4141
type: 'category',
42-
label: 'App Editor',
43-
items: [{ type: 'autogenerated', dirName: 'apps' }],
42+
label: 'Flow Editor',
43+
items: [{ type: 'autogenerated', dirName: 'flows' }],
4444
collapsed: true
4545
},
4646
{
4747
type: 'category',
48-
label: 'Flow Editor',
49-
items: [{ type: 'autogenerated', dirName: 'flows' }],
48+
label: 'App Editor',
49+
items: [{ type: 'autogenerated', dirName: 'apps' }],
5050
collapsed: true
5151
},
5252
{

‎static/videos/aggrid_table.mp4

507 KB
Binary file not shown.

‎static/videos/container.mp4

452 KB
Binary file not shown.

‎static/videos/drawer.mp4

377 KB
Binary file not shown.

‎static/videos/horizontal_split.mp4

198 KB
Binary file not shown.

‎static/videos/tabs.mp4

280 KB
Binary file not shown.

‎static/videos/vertical_split.mp4

255 KB
Binary file not shown.

0 commit comments

Comments
 (0)