From f178454d9b2f798e9c610253cf15fb0ce7adc945 Mon Sep 17 00:00:00 2001 From: Eric Holscher Date: Wed, 20 Nov 2024 16:19:19 -0800 Subject: [PATCH 1/3] Add Markdoc page to website marketing This links to our newly created doc page --- content/includes/try-it-out-markdoc.html | 91 ++++++++++++ content/pages/tools/markdoc.html | 139 ++++++++++++++++++ .../templates/includes/topnav.html | 1 + 3 files changed, 231 insertions(+) create mode 100644 content/includes/try-it-out-markdoc.html create mode 100644 content/pages/tools/markdoc.html diff --git a/content/includes/try-it-out-markdoc.html b/content/includes/try-it-out-markdoc.html new file mode 100644 index 00000000..e5063a86 --- /dev/null +++ b/content/includes/try-it-out-markdoc.html @@ -0,0 +1,91 @@ +
+
Try it out
+
+ +
+
+

+ Deploy in 5 minutes and see for yourself +

+ +
+ +
+
+ + {# Stylized code blocks #} + {% call technical.code_block(title=".readthedocs.yaml", icon="fa-file") %} + {% markdown %} + + ```yaml + version: 2 + + build: + os: ubuntu-24.04 + tools: + nodejs: "18" + commands: + # Install dependencies + - cd docs/ && npm install + # Build the site + - cd docs/ && npm run build + # Copy generated files into Read the Docs directory + - mkdir --parents $READTHEDOCS_OUTPUT/html/ + - cp --verbose --recursive docs/out/* $READTHEDOCS_OUTPUT/html/ + + ``` + + {% endmarkdown %} + {% endcall %} +
+
+ +
+
+
+ + {%- set header_1 = "Create an account" %} + {%- set icon_1 = "fa-square-1" -%} + + + + {{ header_1 }} + Sign up with GitHub or your email. + + + + {%- set header_2 = "Import your project" %} + {%- set icon_2 = "fa-square-2" -%} + + + + {{ header_2 }} + Select a project from your existing Git repositories. + + + + {%- set header_3 = "Add YAML config" %} + {%- set icon_3 = "fa-square-3" -%} + + + + {{ header_3 }} + Save this file as .readthedocs.yaml, and update the commands as necessary. + + + + {%- set header_4 = "Your docs build on every commit" %} + {%- set icon_4 = "fa-square-4" -%} + + + + {{ header_4 }} + Like magic. + + +
+
+
+
+
+
diff --git a/content/pages/tools/markdoc.html b/content/pages/tools/markdoc.html new file mode 100644 index 00000000..769e7b14 --- /dev/null +++ b/content/pages/tools/markdoc.html @@ -0,0 +1,139 @@ +{# + The goal of this page is to sell users who are already authoring in Markdoc on the benefits of our hosting. + We aren't focusing on generic Markdoc benefits, + but the unique differentiation of our platform. +#} + +{# + View this page at http://localhost:8080/tools/markdoc/ +#} + + + + Optimize your Markdoc documentation with our hosting + + + + + + + +{% import "partials/basic.html" as basic %} +{% import "partials/marketing.html" as marketing %} +{% import "partials/technical.html" as technical %} +{% import "partials/homepage.html" as homepage %} + +
+ {% call basic.header_image( + header="Optimize your Markdoc documentation with our hosting", + image="/images/homepage.png", + image_alt="Examples of Read the Docs hosted documentation", + vertical_align="middle") + %} + {# TODO: Add a GIF of using hoverxref & livesearch #} +

+ Automatically deploy powerful search, versioning, and collaboration to your Markdoc projects. +

+ +

+ + + Create an account + + + + See a demo + +

+ {% endcall %} +
+ +
+ {% call marketing.highlight_list() %} + + {% call marketing.highlight_item( + icon="olive fa-people-arrows", + icon_style="--fa-secondary-color: violet; --fa-secondary-opacity: 1;", + header="Easily share with deploy previews", + color="violet") %} + {% markdown %} + Receive feedback from your team, + and have confidence in changes before they go live. + {% endmarkdown %} + {% endcall %} + + {% call marketing.highlight_item( + icon="yellow fa-magnifying-glass", + icon_style="--fa-secondary-color: white; --fa-secondary-opacity: 1;", + header="Always find what you need", + color="violet") %} + {% markdown %} + Search across all your projects with our search-as-you-type interface, + and never lose documentation again. + {% endmarkdown %} + {% endcall %} + + {% call marketing.highlight_item( + icon="fa-eye", + header="Keep your focus with link previews", + color="violet") %} + + {% markdown %} + Provide context on every internal link in your docs with instant preview links. + Skim the content without opening *another* tab. + {% endmarkdown %} + {% endcall %} + + {% endcall %} +
+ +{# Try it out code block #} +{% include "includes/try-it-out-markdoc.html" %} + +{# Markdoc user testimonials #} +{# {% include "includes/users-markdoc.html" %} #} + +{% block homepage_bottom_callout %} +
+
+
+ +
+
+ + {# + TODO replace this block with something more actionable. It's + not saying anything new at this point in the page, and the call + to action is not strong. + #} +
+

+ Import your Markdoc project today. +

+ +

+ + + Create an account + +

+
+ +

+ Learn more about using Markdoc with Read the Docs in our documentation. +

+ +
+
+ +
+
+
+{% endblock homepage_bottom_callout %} + + + diff --git a/readthedocs_theme/templates/includes/topnav.html b/readthedocs_theme/templates/includes/topnav.html index 6c405912..120b5a48 100644 --- a/readthedocs_theme/templates/includes/topnav.html +++ b/readthedocs_theme/templates/includes/topnav.html @@ -46,6 +46,7 @@ Sphinx Mkdocs Jupyter Book + Markdoc {% endif %} From 2a11c521cffeaaec036ff742ec7abcac5077e141 Mon Sep 17 00:00:00 2001 From: Eric Holscher <25510+ericholscher@users.noreply.github.com> Date: Thu, 21 Nov 2024 09:06:42 -0800 Subject: [PATCH 2/3] Apply suggestions from code review Co-authored-by: Manuel Kaufmann --- content/includes/try-it-out-markdoc.html | 2 +- content/pages/tools/markdoc.html | 2 +- 2 files changed, 2 insertions(+), 2 deletions(-) diff --git a/content/includes/try-it-out-markdoc.html b/content/includes/try-it-out-markdoc.html index e5063a86..1a288b82 100644 --- a/content/includes/try-it-out-markdoc.html +++ b/content/includes/try-it-out-markdoc.html @@ -23,7 +23,7 @@

build: os: ubuntu-24.04 tools: - nodejs: "18" + nodejs: "22" commands: # Install dependencies - cd docs/ && npm install diff --git a/content/pages/tools/markdoc.html b/content/pages/tools/markdoc.html index 769e7b14..13f4cb99 100644 --- a/content/pages/tools/markdoc.html +++ b/content/pages/tools/markdoc.html @@ -42,7 +42,7 @@ Create an account - + See a demo From 15e21cdcad56e77e0687cba20b2aa2e38b5b0386 Mon Sep 17 00:00:00 2001 From: Eric Holscher Date: Mon, 25 Nov 2024 09:55:45 -0800 Subject: [PATCH 3/3] Add doc link in Learn More --- content/pages/tools/markdoc.html | 10 +++++----- 1 file changed, 5 insertions(+), 5 deletions(-) diff --git a/content/pages/tools/markdoc.html b/content/pages/tools/markdoc.html index 13f4cb99..a8cf2e49 100644 --- a/content/pages/tools/markdoc.html +++ b/content/pages/tools/markdoc.html @@ -42,7 +42,7 @@ Create an account - + See a demo @@ -120,13 +120,13 @@ Create an account + + + Learn more +

-

- Learn more about using Markdoc with Read the Docs in our documentation. -

-