mirror of
https://github.com/home-assistant/home-assistant.io.git
synced 2025-07-19 07:17:14 +00:00
2020.12 + Blue
This commit is contained in:
Franck Nijhof
parent
2ae7ed2082
commit
c49a656d53
@ -99,8 +99,8 @@ social:
|
|||||||
account: home_assistant
|
account: home_assistant
|
||||||
|
|
||||||
# Home Assistant release details
|
# Home Assistant release details
|
||||||
current_major_version: 1
|
current_major_version: 2020
|
||||||
current_minor_version: 0
|
current_minor_version: 12
|
||||||
current_patch_version: 0
|
current_patch_version: 0
|
||||||
date_released: 2020-12-13
|
date_released: 2020-12-13
|
||||||
|
|
||||||
|
|||||||
45
plugins/details.rb
Normal file
45
plugins/details.rb
Normal file
@ -0,0 +1,45 @@
|
|||||||
|
module Jekyll
|
||||||
|
class DetailsBlock < Liquid::Block
|
||||||
|
|
||||||
|
def render_details_block(vars:, converter:, classes: nil, parent_type: nil)
|
||||||
|
result = Array.new
|
||||||
|
result << vars.map do |entry|
|
||||||
|
markup = Array.new
|
||||||
|
markup << "<div class='details-block-item' onclick='showDetails(this)'>"
|
||||||
|
markup << "<div class='details-block-title'>#{entry['title']}"
|
||||||
|
markup << '<svg id="down" style="display: block;" width="24" height="24" viewBox="0 0 24 24"><path d="M7.41,8.58L12,13.17L16.59,8.58L18,10L12,16L6,10L7.41,8.58Z" /></svg>'
|
||||||
|
markup << '<svg id="up" style="display: none;" width="24" height="24" viewBox="0 0 24 24"><path d="M7.41,15.41L12,10.83L16.59,15.41L18,14L12,8L6,14L7.41,15.41Z" /></svg>'
|
||||||
|
markup << "</div>"
|
||||||
|
markup << "<div class='details-block-content' hidden onclick>#{converter.convert(entry['content'].to_s)}</div>"
|
||||||
|
markup << "</div>"
|
||||||
|
end
|
||||||
|
result.join
|
||||||
|
end
|
||||||
|
|
||||||
|
def render(context)
|
||||||
|
contents = super(context)
|
||||||
|
vars = SafeYAML.load(contents)
|
||||||
|
|
||||||
|
site = context.registers[:site]
|
||||||
|
converter = site.find_converter_instance(::Jekyll::Converters::Markdown)
|
||||||
|
|
||||||
|
<<~MARKUP
|
||||||
|
<script>
|
||||||
|
function showDetails(el) {
|
||||||
|
const content = el.querySelector(".details-block-content");
|
||||||
|
const up = el.querySelector(".details-block-title").querySelector("svg#up");
|
||||||
|
const down = el.querySelector(".details-block-title").querySelector("svg#down");
|
||||||
|
up.style.display = up.style.display === "none" ? "block" : "none";
|
||||||
|
down.style.display = down.style.display === "none" ? "block" : "none";
|
||||||
|
content.hidden = !content.hidden;
|
||||||
|
}
|
||||||
|
</script>
|
||||||
|
<div class="details-block">
|
||||||
|
#{render_details_block(vars: vars, converter: converter)}
|
||||||
|
</div>
|
||||||
|
MARKUP
|
||||||
|
end
|
||||||
|
end
|
||||||
|
end
|
||||||
|
|
||||||
|
Liquid::Template.register_tag('details', Jekyll::DetailsBlock)
|
||||||
998
sass/custom/_blue.scss
Normal file
998
sass/custom/_blue.scss
Normal file
@ -0,0 +1,998 @@
|
|||||||
|
$blue__deep_color: #161d61;
|
||||||
|
$blue__light_color: #18abfd;
|
||||||
|
$ha__primary_color: #03a9f4;
|
||||||
|
|
||||||
|
#blue {
|
||||||
|
$blue__hero_height: 670px;
|
||||||
|
font-family: Roboto, "Helvetica Neue", Helvetica, Arial, sans-serif;
|
||||||
|
.site-header {
|
||||||
|
.grid-wrapper {
|
||||||
|
max-width: 1100px !important;
|
||||||
|
padding: 0 25px !important;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.grid-wrapper {
|
||||||
|
max-width: 1500px;
|
||||||
|
padding: 0;
|
||||||
|
width: 100%;
|
||||||
|
}
|
||||||
|
.page-content {
|
||||||
|
overflow-x: hidden;
|
||||||
|
}
|
||||||
|
.banner {
|
||||||
|
height: $blue__hero_height;
|
||||||
|
margin-bottom: 16px;
|
||||||
|
margin-top: -42px;
|
||||||
|
width: 100%;
|
||||||
|
text-align: center;
|
||||||
|
.title {
|
||||||
|
position: relative;
|
||||||
|
width: 550px;
|
||||||
|
height: 168px;
|
||||||
|
left: calc(50% - 550px / 2 - 0.5px);
|
||||||
|
font-weight: 900;
|
||||||
|
font-size: 68px;
|
||||||
|
line-height: 55px;
|
||||||
|
text-align: center;
|
||||||
|
color: #ffffff;
|
||||||
|
bottom: 226px;
|
||||||
|
svg {
|
||||||
|
stroke: $ha__primary_color;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
img {
|
||||||
|
width: 100%;
|
||||||
|
object-fit: cover;
|
||||||
|
object-position: bottom;
|
||||||
|
border-radius: 0;
|
||||||
|
border: 0;
|
||||||
|
height: $blue__hero_height;
|
||||||
|
box-shadow: none;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.content {
|
||||||
|
max-width: 1000px;
|
||||||
|
margin: auto;
|
||||||
|
|
||||||
|
.sub-title {
|
||||||
|
font-weight: bold;
|
||||||
|
font-size: 42px;
|
||||||
|
line-height: 49px;
|
||||||
|
margin: 32px;
|
||||||
|
text-align: center;
|
||||||
|
}
|
||||||
|
|
||||||
|
.missing-piece {
|
||||||
|
z-index: 2;
|
||||||
|
position: relative;
|
||||||
|
display: flex;
|
||||||
|
width: 600px;
|
||||||
|
border-radius: 8px;
|
||||||
|
margin: -36px auto 0;
|
||||||
|
|
||||||
|
.missing-piece-header {
|
||||||
|
font-weight: 900;
|
||||||
|
font-size: 24px;
|
||||||
|
line-height: 28px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.missing-piece-content {
|
||||||
|
font-size: 16px;
|
||||||
|
line-height: 19px;
|
||||||
|
margin-top: 16px;
|
||||||
|
width: 420px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.missing-piece-overlay {
|
||||||
|
width: 210px;
|
||||||
|
border-radius: 8px;
|
||||||
|
margin: -50px -50px 0 0;
|
||||||
|
padding: 22px;
|
||||||
|
display: flex;
|
||||||
|
flex-flow: wrap;
|
||||||
|
justify-content: space-between;
|
||||||
|
|
||||||
|
.missing-piece-overlay-header {
|
||||||
|
font-weight: 500;
|
||||||
|
font-size: 12px;
|
||||||
|
line-height: 14px;
|
||||||
|
letter-spacing: 0.1em;
|
||||||
|
color: #0c0c0c;
|
||||||
|
opacity: 0.33;
|
||||||
|
width: 100%;
|
||||||
|
text-align: right;
|
||||||
|
}
|
||||||
|
.missing-piece-overlay-price {
|
||||||
|
width: calc(100% - 6px);
|
||||||
|
text-align: right;
|
||||||
|
font-weight: 900;
|
||||||
|
font-size: 24px;
|
||||||
|
line-height: 28px;
|
||||||
|
color: #0c0c0c;
|
||||||
|
display: inline-flex;
|
||||||
|
justify-content: flex-end;
|
||||||
|
|
||||||
|
div {
|
||||||
|
width: 6px;
|
||||||
|
margin-top: 2px;
|
||||||
|
font-size: 12px;
|
||||||
|
line-height: 14px;
|
||||||
|
color: #0c0c0c;
|
||||||
|
opacity: 0.4;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.missing-piece-overlay-images {
|
||||||
|
display: grid;
|
||||||
|
grid-template-columns: 47px 47px 47px;
|
||||||
|
grid-template-rows: 47px 47px;
|
||||||
|
grid-auto-flow: row;
|
||||||
|
gap: 2px;
|
||||||
|
|
||||||
|
.img-container {
|
||||||
|
border: 1px solid #e9e9e9;
|
||||||
|
box-sizing: border-box;
|
||||||
|
border-radius: 4px;
|
||||||
|
height: 47px;
|
||||||
|
width: 47px;
|
||||||
|
display: flex;
|
||||||
|
|
||||||
|
img {
|
||||||
|
margin: auto;
|
||||||
|
box-shadow: none;
|
||||||
|
border-radius: 0;
|
||||||
|
border: 0;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.img-container:first-of-type {
|
||||||
|
grid-column: 1 / span 2;
|
||||||
|
grid-row: 1 / span 2;
|
||||||
|
height: 96px;
|
||||||
|
width: 96px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.missing-piece-overlay-button {
|
||||||
|
background-color: $ha__primary_color;
|
||||||
|
margin-top: 12px;
|
||||||
|
border-radius: 4px;
|
||||||
|
width: 154px;
|
||||||
|
height: 46px;
|
||||||
|
display: flex;
|
||||||
|
cursor: pointer;
|
||||||
|
|
||||||
|
div {
|
||||||
|
margin: auto;
|
||||||
|
font-weight: 900;
|
||||||
|
font-size: 18px;
|
||||||
|
color: #ffffff;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.missing-piece-disclaimer {
|
||||||
|
font-size: 12px;
|
||||||
|
line-height: 14px;
|
||||||
|
color: #0c0c0c;
|
||||||
|
opacity: 0.4;
|
||||||
|
text-align: center;
|
||||||
|
margin: 12px auto 50px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.bullet-points {
|
||||||
|
margin: 24px 136px;
|
||||||
|
display: grid;
|
||||||
|
gap: 32px;
|
||||||
|
grid-template-columns: repeat(2, 1fr);
|
||||||
|
.item {
|
||||||
|
display: grid;
|
||||||
|
text-align: center;
|
||||||
|
span:nth-of-type(1) {
|
||||||
|
color: rgba(0, 0, 0, 0.87);
|
||||||
|
font-size: 24px;
|
||||||
|
font-weight: 300;
|
||||||
|
letter-spacing: 0.1em;
|
||||||
|
line-height: 28px;
|
||||||
|
opacity: 0.66;
|
||||||
|
text-transform: uppercase;
|
||||||
|
}
|
||||||
|
span:nth-of-type(2) {
|
||||||
|
color: rgba(0, 0, 0, 0.87);
|
||||||
|
font-size: 48px;
|
||||||
|
letter-spacing: -2px;
|
||||||
|
line-height: 56px;
|
||||||
|
}
|
||||||
|
span:nth-of-type(3) {
|
||||||
|
color: rgba(0, 0, 0, 0.87);
|
||||||
|
font-size: 14px;
|
||||||
|
font-weight: 500;
|
||||||
|
letter-spacing: -1px;
|
||||||
|
line-height: 16px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.vision {
|
||||||
|
position: sticky;
|
||||||
|
text-align: center;
|
||||||
|
display: inline-block;
|
||||||
|
width: 100%;
|
||||||
|
margin-bottom: 160px;
|
||||||
|
|
||||||
|
svg {
|
||||||
|
z-index: 0;
|
||||||
|
width: 100vw;
|
||||||
|
margin-left: calc(-100vw / 2);
|
||||||
|
position: absolute;
|
||||||
|
|
||||||
|
path {
|
||||||
|
z-index: 0;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.vision-content {
|
||||||
|
z-index: 1;
|
||||||
|
position: relative;
|
||||||
|
|
||||||
|
.vision-header {
|
||||||
|
margin-top: 172px;
|
||||||
|
font-weight: 900;
|
||||||
|
font-size: 68px;
|
||||||
|
line-height: 80px;
|
||||||
|
color: $blue__deep_color;
|
||||||
|
}
|
||||||
|
.vision-statement {
|
||||||
|
font-size: 18px;
|
||||||
|
line-height: 21px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.vision-blocks {
|
||||||
|
width: 100%;
|
||||||
|
display: flex;
|
||||||
|
flex-flow: wrap;
|
||||||
|
justify-content: space-between;
|
||||||
|
|
||||||
|
.vision-block {
|
||||||
|
width: 335px;
|
||||||
|
margin: 62px;
|
||||||
|
|
||||||
|
.vision-block-title {
|
||||||
|
text-transform: uppercase;
|
||||||
|
color: $blue__deep_color;
|
||||||
|
letter-spacing: -2px;
|
||||||
|
font-size: 48px;
|
||||||
|
line-height: 56px;
|
||||||
|
font-weight: bold;
|
||||||
|
}
|
||||||
|
.vision-block-content {
|
||||||
|
font-size: 18px;
|
||||||
|
line-height: 133%;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.mood {
|
||||||
|
text-align: center;
|
||||||
|
margin-bottom: 32px;
|
||||||
|
margin-bottom: 80px;
|
||||||
|
|
||||||
|
.mood-cards {
|
||||||
|
display: inline-flex;
|
||||||
|
align-items: center;
|
||||||
|
justify-content: space-between;
|
||||||
|
margin: 0 150px;
|
||||||
|
width: calc(100% - 300px);
|
||||||
|
position: relative;
|
||||||
|
|
||||||
|
.material-card {
|
||||||
|
display: block;
|
||||||
|
align-items: initial;
|
||||||
|
width: 300px;
|
||||||
|
z-index: 1;
|
||||||
|
|
||||||
|
img {
|
||||||
|
box-shadow: none;
|
||||||
|
border: 0;
|
||||||
|
border-radius: 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
.mood-card-type {
|
||||||
|
width: 60px;
|
||||||
|
text-align: start;
|
||||||
|
font-weight: bold;
|
||||||
|
font-size: 32px;
|
||||||
|
line-height: 32px;
|
||||||
|
|
||||||
|
.mode {
|
||||||
|
margin-top: -8px;
|
||||||
|
font-weight: normal;
|
||||||
|
font-size: 15px;
|
||||||
|
text-align: justify;
|
||||||
|
letter-spacing: 6px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.mood-card-footer {
|
||||||
|
display: flex;
|
||||||
|
|
||||||
|
.specifications {
|
||||||
|
display: grid;
|
||||||
|
height: 60px;
|
||||||
|
margin-top: 16px;
|
||||||
|
grid-template-columns: repeat(2, 1fr);
|
||||||
|
justify-items: left;
|
||||||
|
align-items: self-end;
|
||||||
|
flex-wrap: wrap;
|
||||||
|
width: calc(100% - 75px);
|
||||||
|
|
||||||
|
.spec-item {
|
||||||
|
height: 30px;
|
||||||
|
font-size: 11px;
|
||||||
|
display: inline-grid;
|
||||||
|
line-height: 15px;
|
||||||
|
justify-items: left;
|
||||||
|
|
||||||
|
span:first-of-type {
|
||||||
|
font-weight: bold;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.outline {
|
||||||
|
display: flex;
|
||||||
|
place-self: flex-end;
|
||||||
|
color: #c4c4c4;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.mood-separator {
|
||||||
|
z-index: 0;
|
||||||
|
display: grid;
|
||||||
|
height: 120px;
|
||||||
|
width: 120px;
|
||||||
|
align-content: center;
|
||||||
|
justify-content: center;
|
||||||
|
border-radius: 188px;
|
||||||
|
border: 1px dashed #c4c4c4;
|
||||||
|
margin: 0 -80px;
|
||||||
|
padding: 120px;
|
||||||
|
|
||||||
|
span {
|
||||||
|
display: block;
|
||||||
|
width: inherit;
|
||||||
|
}
|
||||||
|
|
||||||
|
span:first-of-type {
|
||||||
|
color: $ha__primary_color;
|
||||||
|
font-weight: bold;
|
||||||
|
font-size: 16px;
|
||||||
|
line-height: 15px;
|
||||||
|
}
|
||||||
|
|
||||||
|
span:last-of-type {
|
||||||
|
font-size: 12px;
|
||||||
|
color: #0c0c0c;
|
||||||
|
opacity: 0.4;
|
||||||
|
}
|
||||||
|
|
||||||
|
.mood-separator-arrow {
|
||||||
|
color: #c4c4c4;
|
||||||
|
}
|
||||||
|
|
||||||
|
.mood-separator-arrow.right {
|
||||||
|
margin-top: -118px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.mood-separator-arrow.left {
|
||||||
|
margin-bottom: -118px;
|
||||||
|
align-self: end;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.specifications {
|
||||||
|
display: grid;
|
||||||
|
grid-template-columns: repeat(5, 1fr);
|
||||||
|
|
||||||
|
.specifications-components {
|
||||||
|
grid-column: 1 / span 3;
|
||||||
|
margin-right: 24px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.component-list {
|
||||||
|
display: grid;
|
||||||
|
row-gap: 8px;
|
||||||
|
grid-template-columns: repeat(5, 1fr);
|
||||||
|
font-size: 18px;
|
||||||
|
line-height: 21px;
|
||||||
|
|
||||||
|
.spec-title {
|
||||||
|
grid-column: 1;
|
||||||
|
margin-right: 24px;
|
||||||
|
margin-top: 16px;
|
||||||
|
text-transform: uppercase;
|
||||||
|
opacity: 0.4;
|
||||||
|
}
|
||||||
|
.spec-content {
|
||||||
|
grid-column: 2 / span 4;
|
||||||
|
font-weight: bold;
|
||||||
|
margin-top: 16px;
|
||||||
|
|
||||||
|
.spec-content-additional {
|
||||||
|
font-weight: normal;
|
||||||
|
|
||||||
|
ul {
|
||||||
|
margin-bottom: 0;
|
||||||
|
margin-left: 16px;
|
||||||
|
|
||||||
|
li {
|
||||||
|
margin-bottom: 0;
|
||||||
|
}
|
||||||
|
li::marker {
|
||||||
|
content: "- ";
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.specifications-form-factor {
|
||||||
|
grid-column: 4 / span 2;
|
||||||
|
|
||||||
|
.specifications-form-factor-grid {
|
||||||
|
display: grid;
|
||||||
|
margin-left: 42px;
|
||||||
|
|
||||||
|
.sff-description {
|
||||||
|
display: grid;
|
||||||
|
|
||||||
|
span:first-of-type {
|
||||||
|
font-size: 1.525em;
|
||||||
|
line-height: 24px;
|
||||||
|
grid-column: 1;
|
||||||
|
text-transform: uppercase;
|
||||||
|
opacity: 0.4;
|
||||||
|
align-self: self-end;
|
||||||
|
}
|
||||||
|
|
||||||
|
span:last-of-type {
|
||||||
|
font-weight: bold;
|
||||||
|
font-size: 1.425em;
|
||||||
|
word-spacing: -4px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.sff-width {
|
||||||
|
grid-column: 1 / span 2;
|
||||||
|
}
|
||||||
|
svg#zen {
|
||||||
|
grid-column: 1;
|
||||||
|
height: 100px;
|
||||||
|
width: 200px;
|
||||||
|
margin-bottom: 32px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.sff-height {
|
||||||
|
grid-column: 2;
|
||||||
|
margin-left: 14px;
|
||||||
|
}
|
||||||
|
|
||||||
|
svg#depth {
|
||||||
|
grid-column: 1;
|
||||||
|
height: 200px;
|
||||||
|
width: 200px;
|
||||||
|
margin-bottom: 32px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.sff-depth {
|
||||||
|
grid-column: 2;
|
||||||
|
margin-left: 14px;
|
||||||
|
}
|
||||||
|
|
||||||
|
svg#weight {
|
||||||
|
grid-column: 1 / span 2;
|
||||||
|
height: 200px;
|
||||||
|
width: 100%;
|
||||||
|
}
|
||||||
|
|
||||||
|
.sff-weight {
|
||||||
|
grid-column: 1 / span 2;
|
||||||
|
justify-content: center;
|
||||||
|
margin-top: -24px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
img {
|
||||||
|
box-shadow: none;
|
||||||
|
border: 0;
|
||||||
|
border-radius: 0;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.faq-list {
|
||||||
|
margin: 0 72px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.blue3d {
|
||||||
|
text-decoration: none;
|
||||||
|
|
||||||
|
.blue3d-container {
|
||||||
|
align-items: flex-end;
|
||||||
|
background-image: url('/images/blue/blue_3d.jpg');
|
||||||
|
background-position: bottom;
|
||||||
|
background-size: cover;
|
||||||
|
display: flex;
|
||||||
|
height: 390px;
|
||||||
|
margin: auto;
|
||||||
|
margin-top: 62px;
|
||||||
|
padding: 0;
|
||||||
|
width: 720px;
|
||||||
|
|
||||||
|
.blue3d-description {
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
justify-content: space-between;
|
||||||
|
background-color: #000000ab;
|
||||||
|
color: #FFFFFF;
|
||||||
|
height: 60px;
|
||||||
|
width: 100%;
|
||||||
|
|
||||||
|
svg {
|
||||||
|
fill: white;
|
||||||
|
height: 32px;
|
||||||
|
width: 32px;
|
||||||
|
min-width: 32px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.blue-buy-fab {
|
||||||
|
background-color: $ha__primary_color;
|
||||||
|
border-radius: 62px;
|
||||||
|
bottom: 16px;
|
||||||
|
display: flex;
|
||||||
|
box-shadow: rgba(0, 0, 0, 0.2) 0px 7px 8px -4px,
|
||||||
|
rgba(0, 0, 0, 0.14) 0px 12px 17px 2px,
|
||||||
|
rgba(0, 0, 0, 0.12) 0px 5px 22px 4px;
|
||||||
|
box-sizing: border-box;
|
||||||
|
color: #ffffff;
|
||||||
|
cursor: pointer;
|
||||||
|
display: inline-flex;
|
||||||
|
float: right;
|
||||||
|
font-size: 12.25px;
|
||||||
|
font-weight: 400;
|
||||||
|
font-weight: bold;
|
||||||
|
line-height: 32px;
|
||||||
|
padding: 8px 16px 4px;
|
||||||
|
position: fixed;
|
||||||
|
right: 24px;
|
||||||
|
z-index: 1111;
|
||||||
|
|
||||||
|
svg {
|
||||||
|
margin-top: 4px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
#buy-dialog {
|
||||||
|
z-index: 1000;
|
||||||
|
display: none;
|
||||||
|
position: fixed;
|
||||||
|
left: 0;
|
||||||
|
top: 0;
|
||||||
|
width: 100vw;
|
||||||
|
height: 100vh;
|
||||||
|
background-color: rgb(0, 0, 0);
|
||||||
|
background-color: rgba(0, 0, 0, 0.4);
|
||||||
|
|
||||||
|
.dialog-content {
|
||||||
|
border-radius: 8px;
|
||||||
|
margin: auto;
|
||||||
|
width: 600px;
|
||||||
|
padding: 0;
|
||||||
|
overflow-y: auto;
|
||||||
|
display: flex;
|
||||||
|
flex-flow: column;
|
||||||
|
justify-content: space-between;
|
||||||
|
|
||||||
|
.close-container {
|
||||||
|
position: fixed;
|
||||||
|
float: right;
|
||||||
|
width: 615px;
|
||||||
|
text-align: right;
|
||||||
|
margin-top: -17px;
|
||||||
|
|
||||||
|
.dialog-close {
|
||||||
|
cursor: pointer;
|
||||||
|
font-size: 32px;
|
||||||
|
background-color: #ffffff;
|
||||||
|
border-radius: 100px;
|
||||||
|
height: 32px;
|
||||||
|
width: 32px;
|
||||||
|
display: inline-flex;
|
||||||
|
align-items: center;
|
||||||
|
justify-content: center;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.dialog-header {
|
||||||
|
display: flex;
|
||||||
|
justify-content: space-between;
|
||||||
|
padding: 8px 16px;
|
||||||
|
font-weight: bold;
|
||||||
|
font-size: 24px;
|
||||||
|
|
||||||
|
svg {
|
||||||
|
width: 32px;
|
||||||
|
height: 32px;
|
||||||
|
cursor: pointer;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.distributors {
|
||||||
|
a {
|
||||||
|
text-decoration: none;
|
||||||
|
|
||||||
|
.distributor {
|
||||||
|
width: 100%;
|
||||||
|
display: flex;
|
||||||
|
justify-content: space-between;
|
||||||
|
padding: 8px 16px;
|
||||||
|
color: #222222;
|
||||||
|
margin: auto;
|
||||||
|
|
||||||
|
svg {
|
||||||
|
height: 100%;
|
||||||
|
align-self: center;
|
||||||
|
}
|
||||||
|
|
||||||
|
div {
|
||||||
|
display: grid;
|
||||||
|
line-height: 20px;
|
||||||
|
|
||||||
|
div:nth-of-type(1) {
|
||||||
|
align-content: center;
|
||||||
|
grid-column: 1;
|
||||||
|
grid-row: 1 / span 2;
|
||||||
|
margin-right: 8px;
|
||||||
|
}
|
||||||
|
div:nth-of-type(2) {
|
||||||
|
grid-column: 2;
|
||||||
|
}
|
||||||
|
div:nth-of-type(3) {
|
||||||
|
grid-column: 2;
|
||||||
|
color: darkslategrey;
|
||||||
|
font-size: small;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.distributor:hover {
|
||||||
|
border-color: $ha__primary_color;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.box-contents {
|
||||||
|
margin: 0 16px 32px;
|
||||||
|
ul {
|
||||||
|
margin: 12px 0 12px 24px;
|
||||||
|
color: darkslategrey;
|
||||||
|
font-size: small;
|
||||||
|
|
||||||
|
li {
|
||||||
|
margin-bottom: 4px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.ul-sub {
|
||||||
|
margin: 0 0 0 16px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.tip {
|
||||||
|
color: darkslategrey;
|
||||||
|
font-size: small;
|
||||||
|
text-align: center;
|
||||||
|
padding: 12px 62px 12px;
|
||||||
|
margin-top: 16px;
|
||||||
|
border-top: 1px darkslategrey solid;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
@media only screen and (max-width: $palm-end) {
|
||||||
|
$blue__hero_height: 500px;
|
||||||
|
#blue {
|
||||||
|
.site-header {
|
||||||
|
background-color: #ffffff66;
|
||||||
|
transition: background 0.5s;
|
||||||
|
|
||||||
|
ul {
|
||||||
|
margin: 0 4px;
|
||||||
|
width: calc(100% - 8px);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.page-content {
|
||||||
|
margin-top: 0;
|
||||||
|
height: 100%;
|
||||||
|
}
|
||||||
|
.grid-wrapper {
|
||||||
|
margin-left: 0;
|
||||||
|
width: 100%;
|
||||||
|
}
|
||||||
|
.banner {
|
||||||
|
margin-bottom: 8px;
|
||||||
|
height: $blue__hero_height;
|
||||||
|
img {
|
||||||
|
height: $blue__hero_height;
|
||||||
|
}
|
||||||
|
.title {
|
||||||
|
width: 100%;
|
||||||
|
left: unset;
|
||||||
|
font-size: 2em;
|
||||||
|
line-height: 0px;
|
||||||
|
|
||||||
|
svg {
|
||||||
|
width: 152px;
|
||||||
|
height: 122px;
|
||||||
|
|
||||||
|
text {
|
||||||
|
font-size: 65px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.content {
|
||||||
|
margin: 0 8px;
|
||||||
|
|
||||||
|
.sub-title {
|
||||||
|
font-size: 24px;
|
||||||
|
line-height: 28px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.missing-piece {
|
||||||
|
margin: -116px auto 0;
|
||||||
|
display: block;
|
||||||
|
width: 100%;
|
||||||
|
padding: 0;
|
||||||
|
|
||||||
|
.missing-piece-header {
|
||||||
|
padding-left: 8px;
|
||||||
|
padding-top: 8px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.missing-piece-content {
|
||||||
|
padding-left: 8px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.missing-piece-content {
|
||||||
|
width: 100%;
|
||||||
|
}
|
||||||
|
.secondary {
|
||||||
|
display: none;
|
||||||
|
}
|
||||||
|
|
||||||
|
.missing-piece-overlay {
|
||||||
|
margin: 0;
|
||||||
|
margin-top: 12px;
|
||||||
|
width: 100%;
|
||||||
|
|
||||||
|
.missing-piece-overlay-images {
|
||||||
|
margin-top: -42px;
|
||||||
|
margin-left: -8px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.missing-piece-disclaimer {
|
||||||
|
margin: 12px auto 12px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.bullet-points {
|
||||||
|
margin: 24px 0;
|
||||||
|
.item {
|
||||||
|
span:nth-of-type(1) {
|
||||||
|
font-size: 16px;
|
||||||
|
line-height: 16px;
|
||||||
|
}
|
||||||
|
span:nth-of-type(2) {
|
||||||
|
font-size: 32px;
|
||||||
|
line-height: 32px;
|
||||||
|
}
|
||||||
|
span:nth-of-type(3) {
|
||||||
|
font-size: 12px;
|
||||||
|
line-height: 12px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.vision {
|
||||||
|
margin-bottom: 0;
|
||||||
|
svg {
|
||||||
|
display: none;
|
||||||
|
}
|
||||||
|
.vision-content {
|
||||||
|
margin-top: 28px;
|
||||||
|
.vision-header {
|
||||||
|
font-size: 34px;
|
||||||
|
line-height: 40px;
|
||||||
|
margin-top: 8px;
|
||||||
|
}
|
||||||
|
.vision-statement {
|
||||||
|
font-size: 12px;
|
||||||
|
line-height: 14px;
|
||||||
|
}
|
||||||
|
.vision-blocks {
|
||||||
|
.vision-block {
|
||||||
|
width: 100%;
|
||||||
|
margin: 9px;
|
||||||
|
.vision-block-title {
|
||||||
|
font-size: 24px;
|
||||||
|
line-height: 28px;
|
||||||
|
}
|
||||||
|
.vision-block-content {
|
||||||
|
display: none;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.mood {
|
||||||
|
.mood-cards {
|
||||||
|
display: inline-grid;
|
||||||
|
margin: 0;
|
||||||
|
width: 100%;
|
||||||
|
|
||||||
|
.material-card {
|
||||||
|
width: 100% !important;
|
||||||
|
display: block;
|
||||||
|
height: auto !important;
|
||||||
|
margin: 0 !important;
|
||||||
|
z-index: 4;
|
||||||
|
|
||||||
|
img {
|
||||||
|
max-height: 180px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.mood-card-footer {
|
||||||
|
.specifications {
|
||||||
|
display: none;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.mood-separator {
|
||||||
|
margin: -80px calc((100% / 2) - 120px);
|
||||||
|
|
||||||
|
.mood-separator-arrow {
|
||||||
|
display: none;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.faq-list {
|
||||||
|
margin: 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
.specifications {
|
||||||
|
display: block;
|
||||||
|
|
||||||
|
h3 {
|
||||||
|
text-align: center;
|
||||||
|
}
|
||||||
|
|
||||||
|
.component-list {
|
||||||
|
grid-template-columns: repeat(1, 1fr);
|
||||||
|
|
||||||
|
.spec-title,
|
||||||
|
.spec-content {
|
||||||
|
grid-column: 1;
|
||||||
|
}
|
||||||
|
|
||||||
|
.spec-title {
|
||||||
|
margin-top: 8px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.spec-content {
|
||||||
|
margin-top: -4px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.specifications-form-factor {
|
||||||
|
.specifications-form-factor-grid {
|
||||||
|
margin-left: 0;
|
||||||
|
|
||||||
|
.sff-width {
|
||||||
|
margin-left: 50px;
|
||||||
|
}
|
||||||
|
.sff-description {
|
||||||
|
span:last-of-type {
|
||||||
|
font-size: 16px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.blue-buy-fab {
|
||||||
|
bottom: 12px;
|
||||||
|
right: 12px;
|
||||||
|
display: none;
|
||||||
|
}
|
||||||
|
|
||||||
|
#buy-dialog {
|
||||||
|
padding-top: 0;
|
||||||
|
|
||||||
|
.dialog-content {
|
||||||
|
border-radius: 0;
|
||||||
|
height: 100vh;
|
||||||
|
width: 100vw;
|
||||||
|
padding-bottom: 64px;
|
||||||
|
display: block;
|
||||||
|
|
||||||
|
.tip {
|
||||||
|
margin: 32px 8px 8px 8px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.blue3d {
|
||||||
|
.blue3d-container {
|
||||||
|
width: 100% !important;
|
||||||
|
|
||||||
|
.blue3d-description {
|
||||||
|
height: auto !important;
|
||||||
|
|
||||||
|
i {
|
||||||
|
align-self: center;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
@media only screen and (max-width: $lap-end) {
|
||||||
|
#blue {
|
||||||
|
.page-content {
|
||||||
|
.content {
|
||||||
|
.bullet-points {
|
||||||
|
margin: 24px 0;
|
||||||
|
}
|
||||||
|
.vision {
|
||||||
|
margin-top: -200px;
|
||||||
|
|
||||||
|
.vision-content {
|
||||||
|
padding-top: 200px;
|
||||||
|
|
||||||
|
.vision-blocks {
|
||||||
|
margin: 32px 0;
|
||||||
|
|
||||||
|
.vision-block {
|
||||||
|
margin: 8px !important;
|
||||||
|
|
||||||
|
.vision-block-content {
|
||||||
|
display: none;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.mood {
|
||||||
|
.mood-cards {
|
||||||
|
margin: 0;
|
||||||
|
width: inherit;
|
||||||
|
.material-card {
|
||||||
|
height: 300px;
|
||||||
|
width: 230px;
|
||||||
|
margin: 0 24px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.specifications {
|
||||||
|
margin: 0 16px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
26
sass/custom/_details.scss
Normal file
26
sass/custom/_details.scss
Normal file
@ -0,0 +1,26 @@
|
|||||||
|
div.details-block {
|
||||||
|
width: 100%;
|
||||||
|
display: block;
|
||||||
|
|
||||||
|
.details-block-item {
|
||||||
|
background-color: white;
|
||||||
|
padding: 4px 16px;
|
||||||
|
margin: 8px;
|
||||||
|
cursor: pointer;
|
||||||
|
box-shadow: 0px 4px 20px rgba(0, 0, 0, 0.1);
|
||||||
|
border-radius: 16px;
|
||||||
|
|
||||||
|
.details-block-title {
|
||||||
|
font-weight: bold;
|
||||||
|
font-size: 18px;
|
||||||
|
line-height: 21px;
|
||||||
|
height: 54px;
|
||||||
|
justify-content: space-between;
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
}
|
||||||
|
.details-block-content {
|
||||||
|
margin: 4px 32px 0 0;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
59
sass/custom/_features.scss
Normal file
59
sass/custom/_features.scss
Normal file
@ -0,0 +1,59 @@
|
|||||||
|
.feature-cards {
|
||||||
|
display: grid;
|
||||||
|
grid-template-columns: repeat(2, 1fr);
|
||||||
|
gap: 32px;
|
||||||
|
margin: auto;
|
||||||
|
|
||||||
|
.card {
|
||||||
|
border-radius: 8px;
|
||||||
|
display: inline-block;
|
||||||
|
width: calc(100% - 16px);
|
||||||
|
vertical-align: top;
|
||||||
|
|
||||||
|
.card-header {
|
||||||
|
font-size: 1.4rem;
|
||||||
|
line-height: 1.6;
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
padding-bottom: 8px;
|
||||||
|
height: 62px;
|
||||||
|
|
||||||
|
i {
|
||||||
|
height: 62px;
|
||||||
|
min-width: 62px;
|
||||||
|
text-align: center;
|
||||||
|
font-size: 39px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.card-content {
|
||||||
|
padding-left: 24px;
|
||||||
|
|
||||||
|
.button {
|
||||||
|
font-size: small;
|
||||||
|
font-weight: 600;
|
||||||
|
text-decoration: none;
|
||||||
|
}
|
||||||
|
|
||||||
|
p:last-of-type,
|
||||||
|
ul {
|
||||||
|
margin-bottom: 12px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
@media only screen and (max-width: $palm-end) {
|
||||||
|
.feature-cards {
|
||||||
|
width: 95%;
|
||||||
|
grid-template-columns: repeat(1, 1fr);
|
||||||
|
|
||||||
|
.card {
|
||||||
|
width: 100%;
|
||||||
|
|
||||||
|
.card-content {
|
||||||
|
padding-left: 0;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
@ -157,6 +157,9 @@ $primary-color: #049cdb;
|
|||||||
color: white;
|
color: white;
|
||||||
border-bottom-left-radius: 2px;
|
border-bottom-left-radius: 2px;
|
||||||
border-bottom-right-radius: 2px;
|
border-bottom-right-radius: 2px;
|
||||||
|
display: flex;
|
||||||
|
justify-content: space-between;
|
||||||
|
align-items: center;
|
||||||
|
|
||||||
.title {
|
.title {
|
||||||
font-size: 20px;
|
font-size: 20px;
|
||||||
@ -167,6 +170,13 @@ $primary-color: #049cdb;
|
|||||||
font-size: 12px;
|
font-size: 12px;
|
||||||
font-weight: initial;
|
font-weight: initial;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
svg {
|
||||||
|
fill: white;
|
||||||
|
width: 32px;
|
||||||
|
height: 32px;
|
||||||
|
min-width: 32px;
|
||||||
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|||||||
@ -1,6 +1,9 @@
|
|||||||
@import 'oscailte/oscailte';
|
@import 'oscailte/oscailte';
|
||||||
@import 'custom/paulus';
|
@import 'custom/paulus';
|
||||||
|
@import 'custom/blue';
|
||||||
|
@import 'custom/features';
|
||||||
@import 'custom/component_page';
|
@import 'custom/component_page';
|
||||||
@import 'custom/syntax';
|
@import 'custom/syntax';
|
||||||
|
@import 'custom/details';
|
||||||
@import 'custom/print';
|
@import 'custom/print';
|
||||||
@import 'custom/layout';
|
@import 'custom/layout';
|
||||||
98
source/_includes/custom/features.html
Normal file
98
source/_includes/custom/features.html
Normal file
@ -0,0 +1,98 @@
|
|||||||
|
<div class="feature-cards">
|
||||||
|
<div class="card">
|
||||||
|
<div class="card-header">
|
||||||
|
<i class="icon-lightbulb"></i>
|
||||||
|
Works with over 1000 devices
|
||||||
|
</div>
|
||||||
|
<div class="card-content">
|
||||||
|
<p>
|
||||||
|
Home Assistant can integration with over a thousand different devices
|
||||||
|
and services.
|
||||||
|
</p>
|
||||||
|
|
||||||
|
<p>
|
||||||
|
Once started, Home Assistant will automatically scan your network for
|
||||||
|
known devices and allow you to easily set them up.
|
||||||
|
</p>
|
||||||
|
<a class="button" href="/integrations">EXPLORE INTEGRATIONS</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="card">
|
||||||
|
<div class="card-header">
|
||||||
|
<i class="icon-gears"></i>
|
||||||
|
Powerful automations
|
||||||
|
</div>
|
||||||
|
<div class="card-content">
|
||||||
|
<p>
|
||||||
|
Once you have integrated all your devices at home, you can unleash Home
|
||||||
|
Assistant’s advanced automation engine to make your home work for you.
|
||||||
|
</p>
|
||||||
|
|
||||||
|
<ul>
|
||||||
|
<li>Turn on the light when the sun sets or when coming home</li>
|
||||||
|
<li>Alert you when you leave your garage door open.</li>
|
||||||
|
</ul>
|
||||||
|
<a class="button" href="/docs/automation">EXPLORE AUTOMATIONS</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="card">
|
||||||
|
<div class="card-header">
|
||||||
|
<i class="icon-puzzle-piece"></i>
|
||||||
|
Extend your system with add-ons
|
||||||
|
</div>
|
||||||
|
<div class="card-content">
|
||||||
|
<p>
|
||||||
|
Home Assistant is not just limited to Home Assistant. Easily install
|
||||||
|
other applications that will help you manage your home.
|
||||||
|
</p>
|
||||||
|
|
||||||
|
<ul>
|
||||||
|
<li>Run AdGuard, a DNS-based ad blocker</li>
|
||||||
|
<li>Run third party automation engines like NodeRed</li>
|
||||||
|
<li>Turn Home Assistant Blue into a Spotify Connect target</li>
|
||||||
|
</ul>
|
||||||
|
<a class="button" href="/addons">EXPLORE ADD-ONS</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="card">
|
||||||
|
<div class="card-header">
|
||||||
|
<i class="icon-shield"></i>
|
||||||
|
All your smart home data stays local
|
||||||
|
</div>
|
||||||
|
<div class="card-content">
|
||||||
|
<p>Home Assistant keeps your data local, not need for a cloud.</p>
|
||||||
|
|
||||||
|
<p>
|
||||||
|
Home Assistant communicates with your devices locally, and will fallback
|
||||||
|
to pulling in data from the cloud if there is no other option. No data
|
||||||
|
is stored in the cloud, and everything is processed locally.
|
||||||
|
</p>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="card">
|
||||||
|
<div class="card-header">
|
||||||
|
<i class="icon-mobile-phone"></i>
|
||||||
|
Companion Mobile Apps
|
||||||
|
</div>
|
||||||
|
<div class="card-content">
|
||||||
|
<p>
|
||||||
|
Use the official Home Assistant apps, a convenient companion to quickly
|
||||||
|
control your devices and be notified when things happen in your home,
|
||||||
|
even on your wrist using the Apple Watch.
|
||||||
|
</p>
|
||||||
|
|
||||||
|
<p>
|
||||||
|
The apps can also be used to send your location home to use presence
|
||||||
|
detection as part of your automations. Data is sent directly to your
|
||||||
|
home, no access by third-parties.
|
||||||
|
</p>
|
||||||
|
<a
|
||||||
|
class="button"
|
||||||
|
href="https://companion.home-assistant.io/"
|
||||||
|
target="_blank"
|
||||||
|
>
|
||||||
|
DOWNLOAD APPS
|
||||||
|
</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
@ -3,7 +3,7 @@ title: Blueprints
|
|||||||
description: Instructions on how to use Automation Blueprints with Home Assistant.
|
description: Instructions on how to use Automation Blueprints with Home Assistant.
|
||||||
ha_category:
|
ha_category:
|
||||||
- Automation
|
- Automation
|
||||||
ha_release: 1.0
|
ha_release: 2020.12
|
||||||
ha_quality_scale: internal
|
ha_quality_scale: internal
|
||||||
ha_codeowners:
|
ha_codeowners:
|
||||||
- '@home-assistant/core'
|
- '@home-assistant/core'
|
||||||
|
|||||||
@ -6,7 +6,7 @@ ha_category:
|
|||||||
- Sensor
|
- Sensor
|
||||||
- Switch
|
- Switch
|
||||||
ha_iot_class: Cloud Polling
|
ha_iot_class: Cloud Polling
|
||||||
ha_release: 1.0
|
ha_release: 2020.12
|
||||||
ha_codeowners:
|
ha_codeowners:
|
||||||
- '@cyberjunky'
|
- '@cyberjunky'
|
||||||
ha_config_flow: true
|
ha_config_flow: true
|
||||||
|
|||||||
@ -4,7 +4,7 @@ description: Instructions for integrating Brightech Kuler Sky Bluetooth floor la
|
|||||||
ha_category:
|
ha_category:
|
||||||
- Light
|
- Light
|
||||||
ha_iot_class: Local Polling
|
ha_iot_class: Local Polling
|
||||||
ha_release: '1.0'
|
ha_release: 2020.12
|
||||||
ha_domain: kulersky
|
ha_domain: kulersky
|
||||||
ha_codeowners:
|
ha_codeowners:
|
||||||
- '@emlove'
|
- '@emlove'
|
||||||
|
|||||||
@ -4,7 +4,7 @@ description: Instructions on how to integrate Motion Blinds from Coulisse B.V. i
|
|||||||
ha_category:
|
ha_category:
|
||||||
- Cover
|
- Cover
|
||||||
ha_iot_class: Local Polling
|
ha_iot_class: Local Polling
|
||||||
ha_release: 1.0
|
ha_release: 2020.12
|
||||||
ha_domain: motion_blinds
|
ha_domain: motion_blinds
|
||||||
ha_codeowners:
|
ha_codeowners:
|
||||||
- '@starkillerOG'
|
- '@starkillerOG'
|
||||||
|
|||||||
@ -3,7 +3,7 @@ title: Number
|
|||||||
description: Instructions on how to manage your Number entities with Home Assistant.
|
description: Instructions on how to manage your Number entities with Home Assistant.
|
||||||
ha_category:
|
ha_category:
|
||||||
- Number
|
- Number
|
||||||
ha_release: 1.0
|
ha_release: 2020.12
|
||||||
ha_quality_scale: internal
|
ha_quality_scale: internal
|
||||||
ha_domain: number
|
ha_domain: number
|
||||||
ha_iot_class: ~
|
ha_iot_class: ~
|
||||||
|
|||||||
@ -3,7 +3,7 @@ title: "MQTT Scene"
|
|||||||
description: "Instructions on how to integrate MQTT scenes into Home Assistant."
|
description: "Instructions on how to integrate MQTT scenes into Home Assistant."
|
||||||
ha_category:
|
ha_category:
|
||||||
- Scene
|
- Scene
|
||||||
ha_release: 1.0
|
ha_release: 2020.12
|
||||||
ha_iot_class: Configurable
|
ha_iot_class: Configurable
|
||||||
ha_domain: mqtt
|
ha_domain: mqtt
|
||||||
---
|
---
|
||||||
|
|||||||
@ -3,7 +3,7 @@ title: "SRP Energy"
|
|||||||
description: "How to integrate SRP Energy within Home Assistant."
|
description: "How to integrate SRP Energy within Home Assistant."
|
||||||
ha_category:
|
ha_category:
|
||||||
- Energy
|
- Energy
|
||||||
ha_release: 1.0
|
ha_release: 2020.12
|
||||||
ha_iot_class: Cloud Polling
|
ha_iot_class: Cloud Polling
|
||||||
---
|
---
|
||||||
|
|
||||||
|
|||||||
@ -3,7 +3,7 @@ title: Twinkly
|
|||||||
description: Instructions on how to integrate Twinkly LED string to Home Assistant.
|
description: Instructions on how to integrate Twinkly LED string to Home Assistant.
|
||||||
ha_category:
|
ha_category:
|
||||||
- Light
|
- Light
|
||||||
ha_release: 1.0
|
ha_release: 2020.12
|
||||||
ha_config_flow: true
|
ha_config_flow: true
|
||||||
ha_domain: twinkly
|
ha_domain: twinkly
|
||||||
ha_iot_class: Local pull
|
ha_iot_class: Local pull
|
||||||
|
|||||||
123
source/_posts/2020-12-13-home-assistant-os-release-5.markdown
Normal file
123
source/_posts/2020-12-13-home-assistant-os-release-5.markdown
Normal file
@ -0,0 +1,123 @@
|
|||||||
|
---
|
||||||
|
layout: post
|
||||||
|
title: "Home Assistant OS Release 5"
|
||||||
|
description: "Improved name resolution, external data disk, more reliability and supporting 3 new devices!"
|
||||||
|
date: 2020-12-13 00:00:00
|
||||||
|
date_formatted: "December 13, 2020"
|
||||||
|
author: Stefan Agner
|
||||||
|
author_twitter: falstaff_ch
|
||||||
|
comments: true
|
||||||
|
categories: Release-Notes
|
||||||
|
og_image: /images/blog/2020-12-13-os5/social.png
|
||||||
|
---
|
||||||
|
|
||||||
|
<img src='/images/blog/2020-12-13-os5/social.png' style='border: 0;box-shadow: none;'>
|
||||||
|
|
||||||
|
Today we also release Home Assistant OS 5.8, the first stable version of the 5.x
|
||||||
|
release series.
|
||||||
|
|
||||||
|
**Highlights**:
|
||||||
|
|
||||||
|
- Improved Multicast Name Resolution on OS level
|
||||||
|
- External Data Disk Feature
|
||||||
|
- Improved Reliability against Container corruption
|
||||||
|
|
||||||
|
- New support: Raspberry Pi 4 – 8GB
|
||||||
|
- New support: ASUS Tinker Board S
|
||||||
|
- New support: ODROID-C4
|
||||||
|
- Improved: OVA Virtual image includes more drivers
|
||||||
|
|
||||||
|
## Table of contents
|
||||||
|
|
||||||
|
- [Table of contents](#table-of-contents)
|
||||||
|
- [Operating System Changes](#operating-system-changes)
|
||||||
|
- [Multicast Name Resolution](#multicast-name-resolution)
|
||||||
|
- [External Data Disk](#external-data-disk)
|
||||||
|
- [Improved Reliability](#improved-reliability)
|
||||||
|
- [Under the Hood](#under-the-hood)
|
||||||
|
- [Board Support](#board-support)
|
||||||
|
- [Raspberry Pi](#raspberry-pi)
|
||||||
|
- [ODROID](#odroid)
|
||||||
|
- [Open Virtualization Appliance/Intel NUC](#open-virtualization-appliance-intel-nuc)
|
||||||
|
- [New Board Support](#new-board-suport)
|
||||||
|
- [Other Changes](#other-changes)
|
||||||
|
|
||||||
|
## Operating System Changes
|
||||||
|
|
||||||
|
### Multicast Name Resolution
|
||||||
|
|
||||||
|
Release 5 uses systemd-resolved to provide DNS services on the operating system
|
||||||
|
level and acts as a multicast name resolution responder. Besides, mDNS
|
||||||
|
systemd-resolved also supports the LLMNR hostname resolution protocol. In
|
||||||
|
practice, this makes discovering a new installation of Home Assistant OS working
|
||||||
|
in most situations, either using `http://homeassistant.local:8123` or
|
||||||
|
`http://homeassistant:8123`.
|
||||||
|
|
||||||
|
### External Data Disk
|
||||||
|
|
||||||
|
In release 4 we introduced external data disk support. The command `datactl`
|
||||||
|
allows moving the main data partition to any disk connected to the system. The
|
||||||
|
boot partition and main operating system partitions stay on the boot medium
|
||||||
|
(typically the SD card). Using this approach is more reliable than booting the
|
||||||
|
system from USB. Booting from USB requires several parts of the software stack
|
||||||
|
to rediscover the external storage. In release 5 we made the external data disk
|
||||||
|
feature more robust and the initial moving process much faster. We plan to
|
||||||
|
improve that feature even more and are happy to get your feedback!
|
||||||
|
|
||||||
|
### Improved Reliability
|
||||||
|
|
||||||
|
The main system service to start Home Assistant Supervisor is now more reliable.
|
||||||
|
Home Assistant OS is now able to detect a corrupted supervisor container in most
|
||||||
|
situations and automatically downloads a new version of it. File system checks
|
||||||
|
have also been expanded to the boot partition, which makes sure that all file
|
||||||
|
systems are being checked now.
|
||||||
|
|
||||||
|
### Under the Hood
|
||||||
|
|
||||||
|
Under the hood, we updated to Buildroot 2020.11, which brings tons of new software
|
||||||
|
versions along with bug and security fixes. Some key components which received
|
||||||
|
an update were systemd 246 and AppArmor version 3.0.
|
||||||
|
|
||||||
|
## Board Support
|
||||||
|
|
||||||
|
### Raspberry Pi
|
||||||
|
|
||||||
|
All Raspberry Pi versions now use Linux Kernel 5.4, just like Raspberry Pi OS.
|
||||||
|
With the move to U-Boot 2020.10, we are now also supporting Raspberry Pi with 8GB
|
||||||
|
of memory. With the new kernel and U-Boot Home Assistant OS can now also run on
|
||||||
|
the Compute Module 4 as well as the Pi 400 (the keyboard). A keyboard is
|
||||||
|
probably not the ideal form factor for a headless system such as Home Assistant
|
||||||
|
OS, but it comes with good cooling, which makes it not the worst choice :-). We
|
||||||
|
recently tested the 64-bit variant of Home Assistant OS much more and feel
|
||||||
|
comfortable to recommend the 64-bit version for Raspberry Pi 4.
|
||||||
|
|
||||||
|
### ODROID
|
||||||
|
|
||||||
|
The ODROID platforms now use Linux 5.9, which brings improved support for all
|
||||||
|
ODROID platforms such as the ODROID N2(+). For the N2(+) the Real-Time Clock is
|
||||||
|
now supported as well.
|
||||||
|
|
||||||
|
### Open Virtualization Appliance/Intel NUC
|
||||||
|
|
||||||
|
The x86 platforms (Intel NUC, OVA - Open Virtualization Appliance) now use
|
||||||
|
Linux 5.9. The kernel for OVA images has new drivers enabled for Intel Network
|
||||||
|
devices with Virtual Function, PCIe passthrough for Hyper-V, or support for
|
||||||
|
Audio (HDA audio devices).
|
||||||
|
|
||||||
|
### New Board Support
|
||||||
|
|
||||||
|
Besides the ASUS Tinker Board, we now also support the Tinker Board S, a variant
|
||||||
|
with fast on-board eMMC storage. Thanks to [@ubergeek801] we now also have support
|
||||||
|
for ODROID-C4, a cost-effective alternative to Raspberry Pi in a similar form
|
||||||
|
factor.
|
||||||
|
|
||||||
|
## Other Changes
|
||||||
|
|
||||||
|
The build pipeline is now using GitHub Actions and we compress the images using
|
||||||
|
the xz compression algorithm instead of gz. The flashing process will stay the
|
||||||
|
same: Etcher supports flashing from gz as well as xz.
|
||||||
|
|
||||||
|
This is all I can think of for now. The release 5.8 will be on the stable
|
||||||
|
channel today, so watch out for the update notification in the Supervisor
|
||||||
|
section. Images are available in the release section over on
|
||||||
|
[GitHub](https://github.com/home-assistant/operating-system/releases).
|
||||||
@ -1,50 +1,45 @@
|
|||||||
---
|
---
|
||||||
layout: post
|
layout: post
|
||||||
title: "1.0: Beta release notes"
|
title: "2020.12: Automate with Blueprints!"
|
||||||
description: "Beta release notes for Home Assistant Core 1.0"
|
description: "Sharable automations using blueprints, new neural voices for Nabu Casa TTS, disable devices and assign entities to areas!"
|
||||||
date: 2020-12-2 00:00:00
|
date: 2020-12-13 00:00:00
|
||||||
date_formatted: "December 13, 2020"
|
date_formatted: "December 13, 2020"
|
||||||
author: Franck Nijhof
|
author: Franck Nijhof
|
||||||
author_twitter: frenck
|
author_twitter: frenck
|
||||||
comments: true
|
comments: true
|
||||||
categories: Release-Notes
|
categories: Release-Notes
|
||||||
og_image: /images/blog/2020-12-1.0/social.png
|
og_image: /images/blog/2020-12/social.png
|
||||||
---
|
---
|
||||||
|
|
||||||
<a href='/integrations/#version/1.0'><img src='/images/blog/2020-12-1.0/social.png' style='border: 0;box-shadow: none;'></a>
|
<a href='/integrations/#version/2020.12'><img src='/images/blog/2020-12/social.png' style='border: 0;box-shadow: none;'></a>
|
||||||
|
|
||||||
These are the beta release notes for Home Assistant Core 1.0 (and is thus a
|
Welcome to Home Assistant Core 2020.12!
|
||||||
work in progress).
|
|
||||||
|
|
||||||
**Yes, Home Assistant Core 1.0! This major release is going to be announced at the [Home Assistant Conference](/conference) on 13 December**:
|
You are looking at our new versioning schema. From now on, the Home Assistant
|
||||||
|
Core will be using calendar versioning, consisting of the year, month and
|
||||||
|
a patch number to indicate a bug-fix release. This also means our release
|
||||||
|
schedule is changing. Home Assistant Core will now be released every first
|
||||||
|
Wednesday of the month!
|
||||||
|
|
||||||
<a class="btn" href="https://hopin.to/events/home-assistant-conference">Get your $1 ticket</a>
|
As most things are announced at the [Home Assistant Conference](/conference);
|
||||||
|
more things will be added/tweak in these release notes the next couple of days.
|
||||||
|
|
||||||
If you encounter any issues with the beta release, please report them on GitHub:
|
For me, this has been an exiting year! And thanks everybody for contributing
|
||||||
|
to this amazing project, not matter what and how you contributed. You are all
|
||||||
|
amazing! ❤️
|
||||||
|
|
||||||
- Issues with integrations, automations and such (Core related):<br>
|
With the Holiday season coming, it is time to slow down a bit, enjoy time with
|
||||||
<https://github.com/home-assistant/core/issues>
|
our family. And in a couple of weeks, a new year will start; Let's make it a
|
||||||
- Issues with the frontend/Lovelace:<br>
|
good one!
|
||||||
<https://github.com/home-assistant/frontend/issues>
|
|
||||||
- Issues with the Supervisor:<br>
|
|
||||||
<https://github.com/home-assistant/supervisor/issues>
|
|
||||||
- Issues with the documentation:<br>
|
|
||||||
<https://github.com/home-assistant/home-assistant.io/issues>
|
|
||||||
|
|
||||||
Please be sure to include the beta version you are running in the issue
|
Happy holidays, stay safe and for the last time this year: Enjoy the release!
|
||||||
description (not title), so we can classify your issue correctly.
|
|
||||||
|
|
||||||
Issues introduced in the beta are processed with priority.
|
../Frenck
|
||||||
|
|
||||||
## Table of contents
|
|
||||||
|
|
||||||
- [Table of contents](#table-of-contents)
|
|
||||||
- [Lorem ipsum](#lorem-ipsum)
|
|
||||||
- [Home Assistant Blueprints](#home-assistant-blueprints)
|
|
||||||
- [Blueprints](#blueprints)
|
- [Blueprints](#blueprints)
|
||||||
- [Creating blueprints](#creating-blueprints)
|
|
||||||
- [Sharing blueprints](#sharing-blueprints)
|
- [Sharing blueprints](#sharing-blueprints)
|
||||||
- [Using blueprints](#using-blueprints)
|
- [Using blueprints](#using-blueprints)
|
||||||
|
- [Creating blueprints](#creating-blueprints)
|
||||||
- [New neural voices for Nabu Casa Cloud TTS](#new-neural-voices-for-nabu-casa-cloud-tts)
|
- [New neural voices for Nabu Casa Cloud TTS](#new-neural-voices-for-nabu-casa-cloud-tts)
|
||||||
- [Assign areas to entities and readable area IDs](#assign-areas-to-entities-and-readable-area-ids)
|
- [Assign areas to entities and readable area IDs](#assign-areas-to-entities-and-readable-area-ids)
|
||||||
- [Temporarily disable devices](#temporarily-disable-devices)
|
- [Temporarily disable devices](#temporarily-disable-devices)
|
||||||
@ -59,10 +54,10 @@ Issues introduced in the beta are processed with priority.
|
|||||||
|
|
||||||
## Blueprints
|
## Blueprints
|
||||||
|
|
||||||
Say hello; to the major new feature of Home Assistant 1.0.0: Blueprints!
|
Say hello; to the major new feature of Home Assistant 2020.12: Blueprints!
|
||||||
|
|
||||||
<p class='img'>
|
<p class='img'>
|
||||||
<img src='/images/blog/2020-12-1.0/blueprints.png' alt='Screenshot of the blueprints configuration panel'>
|
<img src='/images/blog/2020-12/blueprints.png' alt='Screenshot of the blueprints configuration panel'>
|
||||||
Screenshot of the blueprints configuration panel.
|
Screenshot of the blueprints configuration panel.
|
||||||
</p>
|
</p>
|
||||||
|
|
||||||
@ -104,7 +99,7 @@ into the UI. Then you can create automations from these blueprints by filling
|
|||||||
out the required inputs.
|
out the required inputs.
|
||||||
|
|
||||||
<p class='img'>
|
<p class='img'>
|
||||||
<img src='/images/blog/2020-12-1.0/blueprint-ui.png' alt='Screenshot of a blueprint'>
|
<img src='/images/blog/2020-12/blueprint-ui.png' alt='Screenshot of a blueprint'>
|
||||||
Screenshot of a blueprint.
|
Screenshot of a blueprint.
|
||||||
</p>
|
</p>
|
||||||
|
|
||||||
@ -171,7 +166,7 @@ a device as well. For example, your in-wall mounted switch controls a light in
|
|||||||
another room.
|
another room.
|
||||||
|
|
||||||
<p class='img'>
|
<p class='img'>
|
||||||
<img src='/images/blog/2020-12-1.0/entity-areas.png' alt='Screenshot of disabling a device'>
|
<img src='/images/blog/2020-12/entity-areas.png' alt='Screenshot of disabling a device'>
|
||||||
Screenshot of disabling a device.
|
Screenshot of disabling a device.
|
||||||
</p>
|
</p>
|
||||||
|
|
||||||
@ -204,7 +199,7 @@ next year, when you unpack all decorations, enable them again and you're
|
|||||||
ready to go for another Holiday season!
|
ready to go for another Holiday season!
|
||||||
|
|
||||||
<p class='img'>
|
<p class='img'>
|
||||||
<img src='/images/blog/2020-12-1.0/disable-device.png' alt='Screenshot of disabling a device'>
|
<img src='/images/blog/2020-12/disable-device.png' alt='Screenshot of disabling a device'>
|
||||||
Screenshot of disabling a device.
|
Screenshot of disabling a device.
|
||||||
</p>
|
</p>
|
||||||
|
|
||||||
776
source/blue/index.html
Normal file
776
source/blue/index.html
Normal file
File diff suppressed because one or more lines are too long
Binary file not shown.
|
Before Width: | Height: | Size: 118 KiB |
BIN
source/images/blog/2020-12-13-os5/social.png
Normal file
BIN
source/images/blog/2020-12-13-os5/social.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 109 KiB |
|
Before Width: | Height: | Size: 57 KiB After Width: | Height: | Size: 57 KiB |
|
Before Width: | Height: | Size: 59 KiB After Width: | Height: | Size: 59 KiB |
|
Before Width: | Height: | Size: 23 KiB After Width: | Height: | Size: 23 KiB |
|
Before Width: | Height: | Size: 32 KiB After Width: | Height: | Size: 32 KiB |
BIN
source/images/blog/2020-12/social.png
Normal file
BIN
source/images/blog/2020-12/social.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 123 KiB |
BIN
source/images/blue/blue1.png
Normal file
BIN
source/images/blue/blue1.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 93 KiB |
BIN
source/images/blue/blue2.png
Normal file
BIN
source/images/blue/blue2.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 15 KiB |
BIN
source/images/blue/blue3.png
Normal file
BIN
source/images/blue/blue3.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 13 KiB |
BIN
source/images/blue/blue_3d.jpg
Normal file
BIN
source/images/blue/blue_3d.jpg
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 304 KiB |
BIN
source/images/blue/blue_dev_mode.png
Normal file
BIN
source/images/blue/blue_dev_mode.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 270 KiB |
BIN
source/images/blue/blue_hero.jpg
Normal file
BIN
source/images/blue/blue_hero.jpg
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 382 KiB |
BIN
source/images/blue/blue_narrow.jpg
Normal file
BIN
source/images/blue/blue_narrow.jpg
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 215 KiB |
BIN
source/images/blue/blue_zen_mode.png
Normal file
BIN
source/images/blue/blue_zen_mode.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 258 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 32 KiB After Width: | Height: | Size: 43 KiB |
@ -26,6 +26,18 @@ description:
|
|||||||
<a href="/latest-release-notes/">Release notes</a>
|
<a href="/latest-release-notes/">Release notes</a>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
|
<div class="recent-posts material-card text">
|
||||||
|
<h1>Recent Blog Posts</h1>
|
||||||
|
|
||||||
|
{% for post in site.posts limit: 4 %}
|
||||||
|
<li class="post" style="display: grid; font-size: 16px;">
|
||||||
|
<a href="{{ post.url }}">{{ post.title }}</a>
|
||||||
|
<small class="blog-date">{{ post.date_formatted }}</small>
|
||||||
|
</li>
|
||||||
|
{% endfor %}
|
||||||
|
</div>
|
||||||
|
|
||||||
<div class="join-community material-card text">
|
<div class="join-community material-card text">
|
||||||
<h1>Join The Community</h1>
|
<h1>Join The Community</h1>
|
||||||
We love to help with & talk about home automation.
|
We love to help with & talk about home automation.
|
||||||
@ -37,13 +49,12 @@ description:
|
|||||||
</div>
|
</div>
|
||||||
|
|
||||||
<a
|
<a
|
||||||
class="material-card picture-promo"
|
class="material-card highlight-blog-post"
|
||||||
href="/conference/"
|
href="/blog/2016/01/19/perfect-home-automation/"
|
||||||
style="
|
>
|
||||||
background-image: url(/images/conference/frontpage-card.png);
|
Read our founder's vision for the perfect home automation
|
||||||
padding-top: 43%;
|
<i class="icon-arrow-right"></i>
|
||||||
"
|
</a>
|
||||||
></a>
|
|
||||||
|
|
||||||
<div class="material-card text">
|
<div class="material-card text">
|
||||||
<h1>Alexa, turn on the lights</h1>
|
<h1>Alexa, turn on the lights</h1>
|
||||||
@ -62,63 +73,63 @@ description:
|
|||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<a
|
|
||||||
class="material-card highlight-blog-post"
|
|
||||||
href="/blog/2016/01/19/perfect-home-automation/"
|
|
||||||
>
|
|
||||||
Read our founder's vision for the perfect home automation
|
|
||||||
<i class="icon-arrow-right"></i>
|
|
||||||
</a>
|
|
||||||
|
|
||||||
<a
|
<a
|
||||||
class="material-card picture-promo"
|
class="material-card picture-promo"
|
||||||
href="/blog/2019/08/06/home-assistant-cast/"
|
href="/blog/2019/08/06/home-assistant-cast/"
|
||||||
style="background-image: url(/images/frontpage/cast-frontpage.png)"
|
style="background-image: url(/images/frontpage/cast-frontpage.png)"
|
||||||
>
|
>
|
||||||
<div class="caption">
|
<div class="caption">
|
||||||
<div class="title">Take over all the screens</div>
|
<div class="title">
|
||||||
<div class="subtitle">
|
Take over all the screens
|
||||||
Home Assistant Cast makes each TV a display.
|
<div class="subtitle">
|
||||||
|
Home Assistant Cast makes each TV a display.
|
||||||
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
<svg viewBox="0 0 24 24"><path d="M8.59,16.58L13.17,12L8.59,7.41L10,6L16,12L10,18L8.59,16.58Z" /></svg>
|
||||||
</div>
|
</div>
|
||||||
</a>
|
</a>
|
||||||
</div>
|
</div>
|
||||||
<div class="grid__item two-thirds lap-two-thirds palm-one-whole">
|
<div class="grid__item two-thirds lap-two-thirds palm-one-whole">
|
||||||
<div class="recent-posts material-card text">
|
|
||||||
<h1>Recent Blog Posts</h1>
|
|
||||||
|
|
||||||
{% for post in site.posts limit: 4 %}
|
|
||||||
<li class="post">
|
|
||||||
<a href="{{ post.url }}">{{ post.title }}</a>
|
|
||||||
<small class="blog-date">{{ post.date_formatted }}</small>
|
|
||||||
</li>
|
|
||||||
{% endfor %}
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<a
|
<a
|
||||||
class="material-card picture-promo"
|
class="material-card picture-promo"
|
||||||
href="/blog/2019/11/22/state-of-the-union/"
|
href="/blue"
|
||||||
style="
|
style="
|
||||||
background-image: url(/images/frontpage/sotu2019-paulus.jpeg);
|
background-image: url(/images/blue/blue_narrow.jpg);
|
||||||
background-size: cover;
|
background-size: cover;
|
||||||
background-color: #41bdf5;
|
background-color: #41bdf5;
|
||||||
"
|
"
|
||||||
>
|
>
|
||||||
<div class="caption">
|
<div class="caption">
|
||||||
<div class="title">State of the Union 2019</div>
|
<div class="title">
|
||||||
<div class="subtitle">
|
Home Assistant Blue!
|
||||||
Learn why we do what we do and what is next.
|
<div class="subtitle">
|
||||||
|
Where style and performance meet privacy
|
||||||
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
<svg viewBox="0 0 24 24"><path d="M8.59,16.58L13.17,12L8.59,7.41L10,6L16,12L10,18L8.59,16.58Z" /></svg>
|
||||||
</div>
|
</div>
|
||||||
</a>
|
</a>
|
||||||
|
|
||||||
<a
|
<a
|
||||||
class="material-card highlight-blog-post large"
|
class="material-card picture-promo"
|
||||||
href="/blog/2017/07/25/introducing-hassio/"
|
href="/conference/"
|
||||||
|
style="
|
||||||
|
background-image: url(/images/conference/frontpage-card.png);
|
||||||
|
background-size: cover;
|
||||||
|
background-color: #41bdf5;
|
||||||
|
background-position: top;
|
||||||
|
"
|
||||||
>
|
>
|
||||||
Learn how our OS can turn your Raspberry Pi into the ultimate home
|
<div class="caption">
|
||||||
automation hub
|
<div class="title">
|
||||||
<i class="icon-arrow-right"></i>
|
December 13, 2020
|
||||||
|
<div class="subtitle">
|
||||||
|
It's all about Home Assistant!
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<svg viewBox="0 0 24 24"><path d="M8.59,16.58L13.17,12L8.59,7.41L10,6L16,12L10,18L8.59,16.58Z" /></svg>
|
||||||
|
</div>
|
||||||
</a>
|
</a>
|
||||||
|
|
||||||
<a
|
<a
|
||||||
@ -129,10 +140,13 @@ description:
|
|||||||
"
|
"
|
||||||
>
|
>
|
||||||
<div class="caption">
|
<div class="caption">
|
||||||
<div class="title">Home Assistant Tags</div>
|
<div class="title">
|
||||||
<div class="subtitle">
|
Home Assistant Tags
|
||||||
Use NFC to bring music to your life or automate the mundane.
|
<div class="subtitle">
|
||||||
|
Use NFC to bring music to your life or automate the mundane.
|
||||||
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
<svg viewBox="0 0 24 24"><path d="M8.59,16.58L13.17,12L8.59,7.41L10,6L16,12L10,18L8.59,16.58Z" /></svg>
|
||||||
</div>
|
</div>
|
||||||
</a>
|
</a>
|
||||||
|
|
||||||
@ -142,10 +156,13 @@ description:
|
|||||||
style="background-image: url(/images/merchandise/shirt-frontpage.png)"
|
style="background-image: url(/images/merchandise/shirt-frontpage.png)"
|
||||||
>
|
>
|
||||||
<div class="caption">
|
<div class="caption">
|
||||||
<div class="title">Join the Home Assistant t-shirt revolution!</div>
|
<div class="title">
|
||||||
<div class="subtitle">
|
Join the Home Assistant t-shirt revolution!
|
||||||
Look sharp in blue, black or gray. Wearing a HA t-shirt is okay.
|
<div class="subtitle">
|
||||||
|
Look sharp in blue, black or gray. Wearing a HA t-shirt is okay.
|
||||||
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
<svg viewBox="0 0 24 24"><path d="M8.59,16.58L13.17,12L8.59,7.41L10,6L16,12L10,18L8.59,16.58Z" /></svg>
|
||||||
</div>
|
</div>
|
||||||
</a>
|
</a>
|
||||||
</div>
|
</div>
|
||||||
|
|||||||
Loading…
x
Reference in New Issue
Block a user