Pt 2091 doc migration render (#552)

PT-2091 Docs configuration for Render builds

* Added Sphinx-material theme and customizations
* Changed Makefile to use Material theme
* Customized the theme
* Added a separate config for render builds

config/sphinx-build/Makefile

@@ -50,6 +50,12 @@ html:
 	@echo
 	@echo "Build finished. The HTML pages are in $(BUILDDIR)/html."
 
+thtml:
+	@echo "Building html doc"
+	$(SPHINXBUILD) -b html $(ALLSPHINXOPTS) -c conf-material $(BUILDDIR)/html
+	@echo
+	@echo "Build finished. The HTML pages are in $(BUILDDIR)/html."
+
 dirhtml:
 	$(SPHINXBUILD) -b dirhtml $(ALLSPHINXOPTS) $(BUILDDIR)/dirhtml
 	@echo

config/sphinx-build/_static/_templates/theme/header.html

@@ -0,0 +1,39 @@
+<header class="md-header" data-md-component="header">
+  <nav class="md-header-nav md-grid">
+    <div class="md-flex navheader">
+      <div class="md-flex__cell md-flex__cell--shrink">
+        <a href="https://www.percona.com/software/documentation" title="{{ docstitle|e }}"
+           class="md-header-nav__button md-logo">
+          {% if theme_logo_icon|e %}
+            <i class="md-icon">{{ theme_logo_icon }}</i>
+          {% elif logo %}
+              <img src="{{ pathto('_static/' ~ logo, 1) }}" height="26"
+                   alt="{{ shorttitle|striptags|e }} logo">
+          {% else %}
+            &nbsp;
+          {% endif %}
+        </a>
+      </div>
+      <div class="md-flex__cell md-flex__cell--shrink">
+        <label class="md-icon md-icon--menu md-header-nav__button" for="__drawer"></label>
+      </div>
+      <div class="md-flex__cell md-flex__cell--stretch">
+        <div class="md-flex__ellipsis md-header-nav__title" data-md-component="title">
+          <span class="md-header-nav__topic"> {{ title|striptags|e }} </span>
+        </div>
+      </div>
+      <div class="md-flex__cell md-flex__cell--shrink">
+        <label class="md-icon md-icon--search md-header-nav__button" for="__search"></label>
+        {% include "searchbox.html" %}
+      </div>
+      {% if theme_repo_url %}
+        <div class="md-flex__cell md-flex__cell--shrink">
+          <div class="md-header-nav__source">
+            {% include "repo.html" %}
+          </div>
+        </div>
+      {% endif %}
+      {% include "version_dropdown.html" %}
+    </div>
+  </nav>
+</header>

config/sphinx-build/_static/_templates/theme/layout.html

@@ -0,0 +1,19 @@
+{# Import the theme's layout. #}
+{% extends "!layout.html" %}
+
+{# Adds Google Analytics events on button click. #}
+{%- block extrahead %}
+<script>
+var _gaq = _gaq || [];
+_gaq.push(['_setAccount', 'UA-343802-3']);
+_gaq.push(['_trackPageview']);
+</script>
+{{ super() }}
+{%- endblock %}
+
+
+{%- block relbar2 %}
+{% include "relbar2.html" %}
+{%- endblock %}
+
+

config/sphinx-build/_static/_templates/theme/localtoc.html

@@ -0,0 +1,26 @@
+{% set toc_nodes = derender_toc(toc, True, pagename) if display_toc else [] %}
+<nav class="md-nav md-nav--secondary">
+  {%- if display_toc and toc_nodes and sidebars and 'localtoc.html' in sidebars %}
+    <label class="md-nav__title" for="__toc">Contents</label>
+  {%- endif %}
+  <ul class="md-nav__list" data-md-scrollfix="">
+    {%- if display_toc and sidebars and 'localtoc.html' in sidebars %}
+      {%- for item in toc_nodes recursive %}
+        <li class="md-nav__item"><a href="{{ item.href|e }}" class="md-nav__link">{{ item.contents }}</a>
+          {%- if item.children -%}
+            <nav class="md-nav">
+              <ul class="md-nav__list">{{ loop(item.children) }}</ul>
+            </nav>
+          {%- endif %}
+        </li>
+      {%- endfor %}
+    {%- endif %}
+    {%- if show_source %}
+    {% include "sourcelink.html" %}
+    {%- endif %}
+    {% if theme_repo_url|e %}
+    <li class="md-nav__item"><a class="md-nav__extra_link" href="{{ theme_repo_url }}/{{ edit_uri }}/{{ pagename }}.rst" target="_blank">
+    <i class="fa fa-github"></i>    Edit this page</a> </li>
+   {% endif %}
+  </ul>
+</nav>

config/sphinx-build/_static/_templates/theme/relbar2.html

@@ -0,0 +1,14 @@
+<div class="md-relbar2__inner md-grid">
+<div class="md-content">
+  <article class="md-content__inner md-typeset" role="main">    
+    <h4>Contact Us </h4>
+       <p>For free technical help, visit the Percona <a class="reference external" href="https://forums.percona.com/c/mongodb/percona-server-for-mongodb/17?utm_campaign=Doc%20pages" target="_blank">Community Forum</a>.<br>
+        <p>To report bugs or submit feature requests, open a <a class="reference external" href="https://jira.percona.com/projects/PSMDB/issues/" target="_blank">JIRA</a> ticket.<br>
+         <p>For paid <a class="reference external" href="https://www.percona.com/services/support"> support </a> and <a class="reference external" href="https://www.percona.com/services/managed-services"> managed </a> or <a class="reference external" href="https://www.percona.com/services/consulting">consulting services </a>, contact <a class="reference external" href="https://www.percona.com/about-percona/contact" target="_blank">Percona Sales</a>.</p>
+         <hr>
+         {# Add the last updated timestamp from git commits using gitstamp extension #}
+         {%- if gitstamp %} <small> Last update: {{gitstamp}} </small> 
+         {%- endif %}
+ </article>
+</div>
+</div>

config/sphinx-build/_static/_templates/theme/sidebar.html

@@ -0,0 +1,22 @@
+<nav class="md-nav md-nav--primary" data-md-level="0">
+  <label class="md-nav__title md-nav__title--site" for="__drawer">
+    <a href="{{ pathto(master_doc)|e }}" title="{{ docstitle|striptags|e }}" class="md-nav__button md-logo">
+      {% if theme_logo_icon %}
+        <i class="md-icon">{{ theme_logo_icon }}</i>
+      {% else %}
+        <img src="{{ pathto('_static/' ~ logo, 1) }}" alt="{{ html_title }} logo" width="48" height="48">
+      {% endif %}
+    </a>
+    <a href="{{ pathto(master_doc)|e }}"
+       title="{{ docstitle|striptags|e }}">{{ theme_nav_title or shorttitle }}</a>
+  </label>
+  {%- if theme_repo_url %}
+    <div class="md-nav__source">
+      {% include "repo.html" %}
+    </div>
+  {% endif %}
+  {% include "globaltoc.html" %}
+  <label class="md-nav__title md-nav__title--site" for="__drawer">
+<a title="Download PDF Manual" onclick="_gaq.push(['b._trackEvent', 'Percona Toolkit', 'Download', 'Download Percona Toolkit {{version}} Manual']);" href="https://learn.percona.com/download-percona-toolkit-3-manual" class="md-nav__link">Download PDF Manual <span class="glyphicon glyphicon-chevron-down"></span></a>
+  </label>
+</nav>

config/sphinx-build/_static/css/material.css

@@ -0,0 +1,33 @@
+.md-relbar2__inner{
+    padding-top:0;
+    padding-bottom:0;
+    margin-bottom: 0;
+}
+
+.sphinx-tabs-tab {
+  position: relative;
+  font-family: "Chivo", "Colfax", Helvetica, Arial, sans-serif;
+  color: #fb8c00;
+  line-height: 24px;
+  margin: 0;
+  font-size: 19px;
+  font-weight: 400;
+  background-color: rgba(255, 255, 255, 0);
+  border-radius: 5px 5px 0 0;
+  border: 0;
+  padding: 1rem 1.5rem;
+  margin-bottom: 0;
+}
+
+.md-typeset{
+    font-size:.7rem;
+    line-height:1.6;
+    -webkit-print-color-adjust:exact
+}
+
+body,input{
+    color:rgba(0,0,0,.87);
+    -webkit-font-feature-settings:"kern","liga";
+    font-feature-settings:"kern","liga";
+    font-family:"Chivo", "Colfax", "Franziska", Helvetica, Arial, sans-serif;
+}

config/sphinx-build/_static/css/tabs.css

@@ -0,0 +1,15 @@
+.sphinx-tabs-tab {
+  position: relative;
+  font-family: "Roboto", "Helvetica Neue", Helvetica, Arial, sans-serif;
+  color: #fb8c00;
+  line-height: 24px;
+  margin: 0;
+  font-size: 19px;
+  font-weight: 400;
+  background-color: rgba(255, 255, 255, 0);
+  border-radius: 5px 5px 0 0;
+  border: 0;
+  padding: 1rem 1.5rem;
+  margin-bottom: 0;
+}
+

config/sphinx-build/_static/percona-logo.svg

@@ -0,0 +1,12 @@
+<svg width="74" height="74" viewBox="0 0 74 74" fill="none" xmlns="http://www.w3.org/2000/svg">
+  <circle cx="37" cy="37" r="37" fill="url(#paint0_linear)"/>
+  <path d="M37.5003 58C49.3744 58 59 48.3743 59 36.5C59 24.6257 49.3744 15 37.5003 15C25.6261 15 16 24.6257 16 36.5C16 36.6671 16.0019 36.8338 16.0057 37H16V67.4672C18.744 69.3622 21.7566 70.896 24.969 72H25V53.9948C28.5225 56.5161 32.8381 58 37.5003 58Z" fill="white"/>
+  <path d="M50 36.5C50 43.4036 44.4037 49 37.5001 49C30.5966 49 25 43.4036 25 36.5C25 29.5964 30.5966 24 37.5001 24C44.4037 24 50 29.5964 50 36.5Z" fill="#FCB42F"/>
+  <defs>
+    <linearGradient id="paint0_linear" x1="37" y1="0" x2="37" y2="74" gradientUnits="userSpaceOnUse">
+      <stop stop-color="#FBB32F"/>
+      <stop offset="0.504739" stop-color="#C11511"/>
+      <stop offset="1" stop-color="#C11411"/>
+    </linearGradient>
+  </defs>
+</svg>

config/sphinx-build/conf-material/conf.py

@@ -0,0 +1,34 @@
+#!/usr/bin/env python3
+# -*- coding: utf-8 -*-
+import sys
+import os
+sys.path.append(os.path.abspath("../"))
+from conf import *
+extensions.append('sphinx_gitstamp')
+extensions.append('sphinx_copybutton')
+html_sidebars['**']=['globaltoc.html', 'searchbox.html', 'localtoc.html', 'logo-text.html']
+html_theme = 'sphinx_material'
+html_theme_options = {
+    'base_url': 'http://bashtage.github.io/sphinx-material/',
+    'repo_url': 'https://github.com/percona/percona-server',
+    'repo_name': 'percona/percona-server',
+    'color_accent': 'grey',
+    'color_primary': 'orange',
+    'globaltoc_collapse': True,
+    'version_dropdown': True
+}
+html_logo = '../_static/percona-logo.svg'
+html_favicon = '../_static/percona_favicon.ico'
+pygments_style = 'emacs'
+gitstamp_fmt = "%b %d, %Y"
+# Specify the text pattern that won't be copied with the code block contents
+copybutton_prompt_text = '$'
+# Add any paths that contain templates here, relative to this directory.
+templates_path = ['../_static/_templates/theme']
+#html_last_updated_fmt = ''
+
+# Path to custom css files. These will override the default css attribute if they exist
+html_css_files = [
+    '../_static/css/material.css',
+]
+

config/sphinx-build/conf.py

@@ -41,7 +41,7 @@ master_doc = 'index'
 
 # General information about the project.
 project = u'Percona Toolkit'
-copyright = u'2021, Percona LLC and/or its affiliates'
+copyright = u'2022, Percona LLC and/or its affiliates'
 
 # The version info for the project you're documenting, acts as replacement for
 # |version| and |release|, also used in various other places throughout the
@@ -97,8 +97,20 @@ html_theme = 'percona-theme'
 # Theme options are theme-specific and customize the look and feel of a theme
 # further.  For a list of options available for each theme, see the
 # documentation.
-#html_theme_options = {}
+#html_theme_options = {
+#  'base_url': 'http://bashtage.github.io/sphinx-material/',
+#  'repo_url': 'https://github.com/percona/percona-toolkit',
+#  'repo_name': 'percona/percona-toolkit',
+#  'color_accent': 'grey',
+#  'color_primary': 'orange',
+#  'google_analytics_account': 'UA-343802-3',
+#  'globaltoc_collapse': True,
+#  'version_dropdown': True
+#}
 
+html_context = {
+   'edit_uri': 'edit/3.x/source'
+}
 # Add any paths that contain custom themes here, relative to this directory.
 html_theme_path = ['.', './percona-theme']
 
@@ -111,17 +123,25 @@ html_short_title = 'Percona Toolkit'
 
 # The name of an image file (relative to this directory) to place at the top
 # of the sidebar.
-#html_logo = None
+#html_logo = '_static/percona-logo.svg'
 
 # The name of an image file (within the static path) to use as favicon of the
 # docs.  This file should be a Windows icon file (.ico) being 16x16 or 32x32
 # pixels large.
-html_favicon = '_static/percona_favicon.ico'
+#html_favicon = '_static/percona_favicon.ico'
 
 # Add any paths that contain custom static files (such as style sheets) here,
 # relative to this directory. They are copied after the builtin static files,
 # so a file named "default.css" will overwrite the builtin "default.css".
-html_static_path = ['_static']
+#html_static_path = ['_static']
+
+# Add any paths that contain templates here, relative to this directory.
+#templates_path = ['_static/_templates/theme']
+
+# Path to custom css files. These will override the default css attribute if they exist
+html_css_files = [
+    '_static/css/material.css',
+]
 
 # If not '', a 'Last updated on:' timestamp is inserted at every page bottom,
 # using the given strftime format.
@@ -132,7 +152,10 @@ html_static_path = ['_static']
 #html_use_smartypants = True
 
 # Custom sidebar templates, maps document names to template names.
-#html_sidebars = {}
+html_sidebars = {
+  '**': ['globaltoc.html', 'searchbox.html', 'localtoc.html', 'sourcelink.html'],
+    'using/windows': ['windowssidebar.html'],
+   }
 
 # Additional templates that should be rendered to pages, maps page names to
 # template names.
@@ -180,12 +203,12 @@ htmlhelp_basename = 'PerconaToolkitdoc'
 # (source start file, target name, title, author, documentclass [howto/manual]).
 latex_documents = [
   ('index', 'PerconaToolkit.tex', u'Percona Toolkit Documentation',
-   u'2021, Percona LLC and/or its affiliates', 'manual'),
+   u'2022, Percona LLC and/or its affiliates', 'manual'),
 ]
 
 # The name of an image file (relative to this directory) to place at the top of
 # the title page.
-latex_logo = 'percona-logo.jpg'
+latex_logo = 'Percona_Logo_Color.png'
 
 # For "manual" documents, if this is true, then toplevel headings are parts,
 # not chapters.
@@ -214,5 +237,5 @@ latex_toplevel_sectioning = 'part'
 # (source start file, name, description, authors, manual section).
 man_pages = [
     ('index', 'perconatoolkit', u'Percona Toolkit Documentation',
-     [u'2021, Percona LLC and/or its affiliates'], 1)
+     [u'2022, Percona LLC and/or its affiliates'], 1)
 ]

requirements-docbuild.txt

@@ -0,0 +1,15 @@
+Sphinx==4.2.0
+sphinx-copybutton
+sphinx-gitstamp
+sphinx-material
+sphinxcontrib-applehelp
+sphinxcontrib-contentui
+sphinxcontrib-devhelp
+sphinxcontrib-fulltoc
+sphinxcontrib-htmlhelp
+sphinxcontrib-jsmath
+sphinxcontrib-qthelp
+sphinxcontrib-serializinghtml
+sphinxcontrib-srclinks
+sphinx-tabs
+

runtime.txt

@@ -0,0 +1 @@
+3.7