jeans/home-assistant.io
jeans/home-assistant.io
1
0
Fork 0
mirror of https://github.com/home-assistant/home-assistant.io.git synced 2025-07-23 17:27:19 +00:00
Code Issues Packages Projects Releases Wiki Activity

Update green landing page (#28971)

Browse Source
This commit is contained in:
Bram Kragten 2023-09-21 13:24:28 +02:00 committed by GitHub
parent e8944d3dba
commit 4c10fbef05
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
27 changed files with 327 additions and 10583 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

319
source/green/index.html
View File

@ -63,7 +63,14 @@ frontpage_image: /images/frontpage/green-frontpage.png
id="w-node-f82aa316-050e-d74a-ecac-5099737262df-3f61e7c1"
class="menu-button w-nav-button"
>
<div class="menu-mobile">
<div class="menu-mobile buy">
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24">
<path
d="M17,18A2,2 0 0,1 19,20A2,2 0 0,1 17,22C15.89,22 15,21.1 15,20C15,18.89 15.89,18 17,18M1,2H4.27L5.21,4H20A1,1 0 0,1 21,5C21,5.17 20.95,5.34 20.88,5.5L17.3,11.97C16.96,12.58 16.3,13 15.55,13H8.1L7.2,14.63L7.17,14.75A0.25,0.25 0 0,0 7.42,15H19V17H7C5.89,17 5,16.1 5,15C5,14.65 5.09,14.32 5.24,14.04L6.6,11.59L3,4H1V2M7,18A2,2 0 0,1 9,20A2,2 0 0,1 7,22C5.89,22 5,21.1 5,20C5,18.89 5.89,18 7,18M16,11L18.78,6H6.14L8.5,11H16Z"
/>
</svg>
</div>
<div class="menu-mobile" id="open-mobile-menu">
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24">
<path
d="M7.41,8.58L12,13.17L16.59,8.58L18,10L12,16L6,10L7.41,8.58Z"
@ -863,9 +870,11 @@ frontpage_image: /images/frontpage/green-frontpage.png
<div class="content-wrapper-page b-padding">
<div class="tag-wrapper">
<div class="bullet-icon-purple"></div>
<div>Switch from other smart home ecosystems at your own pace.</div>
<div>SIMPLE MIGRATION</div>
</div>
<h3 class="heading-medium">Switch over at your own pace.</h3>
<h3 class="heading-medium">
Switch from other smart home ecosystems at your own pace.
</h3>
<p>
Home Assistant works with your existing Apple HomeKit, Google Home*,
Samsung SmartThings**, and Amazon Alexa* setup, allowing a seamless
@ -1062,10 +1071,16 @@ frontpage_image: /images/frontpage/green-frontpage.png
</div>
<div id="w-node-_79ece5a2-49d8-dc2f-c851-03631dc2bea1-3f61e7c1">
<img
src="/images/green/Diagram.svg"
src="/images/green/ha-green-exploded-view.png"
loading="lazy"
width="640"
alt=""
sizes="(max-width: 479px) 87vw, (max-width: 767px) 89vw, 640px"
alt="Exploded view of Home Assistant Green"
srcset="
/images/green/ha-green-exploded-view-p-500.png 500w,
/images/green/ha-green-exploded-view-p-800.png 800w,
/images/green/ha-green-exploded-view.png 961w
"
class="image-product-mobile"
/>
</div>
@ -1760,15 +1775,303 @@ frontpage_image: /images/frontpage/green-frontpage.png
</div>
<div
id="w-node-_69907ac9-cc3c-f202-afac-c92986c4430e-3f61e7c1"
class="grid-image-wrapper box"
class="block-wrapper-content bg-color"
>
<div class="circular-ticker-wrapper">
<div class="circular-inner-reverse">
<div class="circular-wrap">
<img
src="/images/green/paulus.png"
src="/images/green/avatars/jr.jpg"
loading="lazy"
alt=""
class="cover-image"
class="cover-image-2"
/>
</div>
<div class="circular-wrap">
<img
src="/images/green/avatars/gs.jpg"
loading="lazy"
alt=""
class="cover-image-2"
/>
</div>
<div class="circular-wrap">
<img
src="/images/green/avatars/rr.jpg"
loading="lazy"
alt=""
class="cover-image-2"
/>
</div>
<div class="circular-wrap">
<img
src="/images/green/avatars/al.jpg"
loading="lazy"
alt=""
class="cover-image-2"
/>
</div>
<div class="circular-wrap">
<img
src="/images/green/avatars/bk.jpg"
loading="lazy"
alt=""
class="cover-image-2"
/>
</div>
<div class="circular-wrap">
<img
src="/images/green/avatars/fn.jpg"
loading="lazy"
alt=""
class="cover-image-2"
/>
</div>
<div class="circular-wrap">
<img
src="/images/green/avatars/sa.jpg"
loading="lazy"
alt=""
class="cover-image-2"
/>
</div>
<div class="circular-wrap">
<img
src="/images/green/avatars/kb.jpg"
loading="lazy"
alt=""
class="cover-image-2"
/>
</div>
<div class="circular-wrap">
<img
src="/images/green/avatars/mm.jpg"
loading="lazy"
alt=""
class="cover-image-2"
/>
</div>
<div class="circular-wrap">
<img
src="/images/green/avatars/mdb.jpg"
loading="lazy"
alt=""
class="cover-image-2"
/>
</div>
<div class="circular-wrap">
<img
src="/images/green/avatars/em.jpg"
loading="lazy"
alt=""
class="cover-image-2"
/>
</div>
<div class="circular-wrap">
<img
src="/images/green/avatars/mh.jpg"
loading="lazy"
alt=""
class="cover-image-2"
/>
</div>
<div class="circular-wrap">
<img
src="/images/green/avatars/ps.jpg"
loading="lazy"
alt=""
class="cover-image-2"
/>
</div>
<div class="circular-wrap">
<img
src="/images/green/avatars/pv.jpg"
loading="lazy"
alt=""
class="cover-image-2"
/>
</div>
<div class="circular-wrap">
<img
src="/images/green/avatars/pb.jpg"
loading="lazy"
alt=""
class="cover-image-2"
/>
</div>
<div class="circular-wrap">
<img
src="/images/green/avatars/md.jpg"
loading="lazy"
alt=""
class="cover-image-2"
/>
</div>
<div class="circular-wrap">
<img
src="/images/green/avatars/mvi.jpg"
loading="lazy"
alt=""
class="cover-image-2"
/>
</div>
<div class="circular-wrap">
<img
src="/images/green/avatars/pc.jpg"
loading="lazy"
alt=""
class="cover-image-2"
/>
</div>
</div>
<div class="circular-inner-reverse">
<div class="circular-wrap">
<img
src="/images/green/avatars/jr.jpg"
loading="lazy"
alt=""
class="cover-image-2"
/>
</div>
<div class="circular-wrap">
<img
src="/images/green/avatars/gs.jpg"
loading="lazy"
alt=""
class="cover-image-2"
/>
</div>
<div class="circular-wrap">
<img
src="/images/green/avatars/rr.jpg"
loading="lazy"
alt=""
class="cover-image-2"
/>
</div>
<div class="circular-wrap">
<img
src="/images/green/avatars/al.jpg"
loading="lazy"
alt=""
class="cover-image-2"
/>
</div>
<div class="circular-wrap">
<img
src="/images/green/avatars/bk.jpg"
loading="lazy"
alt=""
class="cover-image-2"
/>
</div>
<div class="circular-wrap">
<img
src="/images/green/avatars/fn.jpg"
loading="lazy"
alt=""
class="cover-image-2"
/>
</div>
<div class="circular-wrap">
<img
src="/images/green/avatars/sa.jpg"
loading="lazy"
alt=""
class="cover-image-2"
/>
</div>
<div class="circular-wrap">
<img
src="/images/green/avatars/kb.jpg"
loading="lazy"
alt=""
class="cover-image-2"
/>
</div>
<div class="circular-wrap">
<img
src="/images/green/avatars/mm.jpg"
loading="lazy"
alt=""
class="cover-image-2"
/>
</div>
<div class="circular-wrap">
<img
src="/images/green/avatars/mdb.jpg"
loading="lazy"
alt=""
class="cover-image-2"
/>
</div>
<div class="circular-wrap">
<img
src="/images/green/avatars/em.jpg"
loading="lazy"
alt=""
class="cover-image-2"
/>
</div>
<div class="circular-wrap">
<img
src="/images/green/avatars/mh.jpg"
loading="lazy"
alt=""
class="cover-image-2"
/>
</div>
<div class="circular-wrap">
<img
src="/images/green/avatars/ps.jpg"
loading="lazy"
alt=""
class="cover-image-2"
/>
</div>
<div class="circular-wrap">
<img
src="/images/green/avatars/pv.jpg"
loading="lazy"
alt=""
class="cover-image-2"
/>
</div>
<div class="circular-wrap">
<img
src="/images/green/avatars/pb.jpg"
loading="lazy"
alt=""
class="cover-image-2"
/>
</div>
<div class="circular-wrap">
<img
src="/images/green/avatars/md.jpg"
loading="lazy"
alt=""
class="cover-image-2"
/>
</div>
<div class="circular-wrap">
<img
src="/images/green/avatars/mvi.jpg"
loading="lazy"
alt=""
class="cover-image-2"
/>
</div>
<div class="circular-wrap">
<img
src="/images/green/avatars/pc.jpg"
loading="lazy"
alt=""
class="cover-image-2"
/>
</div>
</div>
</div>
</div>
</div>
</div>
</div>

2
source/green/script.js
View File

@ -95,7 +95,7 @@ if (document.location.search === "?order") {
showBuyDialog();
}
const menuMobileBtn = document.querySelector(".menu-mobile");
const menuMobileBtn = document.getElementById("open-mobile-menu");
const mobileMenu = document.querySelector(".w-nav-overlay");
const mobileMenuLinks = document.querySelectorAll(".w-nav-overlay a");

15
source/green/styles.css
View File

@ -1081,7 +1081,7 @@ button,
.brand {
height: 42px;
padding-bottom: 0;
padding-right: 35px;
padding-right: 20px;
}
.topnav-button {
@ -1719,6 +1719,10 @@ button,
grid-template-columns: 1fr 1fr 1fr;
}
.grid-3-col.specs {
grid-template-columns: 1fr 1.5fr 1fr;
}
.header-ticker-inner {
grid-column-gap: 24px;
align-items: center;
@ -1914,7 +1918,7 @@ button,
}
.block-wrapper-content {
height: 45em;
min-height: 45em;
border-radius: 48px;
align-items: center;
display: flex;
@ -2498,6 +2502,7 @@ button,
}
.block-wrapper-content {
min-height: unset;
height: 25em;
}
@ -2680,8 +2685,8 @@ button,
}
.menu-button {
padding-left: 5px;
padding-right: 10px;
padding-left: 0;
padding-right: 0;
}
.button {
@ -3373,6 +3378,8 @@ button,
}
#w-node-f82aa316-050e-d74a-ecac-5099737262df-3f61e7c1 {
display: flex;
flex-direction: row;
grid-area: 1 / 3 / 2 / 4;
justify-self: end;
}

10566
source/images/green/Diagram.svg
View File

File diff suppressed because it is too large Load Diff
Side by Side

Before

Width:  |  Height:  |  Size: 1.0 MiB

BIN
source/images/green/avatars/al.jpg Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 7.7 KiB

BIN
source/images/green/avatars/bk.jpg Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 5.8 KiB

BIN
source/images/green/avatars/em.jpg Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 9.1 KiB

BIN
source/images/green/avatars/fn.jpg Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 6.1 KiB

BIN
source/images/green/avatars/gs.jpg Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 4.7 KiB

BIN
source/images/green/avatars/jr.jpg Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 7.6 KiB

BIN
source/images/green/avatars/kb.jpg Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 6.7 KiB

BIN
source/images/green/avatars/md.jpg Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 6.1 KiB

BIN
source/images/green/avatars/mdb.jpg Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 7.0 KiB

BIN
source/images/green/avatars/mh.jpg Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 4.8 KiB

BIN
source/images/green/avatars/mm.jpg Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 7.0 KiB

BIN
source/images/green/avatars/mv.jpg Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 8.1 KiB

BIN
source/images/green/avatars/mvi.jpg Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 6.0 KiB

BIN
source/images/green/avatars/pb.jpg Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 5.9 KiB

BIN
source/images/green/avatars/pc.jpg Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 7.6 KiB

BIN
source/images/green/avatars/ps.jpg Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 8.2 KiB

BIN
source/images/green/avatars/pv.jpg Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 5.6 KiB

BIN
source/images/green/avatars/rr.jpg Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 7.1 KiB

BIN
source/images/green/avatars/sa.jpg Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 7.9 KiB

BIN
source/images/green/ha-green-exploded-view-p-500.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 95 KiB

BIN
source/images/green/ha-green-exploded-view-p-800.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 241 KiB

BIN
source/images/green/ha-green-exploded-view.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 1.2 MiB

BIN
source/images/green/paulus.png
View File

Binary file not shown.
Side by Side

Before

Width:  |  Height:  |  Size: 1.2 MiB