Fix-green-landing-page (#33541)

Co-authored-by: Franck Nijhof <git@frenck.dev>
Co-authored-by: Franck Nijhof <frenck@frenck.nl>
This commit is contained in:
Madelena Mak 2024-07-05 11:34:47 -04:00 committed by GitHub
parent 4e039ebaa4
commit 4fadb43ff5
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
4 changed files with 84 additions and 86 deletions

View File

@ -1,45 +1,45 @@
{% include site/head.html %}
<body {% if page.body_id %} id="{{ page.body_id }}"{% elsif page.layout == "landingpage" %} id="landingpage"{% endif %}>
<header class='site-header {% if page.hero_unit %}dark{% endif %}'>
<header class='site-header {% if page.dark_header %}dark{% endif %}'>
{% include site/header.html %}
</header>
<div class="page-content">
{% if page.hero_unit %}
{% include site/hero_unit.html %}
{% endif %}
{% if page.hero_unit %}
{% include site/hero_unit.html %}
{% endif %}
<div class="grid-wrapper">
<div class="grid grid-center">
{% if page.is_post and page.sidebar == false %}
<div class="grid__item four-fifths lap-one-whole palm-one-whole">
{% elsif page.is_homepage or page.layout == "landingpage" %}
<div class="grid__item one-whole">
{% else %}
<div class="grid__item two-thirds lap-one-whole palm-one-whole">
{% endif %}
{% if page.is_homepage or page.layout == "landingpage" %}
{{ content }}
<div class="grid-wrapper">
<div class="grid grid-center">
{% if page.is_post and page.sidebar == false %}
<div class="grid__item four-fifths lap-one-whole palm-one-whole">
{% elsif page.is_homepage or page.layout == "landingpage" %}
<div class="grid__item one-whole">
{% else %}
{{ content | output_modder }}
<div class="grid__item two-thirds lap-one-whole palm-one-whole">
{% endif %}
{% if page.is_homepage or page.layout == "landingpage" %}
{{ content }}
{% else %}
{{ content | output_modder }}
{% endif %}
</div>
{% unless page.sidebar == false or page.layout == "landingpage" %}
<aside id="sidebar" class="grid__item one-third lap-one-whole palm-one-whole">
{% include site/sidebar.html %}
</aside>
{% endunless %}
</div>
{% unless page.sidebar == false or page.layout == "landingpage" %}
<aside id="sidebar" class="grid__item one-third lap-one-whole palm-one-whole">
{% include site/sidebar.html %}
</aside>
{% endunless %}
</div>
<footer>
{% include site/footer.html %}
</footer>
</div>
<footer>
{% include site/footer.html %}
</footer>
</div>
{% include javascripts/scripts.html %}
</body>
</html>

View File

@ -6,6 +6,7 @@ date: 2023-09-17
og_image: /images/blog/2023-09-ha10/green-intro.png
frontpage: true
frontpage_image: /images/frontpage/green-frontpage.png
dark_header: true
---
<link rel="stylesheet" href="/green/styles.css" />

View File

@ -12,10 +12,24 @@ html {
}
}
#landingpage .site-header .grid-wrapper {
max-width: 1380px !important;
padding: 0 30px !important;
}
#landingpage footer .grid-wrapper {
max-width: 1380px;
padding: 0 30px;
}
#landingpage #buy-dialog {
overflow-y: auto;
}
#landingpage #buy-dialog .distributors {
font-family: 'Instrument Sans', Figtree, sans-serif;
}
#landingpage .page-content {
height: auto;
overflow-x: unset;
@ -632,7 +646,7 @@ button,
padding-top: 35px;
position: -webkit-sticky;
position: sticky;
top: 42px;
top: 64px;
}
.margin-bottom-small {
@ -667,28 +681,32 @@ button,
transition: backdrop-filter 0.5s;
}
.wrappernav.scrolled {
-webkit-backdrop-filter: saturate(180%) blur(20px);
backdrop-filter: saturate(180%) blur(20px);
}
.wrappernav.wrappernavlocal {
background-color: rgba(0, 0, 0, 0);
margin-bottom: -12em;
position: -webkit-sticky;
position: sticky;
top: 64px;
transition: top .1s, background-color .1s;
}
.wrappernav.scrolled {
-webkit-backdrop-filter: saturate(180%) blur(20px);
backdrop-filter: saturate(180%) blur(20px);
background-color: rgba(255,255,255,.5);
top: 0;
}
.navgrid {
width: 100%;
max-width: 1100px;
max-width: 1380px;
min-height: 6em;
grid-column-gap: 0px;
grid-template-rows: auto;
grid-template-columns: auto 2fr auto;
align-items: center;
padding-left: 24px;
padding-right: 24px;
padding-left: 30px;
padding-right: 30px;
}
.navbar {
@ -725,7 +743,7 @@ button,
color: #c9c9c9;
background-color: #181818;
background-image: linear-gradient(360deg, #222, #2b2b2b);
font-family: Pretendard Regular, sans-serif;
font-family: Figtree, sans-serif;
font-weight: 600;
transition-property: all;
box-shadow: inset 0 1px rgba(255, 255, 255, 0.1),
@ -773,8 +791,9 @@ button,
.nav-link.nav-local {
text-transform: none;
font-size: 16px;
font-weight: 400;
font-size: 14px;
font-family: 'Instrument Sans', Figtree, sans-serif;
font-weight: 500;
}
.image-brand {
@ -1007,6 +1026,7 @@ button,
font-weight: 400;
line-height: 1.4;
text-decoration: none;
letter-spacing: 0 !important;
}
.heading-small {
@ -1017,6 +1037,11 @@ button,
font-weight: 400;
line-height: 1.4;
text-decoration: none;
letter-spacing: 0 !important;
}
h4.heading-small {
margin-top: 0 !important;
}
.text-white {
@ -1130,7 +1155,7 @@ button,
justify-content: center;
align-items: center;
padding: 14px 30px;
font-family: Pretendard, sans-serif;
font-family: Figtree, sans-serif;
font-size: 16px;
font-weight: 600;
text-decoration: none;
@ -1146,7 +1171,7 @@ button,
.topnav-button.black {
color: #fff;
background-color: #222;
font-family: Pretendard Regular, sans-serif;
font-family: Figtree, sans-serif;
font-weight: 600;
}
@ -1342,6 +1367,7 @@ button,
}
.paragraph-m {
font-family: 'Instrument Sans', Figtree, sans-serif;
color: #1d2126;
letter-spacing: 0;
margin-top: 0 !important;
@ -1349,6 +1375,7 @@ button,
font-size: 1.6em !important;
line-height: normal !important;
font-weight: 400;
letter-spacing: 0 !important;
}
.paragraph-m.text-white {
@ -1488,8 +1515,9 @@ button,
}
.main-paragraph-w {
font-family: 'Instrument Sans', Figtree, sans-serif;
color: #1d2126;
letter-spacing: 0;
letter-spacing: 0 !important;
margin-bottom: 0;
font-size: 1.4em;
font-weight: 400;
@ -1843,8 +1871,9 @@ button,
}
.paragraph-small {
font-family: 'Instrument Sans', Figtree, sans-serif;
color: rgba(29, 33, 38, 0.75);
letter-spacing: 0;
letter-spacing: 0 !important;
margin-bottom: 0;
font-size: 1.1em !important;
font-weight: 400;
@ -1925,7 +1954,7 @@ button,
padding-top: 12px;
padding-bottom: 12px;
padding-left: 29px;
font-family: Pretendard Bold, sans-serif;
font-family: Figtree, sans-serif;
font-size: 16px;
font-weight: 700;
}
@ -2311,7 +2340,7 @@ button,
.topnav-button {
width: auto;
padding: 18px 40px;
font-family: Pretendard, sans-serif;
font-family: Figtree, sans-serif;
font-weight: 400;
}
@ -2823,6 +2852,7 @@ button,
.heading-small {
font-size: 14px;
line-height: 1.3;
letter-spacing: 0;
}
.stats-number.large {
@ -3640,27 +3670,6 @@ button,
}
}
@font-face {
font-family: "Pretendard Bold";
src: url("/green/fonts/Pretendard-Bold.woff2") format("woff2");
font-weight: 700;
font-style: normal;
font-display: swap;
}
@font-face {
font-family: "Pretendard Regular";
src: url("/green/fonts/Pretendard-Regular.woff2") format("woff2");
font-weight: 400;
font-style: normal;
font-display: swap;
}
@font-face {
font-family: "Pretendard";
src: url("/green/fonts/Pretendard-SemiBold.woff2") format("woff2");
font-weight: 600;
font-style: normal;
font-display: swap;
}
@font-face {
font-family: "Figtree";
font-style: normal;

View File

@ -2,6 +2,7 @@
show_title: false
sidebar: false
hero_unit: true
dark_header: true
is_homepage: true
regenerate: true
feedback: false
@ -315,24 +316,11 @@ feedback: false
src="/images/press/LinuxMagazine.png"
/></div></a>
<a
href="https://www.heise.de/select/ct/2017/26/1513910625909214"
target="_blank"
rel="noopener"
><div class="material-card"><img alt="Ct logo" src="/images/press/ct.png"
/></div></a>
</div>
</section>
<!-- Sponsor section -->
<section class="sponsor">
<div class="sponsored-by grid__item one-whole">
<h2>The Home Assistant project is sponsored by</h2>
<div class="material-card text">
<a href="https://www.nabucasa.com"
><img alt="Nabu Casa logo" src="/images/sponsors/nabu_casa.svg"
<a
href="https://www.heise.de/select/ct/2017/26/1513910625909214"
target="_blank"
rel="noopener"
><img alt="Ct logo" src="/images/press/ct.png"
/></a>
</div>
</div>