-
Notifications
You must be signed in to change notification settings - Fork 0
/
index.html
123 lines (123 loc) · 6.52 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
113
114
115
116
117
118
119
120
121
122
123
<!doctype html>
<html class="no-js" lang="en">
<head>
<meta charset="utf-8"/>
<meta name="viewport" content="width=device-width, initial-scale=1.0"/>
<title>Downlink Podcast | Exploring Space from Here</title>
<link rel="stylesheet" href="/build/css/styles.css">
<link href="https://fonts.googleapis.com/css?family=Raleway|Rubik+Mono+One|Space+Mono:400,700&display=swap"
rel="stylesheet"/>
</head>
<body class="bg-stars bg-black font-sans leading-normal tracking-normal">
<nav id="header" class="w-full z-10 top-0">
<div class="w-full md:max-w-4xl mx-auto flex flex-wrap items-center justify-between mt-0 py-5">
<div class="pl-4">
<a class="font-logo text-red-600 text-5xl" href="/">Downlink</a>
<p class="font-tagline text-gray-600 uppercase">Exploring space from
here</p>
</div>
<!-- mobile hamburgers on the menu -->
<div class="block lg:hidden pr-4">
<button id="nav-toggle"
class="flex items-center px-3 py-2 border rounded text-gray-500 border-gray-600 hover:text-gray-900 hover:border-green-500 appearance-none focus:outline-none">
<svg class="fill-current h-3 w-3" viewBox="0 0 20 20"
xmlns="http://www.w3.org/2000/svg">
<title>Menu</title>
<path d="M0 3h20v2H0V3zm0 6h20v2H0V9zm0 6h20v2H0v-2z"/>
</svg>
</button>
</div>
<!-- end hamburger -->
<div class="w-full flex-grow lg:flex lg:items-center lg:w-auto hidden lg:block mt-2 lg:mt-0 bg-gray-100 md:bg-transparent z-20"
id="nav-content">
<ul class="list-reset lg:flex justify-end flex-1 items-center font-tagline text-red-600">
<li class="mr-3">
<a class="inline-block no-underline hover:text-gray-900 hover:text-underline py-2 px-4"
href="#">About</a>
</li>
<li class="mr-3">
<a class="inline-block no-underline hover:text-gray-900 hover:text-underline py-2 px-4"
href="#">Subscribe</a>
</li>
<li class="mr-3">
<a class="inline-block no-underline hover:text-gray-900 hover:text-underline py-2 px-4"
href="#">Contact</a>
</li>
</ul>
</div>
</div>
</nav>
<div class="container w-full md:max-w-4xl mx-auto bg-black">
<div class="w-full px-4 md:px-6 text-xl text-gray-800 leading-normal">
<div class="font-copy text-white podcast">
<div class="my-10 entry-header">
<h2 class="font-normal font-title break-normal pt-6 pb-2 text-4xl md:text-4xl">
<a class="text-gray-100" href="podcast-entry.html">Podcast
Episode 74</a></h2>
<p class="text-lg font-normal text-gray-100">June 22, 2020</p>
</div>
<div id="audio-player" class="pb-10">
<audio controls class="w-full bg-black-500">
<source src="" type="audio/ogg">
<source src="" type="audio/mpeg">
Your browser does not support the audio element.
</audio>
</div>
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do
eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut
enim ad minim veniam, quis nostrud exercitation ullamco laboris
nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor
in reprehenderit in voluptate velit esse cillum dolore eu fugiat
nulla pariatur. Excepteur sint occaecat cupidatat non proident,
sunt in culpa qui officia deserunt mollit anim id est
laborum.</p>
</div>
<div class="font-copy article text-white">
<div class="my-10 entry-header">
<h2 class="font-normal font-title break-normal text-gray-100 pt-6 text-4xl md:text-4xl">
<a class="text-gray-100" href="content-entry.html">Back in
Time: Pioneer 10</a></h2>
<p class="text-lg font-normal text-gray-100">June 22, 2020</p>
</div>
<div class="image-full my-5">
<figure>
<img src="images/pioneer-10-nasa-flickr-commons.jpg"/>
<figcaption class="text-xs text-gray-600">1983 Photo of
Pioneer 10 - NASA via Flickr Commons
</figcaption>
</figure>
</div>
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do
eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut
enim ad minim veniam, quis nostrud exercitation ullamco laboris
nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor
in reprehenderit in voluptate velit esse cillum dolore eu fugiat
nulla pariatur. <a href="">Excepteur sint occaecat cupidatat
non</a> proident, sunt in culpa qui officia deserunt mollit
anim id est laborum.</p>
<p class="mt-2 float-right"><a href="/content-entry.html">Continue Reading ⇛</a></p>
</div>
<div class="font-copy link text-white">
<div class="my-2 entry-header">
<h2 class="font-normal font-title break-normal text-gray-100 pt-6 text-1xl md:text-3xl">
<a class="text-gray-100" href="link-entry.html">A Link Title
⇗</a></h2>
<p class="text-lg font-normal text-gray-100">June 22, 2020</p>
</div>
<blockquote>Lorem ipsum dolor sit amet, consectetur adipisicing
elit, sed do eiusmod tempor incididunt ut labore et dolore magna
aliqua. Ut enim ad minim veniam, quis nostrud exercitation
ullamco laboris nisi ut aliquip ex ea commodo consequat.
</blockquote>
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do
eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut
enim ad minim veniam, quis nostrud exercitation ullamco laboris
nisi ut aliquip ex ea commodo consequat.</p>
</div>
</div>
</div>
<footer class="p-4 text-center border-t-2 border-gray-900 py-5 mt-10 text-gray-500">
<p>Copyright 2021 Downlink Online Enterprises</p>
</footer>
</body>
</html>