dash-frontend: Welcome screen: Add watch-wrist page

dash-frontend/assets/dashboard/watch.svg

@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" width="32" height="32" viewBox="0 0 24 24"><!-- Icon from Google Material Icons by Material Design Authors - https://github.com/material-icons/material-icons/blob/master/LICENSE --><path fill="currentColor" d="M20 12c0-2.54-1.19-4.81-3.04-6.27L16 0H8l-.95 5.73C5.19 7.19 4 9.45 4 12s1.19 4.81 3.05 6.27L8 24h8l.96-5.73A7.98 7.98 0 0 0 20 12M6 12c0-3.31 2.69-6 6-6s6 2.69 6 6s-2.69 6-6 6s-6-2.69-6-6"/></svg>

dash-frontend/assets/gui/tab/welcome_page_1.xml

@@ -2,11 +2,12 @@
   <include src_builtin="welcome_common.xml"/>
   
   <elements>
-    <Video macro="video_overlay_component" src_builtin="video/onboarding_double_press.ivf">
+    <rectangle color="#103142" width="100%" height="100%" position="absolute"/>
+    <Video macro="video_overlay_component" src_builtin="video/onboarding_watch.ivf" aspect_ratio="1.0">
       <div macro="video_overlay_content">
-        <PageTitle icon="dashboard/panorama.svg" title="Working Set"/>
+        <PageTitle icon="dashboard/watch.svg" title="Watch"/>
         <div position="relative" align_self="end" padding="16">
-          <TextDesc text="Double-press B (on Index) or Y (on Meta) to toggle the visibility of your workspace. Try it now."/>
+          <TextDesc text="Look at your left wrist. That's your watch."/>
         </div>
       </div>
     </Video>

dash-frontend/assets/gui/tab/welcome_page_2.xml

@@ -1,17 +1,12 @@
 <layout>
   <include src_builtin="welcome_common.xml"/>
-    
+  
   <elements>
-    <Video macro="video_overlay_component" src_builtin="video/onboarding_laser_colors.ivf">
+    <Video macro="video_overlay_component" src_builtin="video/onboarding_double_press.ivf">
       <div macro="video_overlay_content">
-        <PageTitle icon="dashboard/click.svg" title="Laser Colors"/>
+        <PageTitle icon="dashboard/panorama.svg" title="Working Set"/>
-        <div position="relative" flex_direction="row" gap="16" margin="16" align_self="end" justify_self="end" align_items="center">
+        <div position="relative" align_self="end" padding="16">
-          <rectangle flex_direction="column" gap="8" padding="8" round="4" border_color="~color_accent" border="2" >
+          <TextDesc text="Double-press B (on Index) or Y (on Meta) to toggle the visibility of your workspace. Try it now."/>
-            <label size="16" weight="bold" color="#00FFFF" text="— Regular Mode: Blue laser"/>
-            <label size="16" weight="bold" color="#FFAA00" text="— Right-click Mode: Orange laser" />
-            <label size="16" weight="bold" color="#FF88FF" text="— Middle-click Mode: Purple laser" />
-          </rectangle>
-          <label wrap="1" size="18" width="450" weight="bold" shadow="#000000" text="Much of the functionality in WayVR depends on what color of laser is used to interact with a UI element. You don't need to press these buttons, just touch them!"/>
         </div>
       </div>
     </Video>

dash-frontend/assets/gui/tab/welcome_page_3.xml

@@ -1,5 +1,19 @@
 <layout>
+  <include src_builtin="welcome_common.xml"/>
+    
   <elements>
-    <label text="Page 3" weight="bold" size="50"/>
+    <Video macro="video_overlay_component" src_builtin="video/onboarding_laser_colors.ivf">
+      <div macro="video_overlay_content">
+        <PageTitle icon="dashboard/click.svg" title="Laser Colors"/>
+        <div position="relative" flex_direction="row" gap="16" margin="16" align_self="end" justify_self="end" align_items="center">
+          <rectangle flex_direction="column" gap="8" padding="8" round="4" border_color="~color_accent" border="2" >
+            <label size="16" weight="bold" color="#00FFFF" text="— Regular Mode: Blue laser"/>
+            <label size="16" weight="bold" color="#FFAA00" text="— Right-click Mode: Orange laser" />
+            <label size="16" weight="bold" color="#FF88FF" text="— Middle-click Mode: Purple laser" />
+          </rectangle>
+          <label wrap="1" size="18" width="450" weight="bold" shadow="#000000" text="Much of the functionality in WayVR depends on what color of laser is used to interact with a UI element. You don't need to press these buttons, just touch them!"/>
+        </div>
+      </div>
+    </Video>
   </elements>
 </layout>