mirror of
https://github.com/home-assistant/home-assistant.io.git
synced 2025-07-15 21:36:52 +00:00
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:
parent
4e039ebaa4
commit
4fadb43ff5
@ -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>
|
||||
|
@ -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" />
|
||||
|
@ -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;
|
||||
|
@ -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>
|
||||
|
Loading…
x
Reference in New Issue
Block a user