Getting started: Add link to survey on installation experience (#28577)

sass/custom/_paulus.scss

@@ -174,6 +174,79 @@ a.integration-alert {
   }
 }
 
+.installation-survey {
+  box-shadow: none;
+  border: 1px solid rgba(0, 0, 0, .12);
+  border-radius: 4px;
+  padding-bottom: 64px;
+
+  h4 {
+    margin: 0 0 8px !important;
+
+    a {
+      text-decoration: none !important;
+      color: #000;
+    }
+  }
+
+  .links a {
+    font-weight: 400;
+    text-transform: none;
+  }
+}
+
+
+.survey-button {
+  padding-top: 8px;
+  button {
+    position: relative;
+    cursor: pointer;
+    font-size: 14px;
+    font-weight: bold;
+    padding: 8px 28px;
+    color: #fff;
+    background-color: #03a9f4;
+    border: none;
+    border-radius: 4px;
+    box-shadow: 0 2px 2px 0 rgba(0,0,0,.14), 0 3px 1px -2px rgba(0,0,0,.12), 0 1px 5px 0 rgba(0,0,0,.2);
+  }
+  button::before {
+    content: " ";
+    position: absolute;
+    top: 0;
+    bottom: 0;
+    left: 0;
+    right: 0;
+    opacity: 0.2;
+    border-radius: 4px;
+  }
+  button:hover {
+    box-shadow: 0 4px 8px 0 rgba(0,0,0,.14), 0 1px 7px 0 rgba(0,0,0,.12), 0 3px 1px -1px rgba(0,0,0,.2);
+  }
+  button:hover::before {
+    background-color: rgba(255,255,255,.8);
+  }
+  button:focus {
+    outline: none;
+  }
+  button:focus::before {
+    background-color: white;
+  }
+  button:active::before {
+    background-color: grey;
+  }
+  :host([active]) button {
+    color: rgba(0, 0, 0, 0.38);
+    background-color: rgba(0, 0, 0, 0.12);
+    box-shadow: none;
+    cursor: unset;
+    pointer-events: none;
+  }
+  .hidden {
+    display: none;
+  }
+}
+
 .frontpage {
   .material-card {
     margin-bottom: 24px;

source/_includes/installation/operating_system.md

@@ -361,6 +361,8 @@ _All these can be extended if your usage calls for more resources._
 
 {% endif %}
 
+{% include installation_survey.html %}
+
 With the Home Assistant Operating System installed and accessible, you can continue with onboarding.
 
 {% include getting-started/next_step.html step="Onboarding" link="/getting-started/onboarding/" %}

source/_includes/installation_survey.html

@@ -0,0 +1,11 @@
+<div class="material-card text installation-survey" id="survey_section">
+  <h4><a href="#installation-survey_section" class="title-link"><b> Help us improve Home Assistant</b></a></h4>
+  Have you just installed Home Assistant? The Home Assistant team is looking to talk to you to understand how the installation went.
+  <div class="survey-button">
+    <a
+      href="https://forms.gle/BBQN5yiu6f1qfq6g9"
+      target="_blank"
+      ><button> Help now</button></a>
+  </div>
+</div>
+<div><p></p></div>

source/installation/index.html

@@ -6,6 +6,7 @@ show_title: true
 toc: true
 ---
 
+{% include installation_survey.html %}
 
 <div class="intro">
     <p>

source/installation/raspberrypi.markdown

@@ -67,6 +67,8 @@ If you are running an older Windows version or have a stricter network configura
 
 Congratulations! You finished the Raspberry Pi setup!
 
+{% include installation_survey.html %}
+
 With the Home Assistant Operating System installed and accessible, you can now continue with onboarding.
 
 {% include getting-started/next_step.html step="Onboarding" link="/getting-started/onboarding/" %}