Fix search input overlapping site nav

pull/26278/head
Taylor Chaparro 2021-01-26 08:38:41 -08:00
parent 25c5aa783b
commit 9adf2c1b31
No known key found for this signature in database
GPG Key ID: 1CDE2639870D2FE5
2 changed files with 39 additions and 33 deletions

View File

@ -810,6 +810,13 @@ section#cncf {
}
}
.td-search {
header > .header-filler {
height: $hero-padding-top;
background-color: black;
}
}
// Docs specific
#editPageButton {

View File

@ -3,9 +3,10 @@
<head>
{{ partial "head.html" . }}
</head>
<body class="td-{{ .Kind }}{{- if ne .Params.cid "" -}}{{- printf " cid-%s" (lower .Params.cid) -}}{{- end -}}">
<body class="td-search {{- if ne .Params.cid "" -}}{{- printf " cid-%s" (lower .Params.cid) -}}{{- end -}}">
<header>
{{ partial "navbar.html" . }}
<div class="header-filler"></div>
</header>
{{ block "announcement" . }}
{{ if .IsHome }}
@ -16,38 +17,36 @@
{{ end }}
<div class="td-outer">
<main role="main" class="td-main">
<section class="row td-search-result">
<div class="col-12 col-md-4 offset-md-2">
<form class="td-sidebar__search d-flex align-items-center">
{{ partial "search-input.html" . }}
<button class="btn btn-link td-sidebar__toggle d-md-none p-0 ml-3 fas fa-bars" type="button" data-toggle="collapse" data-target="#td-section-nav" aria-controls="td-docs-nav" aria-expanded="false" aria-label="Toggle section navigation">
</button>
</form>
</div>
<div class="col-12 col-md-8 offset-md-2">
<h2 class="ml-4">{{ .Title }}</h2>
{{ if .Site.Params.gcs_engine_id }}
<script>
(function() {
var cx = '{{ . }}';
var gcse = document.createElement('script');
gcse.type = 'text/javascript';
gcse.async = true;
gcse.src = 'https://cse.google.com/cse.js?cx=' + cx;
var s = document.getElementsByTagName('script')[0];
s.parentNode.insertBefore(gcse, s);
})();
</script>
<gcse:searchresults-only></gcse:searchresults-only>
{{ else if .Site.Params.k8s_search }}
<script src="{{ "js/search.js" | relURL }}"></script>
<gcse:searchresults-only linktarget="_parent">
<div id="bing-results-container">{{ T "layouts_docs_search_fetching" }}</div>
<div id="bing-pagination-container"></div>
</gcse:searchresults-only>
{{ end }}
</div>
</section>
<section class="row td-search-result">
<div class="col-12 col-md-4 offset-md-2">
<form class="td-sidebar__search d-flex align-items-center">
{{ partial "search-input.html" . }}
</form>
</div>
<div class="col-12 col-md-8 offset-md-2">
<h2 class="ml-4">{{ .Title }}</h2>
{{ if .Site.Params.gcs_engine_id }}
<script>
(function() {
var cx = '{{ . }}';
var gcse = document.createElement('script');
gcse.type = 'text/javascript';
gcse.async = true;
gcse.src = 'https://cse.google.com/cse.js?cx=' + cx;
var s = document.getElementsByTagName('script')[0];
s.parentNode.insertBefore(gcse, s);
})();
</script>
<gcse:searchresults-only></gcse:searchresults-only>
{{ else if .Site.Params.k8s_search }}
<script src="{{ "js/search.js" | relURL }}"></script>
<gcse:searchresults-only linktarget="_parent">
<div id="bing-results-container">{{ T "layouts_docs_search_fetching" }}</div>
<div id="bing-pagination-container"></div>
</gcse:searchresults-only>
{{ end }}
</div>
</section>
</main>
{{ partial "footer.html" . }}
</div>