Template for EE Tasks alpha (#5066)

* Template for EE Tasks alpha

* Attempt to avoid includes

* Cleanup

* Cleanup

_config.yml

@@ -46,6 +46,13 @@ dtr_versions:
   - version: "2.0"
     path: /datacenter/dtr/2.0/
 
+tablabels:
+  ucp-3.0: Universal Control Plane 3.0
+  ucp-2.2: Universal Control Plane 2.2
+  docker-cli-linux: Docker CLI on Mac/Linux
+  docker-cli-win: Docker CLI on Windows
+  kubectl: Kubernetes CLI
+
 collections:
   samples:
     output: true

_layouts/docs.html

@@ -118,7 +118,53 @@
 							<h1>{{ page.title }}</h1>{% endif %} {% if page.advisory %}
 							<blockquote>{{ site.data.advisories.texts[page.advisory] | markdownify }}</blockquote>{% endif %}{% endif %} {% unless page.tree == false %}{% include read_time.html %}{% endunless %}
 							{% if page.enterprise %}{% include ee_dropdown.html %}{% endif %}
+							{% if page.ui_tabs or page.cli_tabs %}
+								{{ page.description | markdownify }}
+
+								{% if page.ui_tabs %}
+
+								<h2>{{ page.title }} in the UI</h2>
+
+								<blockquote>
+								<p>These instructions require Docker Enterprise</p>
+								<p>The UI instructions shown here are for the dashboard provided with
+								<a href="/enterprise/#docker-ee-feature-tiers">Docker Enterprise Standard</a>
+								or higher.</p>
+								</blockquote>
+
+								<ul class="nav nav-tabs">{% for tab in page.ui_tabs %}
+								  <li{% if forloop.first %} class="active"{% endif %}><a data-toggle="tab" data-target="#ui-{{ tab.version | slugify }}" id="ui-tabheader-{{ tab.version | slugify }}">{{ site.tablabels[tab.version] }}{% if tab.orhigher %} (or higher){% endif %}{% if tab.orlower %} (or lower){% endif %}</a></li>{% endfor %}
+								</ul>
+								<div class="tab-content">{% for tab in page.ui_tabs %}
+								  <div id="ui-{{ tab.version | slugify }}" class="tab-pane fade{% if forloop.first %} in active{% endif %}">{% capture thistab %}{% include_relative {{ page.path | split: "/" | last }} version=tab.version ui="true" %}{% endcapture %}{{ thistab | split: "---" | last | markdownify  }}</div>{% endfor %}
+								</div>
+
+								{% endif %}
+								{% if page.cli_tabs %}
+
+								<h2>{{ page.title }} in the CLI</h2>
+
+								<ul class="nav nav-tabs">{% for tab in page.cli_tabs %}
+								  <li{% if forloop.first %} class="active"{% endif %}><a data-toggle="tab" data-target="#cli-{{ tab.version | slugify }}" id="cli-tabheader-{{ tab.version | slugify }}">{{ site.tablabels[tab.version] }}</a></li>{% endfor %}
+								</ul>
+								<div class="tab-content">{% for tab in page.cli_tabs %}
+								  <div id="cli-{{ tab.version | slugify }}" class="tab-pane fade{% if forloop.first %} in active{% endif %}">{% capture thistab %}{% include_relative {{ page.path | split: "/" | last }} version=tab.version cli="true" %}{% endcapture %}{{ thistab | split: "---" | last | markdownify  }}</div>{% endfor %}
+								</div>
+
+								{% endif %}
+
+								{% if page.next_steps %}
+
+								<h2>Next steps</h2>
+
+								<ul>
+								{% for step in page.next_steps %}  <li><a href="{{ step.path }}">{{ step.title }}</a></li>
+								{% endfor %}
+								</ul>
+								{% endif %}
+							{% else %}
 							{{ content }}
+							{% endif %}
 							<!-- tags -->
 							{% unless page.notags == true %}
 							{% assign keywords = page.keywords | split:"," %}

deploy/test.md

@@ -0,0 +1,52 @@
+---
+title: Manage logs
+description: |
+  The reason you would do this is X, Y, and Z.
+
+  This can be a multiline description but should probably `be brief`.
+ui_tabs:
+- version: ucp-3.0
+  orhigher: true
+- version: ucp-2.2
+  orlower: true
+cli_tabs:
+- version: docker-cli-linux
+- version: docker-cli-win
+- version: kubectl
+next_steps:
+- path: /engine/install
+  title: Install Docker
+- path: /get-started/
+  title: Get Started with Docker
+---
+{% if include.ui %}
+To do this foobar task, you'll want to flip the switch under **Tasks > Foobar**,
+enter your Lorem Ipsum value for {{ site.tablabels[tab.version] }}, then
+click **Save**.
+
+{% if include.version=="ucp-3.0" %}
+![Image number 1](https://docs.docker.com/datacenter/ucp/2.2/guides/images/monitor-ucp-0.png)
+{% elsif include.version=="ucp-2.2" %}
+![Image number 2](https://docs.docker.com/datacenter/ucp/2.2/guides/images/monitor-ucp-1.png)
+{% endif %}
+{% endif %}
+
+{% if include.cli %}
+The command line workflow is essentially the same across the various CLIs.
+First you enumerate the services on the node of choice, then you run the
+`foobar` command.
+
+{% if include.version=="docker-cli-linux" %}
+```bash
+$ docker stack deploy -c test.yml smokestack
+```
+{% elsif include.version=="docker-cli-win" %}
+```powershell
+PS> docker stack deploy -c test.yml smokestack
+```
+{% elsif include.version=="kubectl" %}
+```bash
+$ kubectl get pod -f ./pod.yaml
+```
+{% endif %}
+{% endif %}