-
Notifications
You must be signed in to change notification settings - Fork 0
/
index.html
112 lines (112 loc) · 4.8 KB
/
index.html
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<meta http-equiv="X-UA-Compatible" content="ie=edge" />
<title>App Demo</title>
<link rel="stylesheet" href="/assets/main.css" />
</head>
<body>
<header>
<a class="logo" href="/">
WebNews
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512"><!--!Font Awesome Free 6.5.2 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license/free Copyright 2024 Fonticons, Inc.--><path d="M352 256c0 22.2-1.2 43.6-3.3 64H163.3c-2.2-20.4-3.3-41.8-3.3-64s1.2-43.6 3.3-64H348.7c2.2 20.4 3.3 41.8 3.3 64zm28.8-64H503.9c5.3 20.5 8.1 41.9 8.1 64s-2.8 43.5-8.1 64H380.8c2.1-20.6 3.2-42 3.2-64s-1.1-43.4-3.2-64zm112.6-32H376.7c-10-63.9-29.8-117.4-55.3-151.6c78.3 20.7 142 77.5 171.9 151.6zm-149.1 0H167.7c6.1-36.4 15.5-68.6 27-94.7c10.5-23.6 22.2-40.7 33.5-51.5C239.4 3.2 248.7 0 256 0s16.6 3.2 27.8 13.8c11.3 10.8 23 27.9 33.5 51.5c11.6 26 20.9 58.2 27 94.7zm-209 0H18.6C48.6 85.9 112.2 29.1 190.6 8.4C165.1 42.6 145.3 96.1 135.3 160zM8.1 192H131.2c-2.1 20.6-3.2 42-3.2 64s1.1 43.4 3.2 64H8.1C2.8 299.5 0 278.1 0 256s2.8-43.5 8.1-64zM194.7 446.6c-11.6-26-20.9-58.2-27-94.6H344.3c-6.1 36.4-15.5 68.6-27 94.6c-10.5 23.6-22.2 40.7-33.5 51.5C272.6 508.8 263.3 512 256 512s-16.6-3.2-27.8-13.8c-11.3-10.8-23-27.9-33.5-51.5zM135.3 352c10 63.9 29.8 117.4 55.3 151.6C112.2 482.9 48.6 426.1 18.6 352H135.3zm358.1 0c-30 74.1-93.6 130.9-171.9 151.6c25.5-34.2 45.2-87.7 55.3-151.6H493.4z"/></svg>
</a>
</header>
<main>
<section>
<form action="/search" method="GET">
<label for="q"><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512"><!--!Font Awesome Free 6.5.2 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license/free Copyright 2024 Fonticons, Inc.--><path d="M416 208c0 45.9-14.9 88.3-40 122.7L502.6 457.4c12.5 12.5 12.5 32.8 0 45.3s-32.8 12.5-45.3 0L330.7 376c-34.4 25.2-76.8 40-122.7 40C93.1 416 0 322.9 0 208S93.1 0 208 0S416 93.1 416 208zM208 352a144 144 0 1 0 0-288 144 144 0 1 0 0 288z"/></svg></label>
<input
autofocus
class="search-input"
value="{{ .Query }}"
placeholder="Enter a news topic"
type="search"
name="q"
/>
</form>
</section>
<div class="result-count">
{{ if .Results }}
{{ if (gt .Results.TotalResults 0)}}
<p>
About <strong>{{ .Results.TotalResults }}</strong> results were
found. You are on page <strong>{{ .CurrentPage }}</strong> of
<strong> {{ .TotalPages }}</strong
>.
</p>
{{ else if (ne .Query "") and (eq .Results.TotalResults 0) }}
<p>
No results found for your query: <strong>{{ .Query }}</strong
>.
</p>
{{ end }}
{{ end }}
</div>
<div class="pagination">
{{ if . }}
{{ if (gt .NextPage 2) }}
<a
href="/search?q={{ .Query }}&page={{ .PreviousPage }}"
class="button previous-page"
>Previous</a
>
{{ end }}
{{ if (ne .IsLastPage true) }}
<a
href="/search?q={{ .Query }}&page={{ .NextPage }}"
class="button next-page"
>Next</a
>
{{ end }}
{{ end }}
</div>
</ul>
<section class="results">
<ul class="search-results">
{{ range.Results.Articles }}
<li class="news-article">
<div>
<a target="_blank" rel="noreferrer noopener" href="{{.URL}}">
<h3 class="title">{{.Title }}</h3>
</a>
<p class="description">{{ .Description }}</p>
</div>
<img class="article-image" src="{{ .URLToImage }}" />
<div class="metadata">
<p class="source">{{ .Source.Name }}</p>
<time class="published-date">{{ .FormatPublishedDate }}</time>
</div>
</li>
{{ end }}
</section>
<div class="pagination">
{{ if . }}
{{ if (gt .NextPage 2) }}
<a
href="/search?q={{ .Query }}&page={{ .PreviousPage }}"
class="button previous-page"
>Previous</a
>
{{ end }}
{{ if (ne .IsLastPage true) }}
<a
href="/search?q={{ .Query }}&page={{ .NextPage }}"
class="button next-page"
>Next</a
>
{{ end }}
{{ end }}
</div>
</main>
<footer>
<a
href="https://github.com/Philip-Walsh/go-app"
class="button github-button"
>View on GitHub</a
>
</footer>
</body>
</html>