parent
1954ed396b
commit
54791a98e2
@ -0,0 +1,182 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/skeleton/2.0.4/skeleton.min.css" integrity="sha512-EZLkOqwILORob+p0BXZc+Vm3RgJBOe1Iq/0fiI7r/wJgzOFZMlsqTa29UEl6v6U6gsV4uIpsNZoV32YZqrCRCQ==" crossorigin="anonymous" />
|
||||
<title>PodGrab</title>
|
||||
|
||||
<style>
|
||||
.container {
|
||||
max-width: 800px; }
|
||||
.header {
|
||||
margin-top: 6rem;
|
||||
text-align: center; }
|
||||
.value-prop {
|
||||
margin-top: 1rem; }
|
||||
.value-props {
|
||||
margin-top: 4rem;
|
||||
margin-bottom: 4rem; }
|
||||
.docs-header {
|
||||
text-transform: uppercase;
|
||||
font-size: 1.4rem;
|
||||
letter-spacing: .2rem;
|
||||
font-weight: 600; }
|
||||
.docs-section {
|
||||
border-top: 1px solid #eee;
|
||||
padding: 4rem 0;
|
||||
margin-bottom: 0;}
|
||||
.value-img {
|
||||
display: block;
|
||||
text-align: center;
|
||||
margin: 2.5rem auto 0; }
|
||||
.example-grid .column,
|
||||
.example-grid .columns {
|
||||
background: #EEE;
|
||||
text-align: center;
|
||||
border-radius: 4px;
|
||||
font-size: 1rem;
|
||||
text-transform: uppercase;
|
||||
height: 30px;
|
||||
line-height: 30px;
|
||||
margin-bottom: .75rem;
|
||||
font-weight: 600;
|
||||
letter-spacing: .1rem; }
|
||||
.docs-example .row,
|
||||
.docs-example.row,
|
||||
.docs-example form {
|
||||
margin-bottom: 0; }
|
||||
.docs-example h1,
|
||||
.docs-example h2,
|
||||
.docs-example h3,
|
||||
.docs-example h4,
|
||||
.docs-example h5,
|
||||
.docs-example h6 {
|
||||
margin-bottom: 1rem; }
|
||||
.heading-font-size {
|
||||
font-size: 1.2rem;
|
||||
color: #999;
|
||||
letter-spacing: normal; }
|
||||
.code-example {
|
||||
margin-top: 1.5rem;
|
||||
margin-bottom: 0; }
|
||||
.code-example-body {
|
||||
white-space: pre;
|
||||
word-wrap: break-word }
|
||||
.example {
|
||||
position: relative;
|
||||
margin-top: 4rem; }
|
||||
.example-header {
|
||||
font-weight: 600;
|
||||
margin-top: 1.5rem;
|
||||
margin-bottom: .5rem; }
|
||||
.example-description {
|
||||
margin-bottom: 1.5rem; }
|
||||
.example-screenshot-wrapper {
|
||||
display: block;
|
||||
position: relative;
|
||||
overflow: hidden;
|
||||
border-radius: 6px;
|
||||
border: 1px solid #eee;
|
||||
height: 250px; }
|
||||
.example-screenshot {
|
||||
width: 100%;
|
||||
height: auto; }
|
||||
.example-screenshot.coming-soon {
|
||||
width: auto;
|
||||
position: absolute;
|
||||
background: #eee;
|
||||
top: 5px;
|
||||
right: 5px;
|
||||
bottom: 5px;
|
||||
left: 5px; }
|
||||
.navbar {
|
||||
display: none; }
|
||||
img{
|
||||
display: none
|
||||
}
|
||||
|
||||
/* Larger than phone */
|
||||
@media (min-width: 550px) {
|
||||
.header {
|
||||
margin-top: 8rem;
|
||||
}
|
||||
.value-props {
|
||||
margin-top: 9rem;
|
||||
margin-bottom: 7rem; }
|
||||
.value-img {
|
||||
margin-bottom: 1rem; }
|
||||
.example-grid .column,
|
||||
.example-grid .columns {
|
||||
margin-bottom: 1.5rem; }
|
||||
.docs-section {
|
||||
padding: 6rem 0; }
|
||||
.example-send-yourself-copy {
|
||||
float: right;
|
||||
margin-top: 12px; }
|
||||
.example-screenshot-wrapper {
|
||||
position: absolute;
|
||||
width: 48%;
|
||||
height: 100%;
|
||||
left: 0;
|
||||
max-height: none; }
|
||||
img{
|
||||
display: block
|
||||
}
|
||||
}
|
||||
h1,h2,h3,h4,h5{
|
||||
margin-bottom: 1rem;
|
||||
}
|
||||
h4{
|
||||
font-size: 2rem;
|
||||
}
|
||||
|
||||
h5{
|
||||
font-size: 1.5rem;
|
||||
}
|
||||
p{
|
||||
margin-bottom: 0.5rem;
|
||||
}
|
||||
hr{
|
||||
margin-top: 1rem;
|
||||
margin-bottom: 1rem;
|
||||
}
|
||||
|
||||
/* Larger than tablet */
|
||||
@media (min-width: 750px) {
|
||||
img{
|
||||
display: block
|
||||
}
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
<div class="container">
|
||||
<section class="header">
|
||||
|
||||
<h1>{{ .title }}</h1>
|
||||
</section>
|
||||
<br>
|
||||
{{range .podcastItems}}
|
||||
<div class="podcasts row">
|
||||
<div class="columns two">
|
||||
<img class="u-full-width" src="{{ .Image }}" alt="{{ .Title }}">
|
||||
</div>
|
||||
<div class="columns ten">
|
||||
<h4>{{.Title}} // {{ .Podcast.Title}}</h4>
|
||||
<small>{{ formatDate .PubDate }}</small>
|
||||
<p>{{ .Summary }}</p>
|
||||
|
||||
<a class="button button-primary" href="{{ .DownloadPath }}" download>Download</a>
|
||||
|
||||
</div>
|
||||
<div class="columns one">
|
||||
|
||||
</div>
|
||||
|
||||
</div>
|
||||
<hr>
|
||||
{{end}}
|
||||
</div>
|
||||
</body>
|
||||
</html>
|
Loading…
Reference in new issue