static/frontend/homepage/homepage.tmpl

<!--
    Copyright 2019 The Go Authors. All rights reserved.
    Use of this source code is governed by a BSD-style
    license that can be found in the LICENSE file.
-->

{{define "pre-content"}}
  <link href="/static/frontend/homepage/homepage.min.css?version={{.AppVersionLabel}}" rel="stylesheet">
{{end}}

{{define "main"}}
  <main class="go-Container">
    <div class="go-Content go-Content--center">
      <img class="Homepage-logo" width="700" height="300"
          src="/static/shared/gopher/package-search-700x300.jpeg" alt="Cartoon gopher typing">
      <form class="go-InputGroup Homepage-search Homepage-search--symbol"
          action="/search" role="search" data-gtmc="homepage search form"
          aria-label="Search for a Package">
        <input
          class="go-Input js-searchFocus"
          data-test-id="homepage-search"
          id="AutoComplete"
          role="textbox"
          aria-label="Search packages or symbols"
          type="search"
          name="q"
          placeholder="Search packages or symbols"
          autocapitalize="off"
          autocomplete="off"
          autocorrect="off"
          spellcheck="false"
          title="Search packages or symbols"
          autofocus="true">
        <button type="submit" class="go-Button">Search</button>
      </form>
      <section class="go-Carousel Homepage-tips js-carousel" aria-label="Search Tips Carousel" data-slide-index="{{.TipIndex}}">
	<ul>
	  {{range $i, $v := .SearchTips}}
	    <li class="go-Carousel-slide" {{if not (eq $.TipIndex $i)}}aria-hidden{{end}}>
	      <p>
		<strong>Tip:</strong> {{.Text}}
		<a href="/search?q={{$v.Example1}}">“{{$v.Example1}}”</a> or
		<a href="/search?q={{$v.Example2}}">“{{$v.Example2}}”</a>.
		<a href="/search-help" target="_blank" rel="noopener" class="Homepage-helpLink">
		  Search help <span><img width="24" height="24" src="/static/shared/icon/launch_gm_grey_24dp.svg" alt=""></span>
		</a>
	      </p>
	    </li>
	  {{end}}
	</ul>
      </section>
    </div>
  </main>
{{end}}

{{define "pre-footer"}}
  <div class="Questions">
    <div class="Questions-content">
      <div class="Questions-header">Frequently asked questions:</div>
      <ul>
        <li><a href="https://go.dev/about#adding-a-package">How can I add a package?</a></li>
        <li><a href="https://go.dev/about#removing-a-package">How can I remove a package?</a></li>
        <li><a href="https://go.dev/about#creating-a-badge">How can I add a go badge in my README file?</a></li>
      </ul>
    </div>
  </div>
{{end}}