converted gif to webm format

Signed-off-by: shubhusion <[email protected]>

Gemfile.lock

@@ -10,10 +10,10 @@ GEM
       http_parser.rb (~> 0)
     eventmachine (1.2.7)
     ffi (1.16.3)
-    ffi (1.16.3-x64-mingw-ucrt)
+    ffi (1.16.3-x64-unknown)
     forwardable-extended (2.6.0)
     google-protobuf (3.25.3-arm64-darwin)
-    google-protobuf (3.25.3-x64-mingw-ucrt)
+    google-protobuf (3.25.3-x64-unknown)
     google-protobuf (3.25.3-x86_64-darwin)
     google-protobuf (3.25.3-x86_64-linux)
     http_parser.rb (0.8.0)
@@ -65,21 +65,17 @@ GEM
     pathutil (0.16.2)
       forwardable-extended (~> 2.6)
     public_suffix (5.0.4)
+    rake (13.2.1)
     rb-fsevent (0.11.2)
     rb-inotify (0.10.1)
       ffi (~> 1.0)
     rexml (3.2.8)
       strscan (>= 3.0.9)
     rouge (4.2.0)
     safe_yaml (1.0.5)
-    sass-embedded (1.63.6-arm64-darwin)
-      google-protobuf (~> 3.23)
-    sass-embedded (1.63.6-x64-mingw-ucrt)
-      google-protobuf (~> 3.23)
-    sass-embedded (1.63.6-x86_64-darwin)
-      google-protobuf (~> 3.23)
-    sass-embedded (1.63.6-x86_64-linux-gnu)
+    sass-embedded (1.63.6)
       google-protobuf (~> 3.23)
+      rake (>= 13.0.0)
     strscan (3.1.0)
     terminal-table (3.0.2)
       unicode-display_width (>= 1.1.1, < 3)
@@ -94,7 +90,7 @@ GEM
 PLATFORMS
   arm64-darwin-22
   arm64-darwin-23
-  x64-mingw-ucrt
+  x64-unknown
   x86_64-darwin-23
   x86_64-linux
 
@@ -112,4 +108,4 @@ DEPENDENCIES
   wdm (>= 0.1.0)
 
 BUNDLED WITH
-   2.4.21
+   2.4.22

_includes/features.html

@@ -63,8 +63,10 @@ <h2>Manage your connections with <span class="special-text">Environments</span><
         <div class="image flex" style="flex-flow: column wrap;">
             <div align="center" style="margin-top: 3rem;">
                 <div style="display: flex;">
-                    <img src="/assets/images/features/environments.gif" class="screenshot"
-                        alt="Multi-cluster Kubernetes Manager" loading="lazy" />
+                    <video autoplay loop muted playsinline class="screenshot" alt="Multi-cluster Kubernetes Manager">
+                        <source src="/assets/images/features/environments.webm" type="video/webm">
+                        Your browser does not support the video tag.
+                    </video>
                     <span>
                 <!-- <p style="font-size: 1rem;margin:0rem;padding:0rem;color:#666;font-style: italic;">(excerpt: patterns
                             in-action)</p> -->
@@ -87,8 +89,10 @@ <h2><span class="special-text">Workspaces</span>: Your team's Google Drive for c
         <div class="image flex" style="flex-flow: column wrap;">
             <div align="center" style="margin-top: 3rem;">
                 <div style="display: flex;">
-                    <img src="/assets/images/features/workspace.gif" class="screenshot"
-                        alt="Multi-cluster Kubernetes Manager" loading="lazy" />
+                    <video autoplay loop muted playsinline class="screenshot" alt="Multi-cluster Kubernetes Manager">
+                        <source src="/assets/images/features/workspace.webm" type="video/webm">
+                        Your browser does not support the video tag.
+                    </video>                    
                     <span>
                 <!-- <p style="font-size: 1rem;margin:0rem;padding:0rem;color:#666;font-style: italic;">(excerpt: patterns
                             in-action)</p> -->
@@ -114,8 +118,10 @@ <h2>Manage infra performance with <span class="special-text">Performance Profile
         <div class="image flex" style="flex-flow: column wrap;">
             <div align="center" style="margin-top: 3rem;">
                 <div style="display: flex;">
-                    <img src="/assets/images/features/performance-metrics.gif" class="screenshot"
-                    alt="Multi-cluster Kubernetes Manager" loading="lazy" />
+                    <video autoplay loop muted playsinline class="screenshot" alt="Multi-cluster Kubernetes Manager" >
+                        <source src="/assets/images/features/performance-metrics.webm" type="video/webm" >
+                        Your browser does not support the video tag.
+                    </video>                    
                     <span>
                 <!-- <p style="font-size: 1rem;margin:0rem;padding:0rem;color:#666;font-style: italic;">(excerpt: patterns
                             in-action)</p> -->