@postpostscript/MyFooter: my footer component which shares random vals I've liked!
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
import { rootValRef } from "https://esm.town/v/andreterron/rootValRef";
import { extractValInfo } from "https://esm.town/v/pomdtr/extractValInfo";
import { html, htmlResponse } from "https://esm.town/v/postpostscript/html";
import { recommends } from "https://esm.town/v/postpostscript/recommends";
import { valTownLogoAuto } from "https://esm.town/v/postpostscript/valTownLogo";
const USERNAME = extractValInfo(import.meta.url).author;
export async function MyFooter(logo = valTownLogoAuto) {
const recommendation = rootValRef().handle === USERNAME
? html`<span class="recommends">${await recommends()}</span>`
: "";
return html`
<footer>
Made by
<a href="https://val.town/u/${USERNAME}" target="_blank">@${USERNAME}</a>
for
<a href="https://val.town/" target="_blank">
${logo}
</a>
${recommendation}
</footer>
<style>
body {
min-height: calc(100vh - 1.5rem);
display: flex;
flex-direction: column;
}
footer {
margin-top: auto !important;
}
</style>
`;
}
export default async function(req) {
const { Layout } = await import("https://esm.town/v/postpostscript/Layout");
return htmlResponse`${Layout`
<h1>Footer Demo</h1>
<p>
Fork this if you want to share random vals from your likes in your projects!
</p>
${await MyFooter()}
`}`;
}
Fork this if you want to share random vals from your likes in your projects!
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
import { rootValRef } from "https://esm.town/v/andreterron/rootValRef";
import { extractValInfo } from "https://esm.town/v/pomdtr/extractValInfo";
import { html, htmlResponse } from "https://esm.town/v/postpostscript/html";
import { recommends } from "https://esm.town/v/postpostscript/recommends";
import { valTownLogoAuto } from "https://esm.town/v/postpostscript/valTownLogo";
const USERNAME = extractValInfo(import.meta.url).author;
const hello = Deno.env.get("HELLO_WORLD");
export async function MyFooter(logo = valTownLogoAuto) {
const recommendation = rootValRef().handle === USERNAME
? html`<span class="recommends">${await recommends()}</span>`
: "";
return html`
<footer>
Made by
<a href="https://val.town/u/${USERNAME}" target="_blank">@${USERNAME}</a>
for
<a href="https://val.town/" target="_blank">
${logo}
</a>
${recommendation}
</footer>
<style>
body {
min-height: calc(100vh - 1.5rem);
display: flex;
flex-direction: column;
}
footer {
margin-top: auto !important;
}
</style>
`;
}
export default async function(req) {
const { Layout } = await import("https://esm.town/v/postpostscript/Layout");
return htmlResponse`${Layout`
<h1>Footer Demo</h1>
<p>
${hello}
</p>
${await MyFooter()}
`}`;
}
Fork this if you want to share random vals from your likes in your projects!
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
import { rootValRef } from "https://esm.town/v/andreterron/rootValRef";
import { extractValInfo } from "https://esm.town/v/pomdtr/extractValInfo";
import { html, htmlResponse } from "https://esm.town/v/postpostscript/html";
import { recommends } from "https://esm.town/v/postpostscript/recommends";
import { valTownLogoAuto } from "https://esm.town/v/postpostscript/valTownLogo";
const USERNAME = extractValInfo(import.meta.url).author;
export async function MyFooter(logo = valTownLogoAuto) {
const recommendation = rootValRef().handle === USERNAME
? html`<span class="recommends">${await recommends()}</span>`
: "";
return html`
<footer>
Made by
<a href="https://val.town/u/${USERNAME}" target="_blank">@${USERNAME}</a>
for
<a href="https://val.town/" target="_blank">
${logo}
</a>
${recommendation}
</footer>
<style>
body {
min-height: calc(100vh - 1.5rem);
display: flex;
flex-direction: column;
}
footer {
margin-top: auto !important;
}
</style>
`;
}
export default async function(req) {
const { Layout } = await import("https://esm.town/v/postpostscript/Layout");
return htmlResponse`${Layout`
<h1>Footer Demo</h1>
<p>
Fork this if you want to share random vals from your likes in your projects!
</p>
${await MyFooter()}
`}`;
}