Merge branch 'pan-tour-gradients' into 'master'

build-aux/org.gnome.TourDevel.json

 {
-    "app-id": "org.gnome.TourDevel",
+    "app-id" : "org.gnome.TourDevel",
     "runtime" : "org.gnome.Platform",
     "runtime-version" : "3.36",
     "sdk" : "org.gnome.Sdk",
@@ -23,13 +23,15 @@
         ],
         "env" : {
             "CARGO_HOME" : "/run/build/gnome-tour/cargo",
-            "RUST_BACKTRACE" : "1"
+            "RUST_BACKTRACE" : "1",
+            "GTK_DEBUG" : "interactive"
         }
     },
-    "modules" : [{
-            "name": "libhandy",
-            "buildsystem": "meson",
-            "config-opts": [
+    "modules" : [
+        {
+            "name" : "libhandy",
+            "buildsystem" : "meson",
+            "config-opts" : [
                 "-Dintrospection=disabled",
                 "-Dgtk_doc=false",
                 "-Dtests=false",
@@ -37,15 +39,17 @@
                 "-Dvapi=false",
                 "-Dglade_catalog=disabled"
             ],
-            "cleanup": [
+            "cleanup" : [
                 "/include",
                 "/lib/pkgconfig"
             ],
-            "sources": [{
-                "type": "git",
-                "url": "https://gitlab.gnome.org/GNOME/libhandy.git",
-                "commit": "94313c206258860b2428712e7ece1d02c5177857"
-            }]
+            "sources" : [
+                {
+                    "type" : "git",
+                    "url" : "https://gitlab.gnome.org/GNOME/libhandy.git",
+                    "commit" : "94313c206258860b2428712e7ece1d02c5177857"
+                }
+            ]
         },
         {
             "name" : "gnome-tour",
@@ -62,4 +66,3 @@
         }
     ]
 }
-

data/resources.gresource.xml

@@ -2,11 +2,17 @@
 <gresources>
   <gresource prefix="/org/gnome/Tour/">
       <file compressed="true" alias="style.css">resources/style.css</file>
-      <file compressed="true" alias="activities.svg">resources/assets/activities.svg</file>
-      <file compressed="true" alias="calendar.svg">resources/assets/calendar.svg</file>
-      <file compressed="true" alias="search.svg">resources/assets/search.svg</file>
-      <file compressed="true" alias="software.svg">resources/assets/software.svg</file>
-      <file compressed="true" alias="status-menu.svg">resources/assets/status-menu.svg</file>
+      <file compressed="true" alias="blank.svg">resources/assets/blank.svg</file>
+      <file compressed="true" alias="start-fg.svg">resources/assets/start-fg.svg</file>
+      <file compressed="true" alias="start-bg.svg">resources/assets/start-bg.svg</file>
+      <file compressed="true" alias="start-bg-bg.svg">resources/assets/start-bg-bg.svg</file>
+      <file compressed="true" alias="start-bg-bg-bg.svg">resources/assets/start-bg-bg-bg.svg</file>
+      <file compressed="true" alias="overview.svg">resources/assets/overview.svg</file>
+      <file compressed="true" alias="workspaces.svg">resources/assets/workspaces.svg</file>
+      <file compressed="true" alias="makeyourown.svg">resources/assets/makeyourown.svg</file>
+      <file compressed="true" alias="updown-bg.svg">resources/assets/updown-bg.svg</file>
+      <file compressed="true" alias="hand-fg.svg">resources/assets/hand-fg.svg</file>
+    <file compressed="true" alias="leftright-bg.svg">resources/assets/leftright-bg.svg</file>
       <file compressed="true" alias="ready-to-go.svg">resources/assets/ready-to-go.svg</file>
   </gresource>
 </gresources>

data/resources/assets/blank.svg

+<svg xmlns="http://www.w3.org/2000/svg" width="600" height="300"><defs id="defs5677"><clipPath clipPathUnits="userSpaceOnUse" id="a"><rect y="-101.694" x="508.542" height="80.287" width="271.154" rx="0" ry="0" fill="#1a5fb4" stroke-width="2.793" stroke-linecap="round" id="rect5674"/></clipPath></defs></svg>
\ No newline at end of file

data/resources/assets/calendar.svg

-<svg xmlns="http://www.w3.org/2000/svg" height="300" width="600"><defs><clipPath id="a" clipPathUnits="userSpaceOnUse"><path style="marker:none" d="M228.46 29.202h833.574V319.49c-330.237 0-408.683 175.77-833.574 175.77z" color="#000" overflow="visible" fill="#babdb6"/></clipPath><clipPath id="b" clipPathUnits="userSpaceOnUse"><path style="marker:none" color="#bebebe" overflow="visible" fill="#bebebe" stroke-width="2" d="M26.85 220.75h3.825v6.375H26.85z"/></clipPath><clipPath id="c" clipPathUnits="userSpaceOnUse"><path style="marker:none" color="#bebebe" overflow="visible" fill="#bebebe" stroke-width="2" d="M26.966 221.33h2.898v5.216h-2.898z"/></clipPath><clipPath id="d" clipPathUnits="userSpaceOnUse"><path style="marker:none" color="#bebebe" overflow="visible" fill="#bebebe" stroke-width="2" d="M26.999 221.502h1.876v4.873h-1.876z"/></clipPath></defs><g transform="matrix(2 0 0 2 149.175 -260.804)"><g transform="matrix(.2967 0 0 .2967 -114.583 123.556)" clip-path="url(#a)"><g transform="matrix(4 0 0 4 172 -591)"><path style="marker:none" color="#bebebe" overflow="visible" fill="none" d="M20 276h16v16H20z"/><rect ry=".379" rx=".385" y="279" x="23.062" height="2" width="2" style="marker:none" color="#000" overflow="visible"/><rect style="marker:none" width="2" height="2" x="27.062" y="279" rx=".385" ry=".379" color="#000" overflow="visible"/><rect ry=".379" rx=".385" y="279" x="31.062" height="2" width="2" style="marker:none" color="#000" overflow="visible"/><rect style="marker:none" width="2" height="2" x="23.062" y="283.016" rx=".385" ry=".379" color="#000" overflow="visible"/><rect ry=".379" rx=".385" y="283.016" x="27.062" height="2" width="2" style="marker:none" color="#000" overflow="visible"/><rect style="marker:none" width="2" height="2" x="31.062" y="283.016" rx=".385" ry=".379" color="#000" overflow="visible"/><rect ry=".379" rx=".385" y="287" x="23.062" height="2" width="2" style="marker:none" color="#000" overflow="visible"/><rect style="marker:none" width="2" height="2" x="27.062" y="287" rx=".385" ry=".379" color="#000" overflow="visible"/><rect ry=".379" rx=".385" y="287" x="31.062" height="2" width="2" style="marker:none" color="#000" overflow="visible"/></g><path d="M239.06 57.414h800.88V108.9s-4.029-10.606-11.1-10.96L249 99c-4.596-.354-9.94 5.5-9.94 5.5z" style="marker:none" color="#000" overflow="visible" fill="#fff"/><path style="marker:none" color="#000" overflow="visible" fill="#fff" stroke="#3584e4" stroke-width="3.372" d="M240.001 58.15h800.743v599.998H240.001z"/><path d="M1039.199 109.003c0-5.898-4.781-10.68-10.68-10.68H250.52c-5.898 0-10.68 4.782-10.68 10.68" fill="none" stroke="#3584e4" stroke-width="2.373" stroke-linecap="round"/><text style="line-height:0%;-inkscape-font-specification:'Cantarell Bold';text-align:center" x="628.846" y="86.187" font-weight="700" font-family="Cantarell" letter-spacing="0" word-spacing="0" text-anchor="middle" fill="#3584e4" transform="translate(11)"><tspan x="628.846" y="86.187" style="line-height:1.25" font-size="21.262">14:30</tspan></text><text style="line-height:0%;-inkscape-font-specification:'Cantarell Bold';text-align:start" x="238.059" y="86.187" font-weight="700" font-family="Cantarell" letter-spacing="0" word-spacing="0" fill="#3584e4" transform="translate(11)"><tspan x="238.059" y="86.187" style="line-height:1.25" font-size="21.262">Activities</tspan></text><path style="marker:none" color="#000" overflow="visible" opacity=".706" fill="none" d="M733.912 129.896h32.362v32.362h-32.362z"/></g><g fill="#3584e4"><path d="M169.928 144.76h.997l1.191-1.203.22.006v4.414h-.191l-1.22-1.21h-.997z" style="marker:none" color="#bebebe" overflow="visible"/><path transform="matrix(.3147 0 0 .3147 164.287 75.292)" clip-path="url(#b)" d="M27.178 220.396a1.275 1.275 0 00-.889 2.19 1.91 1.91 0 010 2.703 1.276 1.276 0 101.805 1.805 4.466 4.466 0 000-6.313 1.275 1.275 0 00-.916-.385z" style="line-height:normal;font-variant-ligatures:normal;font-variant-position:normal;font-variant-caps:normal;font-variant-numeric:normal;font-variant-alternates:normal;font-feature-settings:normal;text-indent:0;text-align:start;text-decoration-line:none;text-decoration-style:solid;text-decoration-color:#000;text-transform:none;text-orientation:mixed;white-space:normal;shape-padding:0;isolation:auto;mix-blend-mode:normal;solid-color:#000;solid-opacity:1" color="#000" font-weight="400" font-family="sans-serif" overflow="visible"/><path transform="matrix(.69232 0 0 .69232 154.87 -9.273)" clip-path="url(#c)" d="M27.186 221.098a.58.58 0 00-.405.996 2.606 2.606 0 010 3.687.58.58 0 10.82.82 3.769 3.769 0 000-5.328.58.58 0 00-.415-.175z" style="line-height:normal;font-variant-ligatures:normal;font-variant-position:normal;font-variant-caps:normal;font-variant-numeric:normal;font-variant-alternates:normal;font-feature-settings:normal;text-indent:0;text-align:start;text-decoration-line:none;text-decoration-style:solid;text-decoration-color:#000;text-transform:none;text-orientation:mixed;white-space:normal;shape-padding:0;isolation:auto;mix-blend-mode:normal;solid-color:#000;solid-opacity:1" color="#000" font-weight="400" font-family="sans-serif" overflow="visible"/><path transform="matrix(1.06996 0 0 1.06996 145.453 -93.84)" clip-path="url(#d)" d="M27.188 221.305a.375.375 0 00-.262.644 2.811 2.811 0 010 3.977.376.376 0 10.531.531 3.564 3.564 0 000-5.039.375.375 0 00-.27-.113z" style="line-height:normal;font-variant-ligatures:normal;font-variant-position:normal;font-variant-caps:normal;font-variant-numeric:normal;font-variant-alternates:normal;font-feature-settings:normal;text-indent:0;text-align:start;text-decoration-line:none;text-decoration-style:solid;text-decoration-color:#000;text-transform:none;text-orientation:mixed;white-space:normal;shape-padding:0;isolation:auto;mix-blend-mode:normal;solid-color:#000;solid-opacity:1" color="#000" font-weight="400" font-family="sans-serif" overflow="visible" opacity=".35"/><path d="M179.975 143.477a.401.401 0 00-.219.056 2.813 2.813 0 00-1.306 3.158 2.812 2.812 0 002.709 2.082 2.811 2.811 0 002.714-2.074 2.813 2.813 0 00-1.297-3.161.401.401 0 10-.404.693 2.003 2.003 0 01.927 2.258 2.002 2.002 0 01-1.939 1.482 2.002 2.002 0 01-1.934-1.487c-.235-.878.145-1.8.933-2.256a.401.401 0 00-.184-.751z" style="line-height:normal;font-variant-ligatures:normal;font-variant-position:normal;font-variant-caps:normal;font-variant-numeric:normal;font-variant-alternates:normal;font-feature-settings:normal;text-indent:0;text-align:start;text-decoration-line:none;text-decoration-style:solid;text-decoration-color:#000;text-transform:none;text-orientation:mixed;white-space:normal;shape-padding:0;isolation:auto;mix-blend-mode:normal;solid-color:#000;solid-opacity:1;marker:none" color="#000" font-weight="400" font-family="sans-serif" overflow="visible"/><path d="M181.157 142.749a.401.401 0 00-.395.407v2.006a.401.401 0 10.802 0v-2.006a.401.401 0 00-.407-.407z" style="line-height:normal;font-variant-ligatures:normal;font-variant-position:normal;font-variant-caps:normal;font-variant-numeric:normal;font-variant-alternates:normal;font-feature-settings:normal;text-indent:0;text-align:start;text-decoration-line:none;text-decoration-style:solid;text-decoration-color:#000;text-transform:none;text-orientation:mixed;white-space:normal;shape-padding:0;isolation:auto;mix-blend-mode:normal;solid-color:#000;solid-opacity:1" color="#000" font-weight="400" font-family="sans-serif" overflow="visible"/><path d="M162.635 143.189a.71.71 0 00-.702.702v1.806c0 .382.32.702.702.702h.05l-.313.627-.289.577h3.712l-.289-.577-.313-.627h.05a.71.71 0 00.702-.702v-1.806a.71.71 0 00-.702-.702zm.1.802h2.408v1.605h-2.408z" style="line-height:normal;-inkscape-font-specification:Sans;text-indent:0;text-align:start;text-decoration-line:none;text-transform:none;marker:none" color="#bebebe" font-weight="400" font-family="Sans" overflow="visible"/><path d="M163.538 146.8v1.605h.802V146.8zM161.531 148.405v.802h4.816v-.802z" style="line-height:normal;font-variant-ligatures:normal;font-variant-position:normal;font-variant-caps:normal;font-variant-numeric:normal;font-variant-alternates:normal;font-feature-settings:normal;text-indent:0;text-align:start;text-decoration-line:none;text-decoration-style:solid;text-decoration-color:#000;text-transform:none;text-orientation:mixed;white-space:normal;shape-padding:0;isolation:auto;mix-blend-mode:normal;solid-color:#000;solid-opacity:1;marker:none" color="#bebebe" font-weight="400" font-family="sans-serif" overflow="visible"/><path style="marker:none" d="M190.033 146.132l-1.505 1.504-1.504-1.504z" color="#000" overflow="visible"/></g><rect ry="0" rx="0" y="151.228" x="64.907" height="1.5" width="21.75" style="marker:none" fill="#3584e4"/></g><path d="M537.875 175.526c-196.155 0-223.373 104.707-475.75 104.707" style="marker:none" color="#000" overflow="visible" fill="none" stroke="#3584e4" stroke-width=".5" stroke-dasharray="1,2"/><path style="marker:none" d="M298.886 49.43l-10.061 10.06h-86.433a8.73 8.73 0 00-8.752 8.753v193.548c0 4.85 3.901 8.78 8.752 8.78H397.58c4.851 0 8.78-3.93 8.78-8.78V68.243c0-4.85-3.929-8.752-8.78-8.752h-88.66z" color="#000" overflow="visible" fill="#3584e4"/></svg>
\ No newline at end of file

data/resources/assets/hand-fg.svg

+<svg xmlns="http://www.w3.org/2000/svg" width="600" height="300"><g transform="translate(25 15)" fill="#3584e4"><circle cx="315" cy="105" r="35" opacity=".5"/><circle cx="245" cy="105" r="35" opacity=".5"/><circle cx="280" cy="95" r="35" opacity=".5"/></g><path d="M270 109a15 15 0 0115 15v72a3 3 0 003 3h1a3 3 0 003-3v-8a14 14 0 0114-14 14 14 0 0114 14v8a3 3 0 003 3h1a3 3 0 003-3v-8a14 14 0 0114-14 14 14 0 0114 14v8a3 3 0 003 3h1a3 3 0 003-3v-1a14 14 0 0114-14 14 14 0 0114 14v74a30 30 0 01-30 30h-80a48.284 48.284 0 01-34.142-14.142l-47.511-47.511a13.61 13.61 0 01-1.264-17.79l.834-1.113a12.198 12.198 0 0116.754-2.675l28.04 19.63A7.81 7.81 0 00255 229V124a15 15 0 0115-15z" opacity=".05"/><path d="M270 105a15 15 0 0115 15v72a3 3 0 003 3h1a3 3 0 003-3v-83a14 14 0 0114-14 14 14 0 0114 14v83a3 3 0 003 3h1a3 3 0 003-3v-73a14 14 0 0114-14 14 14 0 0114 14v73a3 3 0 003 3h1a3 3 0 003-3v-1a14 14 0 0114-14 14 14 0 0114 14v74a30 30 0 01-30 30h-80a48.284 48.284 0 01-34.142-14.142l-45.71-45.71a15.812 15.812 0 01-1.029-21.229l.042-.051a14.582 14.582 0 0120.344-2.14l23.762 18.926A7.229 7.229 0 00255 225V120a15 15 0 0115-15z" fill="#f6f5f4"/><path d="M196.258 219.491c-1.993 5.044-.093 11.674 3.742 15.509l45.857 45.857A48.284 48.284 0 00280 295h80c16.569 0 30-13.431 30-30v-10c0 16.569-13.431 30-30 30h-80a48.284 48.284 0 01-34.143-14.143l-46.564-46.74a13.61 13.61 0 01-3.035-4.626z" fill="#deddda"/><defs id="defs5677"><clipPath clipPathUnits="userSpaceOnUse" id="a"><rect y="-101.694" x="508.542" height="80.287" width="271.154" rx="0" ry="0" fill="#1a5fb4" stroke-width="2.793" stroke-linecap="round" id="rect5674"/></clipPath></defs></svg>
\ No newline at end of file

data/resources/assets/leftright-bg.svg

+<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="600" height="300"><defs><linearGradient id="a"><stop offset="0" stop-color="#1c71d8"/><stop offset="1" stop-color="#33d17a"/></linearGradient><linearGradient xlink:href="#a" id="b" x1="114.955" y1="150.56" x2="497.629" y2="150.56" gradientUnits="userSpaceOnUse"/></defs><path d="M343.412 6.958L264.768 85.6a16 16 0 01-22.627 0l-41.083-41.083a16 16 0 00-22.628 0l-58.789 58.79a16 16 90 000 22.627l41.083 41.083a16 16 90 010 22.627l-23.096 23.097a16 16 90 000 22.627l58.789 58.79a16 16 180 0022.627 0L343.27 169.932a16 16 180 0122.627 0l45.625 45.625a16 16 180 0022.627 0l58.79-58.79a16.015 16.015 90.027 00.01-22.637L366.028 6.969a15.985 15.985.027 00-22.616-.011z" fill="url(#b)"/><rect width="324.179" height="195.739" x="145.536" y="48.014" rx="26.854" ry="26.854" fill="#c0bfbc"/><path d="M169.965 153.585l-8.563-8.563 8.563-8.563m-8.563 8.563h17.126m265.533 8.563l8.563-8.563-8.563-8.563m8.563 8.563h-17.126" stroke-width="5.138" fill="none" stroke="#fff" stroke-linecap="round"/></svg>
\ No newline at end of file

data/resources/assets/start-bg-bg-bg.svg

+<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" height="400" width="600"><defs><linearGradient xlink:href="#a" id="b" x1="-1180" y1="1314.52" x2="-940" y2="1314.52" gradientUnits="userSpaceOnUse" gradientTransform="translate(1059.535 -574.008) scale(1.14415)"/><linearGradient id="a"><stop offset="0" stop-color="#3580e4"/><stop offset="1" stop-color="#8abfdd"/></linearGradient></defs><circle cx="-153.265" cy="930" r="137.298" transform="matrix(0 -1 1 0 -620 9.437)" fill="url(#b)"/></svg>
\ No newline at end of file

data/resources/assets/start-bg-bg.svg

+<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" height="400" width="600"><defs><linearGradient id="a"><stop offset="0" stop-color="#b2d0f4"/><stop offset="1" stop-color="#fff"/></linearGradient><linearGradient id="b"><stop offset="0" stop-color="#b2cdf1"/><stop offset="1" stop-color="#fff"/></linearGradient><linearGradient xlink:href="#a" id="c" x1="85" y1="195" x2="85" y2="165" gradientUnits="userSpaceOnUse"/><linearGradient xlink:href="#b" id="d" x1="245" y1="195" x2="245" y2="170" gradientUnits="userSpaceOnUse" gradientTransform="translate(670 20.563)"/></defs><path d="M97.5 140a27.5 27.5 0 00-26.938 21.969A17.5 17.5 0 0062.5 160 17.5 17.5 0 0045 177.5 17.5 17.5 0 0062.5 195a17.5 17.5 0 00.05 0H155a10 10 0 0010-10 10 10 0 00-10-10 10 10 0 00-7.871 3.83 20 20 0 00.371-3.83 20 20 0 00-20-20 20 20 0 00-5.17.68A27.5 27.5 0 0097.5 140z" fill="url(#c)" opacity=".5"/><path d="M905 175.563a20 20 0 00-20 20 20 20 0 0020 20h27.5a12.5 12.5 0 0012.5-12.5 12.5 12.5 0 00-12.5-12.5 12.5 12.5 0 00-7.643 2.611A20 20 0 00905 175.563z" opacity=".5" fill="url(#d)" transform="translate(-620 9.437)"/></svg>
\ No newline at end of file

data/resources/assets/start-bg.svg

+<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" height="400" width="1400"><defs><linearGradient id="b"><stop offset="0" stop-color="#c5dcf7"/><stop offset="1" stop-color="#fff"/></linearGradient><linearGradient xlink:href="#a" id="c" x1="85" y1="107.162" x2="85" y2="86" gradientUnits="userSpaceOnUse" gradientTransform="matrix(-3.35406 0 0 3.35406 1487.997 -204.114)"/><linearGradient id="a"><stop offset="0" stop-color="#eef4fc"/><stop offset="1" stop-color="#fff"/></linearGradient><linearGradient xlink:href="#b" id="d" gradientUnits="userSpaceOnUse" gradientTransform="matrix(-2.7272 0 0 2.7272 1434.713 -153.978)" x1="85" y1="107.162" x2="85" y2="86"/><linearGradient xlink:href="#b" id="e" gradientUnits="userSpaceOnUse" gradientTransform="matrix(-2.57314 0 0 2.57314 1337.412 -173.264)" x1="85" y1="110.304" x2="85" y2="86.986"/><linearGradient xlink:href="#b" id="f" gradientUnits="userSpaceOnUse" gradientTransform="translate(1495.83 -136.448) scale(1.54638)" x1="85" y1="107.162" x2="85" y2="82.135"/></defs><g transform="translate(-620 199.437)" fill="url(#c)"><path d="M1172.903 20.563c21.305.03 40.644 12.452 49.52 31.82a40.917 40.917 0 0118.66-4.55c21.519.032 39.339 16.716 40.77 38.187h.139c15.062 0 27.271 12.21 27.271 27.272 0 15.061-12.21 27.271-27.272 27.271h-152.722a32.727 32.727 0 01-32.727-32.726 32.727 32.727 0 0121.914-30.851 57.352 57.352 0 01-.097-1.874c0-30.124 24.42-54.544 54.544-54.544z" fill="url(#d)"/><path style="font-variation-settings:normal" d="M840.695.562a45.133 45.133 0 00-44.932 42.712c-16.205 2.541-28.526 16.495-28.526 33.436 0 18.754 15.098 33.853 33.853 33.853h87.959a26.127 26.127 0 0026.185-26.184 26.129 26.129 0 00-26.185-26.186h-4.848a45.133 45.133 0 001.764-12.497A45.133 45.133 0 00840.832.563a45.133 45.133 0 00-.136 0z" fill="url(#e)"/><path d="M1644.283-37.48a30.932 30.932 0 00-28.08 18.043 23.2 23.2 0 00-10.58-2.58c-12.201.018-22.305 9.478-23.117 21.653h-.079c-8.54 0-15.463 6.923-15.463 15.464 0 8.54 6.923 15.463 15.464 15.463h86.596a18.557 18.557 0 0018.557-18.556 18.557 18.557 0 00-12.426-17.494 32.52 32.52 0 00.055-1.062c0-17.081-13.846-30.928-30.927-30.928z" fill="url(#f)"/></g></svg>
\ No newline at end of file

data/resources/assets/start-fg.svg

+<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="600" height="300"><defs><radialGradient r="33.5" fy="48.406" fx="79.091" cy="48.406" cx="79.091" gradientTransform="matrix(.00476 1.62228 -1.43419 .00422 141.702 -82.047)" gradientUnits="userSpaceOnUse" id="e" xlink:href="#a"/><radialGradient r="12" fy="54.102" fx="71.474" cy="54.102" cx="71.474" gradientTransform="matrix(4.50607 0 0 4.76661 -259.306 -59.706)" gradientUnits="userSpaceOnUse" id="f" xlink:href="#b"/><radialGradient r="14.583" fy="49.777" fx="40.152" cy="49.777" cx="40.152" gradientTransform="matrix(.87016 4.27869 -2.56693 .52204 148.394 -163.306)" gradientUnits="userSpaceOnUse" id="g" xlink:href="#c"/><radialGradient r="14.583" fy="49.777" fx="40.152" cy="49.777" cx="40.152" gradientTransform="matrix(.87016 4.27869 -2.56693 .52204 148.394 -163.306)" gradientUnits="userSpaceOnUse" id="h" xlink:href="#c"/><linearGradient id="a"><stop offset="0" stop-color="#fff"/><stop offset=".519" stop-color="#fff"/><stop offset=".734" stop-color="#cfcfcf"/><stop offset="1" stop-color="#dcdcdc"/></linearGradient><linearGradient id="b"><stop offset="0" stop-color="#ed686f"/><stop offset=".865" stop-color="#a51d2d"/><stop offset="1" stop-color="#e01b24"/></linearGradient><linearGradient id="c"><stop offset="0" stop-color="#ed686f"/><stop offset=".911" stop-color="#a51d2d"/><stop offset="1" stop-color="#e01b24"/></linearGradient><clipPath id="d" clipPathUnits="userSpaceOnUse"><path d="M65 177c-18.502 0-33.5 14.998-33.5 33.5.008 7.371 4.131 15.807 11.388 23.526l12.617 13.171H75.02l12.137-13.245c6.636-7.059 11.33-16.117 11.344-23.452 0-18.502-14.998-33.5-33.5-33.5z" style="marker:none" fill="#fff" stroke-width="2"/></clipPath></defs><g transform="matrix(2.34097 0 0 2.2008 137.836 -339.542)" clip-path="url(#d)"><path transform="translate(-8 156)" d="M73 21c-18.502 0-33.5 14.998-33.5 33.5.008 7.371 3.5 14.422 6.94 20.379L58 98h30l11.605-23.21c3.395-5.88 6.88-12.955 6.895-20.29C106.5 35.998 91.502 21 73 21z" style="marker:none" fill="url(#e)"/><path d="M64 177s-18.332 12.132-18.332 30.989C45.668 222.56 61.842 254 61.842 254H67s1.333-31.44 1.333-46.011C68.333 189.132 64 177 64 177z" fill="url(#f)"/><path transform="translate(-8 156)" d="M71.983 21.106c-8.207.147-16.328 3.285-22.5 8.695-6.174 5.409-10.35 13.047-11.574 21.163-1.24 8.225.567 16.874 4.995 23.915L61.902 98h6.432L55.002 81.27c-4.3-5.395-8.472-11.07-10.596-17.634-2.123-6.564-2.166-13.8.003-20.348A32.824 32.824 0 0154.925 28.13a32.824 32.824 0 0117.058-7.025z" fill="url(#g)"/><path transform="matrix(-1 0 0 1 137.16 155.823)" d="M73.003 21.303c-7.709-1.547-15.97-.154-22.746 3.835-6.776 3.989-12.002 10.537-14.39 18.029a32.484 32.484 0 00-.757 16.805 32.484 32.484 0 007.794 14.907L54.11 98h13.383L54.16 74.356c-2.868-5.087-5.557-10.406-6.427-16.181-.87-5.775.036-11.771 2.374-17.123 4.173-9.55 12.836-17.022 22.895-19.748z" fill="url(#h)"/></g><path style="marker:none" d="M272.834 227.583v14.548a7.277 7.277 0 007.293 7.294h19.744c4.041 0 6.446-3.343 7.294-7.294v-14.548z" fill="#e5a50a"/><path style="marker:none" d="M272.834 224.462v14.548a7.277 7.277 0 007.293 7.293h19.744c4.041 0 6.446-3.341 7.294-7.293v-14.548z" fill="#e5a50a"/><path style="marker:none" d="M294.681 224.462v21.84h5.19c4.041 0 6.446-3.34 7.294-7.292v-14.548z" fill="#f3af0b"/></svg>
\ No newline at end of file

data/resources/assets/status-menu.svg

-<svg xmlns="http://www.w3.org/2000/svg" height="300" width="600"><defs><clipPath id="a" clipPathUnits="userSpaceOnUse"><path style="marker:none" d="M228.46 29.202h833.574V319.49c-330.237 0-408.683 175.77-833.574 175.77z" color="#000" overflow="visible" fill="#babdb6"/></clipPath><clipPath id="b" clipPathUnits="userSpaceOnUse"><path style="marker:none" color="#bebebe" overflow="visible" fill="#bebebe" stroke-width="2" d="M26.85 220.75h3.825v6.375H26.85z"/></clipPath><clipPath id="c" clipPathUnits="userSpaceOnUse"><path style="marker:none" color="#bebebe" overflow="visible" fill="#bebebe" stroke-width="2" d="M26.966 221.33h2.898v5.216h-2.898z"/></clipPath><clipPath id="d" clipPathUnits="userSpaceOnUse"><path style="marker:none" color="#bebebe" overflow="visible" fill="#bebebe" stroke-width="2" d="M26.999 221.502h1.876v4.873h-1.876z"/></clipPath></defs><g clip-path="url(#a)" transform="matrix(.59339 0 0 .59339 -79.99 -13.822)"><g transform="matrix(4 0 0 4 172 -591)"><path style="marker:none" color="#bebebe" overflow="visible" fill="none" d="M20 276h16v16H20z"/><rect style="marker:none" width="2" height="2" x="23.062" y="279" rx=".385" ry=".379" color="#000" overflow="visible"/><rect ry=".379" rx=".385" y="279" x="27.062" height="2" width="2" style="marker:none" color="#000" overflow="visible"/><rect style="marker:none" width="2" height="2" x="31.062" y="279" rx=".385" ry=".379" color="#000" overflow="visible"/><rect ry=".379" rx=".385" y="283.016" x="23.062" height="2" width="2" style="marker:none" color="#000" overflow="visible"/><rect style="marker:none" width="2" height="2" x="27.062" y="283.016" rx=".385" ry=".379" color="#000" overflow="visible"/><rect ry=".379" rx=".385" y="283.016" x="31.062" height="2" width="2" style="marker:none" color="#000" overflow="visible"/><rect style="marker:none" width="2" height="2" x="23.062" y="287" rx=".385" ry=".379" color="#000" overflow="visible"/><rect ry=".379" rx=".385" y="287" x="27.062" height="2" width="2" style="marker:none" color="#000" overflow="visible"/><rect style="marker:none" width="2" height="2" x="31.062" y="287" rx=".385" ry=".379" color="#000" overflow="visible"/></g><path style="marker:none" d="M239.06 57.414h800.88V108.9s-4.029-10.606-11.1-10.96L249 99c-4.596-.354-9.94 5.5-9.94 5.5z" color="#000" overflow="visible" fill="#fff"/><path style="marker:none" color="#000" overflow="visible" fill="#fff" stroke="#3584e4" stroke-width="3.372" d="M240.001 58.15h800.743v599.998H240.001z"/><path d="M1039.199 108.555c0-5.898-4.781-10.68-10.68-10.68H250.52c-5.898 0-10.68 4.782-10.68 10.68" fill="none" stroke="#3584e4" stroke-width="1.685" stroke-linecap="round"/><text y="86.187" x="628.846" style="line-height:0%;-inkscape-font-specification:'Cantarell Bold';text-align:center" font-weight="700" font-family="Cantarell" letter-spacing="0" word-spacing="0" text-anchor="middle" fill="#3584e4" transform="translate(11)"><tspan style="line-height:1.25" y="86.187" x="628.846" font-size="21.262">14:30</tspan></text><path d="M915.778 96.192h113.146c5.899 0 10.68 4.781 10.68 10.68" fill="none" stroke="#3584e4" stroke-width="5" stroke-linecap="square"/><text y="86.187" x="238.059" style="line-height:0%;-inkscape-font-specification:'Cantarell Bold';text-align:start" font-weight="700" font-family="Cantarell" letter-spacing="0" word-spacing="0" fill="#3584e4" transform="translate(11)"><tspan style="line-height:1.25" y="86.187" x="238.059" font-size="21.262">Activities</tspan></text><path style="marker:none" color="#000" overflow="visible" opacity=".706" fill="none" d="M733.912 129.896h32.362v32.362h-32.362z"/></g><g fill="#3584e4"><path style="marker:none" d="M488.249 30.825h1.993l2.383-2.408.439.013v8.827h-.382l-2.44-2.42h-1.993z" color="#bebebe" overflow="visible"/><path style="line-height:normal;font-variant-ligatures:normal;font-variant-position:normal;font-variant-caps:normal;font-variant-numeric:normal;font-variant-alternates:normal;font-feature-settings:normal;text-indent:0;text-align:start;text-decoration-line:none;text-decoration-style:solid;text-decoration-color:#000;text-transform:none;text-orientation:mixed;white-space:normal;shape-padding:0;isolation:auto;mix-blend-mode:normal;solid-color:#000;solid-opacity:1" d="M27.178 220.396a1.275 1.275 0 00-.889 2.19 1.91 1.91 0 010 2.703 1.276 1.276 0 101.805 1.805 4.466 4.466 0 000-6.313 1.275 1.275 0 00-.916-.385z" clip-path="url(#b)" transform="matrix(.62939 0 0 .62939 476.967 -108.112)" color="#000" font-weight="400" font-family="sans-serif" overflow="visible"/><path style="line-height:normal;font-variant-ligatures:normal;font-variant-position:normal;font-variant-caps:normal;font-variant-numeric:normal;font-variant-alternates:normal;font-feature-settings:normal;text-indent:0;text-align:start;text-decoration-line:none;text-decoration-style:solid;text-decoration-color:#000;text-transform:none;text-orientation:mixed;white-space:normal;shape-padding:0;isolation:auto;mix-blend-mode:normal;solid-color:#000;solid-opacity:1" d="M27.186 221.098a.58.58 0 00-.405.996 2.606 2.606 0 010 3.687.58.58 0 10.82.82 3.769 3.769 0 000-5.328.58.58 0 00-.415-.175z" clip-path="url(#c)" transform="matrix(1.38465 0 0 1.38465 458.132 -277.244)" color="#000" font-weight="400" font-family="sans-serif" overflow="visible"/><path style="line-height:normal;font-variant-ligatures:normal;font-variant-position:normal;font-variant-caps:normal;font-variant-numeric:normal;font-variant-alternates:normal;font-feature-settings:normal;text-indent:0;text-align:start;text-decoration-line:none;text-decoration-style:solid;text-decoration-color:#000;text-transform:none;text-orientation:mixed;white-space:normal;shape-padding:0;isolation:auto;mix-blend-mode:normal;solid-color:#000;solid-opacity:1" d="M27.188 221.305a.375.375 0 00-.262.644 2.811 2.811 0 010 3.977.376.376 0 10.531.531 3.564 3.564 0 000-5.039.375.375 0 00-.27-.113z" clip-path="url(#d)" transform="matrix(2.13992 0 0 2.13992 439.298 -446.375)" color="#000" font-weight="400" font-family="sans-serif" overflow="visible" opacity=".35"/><path style="line-height:normal;font-variant-ligatures:normal;font-variant-position:normal;font-variant-caps:normal;font-variant-numeric:normal;font-variant-alternates:normal;font-feature-settings:normal;text-indent:0;text-align:start;text-decoration-line:none;text-decoration-style:solid;text-decoration-color:#000;text-transform:none;text-orientation:mixed;white-space:normal;shape-padding:0;isolation:auto;mix-blend-mode:normal;solid-color:#000;solid-opacity:1;marker:none" d="M508.342 28.257a.803.803 0 00-.437.113 5.625 5.625 0 00-2.613 6.315 5.624 5.624 0 005.418 4.164 5.622 5.622 0 005.429-4.148 5.626 5.626 0 00-2.595-6.323.803.803 0 10-.807 1.387 4.007 4.007 0 011.853 4.516 4.004 4.004 0 01-3.878 2.964 4.004 4.004 0 01-3.869-2.975 4.006 4.006 0 011.866-4.511.803.803 0 00-.367-1.502z" color="#000" font-weight="400" font-family="sans-serif" overflow="visible"/><path style="line-height:normal;font-variant-ligatures:normal;font-variant-position:normal;font-variant-caps:normal;font-variant-numeric:normal;font-variant-alternates:normal;font-feature-settings:normal;text-indent:0;text-align:start;text-decoration-line:none;text-decoration-style:solid;text-decoration-color:#000;text-transform:none;text-orientation:mixed;white-space:normal;shape-padding:0;isolation:auto;mix-blend-mode:normal;solid-color:#000;solid-opacity:1" d="M510.705 26.8a.803.803 0 00-.79.815v4.013a.803.803 0 101.605 0v-4.013a.803.803 0 00-.815-.814z" color="#000" font-weight="400" font-family="sans-serif" overflow="visible"/><path style="line-height:normal;-inkscape-font-specification:Sans;text-indent:0;text-align:start;text-decoration-line:none;text-transform:none;marker:none" d="M473.662 27.681a1.42 1.42 0 00-1.404 1.404v3.611c0 .765.64 1.405 1.404 1.405h.1l-.627 1.254-.577 1.153h7.423l-.576-1.153-.627-1.254h.1a1.42 1.42 0 001.404-1.405v-3.61a1.42 1.42 0 00-1.404-1.405zm.2 1.605h4.815v3.21h-4.815z" color="#bebebe" font-weight="400" font-family="Sans" overflow="visible"/><path style="line-height:normal;font-variant-ligatures:normal;font-variant-position:normal;font-variant-caps:normal;font-variant-numeric:normal;font-variant-alternates:normal;font-feature-settings:normal;text-indent:0;text-align:start;text-decoration-line:none;text-decoration-style:solid;text-decoration-color:#000;text-transform:none;text-orientation:mixed;white-space:normal;shape-padding:0;isolation:auto;mix-blend-mode:normal;solid-color:#000;solid-opacity:1;marker:none" d="M475.467 34.904v3.21h1.606v-3.21z" color="#bebebe" font-weight="400" font-family="sans-serif" overflow="visible"/><path style="line-height:normal;font-variant-ligatures:normal;font-variant-position:normal;font-variant-caps:normal;font-variant-numeric:normal;font-variant-alternates:normal;font-feature-settings:normal;text-indent:0;text-align:start;text-decoration-line:none;text-decoration-style:solid;text-decoration-color:#000;text-transform:none;text-orientation:mixed;white-space:normal;shape-padding:0;isolation:auto;mix-blend-mode:normal;solid-color:#000;solid-opacity:1;marker:none" d="M471.455 38.113v1.605h9.63v-1.605z" color="#bebebe" font-weight="400" font-family="sans-serif" overflow="visible"/><path d="M528.458 33.566l-3.01 3.01-3.008-3.01z" style="marker:none" color="#000" overflow="visible"/></g><path style="marker:none" d="M538.272 175.362c-196.154 0-223.372 104.707-475.75 104.707" color="#000" overflow="visible" fill="none" stroke="#3584e4" stroke-dasharray="2,4" stroke-width=".5"/><path d="M496.913 49.208l-9.573 9.573H365.25a8.307 8.307 0 00-8.327 8.328v152.26c0 4.616 3.713 8.354 8.328 8.354h152.26a8.351 8.351 0 008.355-8.353V67.109c0-4.616-3.739-8.328-8.354-8.328H506.46z" style="marker:none" color="#000" overflow="visible" fill="#3584e4"/></svg>
\ No newline at end of file

data/resources/assets/updown-bg.svg

+<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="600" height="300"><defs><linearGradient id="a"><stop offset="0" stop-color="#9141ac"/><stop offset="1" stop-color="#ed333b"/></linearGradient><linearGradient xlink:href="#a" id="b" x1="260" y1="0" x2="260" y2="300" gradientUnits="userSpaceOnUse"/></defs><path d="M269.171 293.4l78.644-78.643a16 16 0 0122.627 0l41.083 41.083a16 16 0 0022.628 0l58.789-58.789a16 16 90 000-22.627l-41.083-41.083a16 16 90 010-22.627l23.096-23.097a16 16 90 000-22.627L416.166 6.2a16 16 180 00-22.627 0L269.314 130.426a16 16 180 01-22.627 0l-45.625-45.624a16 16 180 00-22.627 0l-58.79 58.789a16.015 16.015 90.027 00-.01 22.638l126.92 127.162a15.985 15.985.027 0022.616.011z" fill="url(#b)"/><rect width="324.179" height="195.739" x="145.536" y="48.014" rx="26.854" ry="26.854" fill="#c0bfbc"/><path d="M452.244 219.785l-8.563 8.563-8.563-8.563m8.563 8.563v-17.126m8.563-136.228l-8.563-8.563-8.563 8.563m8.563-8.563v17.125" stroke-width="5.138" fill="none" stroke="#fff" stroke-linecap="round"/></svg>
\ No newline at end of file

data/resources/style.css

@@ -20,11 +20,53 @@
   transition-duration: 250ms;
   transition-timing-function: ease-in-out;
 }
+/* pages */
 
-.last-page {
-  background-color: #4a86cf; /*GNOME blue*/
+@keyframes welcome-bg-move {
+    from { background-position: center 30%, -1400px 0, -600px 0, center 30%; }
+    to { background-position: center 30%, 0 0, 0 0, center 30%; }
+  }
+
+@keyframes up-and-down {
+    from { background-position: center 30%, center 30%, center; }
+    to { background-position: center 40%, center 30%, center; }
 }
 
-.last-page .page-title, .last-page .page-body {
-  color: white;
+@keyframes left-and-right {
+    from { background-position: 40% 30%, center 30%, center; }
+    to { background-position: 60% 30%, center 30%, center; }
 }
+
+.page { color: #000; }
+  .welcome-page {
+    background-repeat: no-repeat, repeat-x, repeat-x, no-repeat;
+    background-image: url('/org/gnome/Tour/start-fg.svg'),
+                      url('/org/gnome/Tour/start-bg.svg'),
+                      url('/org/gnome/Tour/start-bg-bg.svg'),
+                      url('/org/gnome/Tour/start-bg-bg-bg.svg');
+    background-position: center 30%, -1400px 0, -600px 0, center 30%; /* wasn't able to properly loop with relative offsets */
+    animation: welcome-bg-move 60s linear infinite;
+  }
+
+  /* .page:nth-child(2) { background: linear-gradient(to right, #3584e4, #1a5fb4); }  overview */
+  .page:nth-child(3) {  }  /* customize */
+  /* .page:nth-child(4) { background: linear-gradient(to right, #e66100, #c64600); }  workspaces */
+
+  .page:nth-child(5) { /* up down */
+    background: url('/org/gnome/Tour/hand-fg.svg'),
+                url('/org/gnome/Tour/updown-bg.svg');
+    background-repeat: no-repeat;
+    background-position: center 30%;
+    animation: up-and-down 2s ease-in-out infinite alternate;
+    }
+  .page:nth-child(6) {   /* left right */
+    background: url('/org/gnome/Tour/hand-fg.svg'),
+                url('/org/gnome/Tour/leftright-bg.svg');
+    background-repeat: no-repeat;
+    background-position: center 30%;
+    animation: left-and-right 2s ease-in-out infinite alternate;
+    }
+  .last-page { }
+  .last-page .page-title, .last-page .page-body { }
+
+

src/widgets/pages/image.rs

@@ -16,6 +16,7 @@ impl ImagePageWidget {
 
     fn init(&self, resource_uri: &str, head: String, body: String) {
         self.widget.set_property_expand(true);
+        self.widget.get_style_context().add_class("page");
         self.widget.set_halign(gtk::Align::Fill);
         self.widget.set_valign(gtk::Align::Fill);
 

src/widgets/pages/welcome.rs

@@ -73,13 +73,14 @@ impl WelcomePageWidget {
             .margin_top(24)
             .margin_bottom(24)
             .build();
+        self.widget.get_style_context().add_class("page");
+        self.widget.get_style_context().add_class("welcome-page");
 
         #[cfg(not(feature = "video"))]
         let header = {
             let icon = glib::get_os_info("LOGO").unwrap_or_else(|| "start-here-symbolic".into());
 
-            let logo = gtk::Image::from_icon_name(Some(&icon), gtk::IconSize::Dialog);
-            logo.set_pixel_size(196);
+            let logo = gtk::Image::from_resource("/org/gnome/Tour/blank.svg");
             logo.show();
 
             logo.upcast::<gtk::Widget>()
@@ -159,7 +160,7 @@ impl WelcomePageWidget {
         container.add(&title);
 
         let text = gtk::Label::new(Some(&gettext(
-            "Hi there! Take the tour to learn your way around and discover essential features.",
+            "Learn about new and essential features in GNOME 40.",
         )));
         text.get_style_context().add_class("body");
         text.set_margin_top(12);

src/widgets/window.rs

@@ -45,12 +45,11 @@ impl Window {
         self.paginator
             .borrow_mut()
             .add_page(WelcomePageWidget::new().widget.upcast::<gtk::Widget>());
-
         self.paginator.borrow_mut().add_page(
             ImagePageWidget::new(
-                "/org/gnome/Tour/activities.svg",
-                gettext("Open Activities to launch apps"),
-                gettext("The activities view can also be used to switch windows and search."),
+                "/org/gnome/Tour/overview.svg",
+                gettext("Get an Overview"),
+                gettext("Press Activities to see open windows and apps."),
             )
             .widget
             .upcast::<gtk::Widget>(),
@@ -58,9 +57,9 @@ impl Window {
 
         self.paginator.borrow_mut().add_page(
             ImagePageWidget::new(
-                "/org/gnome/Tour/search.svg",
-                gettext("Just type to search"),
-                gettext("In the activities view, just start typing to search for apps, settings and more."),
+                "/org/gnome/Tour/makeyourown.svg",
+                gettext("Make Apps Your Own"),
+                gettext("Arrange your apps so they make sense for you."),
             )
             .widget
             .upcast::<gtk::Widget>(),
@@ -68,9 +67,9 @@ impl Window {
 
         self.paginator.borrow_mut().add_page(
             ImagePageWidget::new(
-                "/org/gnome/Tour/calendar.svg",
-                gettext("Click the time to see notifications"),
-                gettext("The notifications popover also includes personal planning tools."),
+                "/org/gnome/Tour/workspaces.svg",
+                gettext("Keep on Top with Workspaces"),
+                gettext("Easily organise windows with the new workspaces view."),
             )
             .widget
             .upcast::<gtk::Widget>(),
@@ -78,9 +77,9 @@ impl Window {
 
         self.paginator.borrow_mut().add_page(
             ImagePageWidget::new(
-                "/org/gnome/Tour/status-menu.svg",
-                gettext("View system information and settings"),
-                gettext("Get an overview of the system status and quickly change settings."),
+                "/org/gnome/Tour/blank.svg",
+                gettext("Up/Down for the Overview"),
+                gettext("On a touchpad, use three-finger vertical swipes. Try it!"),
             )
             .widget
             .upcast::<gtk::Widget>(),
@@ -88,9 +87,9 @@ impl Window {
 
         self.paginator.borrow_mut().add_page(
             ImagePageWidget::new(
-                "/org/gnome/Tour/software.svg",
-                gettext("Use Software to find and install apps"),
-                gettext("Discover great apps through search, browsing and our recommendations."),
+                "/org/gnome/Tour/blank.svg",
+                gettext("Left/Right for Workspaces"),
+                gettext("On a touchpad, use three-finger horizontal swipes. Try it!"),
             )
             .widget
             .upcast::<gtk::Widget>(),