chore: more responsive

This commit is contained in:
xuu 2025-04-02 14:22:10 -06:00
parent 1ae8680f43
commit 14e1c4176d
Signed by: xuu
GPG Key ID: 8B3B0604F164E04F

View File

@ -117,22 +117,34 @@ func (r *HTWriter) WriteTo(w io.Writer) (int64, error) {
<head>
<title>The Watcher</title>
<style>
body { font-family: sans-serif; width: 70%; margin: auto; background: black; color: white; }
@media screen and (max-width: 500px) {
body { width: 100%; margin: 0; }
}
@media screen and (min-width: 500px) and (max-width: 940px) {
body { width: 90%; margin: auto; }
.h-card { columns: 2; }
}
@media screen and (min-width: 940px) {
body { width: 70%; margin: auto; }
.h-card { columns: 2; }
}
body { font-family: sans-serif; background: black; color: white; }
a { color: cornflowerblue; text-decoration: none; }
main { }
pre { white-space: pre-wrap; }
pre.preamble { color: green; }
article { background-color: #333; border: 1px solid green; border-radius: 4px; padding: 4px; margin: 2px; }
article pre { color: orange; }
.h-card { columns: 2; }
.h-card .author { display: flex; }
.h-card .icon { width: 36px; margin: 4px; }
.h-card .u-photo { width: 32px; }
.h-card .date { text-align: right;}
.p-org a { color: darkgrey; }
.h-card .date { text-align: right;}
section { padding: 1em; border: 1px solid darkgreen; background-color: #111; }
section img { max-width: 100%; }
</style>
<meta name="viewport" content="width=device-width, initial-scale=1">
</head>
<body onload="setTimestamps()">
<pre class='preamble'>
@ -195,7 +207,7 @@ func (r *HTWriter) WriteTo(w io.Writer) (int64, error) {
</div>
</header>
<section>
%h
%-h
</section>
</div>
</article>