diff options
Diffstat (limited to 'pages')
| -rw-r--r-- | pages/calendar-day.mustache | 36 | ||||
| -rw-r--r-- | pages/calendar.mustache | 59 | ||||
| -rw-r--r-- | pages/log.mustache | 8 | ||||
| -rw-r--r-- | pages/style.css | 47 |
4 files changed, 142 insertions, 8 deletions
diff --git a/pages/calendar-day.mustache b/pages/calendar-day.mustache new file mode 100644 index 0000000..0291226 --- /dev/null +++ b/pages/calendar-day.mustache @@ -0,0 +1,36 @@ +<!doctype html> +<html lang="en"> +<head> + <meta charset="utf-8"> + <title>{{channel}} {{date}} ({{network}}) - ircbrowse2</title> + <meta name="viewport" content="width=device-width, initial-scale=1"> + <link rel="stylesheet" href="/style.css"> +</head> +<body> + <div id="gridwrapper" data-page="withheader"> + <header> + <a href="/" class="hdritem">Home</a> + {{network}}/{{channel}}: + <a href="/log/{{alias}}" class="hdritem">Logs</a> + <a href="/cal/{{alias}}" class="hdritem">Calendar</a> + </header> + <main> + <h1>Logs on {{date}} ({{network}}/{{channel}})</h1> + <table id="events"><tbody> + {{#events}} + <tr{{#classlist}} class="{{.}}"{{/classlist}}> + <td>{{time}}</td> + <td>{{#nickwrap1}}<span class="nickwrap">{{nickwrap1}}</span>{{/nickwrap1}}{{nick}}{{#nickwrap2}}<span class="nickwrap">{{nickwrap2}}</span>{{/nickwrap2}}</td> + <td>{{message}}</td> + </tr> + {{/events}} + </tbody></table> + <p>All times are in UTC.</p> + </main> + <footer> + An IRC log viewer by + <a href="https://tomsmeding.com">Tom Smeding</a>. + </footer> + </div> +</body> +</html> diff --git a/pages/calendar.mustache b/pages/calendar.mustache new file mode 100644 index 0000000..79475cb --- /dev/null +++ b/pages/calendar.mustache @@ -0,0 +1,59 @@ +<!doctype html> +<html lang="en"> +<head> + <meta charset="utf-8"> + <title>Calendar {{channel}} ({{network}}) - ircbrowse2</title> + <meta name="viewport" content="width=device-width, initial-scale=1"> + <link rel="stylesheet" href="/style.css"> +</head> +<body> + <div id="gridwrapper" data-page="withheader"> + <header> + <a href="/" class="hdritem">Home</a> + {{network}}/{{channel}}: + <a href="/log/{{alias}}" class="hdritem">Logs</a> + <a href="/cal/{{alias}}" class="hdritem">Calendar</a> + </header> + <main> + <h1>Calendar: {{network}}/{{channel}}</h1> + {{#years}} + <h2>{{year}}</h2> + <table><tbody> + {{#monrows}} + <tr> + {{#months}} + <td class="calmonth"> + {{#monthname}} + <b>{{monthname}}</b><br> + <table class="calmonth"><tbody> + {{#weeks}} + <tr> + {{#days}} + <td>{{#date}}<a href="/cal/{{alias}}/{{year}}-{{month00}}-{{date00}}">{{date}}</a>{{/date}}</td> + {{/days}} + {{^days}} + <td> </td> + {{/days}} + </tr> + {{/weeks}} + {{#phantomweek}} + <tr style="opacity:0"> + <td>30</td><td>30</td><td>30</td><td>30</td><td>30</td><td>30</td><td>30</td> + </tr> + {{/phantomweek}} + </tbody></table> + {{/monthname}} + </td> + {{/months}} + </tr> + {{/monrows}} + </tbody></table> + {{/years}} + </main> + <footer> + An IRC log viewer by + <a href="https://tomsmeding.com">Tom Smeding</a>. + </footer> + </div> +</body> +</html> diff --git a/pages/log.mustache b/pages/log.mustache index 254a9cd..1257d7e 100644 --- a/pages/log.mustache +++ b/pages/log.mustache @@ -2,7 +2,7 @@ <html lang="en"> <head> <meta charset="utf-8"> - <title>ircbrowse2: {{channel}} ({{network}})</title> + <title>{{channel}} ({{network}}) - ircbrowse2</title> <meta name="viewport" content="width=device-width, initial-scale=1"> <link rel="stylesheet" href="/style.css"> </head> @@ -10,7 +10,8 @@ <div id="gridwrapper" data-page="withheader"> <header> <a href="/" class="hdritem">Home</a> - <span class="hdrspacer"></span> + {{network}}/{{channel}}: + <a href="/log/{{alias}}" class="hdritem">Logs</a> <a href="/cal/{{alias}}" class="hdritem">Calendar</a> </header> <main> @@ -81,9 +82,8 @@ {{/lastpage}} </div> {{/picker}} - <span style="margin: 0 9px 0 4px">—</span> - {{totalevents}} events total </div> + <p>All times are in UTC.</p> </main> <footer> An IRC log viewer by diff --git a/pages/style.css b/pages/style.css index 6fb9fbe..e7f0b43 100644 --- a/pages/style.css +++ b/pages/style.css @@ -9,6 +9,7 @@ body { --leave-color: #b66; --nickwrap-color: #999; --link-color: #33f; + --calendar-month-stripe-color: #c6c6da; } @media (prefers-color-scheme: dark) { @@ -23,6 +24,7 @@ body { --leave-color: #b05757; --nickwrap-color: var(--meta-color); --link-color: #abf; + --calendar-month-stripe-color: #446; } } @@ -32,7 +34,6 @@ html, body { body { font-family: "Adwaita Sans", system-ui, sans-serif; - font-variant-numeric: tabular-nums; background-color: var(--bg-color); color: var(--font-color); } @@ -77,9 +78,12 @@ footer { color: var(--footer-text-color); } -.hdrspacer { - display: inline-block; - width: 15px; +header > .hdritem:first-child { + margin-right: 30px; +} + +header > .hdritem:nth-child(n + 2) { + margin-left: 15px; } .hdritem { @@ -120,6 +124,10 @@ table#events td { vertical-align: top; } +table#events td:first-child { + font-variant-numeric: tabular-nums; +} + table#events td:nth-child(2) { text-align: right; } @@ -136,3 +144,34 @@ table#events tr.ev-leave > td:nth-child(n + 2) { color: var(--leave-color); } table#events tr.ev-act > td:nth-child(n + 2) { font-style: italic; } table#events tr.ev-notice > td:nth-child(n + 2) { font-weight: bold; } table#events tr.ev-parseerror > td:nth-child(n + 2) { color: red; } + +/* calendar page */ +table.calmonth { + border-top: 1px var(--calendar-month-stripe-color) solid; +} + +table.calmonth > tbody > tr { + padding: 0; +} + +table.calmonth > tbody > tr > td { + text-align: right; + padding: 1px 2px; +} + +table.calmonth > tbody > tr > td > a { + font-variant-numeric: tabular-nums; + + /* make link fill entire cell */ + display: inline-block; + width: 100%; +} + +td.calmonth { + vertical-align: top; + padding: 0 10px 10px 0; +} + +td.calmonth > b { + padding-left: 4px; +} |