RSS updates, and additional features
This commit is contained in:
parent
eebfde5c9a
commit
ad5dd633e9
16 changed files with 761 additions and 67 deletions
|
@ -4,15 +4,39 @@
|
||||||
{{partial "head" .}}
|
{{partial "head" .}}
|
||||||
</head>
|
</head>
|
||||||
<body>
|
<body>
|
||||||
{{partial "header" .}}<hr>
|
{{partial "header" .}}
|
||||||
<main>{{.Content}}</main>
|
<main>
|
||||||
<aside>
|
<section>
|
||||||
<ul>
|
{{ if .Content}}
|
||||||
{{range .Pages}}
|
<article>
|
||||||
<li><a href="{{.Permalink}}">{{.Title}}</a></li>
|
{{.Content}}
|
||||||
|
</article>
|
||||||
{{end}}
|
{{end}}
|
||||||
</ul></aside>
|
{{ if .Pages }}
|
||||||
</body>
|
<article>
|
||||||
<hr>
|
{{range .Pages}}
|
||||||
|
<section class="listing">
|
||||||
|
<div>
|
||||||
|
{{ if .Params.video}}
|
||||||
|
<video autoplay muted>
|
||||||
|
<source src="{{.Params.video}}">
|
||||||
|
</video>
|
||||||
|
{{else}}
|
||||||
|
<a href="{{.Permalink}}">
|
||||||
|
<img src="{{.Params.image}}">
|
||||||
|
</a>
|
||||||
|
{{end}}
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<a href="{{.Permalink}}"><h2>{{.Title}}</h2></a>
|
||||||
|
<p>{{.Params.description}}</p>
|
||||||
|
</div>
|
||||||
|
</section>
|
||||||
|
{{end}}
|
||||||
|
</article>
|
||||||
|
{{end}}
|
||||||
|
</main>
|
||||||
|
|
||||||
{{partial "footer" .}}
|
{{partial "footer" .}}
|
||||||
|
</body>
|
||||||
</html>
|
</html>
|
|
@ -17,7 +17,7 @@
|
||||||
{{ with .Site.Author.email }}<author>{{.}}{{ with $.Site.Author.name }} ({{.}}){{end}}</author>{{end}}
|
{{ with .Site.Author.email }}<author>{{.}}{{ with $.Site.Author.name }} ({{.}}){{end}}</author>{{end}}
|
||||||
<guid>{{ .Permalink }}</guid>
|
<guid>{{ .Permalink }}</guid>
|
||||||
<itunes:image href="{{.Params.image}}"/>
|
<itunes:image href="{{.Params.image}}"/>
|
||||||
<enclosure url="{{.Params.videoURL}}" />
|
<enclosure url="{{.Params.video}}" />
|
||||||
<description>{{- .Content | html -}}</description>
|
<description>{{- .Content | html -}}</description>
|
||||||
</item>
|
</item>
|
||||||
{{ end }}
|
{{ end }}
|
||||||
|
|
|
@ -4,9 +4,19 @@
|
||||||
{{partial "head" .}}
|
{{partial "head" .}}
|
||||||
</head>
|
</head>
|
||||||
<body>
|
<body>
|
||||||
{{partial "header" .}}<hr>
|
{{partial "header" .}}
|
||||||
<main>{{.Content}}</main>
|
<main>
|
||||||
|
<article>
|
||||||
|
<section>
|
||||||
|
{{.Content}}
|
||||||
|
</section>
|
||||||
|
{{ if .Params.author}}
|
||||||
|
<section>
|
||||||
|
{{partial "metadata" .}}
|
||||||
|
</section>
|
||||||
|
{{end}}
|
||||||
|
</article>
|
||||||
|
</main>
|
||||||
|
{{partial "footer" .}}
|
||||||
</body>
|
</body>
|
||||||
<hr>
|
|
||||||
{{partial "footer" .}}
|
|
||||||
</html>
|
</html>
|
|
@ -4,10 +4,34 @@
|
||||||
{{partial "head" .}}
|
{{partial "head" .}}
|
||||||
</head>
|
</head>
|
||||||
<body>
|
<body>
|
||||||
{{partial "header" .}}<hr>
|
{{partial "header" .}}
|
||||||
<main>{{.Content}}</main>
|
<main>
|
||||||
<aside>{{partial "sidebar" .}}</aside>
|
<section>
|
||||||
|
<article>
|
||||||
|
{{.Content}}
|
||||||
|
</article>
|
||||||
|
{{ if .Site.Data.details.social_links}}
|
||||||
|
<hr>
|
||||||
|
<article>
|
||||||
|
<h2>Stay up to date</h2>
|
||||||
|
<div id="social-links">
|
||||||
|
{{range .Site.Data.details.social_links}}
|
||||||
|
<div class="social-link">
|
||||||
|
<a href="{{.href}}">
|
||||||
|
<img src="{{.img}}">
|
||||||
|
</a>
|
||||||
|
<a href="{{.href}}"><strong>{{.title}}</strong></a>
|
||||||
|
</div>
|
||||||
|
{{end}}
|
||||||
|
</div>
|
||||||
|
|
||||||
|
</article>
|
||||||
|
{{end}}
|
||||||
|
</section>
|
||||||
|
<article id="sidebar">
|
||||||
|
{{partial "sidebar" .}}
|
||||||
|
</article>
|
||||||
|
</main>
|
||||||
|
{{ partial "footer" .}}
|
||||||
</body>
|
</body>
|
||||||
<hr>
|
|
||||||
{{partial "footer" .}}
|
|
||||||
</html>
|
</html>
|
214
layouts/interverse/list.html
Normal file
214
layouts/interverse/list.html
Normal file
|
@ -0,0 +1,214 @@
|
||||||
|
<!DOCTYPE html>
|
||||||
|
<html>
|
||||||
|
|
||||||
|
<head>
|
||||||
|
{{partial "head" .}}
|
||||||
|
<script defer src="/alpine.js" type="text/javascript"></script>
|
||||||
|
<script src="/helper.js"></script>
|
||||||
|
<style>
|
||||||
|
.interverse {
|
||||||
|
display: flex;
|
||||||
|
flex-direction: column;
|
||||||
|
align-items: center;
|
||||||
|
}
|
||||||
|
|
||||||
|
.interverse h1 {
|
||||||
|
text-align: center;
|
||||||
|
}
|
||||||
|
|
||||||
|
.interverse img {
|
||||||
|
max-width: 15rem;
|
||||||
|
max-height: 15rem;
|
||||||
|
}
|
||||||
|
|
||||||
|
.interverse section {
|
||||||
|
display: flex;
|
||||||
|
flex-direction: row;
|
||||||
|
align-items: center;
|
||||||
|
justify-content: center;
|
||||||
|
flex-wrap: wrap;
|
||||||
|
box-shadow: none;
|
||||||
|
}
|
||||||
|
|
||||||
|
.interverse-connection-preview {
|
||||||
|
display: flex;
|
||||||
|
flex-direction: column;
|
||||||
|
padding: 1rem;
|
||||||
|
margin: 0.5rem;
|
||||||
|
align-items: center;
|
||||||
|
}
|
||||||
|
|
||||||
|
.interverse-connection {
|
||||||
|
margin: 0.25rem;
|
||||||
|
padding: 0.25rem;
|
||||||
|
display: flex;
|
||||||
|
flex-direction: column;
|
||||||
|
align-items: center;
|
||||||
|
justify-items: center;
|
||||||
|
}
|
||||||
|
|
||||||
|
.interverse-resource {
|
||||||
|
margin: 2rem;
|
||||||
|
}
|
||||||
|
|
||||||
|
#interverse-resource-groups {
|
||||||
|
align-items: flex-start;
|
||||||
|
}
|
||||||
|
</style>
|
||||||
|
</head>
|
||||||
|
|
||||||
|
<body>
|
||||||
|
{{partial "header" .}}
|
||||||
|
<main class="interverse" x-data x-if="Alpine.store('data')">
|
||||||
|
<section>{{.Content}}</section>
|
||||||
|
<section id="interverse-details">
|
||||||
|
<img x-bind:src="Alpine.store('data')['image']">
|
||||||
|
<div style="margin-left:3rem;">
|
||||||
|
<h1 x-text="Alpine.store('data')['name']"></h1>
|
||||||
|
<a x-bind:href="Alpine.store('data')['location']" x-text="Alpine.store('data')['location']"></a>
|
||||||
|
</div>
|
||||||
|
</section>
|
||||||
|
<section id="interverse-resource-groups">
|
||||||
|
<template x-for="(group,name) in Alpine.store('data')['resource_groups']">
|
||||||
|
<div>
|
||||||
|
<h1 x-text="name"></h1>
|
||||||
|
<div class="interverse-group">
|
||||||
|
<template x-for="resource in group">
|
||||||
|
<a x-bind:href="resource['location']">
|
||||||
|
<div class="interverse-resource">
|
||||||
|
<template x-if="resource['icon'] !=''">
|
||||||
|
<img class="interverse-resource-icon" x-bind:src="resource['icon']">
|
||||||
|
</template>
|
||||||
|
<h2 x-text="resource['label']"></h2>
|
||||||
|
<p x-text="resource['description']"></p>
|
||||||
|
</div>
|
||||||
|
</a>
|
||||||
|
</template>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</template>
|
||||||
|
</section>
|
||||||
|
<section id="interverse-resources">
|
||||||
|
<template x-for="resource in Alpine.store('data')['resources']">
|
||||||
|
<a x-bind:href="resource['location']">
|
||||||
|
<div class="interverse-resource">
|
||||||
|
<template x-if="resource['icon'] !=''">
|
||||||
|
<img class="interverse-resource-icon" x-bind:src="resource['icon']">
|
||||||
|
</template>
|
||||||
|
<h2 x-text="resource['label']"></h2>
|
||||||
|
<p x-text="resource['description']"></p>
|
||||||
|
</div>
|
||||||
|
</a>
|
||||||
|
</template>
|
||||||
|
</section>
|
||||||
|
<div id="interverse-groups">
|
||||||
|
<template x-for="(group,name) in Alpine.store('data')['connection_groups']">
|
||||||
|
<div>
|
||||||
|
<h1 x-text="name"></h1>
|
||||||
|
<section class="interverse-group">
|
||||||
|
<template x-for="link in group">
|
||||||
|
<div class="interverse-connection" x-data="{connected:false">
|
||||||
|
<template x-if="Alpine.store(link)['name'] !=''">
|
||||||
|
<div class='interverse-connection-preview'
|
||||||
|
x-on:click="initialize(link+'/.well-known/interverse')">
|
||||||
|
<h3 x-text="Alpine.store(link)['name']"></h3>
|
||||||
|
<img x-bind:src="Alpine.store(link)['image']">
|
||||||
|
<a x-bind:href="link" x-text="link"></a>
|
||||||
|
</div>
|
||||||
|
</template>
|
||||||
|
<template x-if="Alpine.store(link) == undefined">
|
||||||
|
<div>
|
||||||
|
<a x-bind:href="link">
|
||||||
|
<p x-text="link"></p>
|
||||||
|
</a>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
</template>
|
||||||
|
</div>
|
||||||
|
</template>
|
||||||
|
</section>
|
||||||
|
|
||||||
|
</div>
|
||||||
|
</template>
|
||||||
|
</div>
|
||||||
|
<h3 style="text-align:center"></h3>
|
||||||
|
<section id="interverse-connections">
|
||||||
|
<template x-for="connection in Alpine.store('data')['connections']">
|
||||||
|
<div class="interverse-connection">
|
||||||
|
<template x-if="Alpine.store(connection)['version'] >=0">
|
||||||
|
<div x-on:click="initialize(connection+'/.well-known/interverse')">
|
||||||
|
<h3 x-text="Alpine.store(connection)['name']"></h3>
|
||||||
|
<template x-if="Alpine.store(connection)['image']!=''">
|
||||||
|
<img x-bind:src="Alpine.store(connection)['image']">
|
||||||
|
</template>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
</template>
|
||||||
|
<template x-if="name == ''">
|
||||||
|
<div>
|
||||||
|
<a x-bind:href="connection" x-text="connection"></a>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
</div>
|
||||||
|
</template>
|
||||||
|
</div>
|
||||||
|
<div id="interverse-contact">
|
||||||
|
<template x-for="contact in Alpine.store('data')['contact']">
|
||||||
|
<div class="interverse-contact">
|
||||||
|
|
||||||
|
</div>
|
||||||
|
|
||||||
|
</template>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
</main>
|
||||||
|
<script>
|
||||||
|
var t = new Date();
|
||||||
|
var timestamp = t.getTime();
|
||||||
|
var main_url = "/.well-known/interverse";
|
||||||
|
if (getUrlParameter('s') && getUrlParameter("url")) {
|
||||||
|
var uri = "";
|
||||||
|
main_url = getUrlParameter('s') + "://" + getUrlParameter("url") + '/.well-known/interverse?t=' + timestamp;
|
||||||
|
} else {
|
||||||
|
if (getUrlParameter('url')) {
|
||||||
|
main_url = "https://" + getUrlParameter('url') + '/.well-known/interverse?t=' + timestamp;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
document.addEventListener('alpine:init', function () {
|
||||||
|
|
||||||
|
initialize(main_url);
|
||||||
|
});
|
||||||
|
|
||||||
|
function initialize(url) {
|
||||||
|
Alpine.store("data", {});
|
||||||
|
fetchdata(url, function (e) {
|
||||||
|
data = JSON.parse(e.target.response);
|
||||||
|
raw_data = JSON.parse(e.target.response);
|
||||||
|
Alpine.store("data", data);
|
||||||
|
var connections = raw_data['connections'];
|
||||||
|
for (group in data['connection_groups']) {
|
||||||
|
for (link in data['connection_groups'][group]) {
|
||||||
|
connections.push(data['connection_groups'][group][link]);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
var t = new Date();
|
||||||
|
var timestamp = t.getTime();
|
||||||
|
for (var i = 0; i < connections.length; i++) {
|
||||||
|
fetchdata(connections[i] + '/.well-known/interverse?t=' + timestamp, function (e) {
|
||||||
|
try {
|
||||||
|
dat = JSON.parse(e.target.response);
|
||||||
|
console.log(dat);
|
||||||
|
Alpine.store(dat['location'], dat);
|
||||||
|
} catch {
|
||||||
|
console.log("Failed to parse connection JSON");
|
||||||
|
}
|
||||||
|
});
|
||||||
|
}
|
||||||
|
|
||||||
|
});
|
||||||
|
}
|
||||||
|
</script>
|
||||||
|
</body>
|
||||||
|
{{partial "footer" .}}
|
||||||
|
|
||||||
|
</html>
|
|
@ -1,3 +1,3 @@
|
||||||
<footer>
|
<footer>
|
||||||
<p><a href="">Freedom</a> created by <a href="https://gabe.rocks">Gabriel</a></p>
|
<p><a href="https://codeberg.org/gabe/Freedom">Freedom</a> created by <a href="https://gabe.rocks">Gabriel</a></p>
|
||||||
</footer>
|
</footer>
|
|
@ -1,3 +1,39 @@
|
||||||
|
<title>{{ .Title}}</title>
|
||||||
<link rel="stylesheet" href="/css/theme.css">
|
<link rel="stylesheet" href="/css/theme.css">
|
||||||
<link rel="stylesheet" href="/style.css">
|
<meta charset="utf-8" />
|
||||||
<title>{{.Title}}</title>
|
<meta name="title" content="{{ .Title }}">
|
||||||
|
<meta name="description" content="{{.Params.description}}">
|
||||||
|
<meta name="og:site_name" content="Libre Solutions Network">
|
||||||
|
<meta property="og:title" content="{{ .Title }}">
|
||||||
|
<meta property="og:description" content="{{.Params.description}}">
|
||||||
|
<meta property="og:url" content="{{.Permalink}}">
|
||||||
|
{{if .Params.video}}
|
||||||
|
<meta name="twitter:card" content="player"/>
|
||||||
|
<meta property="og:video" content="https://libresolutions.network/video-embed?v={{.Params.video}}">
|
||||||
|
<meta property="og:video:url" content="https://libresolutions.network/video-embed?v={{.Params.video}}">
|
||||||
|
<meta property="og:video:secure_url" content="https://libresolutions.network/video-embed?v={{.Params.video}}">
|
||||||
|
<meta property="og:type" content="video">
|
||||||
|
<meta name="twitter:player:width" content="480" />
|
||||||
|
<meta name="twitter:player:height" content="360" />
|
||||||
|
<meta property="twitter:player" content="https://libresolutions.network/video-embed?v={{.Params.video}}">
|
||||||
|
{{else}}
|
||||||
|
{{if .Params.peertubeURL}}
|
||||||
|
<meta property="og:video" content="{{.Params.peertubeURL}}">
|
||||||
|
{{else}}
|
||||||
|
{{if .Params.audioURL}}
|
||||||
|
<meta property="og:audio" content="https://libresolutions.network/media/{{.Params.audioURL}}">
|
||||||
|
<meta property="og:type" content="audio">
|
||||||
|
{{else}}
|
||||||
|
<meta property="og:type" content="website">
|
||||||
|
<meta property="twitter:card" content="summary_large_image">
|
||||||
|
{{end}}
|
||||||
|
{{end}}
|
||||||
|
{{end}}
|
||||||
|
{{ if .Params.image }}
|
||||||
|
<meta property="og:image" content="https://libresolutions.network/media/{{.Params.image}}">
|
||||||
|
<meta property="twitter:image" content="https://libresolutions.network/media/{{.Params.image}}">
|
||||||
|
{{else}}
|
||||||
|
<meta property="og:image" content="https://libresolutions.network/logo.png">
|
||||||
|
<meta property="twitter:image" content="https://libresolutions.network/logo.png">
|
||||||
|
{{end}}
|
||||||
|
|
||||||
|
|
|
@ -1,9 +1,14 @@
|
||||||
<header>
|
<header>
|
||||||
<h1>{{.Site.Title }}</h1>
|
<img src="{{.Site.Data.details.logo}}">
|
||||||
|
<div>
|
||||||
|
<h1>{{.Site.Data.details.name }}</h1>
|
||||||
|
<i>{{.Site.Data.details.description}}</i>
|
||||||
|
</div>
|
||||||
<nav>
|
<nav>
|
||||||
<a href="/"><h3>Home</h3></a>
|
<a href="/"><h2>Home</h2></a>
|
||||||
{{ range .Site.Sections}}
|
{{ range .Site.Sections}}
|
||||||
<a href="{{.Permalink}}"><h3>{{.Title}}</h3></a>
|
<a href="{{.Permalink}}"><h2>{{.Title}}</h2></a>
|
||||||
{{end}}
|
{{end}}
|
||||||
</nav>
|
</nav>
|
||||||
|
|
||||||
</header>
|
</header>
|
15
layouts/partials/metadata.html
Normal file
15
layouts/partials/metadata.html
Normal file
|
@ -0,0 +1,15 @@
|
||||||
|
<div class="metadata">
|
||||||
|
<div>
|
||||||
|
{{$author := index .Site.Data.details.staff (.Params.author | default "default")}}
|
||||||
|
<h2>{{$author.name}}</h2>
|
||||||
|
<p>Date: {{.Date | time.Format "Jan 02 2006"}}</p>
|
||||||
|
</div>
|
||||||
|
<h4>Tags:</h4>
|
||||||
|
<ul>
|
||||||
|
{{ range (.GetTerms "tags")}}
|
||||||
|
<a href="{{.Permalink}}"><li>{{.LinkTitle}}</li></a>
|
||||||
|
{{end}}
|
||||||
|
</ul>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
</div>
|
|
@ -1,5 +1,30 @@
|
||||||
<h3>Sidebar</h3>
|
|
||||||
|
|
||||||
<h4>Recent Content</h4>
|
{{if .Site.Data.details.featured}}
|
||||||
|
<h2>Featured</h2>
|
||||||
|
{{ range .Site.Data.details.featured}}
|
||||||
|
<section class="featured">
|
||||||
|
<a href="{{.href}}">
|
||||||
|
<img src="{{.img}}">
|
||||||
|
</a>
|
||||||
|
<div>
|
||||||
|
<a href="{{.href}}">
|
||||||
|
<h3>{{.title}}</h3>
|
||||||
|
</a>
|
||||||
|
<p>{{.description}}</p>
|
||||||
|
</div>
|
||||||
|
</section>
|
||||||
|
{{end}}
|
||||||
|
{{end}}
|
||||||
|
<h2>Recent Content</h2>
|
||||||
|
{{range first 5 .Site.RegularPages}}
|
||||||
|
|
||||||
<h4>Featured</h4>
|
<section class="recent">
|
||||||
|
<a href="{{.Permalink}}">
|
||||||
|
<img src="{{.Params.image}}">
|
||||||
|
</a>
|
||||||
|
<div>
|
||||||
|
<a href="{{.Permalink}}"><h2>{{.Title}}</h2></a>
|
||||||
|
<p>{{.Params.description}}</p>
|
||||||
|
</div>
|
||||||
|
</section>
|
||||||
|
{{end}}
|
||||||
|
|
30
layouts/rss.xml
Normal file
30
layouts/rss.xml
Normal file
|
@ -0,0 +1,30 @@
|
||||||
|
<rss version="2.0" xmlns:atom="http://www.w3.org/2005/Atom">
|
||||||
|
<channel>
|
||||||
|
<title>{{ .Title }}</title>
|
||||||
|
<link>{{ .Permalink }}</link>
|
||||||
|
<description>{{.Params.description}}</description>
|
||||||
|
<image href="{{.Site.Params.image}}"/>
|
||||||
|
<generator>Hugo -- gohugo.io</generator>{{ with .Site.LanguageCode }}
|
||||||
|
<language>{{.}}</language>{{end}}
|
||||||
|
{{ with .OutputFormats.Get "RSS" }}
|
||||||
|
{{ printf "<atom:link href=%q rel=\"self\" type=%q />" .Permalink .MediaType | safeHTML }}
|
||||||
|
{{ end }}
|
||||||
|
{{ range first 15 .Site.RegularPages }}
|
||||||
|
<item>
|
||||||
|
<title>{{ .Title }}</title>
|
||||||
|
<link>{{ .Permalink }}</link>
|
||||||
|
<pubDate>{{ .Date.Format "Mon, 02 Jan 2006 15:04:05 -0700" | safeHTML }}</pubDate>
|
||||||
|
{{ with .Site.Author.email }}<author>{{.}}{{ with $.Site.Author.name }} ({{.}}){{end}}</author>{{end}}
|
||||||
|
<guid>{{ .Permalink }}</guid>
|
||||||
|
<image>{{.Params.image}}</image>
|
||||||
|
{{ if .Params.audio }}
|
||||||
|
<enclosure url="{{.Params.audio}}" />
|
||||||
|
{{end}}
|
||||||
|
{{ if .Params.video}}
|
||||||
|
<enclosure url="{{.Params.video}}" />
|
||||||
|
{{end}}
|
||||||
|
<description>{{- .Content | html -}}</description>
|
||||||
|
</item>
|
||||||
|
{{ end }}
|
||||||
|
</channel>
|
||||||
|
</rss>
|
|
@ -1,3 +1,3 @@
|
||||||
<audio>
|
<audio>
|
||||||
<source src='{{.Get 0 }}'>
|
<source src='{{.Get "src" }}'>
|
||||||
</audio>
|
</audio>
|
|
@ -1,2 +1,2 @@
|
||||||
<iframe src='{{.Get 0 }}'>
|
<iframe src='{{.Get "src" }}'>
|
||||||
</iframe>
|
</iframe>
|
14
layouts/shortcodes/image.html
Normal file
14
layouts/shortcodes/image.html
Normal file
|
@ -0,0 +1,14 @@
|
||||||
|
{{ if .Get "href"}}
|
||||||
|
<a href='{{.Get "href"}}'>
|
||||||
|
{{end}}
|
||||||
|
<img
|
||||||
|
src='{{.Get "src"}}'
|
||||||
|
{{if .Get "alt"}}
|
||||||
|
alt='{{.Get "alt"}}'
|
||||||
|
{{end}}
|
||||||
|
{{if .Get "float"}}
|
||||||
|
style='float:{{.Get "float"}}'
|
||||||
|
{{end}}>
|
||||||
|
{{ if .Get "href"}}
|
||||||
|
</a>
|
||||||
|
{{end}}
|
|
@ -1,3 +1,3 @@
|
||||||
<video controls>
|
<video controls>
|
||||||
<source src='{{.Get 0 }}'>
|
<source src='{{.Get "src" }}'>
|
||||||
</video>
|
</video>
|
|
@ -1,55 +1,352 @@
|
||||||
body{
|
body {
|
||||||
--theme-primary-color:black;
|
line-height: 1.25;
|
||||||
--theme-secondary-color:white;
|
--theme-color-primary: black;
|
||||||
--theme-accent-color:gold;
|
--theme-color-secondary: white;
|
||||||
background-color: var(--theme-primary-color);
|
--theme-color-accent: #1d7fd4;
|
||||||
color:var(--theme-secondary-color);
|
--theme-color-accent-transparent: #1d7fd444;
|
||||||
width:100vw;
|
--theme-color-accent2: #ebb716;
|
||||||
margin:0;
|
--theme-color-accent2-transparent: #ebb71644;
|
||||||
display:flex;
|
width: 100vw;
|
||||||
|
margin: 0px;
|
||||||
|
padding: 0px;
|
||||||
|
overflow-x: hidden;
|
||||||
|
display: flex;
|
||||||
flex-direction: row;
|
flex-direction: row;
|
||||||
flex-wrap: wrap;
|
flex-wrap: wrap;
|
||||||
|
justify-content: space-evenly;
|
||||||
|
align-items: center;
|
||||||
|
color: var(--theme-color-secondary);
|
||||||
|
background-color: var(--theme-color-primary);
|
||||||
|
}
|
||||||
|
|
||||||
|
.background-photo {
|
||||||
|
position: fixed;
|
||||||
|
top: 40vh;
|
||||||
|
max-width: 80vw;
|
||||||
|
max-height: 70vh;
|
||||||
|
z-index: -1;
|
||||||
|
}
|
||||||
|
header{
|
||||||
|
margin-top:1rem;
|
||||||
|
}
|
||||||
|
|
||||||
|
header,footer{
|
||||||
|
text-align: center;
|
||||||
|
width:100vw;
|
||||||
|
}
|
||||||
|
footer{
|
||||||
|
margin-bottom:0;
|
||||||
|
}
|
||||||
|
nav{
|
||||||
|
background-color:rgba(0,0,0,0.7);
|
||||||
|
border-radius:30%;
|
||||||
|
}
|
||||||
|
|
||||||
|
p {
|
||||||
|
}
|
||||||
|
|
||||||
|
a {
|
||||||
|
color: var(--theme-color-accent2);
|
||||||
|
}
|
||||||
|
|
||||||
|
a:visited {
|
||||||
|
color: var(--theme-color-accent2);
|
||||||
|
}
|
||||||
|
|
||||||
|
hr {
|
||||||
|
width: 100%;
|
||||||
|
margin-top: 2rem;
|
||||||
|
margin-bottom: 2rem;
|
||||||
|
color: var(--theme-color-accent2);
|
||||||
|
}
|
||||||
|
|
||||||
|
main,aside {
|
||||||
|
padding:2.5rem;
|
||||||
|
max-width:80rem;
|
||||||
|
display: flex;
|
||||||
|
flex-direction: row;
|
||||||
|
align-items: flex-start;
|
||||||
|
justify-content: space-evenly;
|
||||||
|
padding:1rem;
|
||||||
|
|
||||||
|
}
|
||||||
|
.listing {
|
||||||
|
width: 100%;
|
||||||
|
margin: 1rem;
|
||||||
|
display: flex;
|
||||||
|
flex-direction: row;
|
||||||
|
align-items: center;
|
||||||
|
justify-content: flex-start;
|
||||||
|
}
|
||||||
|
|
||||||
|
.listing-preview {
|
||||||
|
display: flex;
|
||||||
|
flex-direction: row;
|
||||||
|
flex-wrap: wrap;
|
||||||
|
align-items: flex-start;
|
||||||
justify-content: center;
|
justify-content: center;
|
||||||
}
|
}
|
||||||
|
|
||||||
main,aside{
|
|
||||||
border:1px solid white;
|
img,
|
||||||
display:flex;
|
video {
|
||||||
|
max-width: 95%;
|
||||||
|
}
|
||||||
|
|
||||||
|
audio {
|
||||||
|
width: 100%;
|
||||||
|
}
|
||||||
|
|
||||||
|
.metadata {
|
||||||
|
display: flex;
|
||||||
|
flex-direction: row;
|
||||||
|
flex-wrap: wrap;
|
||||||
|
align-items: flex-start;
|
||||||
|
justify-content: center;
|
||||||
|
}
|
||||||
|
|
||||||
|
.metadata>div {
|
||||||
|
margin: 1rem;
|
||||||
|
}
|
||||||
|
|
||||||
|
.metadata p {
|
||||||
|
max-width: 20rem;
|
||||||
|
}
|
||||||
|
|
||||||
|
.metadata-author {
|
||||||
|
padding: 0.5rem;
|
||||||
|
display: flex;
|
||||||
flex-direction: column;
|
flex-direction: column;
|
||||||
margin:1.5rem;
|
align-items: center;
|
||||||
padding:1rem;
|
flex-wrap: nowrap;
|
||||||
}
|
}
|
||||||
main{
|
|
||||||
min-width: 40%;
|
.metadata-author>img {
|
||||||
max-width: 60rem;
|
max-width: 5rem;
|
||||||
|
border-radius: 3rem;
|
||||||
}
|
}
|
||||||
aside{
|
|
||||||
min-width: 30rem;
|
|
||||||
}
|
header {
|
||||||
header,footer{
|
text-align: center;
|
||||||
width:100vw;
|
background-color: transparent;
|
||||||
display:flex;
|
display: flex;
|
||||||
flex-direction: row;
|
flex-direction: row;
|
||||||
flex-wrap: wrap;
|
flex-wrap: wrap;
|
||||||
align-items: center;
|
align-items: center;
|
||||||
justify-content: center;
|
justify-content: space-evenly;
|
||||||
|
bottom: 0;
|
||||||
}
|
}
|
||||||
nav{
|
|
||||||
display:flex;
|
nav {
|
||||||
|
display: flex;
|
||||||
flex-direction: row;
|
flex-direction: row;
|
||||||
flex-wrap: wrap;
|
flex-wrap: wrap;
|
||||||
margin-left:10%;
|
align-items: center;
|
||||||
|
justify-content: space-evenly;
|
||||||
}
|
}
|
||||||
nav>a{
|
|
||||||
|
nav>* {
|
||||||
|
margin: 1rem;
|
||||||
|
}
|
||||||
|
|
||||||
|
section {
|
||||||
|
display:flex;
|
||||||
|
flex-direction: column;
|
||||||
|
align-items: center;
|
||||||
|
margin-top: 0.5rem;
|
||||||
|
margin-bottom: 0.5rem;
|
||||||
|
padding: 1.25rem;
|
||||||
|
border-radius: 1rem;
|
||||||
|
min-width: 30vw;
|
||||||
|
}
|
||||||
|
|
||||||
|
article {
|
||||||
|
min-width: 30rem;
|
||||||
|
background-color: #000015b6;
|
||||||
|
margin-top: 1rem;
|
||||||
|
margin-bottom: 1rem;
|
||||||
|
padding: 0.5rem;
|
||||||
|
border-radius: 1rem;
|
||||||
|
box-shadow: 0 0 0.45rem var(--theme-color-accent);
|
||||||
|
display: flex;
|
||||||
|
flex-direction: column;
|
||||||
|
align-items: center;
|
||||||
|
|
||||||
|
padding-left:10%;
|
||||||
|
padding-right:10%;
|
||||||
|
}
|
||||||
|
|
||||||
|
blockquote {
|
||||||
|
margin-left: 10%;
|
||||||
|
padding-left: 5%;
|
||||||
|
border-left: 0.5rem solid var(--theme-color-accent2);
|
||||||
|
font-style: italic;
|
||||||
|
}
|
||||||
|
|
||||||
|
section ul,
|
||||||
|
section ol,
|
||||||
|
article ol,
|
||||||
|
article ul {
|
||||||
|
width: 90%;
|
||||||
|
}
|
||||||
|
|
||||||
|
article>a {
|
||||||
|
text-align: center;
|
||||||
|
}
|
||||||
|
|
||||||
|
article h3,
|
||||||
|
section h3,
|
||||||
|
article h4,
|
||||||
|
section h4,
|
||||||
|
article h5,
|
||||||
|
article p {
|
||||||
|
width: 100%;
|
||||||
|
}
|
||||||
|
|
||||||
|
article h3 {
|
||||||
|
text-decoration: underline;
|
||||||
|
}
|
||||||
|
|
||||||
|
article img,
|
||||||
|
article video,
|
||||||
|
article iframe {
|
||||||
|
align-self: center;
|
||||||
|
max-width: 40rem;
|
||||||
|
}
|
||||||
|
|
||||||
|
section iframe,
|
||||||
|
article iframe {
|
||||||
|
width: 80%;
|
||||||
|
height: 25rem;
|
||||||
|
}
|
||||||
|
|
||||||
|
table{
|
||||||
|
width:fit-content;
|
||||||
|
}
|
||||||
|
td,
|
||||||
|
th {
|
||||||
|
margin: 0;
|
||||||
|
border: 1px solid var(--theme-color-accent2);
|
||||||
|
padding: 0.5rem;
|
||||||
|
text-align: left !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
video{
|
||||||
|
background-color:black;
|
||||||
|
}
|
||||||
|
|
||||||
|
.link-preview{
|
||||||
|
display:flex;
|
||||||
|
flex-direction: row;
|
||||||
|
flex-wrap: nowrap;
|
||||||
|
padding:1.5%;
|
||||||
|
justify-content: center;
|
||||||
|
text-decoration: none;
|
||||||
|
text-align: left;
|
||||||
|
max-width: 80%;
|
||||||
|
}
|
||||||
|
.link-preview>*{
|
||||||
|
margin:0.5rem;
|
||||||
|
}
|
||||||
|
.link-preview>img{
|
||||||
|
max-width: 20%;
|
||||||
|
}
|
||||||
|
.link-preview>div>p{
|
||||||
|
text-decoration: none !important;
|
||||||
|
color: var(--theme-color-secondary);
|
||||||
|
}
|
||||||
|
|
||||||
|
.listing img,
|
||||||
|
.listing video {
|
||||||
|
max-width:25rem;
|
||||||
margin:1rem;
|
margin:1rem;
|
||||||
}
|
}
|
||||||
|
|
||||||
a,
|
aside .listing img{
|
||||||
hr{
|
max-height: 15vh;
|
||||||
color:var(--theme-accent-color);
|
|
||||||
}
|
}
|
||||||
hr{
|
|
||||||
width:100%;
|
#sidebar {
|
||||||
margin-top:1.5rem;
|
padding:1rem;
|
||||||
margin-bottom:1.5rem;
|
padding-top:0;
|
||||||
}
|
margin:2rem;
|
||||||
|
margin-top:3rem;
|
||||||
|
}
|
||||||
|
.recent,.featured{
|
||||||
|
width: 100%;
|
||||||
|
display: flex;
|
||||||
|
flex-direction: row;
|
||||||
|
align-items: flex-start;
|
||||||
|
}
|
||||||
|
.recent *,
|
||||||
|
.featured *{
|
||||||
|
margin:0;
|
||||||
|
padding:0;
|
||||||
|
}
|
||||||
|
.recent img,
|
||||||
|
.featured img{
|
||||||
|
max-width:20rem;
|
||||||
|
max-height:10rem;
|
||||||
|
margin:1rem;
|
||||||
|
}
|
||||||
|
|
||||||
|
#social-links{
|
||||||
|
display: flex;
|
||||||
|
flex-direction: row;
|
||||||
|
flex-wrap: wrap;
|
||||||
|
}
|
||||||
|
|
||||||
|
.social-link{
|
||||||
|
display:flex;
|
||||||
|
flex-direction: column;
|
||||||
|
align-items: center;
|
||||||
|
margin:1rem;
|
||||||
|
}
|
||||||
|
|
||||||
|
.social-link img{
|
||||||
|
width:5rem;
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
@media print {
|
||||||
|
body{
|
||||||
|
|
||||||
|
background-color: white;
|
||||||
|
}
|
||||||
|
header,footer{
|
||||||
|
display:none;
|
||||||
|
}
|
||||||
|
body>img{
|
||||||
|
display:none;
|
||||||
|
}
|
||||||
|
img{
|
||||||
|
max-height: 60vh;
|
||||||
|
}
|
||||||
|
*,main,section{
|
||||||
|
color:black;
|
||||||
|
background-color: white;
|
||||||
|
border:none;
|
||||||
|
box-shadow: none;
|
||||||
|
padding:0;
|
||||||
|
max-width:100vw;
|
||||||
|
}
|
||||||
|
main{
|
||||||
|
max-width:100vw;
|
||||||
|
|
||||||
|
}
|
||||||
|
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
@media screen and (orientation:portrait){
|
||||||
|
main{
|
||||||
|
flex-direction: column;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
|
Loading…
Reference in a new issue