added product selector, updated search placeholder

pull/1272/head
Scott Anderson 2020-07-30 15:25:10 -06:00
parent 78e48dec79
commit 267c4a3187
12 changed files with 103 additions and 23 deletions

View File

@ -88,6 +88,7 @@ $(".truncate-toggle").click(function(e) {
})
////////////////////////////// Expand Accordians ///////////////////////////////
$('.expand-label').click(function() {
$(this).children('.expand-toggle').toggleClass('open')
$(this).next('.expand-content').slideToggle(200)

View File

@ -1,11 +1,11 @@
// Expand the menu on click
$(".version-selector").click(function () {
$(".dropdown").click(function () {
$(this).toggleClass("open")
})
// Close the version dropdown by clicking anywhere else
$(document).click(function(e) {
if ( $(e.target).closest('.version-selector').length === 0 ) {
$(".version-selector").removeClass("open");
if ( $(e.target).closest('.dropdown').length === 0 ) {
$(".dropdown").removeClass("open");
}
});

View File

@ -35,19 +35,27 @@
}
}
.version-selector {
.selector-dropdowns {
display: flex;
position: absolute;
z-index: 100;
right: 5.5rem;
transition: right .2s;
}
.dropdown {
display: inline-block;
position: absolute;
z-index: 100;
right: 5.5rem;
position: relative;
align-self: flex-start;
margin-left: .5rem;
color: $g20-white;
height: 2rem;
@include gradient($version-selector-gradient);
background-attachment: local;
font-weight: $medium;
border-radius: $radius;
overflow: hidden;
cursor: pointer;
transition: right .2s;
.selected {
padding: 0 1.75rem 0 .75rem;
@ -70,7 +78,7 @@
}
}
ul.version-list {
ul.item-list {
padding: 0;
margin: 0;
list-style: none;

View File

@ -26,7 +26,7 @@
#search-btn {
opacity: 1;
}
.version-selector {
.selector-dropdowns {
right: 7.5rem;
}
}
@ -51,7 +51,7 @@
#search-btn {
opacity: 0;
}
.version-selector {
.selector-dropdowns {
right: 3.5rem;
}
}

View File

@ -12,4 +12,5 @@
#search-btn {
opacity: 0;
display: none;
}

View File

@ -1,7 +1,12 @@
influxdb:
name: InfluxDB
altname: InfluxDB Cloud & OSS
namespace: influxdb
list_order: 1
versions: [v1.3, v1.4, v1.5, v1.6, v1.7, v1.8, v2.0]
stable: v2.0
latest: v2.0
# Used in cloud-name and cloud-link shortcodes
cloud:
name: "InfluxDB Cloud 2.0"
shortname: "InfluxDB Cloud"
@ -9,20 +14,28 @@ influxdb:
telegraf:
name: Telegraf
namespace: telegraf
list_order: 2
versions: [v1.9, v1.10, v1.11, v1.12, v1.13, v1.14, v1.15]
stable: v1.15
latest: v1.15
chronograf:
name: Chronograf
namespace: chronograf
list_order: 3
versions: [v1.6, v1.7, v1.8]
stable: v1.8
latest: v1.8
kapacitor:
name: Kapacitor
namespace: kapacitor
list_order: 4
versions: [v1.4, v1.5]
stable: v1.5
latest: v1.5
enterprise_influxdb:
name: "InfluxDB Enterprise"
namespace: enterprise_influxdb
list_order: 5
versions: [v1.3, v1.4, v1.5, v1.6, v1.7, v1.8]
stable: v1.8
latest: v1.8

View File

@ -1,4 +1,4 @@
{{ partial "header.html" . }}\
{{ partial "header.html" . }}
{{ partial "topnav.html" . }}
<div class="page-wrapper">

View File

@ -1,9 +1,25 @@
{{ $currentPage := . }}
{{ $productPathData := findRE "[^/]+.*?" .RelPermalink }}
{{ $product := index $productPathData 0 }}
{{ $productName := (index .Site.Data.products $product).name }}
{{ $currentVersion := index $productPathData 1 }}
{{ $searchPlaceholder := cond (eq $product "influxdb") "InfluxDB 2.0 OSS, Cloud, & Flux" (print "Search " $productName " " $currentVersion) }}
<!-- Search placeholder -->
{{ $scratch := newScratch }}
{{ $scratch.Set "searchPlaceholder" "Search"}}
{{ if and (eq $currentVersion nil) (eq (len (findRE `v[1-2]\.` $currentVersion nil)) 0) }}
{{ $scratch.Set "searchPlaceholder" "Search the docs" }}
{{ else if (eq $currentVersion nil) }}
{{ $scratch.Set "searchPlaceholder" (print "Search " (index .Site.Data.products $product).name) }}
{{ else if (and (eq $product "influxdb") (or (eq $currentVersion "v1.7") (eq $currentVersion "v1.8")) ) }}
{{ $scratch.Set "searchPlaceholder" (print (index .Site.Data.products $product).name " " $currentVersion " & Flux") }}
{{ else if (and (eq $product "influxdb") (in $currentVersion "v2") )}}
{{ $scratch.Set "searchPlaceholder" (print "InfluxDB Cloud, OSS, & Flux") }}
{{ else }}
{{ $scratch.Set "searchPlaceholder" (print "Search " (index .Site.Data.products $product).name " " $currentVersion) }}
{{ end }}
{{ $searchPlaceholder := $scratch.Get "searchPlaceholder" }}
<aside class="sidebar">
<div class="sidebar-toggle" onclick="toggle_sidebar('sidebar-closed');return false;"><a href="#">&#59672;</a></div>
@ -29,10 +45,10 @@
{{ $mainMenu := (index .Site.Menus (print $product (replaceRE "[v.]" "_" $currentVersion))) }}
{{ $refMenu := (index .Site.Menus (print $product (replaceRE "[v.]" "_" $currentVersion) "_ref")) }}
<!-- Main Section -->
<!-- Product Main Navigation -->
{{ partial "sidebar/nested-menu" (dict "page" $currentPage "menu" $mainMenu) . }}
<!-- Reference Section -->
<!-- Product Reference Navigation -->
{{ if gt (len $refMenu) 0 }}
<h4 class="reference">Reference</h4>
{{ partial "sidebar/nested-menu" (dict "page" $currentPage "menu" $refMenu) . }}

View File

@ -5,7 +5,10 @@
<a class="docs-home" href="/{{ $.Site.Data.versions.stable_version }}">InfluxDB Docs</a>
</div>
<div class="topnav--right">
{{ partial "topnav/version-selector.html" . }}
<div class="selector-dropdowns">
{{ partial "topnav/product-selector.html" . }}
{{ partial "topnav/version-selector.html" . }}
</div>
<button id="search-btn" onclick="toggle_sidebar('sidebar-open');document.getElementById('algolia-search-input').focus();return false;"><span class="icon-search"></span></button>
<button class="url-trigger" href="#"><span class="icon-ui-cog-thick"></span></button>
<button class="theme-switcher" id="theme-switch-light" onclick="switch_style('light-theme');return false;"><span class="icon-sun1"></span></button>

View File

@ -0,0 +1,20 @@
{{ $productPathData := findRE "[^/]+.*?" .RelPermalink }}
{{ $product := index $productPathData 0 }}
{{ $currentVersion := index $productPathData 1 }}
<div class="dropdown">
{{ if (eq $product nil) }}
<p class="selected">Select a product</p>
{{ else if and (eq $product "influxdb") (in $currentVersion "v2")}}
<p class="selected">{{ (index .Site.Data.products $product).altname }}</p>
{{ else }}
<p class="selected">{{ (index .Site.Data.products $product).name }}</p>
{{ end }}
<ul class="item-list">
{{ range sort .Site.Data.products "list_order" "desc" }}
<li>
<a href="/{{ .namespace }}/{{ .latest }}" {{ if eq .namespace $product }}class="active"{{ end }}>{{ cond (ne .altname nil) .altname .name }}</a>
</li>
{{ end }}
</ul>
</div>

View File

@ -0,0 +1,18 @@
{{ $productPathData := findRE "[^/]+.*?" .RelPermalink }}
{{ $product := index $productPathData 0 }}
{{ $currentVersion := index $productPathData 1 }}
{{ if or (eq $product nil) (eq $currentVersion nil) }}
{{ else }}
<div class="dropdown">
<p class="selected">{{ $currentVersion }}</p>
<ul class="item-list">
<li><a href="https://github.com/influxdata/docs.influxdata.com" class="legacy" target="_blank">older</a></li>
{{ range (index .Site.Data.products $product).versions }}
<li>
<a href="/{{ $product }}/{{ . }}" {{ if eq . $currentVersion }}class="active"{{ end }}>{{ . }}</a>
</li>
{{ end }}
</ul>
</div>
{{ end }}

View File

@ -1 +1 @@
{{- .Site.Data.products.cloud.link -}}
{{- .Site.Data.products.influxdb.cloud.link -}}