docs: Add new demo gif to README (#231)

Since the prompt has been updated to have a new default character symbol, it's time we update the demo gif to reflect those changes.

6 files changed, 21 insertions, 2 deletions

diff --git a/README.md b/README.md
index a0ee9035a..23e0da18d 100644
--- a/README.md
+++ b/README.md
@@ -40,11 +40,16 @@
 
 <h1></h1>
 
+<p align="center">
 Starship is the minimal, blazing fast, and extremely customizable prompt for any shell!<br>
 The prompt shows information you need while you're working, while staying sleek and out of the way.
+<p>
 
 <p align="center">
-  <img alt="Starship with Hyper and One Dark" src="https://raw.githubusercontent.com/starship/starship/master/media/demo.gif">
+  <br>
+  <img alt="Starship with iTerm2 and the Snazzy theme" src="https://raw.githubusercontent.com/starship/starship/master/media/demo.gif" width="80%">
+  <br>
+  <br>
 </p>
 
 ## 🍬 Features
diff --git a/docs/.vuepress/public/demo.mp4 b/docs/.vuepress/public/demo.mp4
new file mode 100644
index 000000000..a6f50f125
--- /dev/null
+++ b/docs/.vuepress/public/demo.mp4
diff --git a/docs/.vuepress/public/demo.webm b/docs/.vuepress/public/demo.webm
new file mode 100644
index 000000000..c9de68fa5
--- /dev/null
+++ b/docs/.vuepress/public/demo.webm
diff --git a/docs/.vuepress/styles/palette.styl b/docs/.vuepress/styles/palette.styl
index 6f343b6b3..31c07ff29 100644
--- a/docs/.vuepress/styles/palette.styl
+++ b/docs/.vuepress/styles/palette.styl
@@ -8,8 +8,15 @@ $codeBgColor = #282c34
   min-width: 300px
   width: 100%
 
+.center
+  margin 0 auto;
+  width: 80%
+  .demo-video
+    width: 100%
+    margin: 50px 0
+
 #main-title
   display: none
 
 .hero
-  margin: 150px 25px
+  margin: 150px 25px 70px
diff --git a/docs/README.md b/docs/README.md
index 46930945b..ebdffe04a 100644
--- a/docs/README.md
+++ b/docs/README.md
@@ -21,6 +21,13 @@ footer: ISC Licensed | Copyright © 2019-present Starship Contributors
   </div>
 </div>
 
+<div class="center">
+  <video class="demo-video" autoplay muted loop>
+    <source src="/demo.webm" type="video/webm">
+    <source src="/demo.mp4" type="video/mp4">
+  </video>
+</div>
+
 ### Quick Install
 
 1. Install the **starship** binary:
diff --git a/media/demo.gif b/media/demo.gif
index ef84ed6eb..26ff47c86 100644
--- a/media/demo.gif
+++ b/media/demo.gif