Update logo (#1932)

docusaurus.config.js

@@ -11,8 +11,8 @@ module.exports = {
       title: "Developers",
       logo: {
         alt: "Home Assistant",
-        src: "img/logo-pretty.svg",
-        srcDark: "img/logo-pretty.svg",
+        src: "img/logo.svg",
+        srcDark: "img/logo.svg",
       },
       items: [
         {
@@ -43,7 +43,7 @@ module.exports = {
       logo: {
         alt: "Home Assistant",
         src: "img/logo-white.svg",
-        height: "70px",
+        height: "30px",
         href: "https://www.home-assistant.io",
       },
       style: "dark",

src/pages/index.js

@@ -135,14 +135,7 @@ function Home() {
       <header className={clsx("hero hero--primary", styles.heroBanner)}>
         <div className="container">
           <div className="row">
-            <div className={clsx("col col--5")}>
-              <img
-                className={styles.heroLogo}
-                alt="Home Assistant Logo"
-                src="/img/logo-white.svg"
-              />
-            </div>
-            <div className={clsx("col col--5")}>
+            <div className={clsx("col col--10")}>
               <h1 className={styles.heroTitle}>{siteConfig.title}</h1>
               <p className={styles.heroTagline}>{siteConfig.tagline}</p>
               <p>

src/pages/styles.module.css

@@ -5,23 +5,20 @@
 
 .heroBanner {
   padding: 4rem 0;
-  text-align: center;
   position: relative;
   overflow: hidden;
+  background: url(/img/hero-image.png);
+  background-size: cover;
+  color: #ffffff;
+  text-shadow: 0px 0px 4px #4caee3;
 }
 
 .heroTitle {
-  font-size: 3rem;
-  color: #ffffff;
+  font-size: 2rem;
 }
 
 .heroTagline {
   font-size: 1.4rem;
-  color: #ffffff;
-}
-
-.heroLogo {
-  max-height: 16em;
 }
 
 a.heroText{