jeans/developers.home-assistant
jeans/developers.home-assistant
1
0
Fork 0
mirror of https://github.com/home-assistant/developers.home-assistant.git synced 2025-07-12 11:56:29 +00:00
Code Issues Packages Projects Releases Wiki Activity

Add recent blog posts to homepage (#985)

Browse Source
This commit is contained in:
Tom Brien 2021-06-28 22:52:54 +01:00 committed by GitHub
parent cd431b3be6
commit 9068b64e55
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
1 changed files with 18 additions and 2 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

20
src/pages/index.js
View File

@ -6,6 +6,7 @@ import useDocusaurusContext from "@docusaurus/useDocusaurusContext";
import useBaseUrl from "@docusaurus/useBaseUrl"; import useBaseUrl from "@docusaurus/useBaseUrl";
import styles from "./styles.module.css"; import styles from "./styles.module.css";
const recentPosts = require("../../.docusaurus/docusaurus-plugin-content-blog/default/blog-post-list-prop-default.json");
const features = [ const features = [
{ {
title: <>Document Structure</>, title: <>Document Structure</>,
@ -75,6 +76,21 @@ const features = [
</> </>
), ),
}, },
{
title: <>Recent Blog Posts</>,
imageUrl: "",
description: (
<>
<ul>
{recentPosts.items.slice(0, 5).map((item, index) => (
<li key={index}>
<a href={`${item.permalink}`}>{item.title}</a>{" "}
</li>
))}
</ul>
</>
)
},
{ {
title: <>Upcoming Events</>, title: <>Upcoming Events</>,
imageUrl: "", imageUrl: "",
@ -83,7 +99,7 @@ const features = [
<iframe <iframe
title="Upcoming Events Calendar" title="Upcoming Events Calendar"
src="https://calendar.google.com/calendar/embed?height=400&amp;wkst=2&amp;bgcolor=%23ffffff&amp;ctz=America%2FLos_Angeles&amp;src=cDA3bjk4Z28xMW9uYW1kMDhkMGttcTZqaHNAZ3JvdXAuY2FsZW5kYXIuZ29vZ2xlLmNvbQ&amp;color=%23039BE5&amp;title=Release%20Schedule&amp;mode=AGENDA&amp;showPrint=0&amp;showTabs=0&amp;showCalendars=0&amp;showTz=0&amp;showNav=0&amp;showDate=0&amp;showTitle=0" src="https://calendar.google.com/calendar/embed?height=400&amp;wkst=2&amp;bgcolor=%23ffffff&amp;ctz=America%2FLos_Angeles&amp;src=cDA3bjk4Z28xMW9uYW1kMDhkMGttcTZqaHNAZ3JvdXAuY2FsZW5kYXIuZ29vZ2xlLmNvbQ&amp;color=%23039BE5&amp;title=Release%20Schedule&amp;mode=AGENDA&amp;showPrint=0&amp;showTabs=0&amp;showCalendars=0&amp;showTz=0&amp;showNav=0&amp;showDate=0&amp;showTitle=0"
style={{ borderWidth: 0, margin: "auto", display: "block" }} style={{ borderWidth: 0, margin: "auto" }}
width="300" width="300"
height="200" height="200"
frameBorder="0" frameBorder="0"
@ -97,7 +113,7 @@ const features = [
function Feature({ imageUrl, title, description }) { function Feature({ imageUrl, title, description }) {
const imgUrl = useBaseUrl(imageUrl); const imgUrl = useBaseUrl(imageUrl);
return ( return (
<div className={clsx("col col--4", styles.feature)}> <div className={clsx("col col--3", styles.feature)}>
{imgUrl && ( {imgUrl && (
<div className="text--center"> <div className="text--center">
<img className={styles.featureImage} src={imgUrl} alt={title} /> <img className={styles.featureImage} src={imgUrl} alt={title} />