diff --git a/_static/custom.css b/_static/custom.css index c24306b38..c0b666de4 100644 --- a/_static/custom.css +++ b/_static/custom.css @@ -90,6 +90,12 @@ img.index-shield { margin-top: 10px; } +div.index-shields { + display: flex; + justify-content: space-around; + margin: 0 64px; +} + .supporters-row { display: flex; } @@ -111,3 +117,54 @@ img.index-shield { margin-left: auto; margin-right: auto; } + + +.guide-container { + margin: 32px 0; + display: flex; + justify-content: space-evenly; +} + +.guide-card { + color: #004B6B; + display: block; + height: auto; + width: 300px; + background-color: #f3f6f6; + border-radius: 8px; + box-shadow: -10px 10px 32px -12px #000; + padding-bottom: 8px; +} + +.guide-card:not(:first-child) { + margin-left: -40px; +} + +.guide-card-title { + font-weight: 300; + margin: 16px !important; +} + +.guide-code { + padding: 8px 16px; + margin: 8px; + color: black; + white-space: pre-line; +} + + +@media screen and (max-width: 870px) { + .guide-container { + flex-direction: column-reverse; + } + .guide-card { + width: 100%; + margin: 8px 0; + } + .guide-card:not(:first-child) { + margin-left: 0; + } + .guide-card ul { + margin-left: 32px; + } +} \ No newline at end of file diff --git a/_templates/contact.html b/_templates/contact.html new file mode 100644 index 000000000..f36b412ff --- /dev/null +++ b/_templates/contact.html @@ -0,0 +1,7 @@ +
+ + diff --git a/conf.py b/conf.py index 4fa8e218d..921f11f97 100644 --- a/conf.py +++ b/conf.py @@ -147,6 +147,7 @@ html_sidebars = { # 'about.html', "searchbox.html", "localtoc.html", + "contact.html" ] } diff --git a/images/hero.png b/images/hero.png new file mode 100644 index 000000000..af76fa285 Binary files /dev/null and b/images/hero.png differ diff --git a/images/index.rst b/images/index.rst index 2e0839683..d48ef2697 100644 --- a/images/index.rst +++ b/images/index.rst @@ -4,13 +4,9 @@ Images This is a dummy file to include images in the sphinx output that will only be used in raw HTML and thus not auto-included. -.. image:: shield-discord.svg - -.. image:: shield-github.svg - .. image:: shield-donate.svg -.. image:: shield-twitter.svg +.. image:: hero.png .. image:: logo.svg diff --git a/images/shield-discord.svg b/images/shield-discord.svg deleted file mode 100644 index a6732870f..000000000 --- a/images/shield-discord.svg +++ /dev/null @@ -1 +0,0 @@ - \ No newline at end of file diff --git a/images/shield-github.svg b/images/shield-github.svg deleted file mode 100644 index 459de0bff..000000000 --- a/images/shield-github.svg +++ /dev/null @@ -1 +0,0 @@ - \ No newline at end of file diff --git a/images/shield-twitter.svg b/images/shield-twitter.svg deleted file mode 100644 index 736028428..000000000 --- a/images/shield-twitter.svg +++ /dev/null @@ -1 +0,0 @@ - \ No newline at end of file diff --git a/index.rst b/index.rst index 65a9e6bd9..e272547a0 100644 --- a/index.rst +++ b/index.rst @@ -1,6 +1,3 @@ -ESPHome -======= - .. meta:: :google-site-verification: Q5q5TFbCofxA8-cSa1Frv5Hj4RopF5zwEZf_zaNHqf4 @@ -14,32 +11,83 @@ ESPHome ESPHome is a system to control your ESP8266/ESP32 by simple yet powerful configuration files and control them remotely through Home Automation systems. +.. image:: /images/hero.png + .. raw:: html - GitHub - Discord - Twitter - -.. _guides: - -Guides ------- - -.. imgtable:: - - Getting Started through Command Line, guides/getting_started_command_line, console.svg - Getting Started with Home Assistant Add-on, guides/getting_started_hassio, home-assistant.svg - FAQ and Tips, guides/faq, question_answer.svg - - Migrating from Tasmota, guides/migrate_sonoff_tasmota, tasmota.svg - Automations, guides/automations, auto-fix.svg - Contributing, guides/contributing, github-circle.svg - - Changelog, changelog/index, new-box.svg - Supporters, guides/supporters, heart.svg - DIY Examples, guides/diy, earth.svg - - Configuration types, guides/configuration-types, puzzle.svg +
+
+

Keeping up

+ + 
+                esphome:
+                  name: Awesome
+                  platform: ESP32
+                  board: nodemcu-32s
+
+
+
+

Next steps

+ +
+
+

Getting started

+ +
+
.. _devices: