Enhance Flux functions lists (#5221)

* WIP flux function list

* fix isset error with icon shortcode

* Update content/flux/v0/spec/variables.md

Co-authored-by: Jason Stirnaman <stirnamanj@gmail.com>

---------

Co-authored-by: Jason Stirnaman <stirnamanj@gmail.com>

assets/styles/layouts/article/_flux.scss

@@ -12,6 +12,17 @@ h2,h3,h4 {
   }
 }
 
+.function-list a.experimental::after {
+  content: '\e903';
+  font-family: 'icomoon-v4';
+  margin-left: .45rem;
+  color: rgba($article-text, .35);
+  // font-size: .75em;
+  font-style: normal;
+  display: inline-block;
+  vertical-align: middle;
+}
+
 #flux-group-keys-demo {
   table {
     margin-bottom: 1.25rem;

content/flux/v0/function-types.md

@@ -53,6 +53,10 @@ and important function behaviors.
 - [Function types](#function-types)
 - [Function categories](#function-categories)
 
+{{% note %}}
+The {{% icon "experimental" %}} icon indicates the function is experimental.
+{{% /note %}}
+
 ---
 
 ## Function types

content/flux/v0/spec/variables.md

@@ -9,6 +9,8 @@ weight: 104
 aliases:
   - /influxdb/v2/reference/flux/language/variables/
   - /influxdb/cloud/reference/flux/language/variables/
+related:
+  - /flux/v0/get-started/syntax-basics/#variables, Flux syntax basics - assign variables
 ---
 
 A **variable** represents a storage location for a single value.

content/flux/v0/stdlib/all-functions.md

@@ -18,4 +18,8 @@ see [Flux function types and categories](/flux/v0/function-types/).
 
 {{< list-filters "flux" >}}
 
+{{% note %}}
+The {{% icon "experimental" %}} icon indicates the function is experimental.
+{{% /note %}}
+
 {{< flux/list-all-functions >}}

data/clockface.yml

@@ -1,12 +1,9 @@
 influxdb:
   default: v4
   cloud: v4
-  v2.6: v4
+
-  v2.4: v4
+flux:
-  v2.3: v3
+  default: v4
-  v2.2: v3
-  v2.1: v3
-  v2.0: v2
 
 enterprise_influxdb:
   default: v2

layouts/shortcodes/flux/list-all-functions.html

@@ -4,25 +4,26 @@
 {{ $filterArr := split $filters ", "}}
 {{ $tagTaxonomy := print $section "/" $currentVersion "/tags" }}
 
-<ul>
+<ul class="function-list">
 {{ range where $.Site.RegularPages.ByTitle "Section" $section }}
-  {{ $title := cond (isset .Page.Params "list_title") (replaceRE `\ function` "" .Page.Params.list_title) (replaceRE `\ function` "" .Title) }}
+  {{ $title := replaceRE `\ function` "" .Title }}
   {{ $deprecated := isset .Page.Params "deprecated" }}
   {{ $removed := isset .Page.Params "removed" }}
+  {{ $experimental := in .Page.RelPermalink "experimental" }}
   {{ $tagList := index .Page.Params $tagTaxonomy | default (slice "") }}
 
   {{ if ne $filters "" }}
     {{ if gt (len (intersect $filterArr (index .Page.Params $tagTaxonomy))) 0}}
       {{ if and (in .RelPermalink (print $section "/" $currentVersion "/")) (in .Title "() function")  }}
         <li>
-          <a href="{{ .RelPermalink }}">{{ $title }}</a>{{ if $deprecated }} <em style="opacity:.35">– (deprecated)</em>{{ end }}
+          <a href="{{ .RelPermalink }}"{{ if $experimental }} class="experimental"{{end}}>{{ $title }}</a>{{ if $deprecated }} <em style="opacity:.35">– (deprecated)</em>{{ end }}
         </li>
       {{ end }}
     {{ end }}
   {{ else }}
     {{ if and (in .RelPermalink (print $section "/" $currentVersion "/")) (in .Title "() function")  }}
       <li class="filter-item visible" data-tags='{{ replaceRE "/" "-" (delimit (apply $tagList "urlize" ".") " ") }}'>
-        <a href="{{ .RelPermalink }}">{{ $title }}</a>
+        <a href="{{ .RelPermalink }}"{{ if $experimental }} class="experimental"{{end}}>{{ $title }}</a>
         {{ if $removed }} <em style="opacity:.35">– (removed)</em>
         {{ else if $deprecated }} <em style="opacity:.35">– (deprecated)</em>{{ end }}
       </li>

layouts/shortcodes/icon.html

@@ -253,5 +253,7 @@
   <span class="inline {{ $version }} cf-icon Group"></span>
   {{- else if or (eq $icon "billing") (eq $icon "bill") -}}
   <span class="inline {{ $version }} cf-icon Bill"></span>
+  {{- else if or (eq $icon "flask") (eq $icon "beaker") (eq $icon "experimental") -}}
+  <span class="inline {{ $version }} cf-icon Flask middle"></span>
   {{- end -}}
 {{- end -}}