Mercurial > prosody-modules

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
{date&<meta name="dcterms.date" content="{date}">}
<title>{title?{room.name?{jid_node}}{date& - {date}}}</title>
<style>
:link,:visited{color:#3465a4;text-decoration:none;}
:link:hover,:visited:hover{color:#6197df;}
body{background-color:#eeeeec;margin:1ex 0;padding-bottom:3em;font-family:Arial,Helvetica,sans-serif;}
ul,ol{padding:0;}
li{list-style:none;}
hr{visibility:hidden;clear:both;}
br{clear:both;}
header,footer{margin:1ex 1em;}
footer{font-size:smaller;color:#babdb6;}
nav{font-size:large;margin:1ex 1ex;clear:both;line-height:1.5em;}
footer nav .up{display:none;}
@media screen and (min-width: 460px) {
nav {font-size:x-large;margin:1ex 1em;}
}
nav a{padding:1ex}
nav li,nav dt{margin:1ex}
nav .up{font-size:smaller;display:block;clear:both;}
nav .up::before{content:"↑ ";}
nav .prev{float:left;}
nav .next{float:right;}
nav .next::after{content:" →";}
nav .prev::before{content:"← ";}
nav .last::after{content:" ⇥";}
nav :empty::after,nav :empty::before{content:""}
table{display:inline-block; margin:1ex 1em;vertical-align:top;}
th{font-size:x-small}
td{text-align:right;color:#bababa}
td > a, td > span{padding:0.4em}
.content{background-color:white;padding:1em;list-style-position:inside;}
.time{float:right;font-size:small;opacity:0.2;}
li:hover .time{opacity:1;}
.description{font-size:smaller;}
.body{white-space:pre-line;}
.body::before,.body::after{content:"";}
.presence .verb{font-style:normal;color:#30c030;}
.unavailable .verb{color:#c03030;}
.button{display:inline-block}
.button>a{color:white;background-color:orange;border-radius:4px}
.reaction{font-size:smaller;outline:1px solid silver;border-radius:2px}
form{text-align:right}
li.edited{display:none}
li:target{outline:1px gray dotted;display:inherit}
figure img{max-height:9em;max-width:16em}
@media (prefers-color-scheme: dark) {
html{color:#eee}
body{background-color:#161616}
.content{background-color:#1c1c1c}
footer{color:#444}
td{color:#444}
.button>a{background-color:#282828}
}
</style>
</head>
<body>
<header>
<h1 {lang&lang="{lang}"} title="xmpp:{jid?}">{title?{room.name?{jid_node}}{date& - {date}}}</h1>
<nav>
<ul>
{jid_node&
<li class="button"><a href="xmpp:{jid?}?join">Join using a client</a></li>
}
{room.webchat_url&
<li class="button"><a href="{room.webchat_url}">Join via web</a></li>
}
{links#
<li><a class="{item.rel?}" href="{item.href}{hide_presence&?p=h}" rel="{item.rel?}">{item.text}</a></li>}
</ul>
</nav>
</header>
<hr>
<main {lang&lang="{lang}"} class="content">
<nav>
<dl class="room-list">
{rooms#
<dt {item.lang&lang="{item.lang}"} class="name"><a href="{item.href}{hide_presence&?p=h}">{item.name}</a></dt>
<dd {item.lang&lang="{item.lang}"} class="description">{item.description?}</dd>}
</dl>
{dates|calendarize#
<h2 id="{item.year}">{item.year}</h2>
{item.months#
<table id="{item.month}-{item.year}">
<caption>{item.month}</caption>
<thead><tr><th>Mon</th><th>Tue</th><th>Wed</th><th>Thu</th><th>Fri</th><th>Sat</th><th>Sun</th></tr></thead>
<tbody>{item.weeks#
<tr>{item.days#<td>{item.href&<a href="{item.href}{hide_presence&?p=h}">}<span>{item.day?&nbsp;}</span>{item.href&</a>}</td>}</tr>}
</tbody>
</table>
}
}
</nav>

<div>
{presence_available&<form>
<label>
<input name="p" value="h" type="checkbox"{hide_presence& checked}>
<span>Hide joins and parts</span>
</label>
<noscript>
<button type="submit">Apply</button>
</noscript>
</form>}
</div>

<ol class="chat-logs">{lines#
<li {item.lang&lang="{item.lang}"} class="{item.st_name} {item.st_type?} {item.edited&edited}" id="{item.key}">
<a class="time" href="#{item.key}"><time id="{item.time}" datetime="{item.datetime}">{item.time}</time></a>
<b class="nick">{item.nick}</b>
<em class="verb">{item.verb?}</em>
<q class="body">{item.edited&<del>}{item.body?}{item.edited&</del> <a href="#{item.edited}" title="jump to corrected version">&#9998;</a>}{item.edit& <a href="#{item.edit}" title="jump to previous version">&#9999;</a>}{item.reply& <a href="#{item.reply}" title="jump to message responded to">&#8634;</a>}</q>
{item.reactions%<span class="reaction">{idx} {item}</span>}
{item.oob.url&<figure><a rel="nofollow" href="{item.oob.url?}"><img alt="{item.oob.desc?}" src="{item.oob.url?}"/></a><figcaption>{item.oob.desc?}</figcaption></figure>}
</li>}
</ol>
</main>
<hr>
<footer>
<nav>
<ul>{links#
<li><a class="{item.rel?}" href="{item.href}{hide_presence&?p=h}" rel="{item.rel?}">{item.text}</a></li>}
</ul>
</nav>
<br>
<div class="powered-by">Prosody</div>
</footer>
<script>
/*
* Local timestamps
*/
(function () {
var timeTags = document.getElementsByTagName("time");
var i = 0, tag, date;
while(timeTags[i]) {
tag = timeTags[i++];
if(date = tag.getAttribute("datetime")) {
date = new Date(date);
tag.textContent = date.toLocaleTimeString(navigator.language);
tag.setAttribute("title", date.toString());
}
}
document.forms[0].elements.p.addEventListener("change", function() {
document.forms[0].submit();
});
})();
</script>
</body>
</html>
author	Kim Alvefur <zash@zash.se>
date	Fri, 12 Aug 2022 17:15:11 +0200
parents	39211f23f9f3
children	d55b10878e43