Groups & Tabsets

Groups

Groups allow users to easily switch between different variants of the documentation. In order for a Group to be activated and work on a page, you need specifiy an existing group at the top of the .adoc file. For example on this page a Java/Scala group has been added using :page-supergroup-java-scala: Language. As a result a drop down picker has been added to the rendered page that visitors can use to pick their preferred language.

Please refer to your documentation’s supergroup.hbs file in the supplemental_ui/partials directory to see which groups are supported in you documentation. If you want to add a new grouping, simply add a new one by following the patten.
This page uses:
= Groups & Tabsets
:page-supergroup-java-scala: Language

Adding content variants

Inline text

Plain inline text about [.group-scala]#scala# [.group-java]#java#.

Bold styling [.group-scala]#*scala*# [.group-java]#*java*# or formatted as [.group-scala]#`scala code`# [.group-java]#`java code`#.

Result

Plain inline text about scala java that respects super groups.

Bold styling scala java or formatted as scala code java code.

Paragraphs

[.group-scala]
This is a Scala specific paragraph.

[.group-java]
This is a Java specific paragraph.

Result

This is a Scala specific paragraph.

This is a Java specific paragraph.

Admonitions

We can create an admonition for Java only

[NOTE.group-java]
====
This is a *Java* specific note.
====

Result (the result should be empty if Scala is selected)

This is a Java specific note.

Tabsets

Group Tabsets

Group Tabsets allow you to define 'tabbed' content that respect the users current 'Group' selection.

[.tabset]
Java::
+
[source,java]
----
public class Java {
  private String name;
  public Person(String name) {
    this.name = name;
  }
}
----
Scala::
+
[source,scala]
----
public class Scala {
  private String name;
  public Person(String name) {
    this.name = name;
  }
}
----

Result

Java
public class Java {
  private String name;
  public Person(String name) {
    this.name = name;
  }
}
Scala
public class Scala {
  private String name;
  public Person(String name) {
    this.name = name;
  }
}

Stand-alone Tabs

You can also use the tabset syntax to define a stand-alone Tabbed UI element. In this case the tabs are rendered but not respect a group setting.

[.tabset]
Play Station::
This is the Play Station stuff for the first tab.
Xbox::
This is the Xbox stuff for the second tab.

Result

Play Station

This is the Play Station stuff for the first tab.

Xbox

This is the Xbox stuff for the second tab.

And a more complex example:

[.tabset]
Tab One::
+
--
Akka provides an API called https://doc.akka.io/docs/akka/current/discovery/index.html[Akka Discovery] that includes a number of backends. Several are compatible with a Kubernetes environment. We're going to use a service locator implementation built on Akka Discovery, and then we're going to use the DNS implementation of Akka discovery to discover other services.

[source,console]
----
$ a code block
----
--

Tab Two::
+
--
This is the java of the second tab.

[source,json]
----
{
  "name": "module-name",
  "version": "10.0.1",
  "description": "An example module to illustrate the usage of package.json",
  "author": "Author Name <author@example.com>",
  "scripts": {
    "test": "mocha",
    "lint": "eslint"
  }
}
----
--

Result

Tab One

Akka provides an API called Akka Discovery that includes a number of backends. Several are compatible with a Kubernetes environment. We’re going to use a service locator implementation built on Akka Discovery, and then we’re going to use the DNS implementation of Akka discovery to discover other services.

$ a code block
Tab Two

This is the java of the second tab.

{
  "name": "module-name",
  "version": "10.0.1",
  "description": "An example module to illustrate the usage of package.json",
  "author": "Author Name <author@example.com>",
  "scripts": {
    "test": "mocha",
    "lint": "eslint"
  }
}