update the scroll area

main
vitrinekast 9 months ago
parent 755bdfb7ff
commit 6eb2d5d3e0

@ -29,7 +29,7 @@
<header>
<h1>TL;DR</h1>
<h2>too log didn't read</h2>
<p>This log was generated on 2024-03-18 16:04:58.608504, the next will be available after 2024-03-18 19:04:58.608504</p>
<p>This log was generated on 2024-03-18 16:18:13.903913, the next will be available after 2024-03-18 19:18:13.903913</p>
</header>
<nav class="slider slider--top">
<label for="time">time</label>
@ -44,40 +44,44 @@
<div class="main__background">
<div class="main__background--radius"></div>
</div>
<article>
<h2>What happened today?</h2>
<div class="main__inner">
<article>
<h2>What happened today?</h2>
<pre>uptime -s</pre>
<p>2024-03-18 07:51:34</p>
<span class="annotation fn-annotatation" level="1">
This is common, the fragility of these machines are more prominant than any cloud user expects. Partially because of scale, partially because a lot of labour that happen in datacenters just escapes us all when we want to just upload an image.
This is common, the
fragility of these machines are more prominant than any cloud user expects. Partially because of scale,
partially because a lot of labour that happen in datacenters just escapes us all when we want to just upload
an image.
</span>
<p>the ones below do not have the "right" annotation levels</p>
<pre>last_user_added</pre>
<p>Feb 29 15:08:48 chopchop useradd[8744]: new user: name=colord, UID=118, GID=130, home=/var/lib/colord, shell=/usr/sbin/nologin, from=/dev/pts/4
<span class="annotation fn-annotatation" level="1">
A level 1 annotation for last_user_added
</span>
<p>the ones below do not have the "right" annotation levels</p>
<pre>users_created_today</pre>
<p>-- No entries --
<pre>last_user_added</pre>
<p>Feb 29 15:08:48 chopchop useradd[8744]: new user: name=colord, UID=118, GID=130, home=/var/lib/colord, shell=/usr/sbin/nologin, from=/dev/pts/4
<span class="annotation fn-annotatation" level="1">
A level 1 annotation for users_created_today
</span>
<span class="annotation fn-annotatation" level="1">
A level 1 annotation for last_user_added
</span>
<pre>users_created_today</pre>
<p>-- No entries --
<span class="annotation fn-annotatation" level="1">
A level 1 annotation for users_created_today
</span>
<pre>list_active_services</pre>
<p> [ - ] alsa-utils
<pre>list_active_services</pre>
<p> [ - ] alsa-utils
[ - ] apparmor
[ + ] atop
[ + ] atopacct
@ -115,14 +119,14 @@
[ - ] uuidd
[ - ] x11-common
<span class="annotation fn-annotatation" level="1">
A level 1 annotation for list_active_services
</span>
<span class="annotation fn-annotatation" level="1">
A level 1 annotation for list_active_services
</span>
<pre>list_groups</pre>
<p>root:x:0:
<pre>list_groups</pre>
<p>root:x:0:
daemon:x:1:
bin:x:2:
sys:x:3:
@ -220,15 +224,15 @@ scanner:x:128:saned
saned:x:129:
colord:x:130:
<span class="annotation fn-annotatation" level="1">
A level 1 annotation for list_groups
</span>
<span class="annotation fn-annotatation" level="1">
A level 1 annotation for list_groups
</span>
<pre>list_package_installs</pre>
<p>2024-03-10 15:16:14 install libtk8.6:armhf <none> 8.6.13-2
<pre>list_package_installs</pre>
<p>2024-03-10 15:16:14 install libtk8.6:armhf <none> 8.6.13-2
2024-03-10 15:16:14 status half-installed libtk8.6:armhf 8.6.13-2
2024-03-10 15:16:15 install tk8.6-blt2.5:armhf <none> 2.5.3+dfsg-4.1
2024-03-10 15:16:15 status half-installed tk8.6-blt2.5:armhf 2.5.3+dfsg-4.1
@ -267,57 +271,58 @@ colord:x:130:
2024-03-15 09:55:52 status half-installed bat:armhf 0.22.1-4
2024-03-15 09:55:52 status not-installed bat:armhf <none>
<span class="annotation fn-annotatation" level="1">
A level 1 annotation for list_package_installs
</span>
<pre>list_package_upgrade</pre>
<p>
<span class="annotation fn-annotatation" level="1">
A level 1 annotation for list_package_upgrade
</span>
<pre>list_package_remove</pre>
<p>2024-03-15 09:55:52 startup packages remove
<span class="annotation fn-annotatation" level="1">
A level 1 annotation for list_package_installs
</span>
<pre>list_package_upgrade</pre>
<p>
<span class="annotation fn-annotatation" level="1">
A level 1 annotation for list_package_upgrade
</span>
<pre>list_package_remove</pre>
<p>2024-03-15 09:55:52 startup packages remove
2024-03-15 09:55:52 remove bat:armhf 0.22.1-4 <none>
<span class="annotation fn-annotatation" level="1">
A level 1 annotation for list_package_remove
</span>
<pre>device_info</pre>
<p>Raspberry Pi 4 Model B Rev 1.4
<span class="annotation fn-annotatation" level="1">
A level 1 annotation for device_info
</span>
<pre>debian_version</pre>
<p>12.1
<span class="annotation fn-annotatation" level="1">
A level 1 annotation for debian_version
</span>
<pre>kernel_version</pre>
<p>Linux chopchop 6.1.65-v8+ #1703 SMP PREEMPT Tue Dec 5 16:25:41 GMT 2023 aarch64 GNU/Linux
<span class="annotation fn-annotatation" level="1">
A level 1 annotation for kernel_version
</span>
</article>
<span class="annotation fn-annotatation" level="1">
A level 1 annotation for list_package_remove
</span>
<pre>device_info</pre>
<p>Raspberry Pi 4 Model B Rev 1.4
<span class="annotation fn-annotatation" level="1">
A level 1 annotation for device_info
</span>
<pre>debian_version</pre>
<p>12.1
<span class="annotation fn-annotatation" level="1">
A level 1 annotation for debian_version
</span>
<pre>kernel_version</pre>
<p>Linux chopchop 6.1.65-v8+ #1703 SMP PREEMPT Tue Dec 5 16:25:41 GMT 2023 aarch64 GNU/Linux
<span class="annotation fn-annotatation" level="1">
A level 1 annotation for kernel_version
</span>
</article>
</div>
</main>
<aside>
@ -331,24 +336,24 @@ colord:x:130:
<script type="text/javascript" src="script.js"></script>
<script type="text/javascript">
window.addEventListener("DOMContentLoaded", function() {
var nextDate = new Date("2024-03-18 19:04:58.608504");
var now = new Date();
var ms = nextDate - now;
console.log("start a timeout in , ", ms);
if(ms > 0) {
window.setTimeout(function() {
// TODO: add a check if there is still an internet connection
// TODO: add a check if there is actually new content?
// TODO: think about server time vs. client time
window.location.reload(true);
}, ms + 10000);
}
});
</script>
<script type="text/javascript">
window.addEventListener("DOMContentLoaded", function () {
var nextDate = new Date("2024-03-18 19:18:13.903913");
var now = new Date();
var ms = nextDate - now;
console.log("start a timeout in , ", ms);
if (ms > 0) {
window.setTimeout(function () {
// TODO: add a check if there is still an internet connection
// TODO: add a check if there is actually new content?
// TODO: think about server time vs. client time
window.location.reload(true);
}, ms + 10000);
}
});
</script>
</body>
</html>

@ -7,7 +7,7 @@
@font-face {
font-family: "CascadiaCode VTT";
font-weight: normal;
src: local("CascadiaCode VTT"), url("fonts/Cascadia/otf/CascadiaCode-Regular.otf") format("opentype"), url("fonts/Cascadia/woff2/CascadiaCode-Regular.woff2") format("woff2");
src: local("CascadiaCode VTT"), url("fonts/Cascadia/otf/CascadiaCode-Light.otf") format("opentype"), url("fonts/Cascadia/woff2/CascadiaCode-Light.woff2") format("woff2");
}
@font-face {
@ -16,6 +16,11 @@
src: local("CascadiaCode VTT"), url("fonts/Cascadia/otf/CascadiaCode-Bold.otf") format("opentype"), url("fonts/Cascadia/woff2/CascadiaCode-Bold.woff2") format("woff2");
}
/*
TODO:
- fallback fonts
*/
:root {
--background: #d1d1d1;
--slider-height: 1.5rem;
@ -65,10 +70,15 @@ h1 {
main {
grid-area: main;
overflow: auto;
overflow: hidden;
position: relative;
}
.main__inner {
overflow: auto;
height: 100%;
}
.main__background,
.main__background--radius {
position: absolute;
@ -83,9 +93,11 @@ main {
border-bottom-right-radius: 60%;
}
article h1, article h2, article h3 {
margin-top: 1rem;
margin-bottom: .5rem;
article h1,
article h2,
article h3 {
margin-top: 1rem;
margin-bottom: 0.5rem;
}
header {
@ -108,13 +120,25 @@ nav {
}
article {
max-width: 500px;
max-width: 700px;
width: calc(100% - 2rem);
margin: 2rem auto;
overflow-x:hidden;
overflow-x: hidden;
color: var(--text-color-light);
display: flex;
flex-direction: column;
font-family: "CascadiaCode VTT";
}
article p,
article pre {
margin: 0 0;
font-size: 14px;
line-height: 1.5;
}
article pre {
color: green;
}
footer {
@ -137,23 +161,21 @@ nav label {
}
.annotation {
background-color: white;
color: black;
width: auto;
max-height: 0px;
overflow: hidden;
display: inline-block;
clear:both;
transition: 1s linear max-height;
font-family: CascadiaCode VTT, monospace;
font-size: 14px;
padding: 0px 2px;
font-weight: lighter;
background-color: white;
color: black;
width: auto;
max-height: 0px;
overflow: hidden;
display: inline-block;
clear: both;
transition: 1s linear max-height;
font-family: "DuctusRegular";
padding: 0px 2px;
font-weight: lighter;
}
.annotation.visible {
max-height: 99px;
max-height: 99px;
}
.slider--left label {
@ -176,14 +198,14 @@ input[type="range"] {
overflow: hidden;
border-radius: 1rem;
border: 1px solid black;
transition: .2s linear;;
transition: 0.2s linear;
}
input[type="range"]::-webkit-slider-runnable-track {
height: var(--slider-height);
background: var(--background);
border-radius: 1rem;
transition: .2s linear;;
transition: 0.2s linear;
}
input[type="range"]::-moz-range-track {

@ -44,122 +44,127 @@
<div class="main__background">
<div class="main__background--radius"></div>
</div>
<article>
<h2>What happened today?</h2>
<div class="main__inner">
<article>
<h2>What happened today?</h2>
<pre>uptime -s</pre>
<p>{{ since_last_boot }}</p>
{% if since_last_boot is defined %}
<span class="annotation fn-annotatation" level="1">
{% if days_since_last_boot|int > 15 %}This is unusual, we are used to ...{% else %}This is common, the fragility of these machines are more prominant than any cloud user expects. Partially because of scale, partially because a lot of labour that happen in datacenters just escapes us all when we want to just upload an image.{% endif %}
{% if days_since_last_boot|int > 15 %}This is unusual, we are used to ...{% else %}This is common, the
fragility of these machines are more prominant than any cloud user expects. Partially because of scale,
partially because a lot of labour that happen in datacenters just escapes us all when we want to just upload
an image.{% endif %}
</span>
{% endif %}
<p>the ones below do not have the "right" annotation levels</p>
<pre>last_user_added</pre>
<p>{{last_user_added}}
{% if last_user_added is defined %}
<span class="annotation fn-annotatation" level="1">
A level 1 annotation for last_user_added
</span>
{% else %}
(no input)
{% endif %}
<pre>users_created_today</pre>
<p>{{users_created_today}}
{% if users_created_today is defined %}
<span class="annotation fn-annotatation" level="1">
A level 1 annotation for users_created_today
</span>
{% else %}
(no input)
{% endif %}
<pre>list_active_services</pre>
<p>{{list_active_services}}
{% if list_active_services is defined %}
<span class="annotation fn-annotatation" level="1">
A level 1 annotation for list_active_services
</span>
{% else %}
(no input)
{% endif %}
<pre>list_groups</pre>
<p>{{list_groups}}
{% if list_groups is defined %}
<span class="annotation fn-annotatation" level="1">
A level 1 annotation for list_groups
</span>
{% else %}
(no input)
{% endif %}
<pre>list_package_installs</pre>
<p>{{list_package_installs}}
{% if list_package_installs is defined %}
<span class="annotation fn-annotatation" level="1">
A level 1 annotation for list_package_installs
</span>
{% else %}
(no input)
{% endif %}
<pre>list_package_upgrade</pre>
<p>{{list_package_upgrade}}
{% if list_package_upgrade is defined %}
<span class="annotation fn-annotatation" level="1">
A level 1 annotation for list_package_upgrade
</span>
{% else %}
(no input)
{% endif %}
<pre>list_package_remove</pre>
<p>{{list_package_remove}}
{% if list_package_remove is defined %}
<span class="annotation fn-annotatation" level="1">
A level 1 annotation for list_package_remove
</span>
{% else %}
(no input)
{% endif %}
<pre>device_info</pre>
<p>{{device_info}}
{% if device_info is defined %}
<span class="annotation fn-annotatation" level="1">
A level 1 annotation for device_info
</span>
{% else %}
(no input)
{% endif %}
<pre>debian_version</pre>
<p>{{debian_version}}
{% if debian_version is defined %}
<span class="annotation fn-annotatation" level="1">
A level 1 annotation for debian_version
</span>
{% else %}
(no input)
{% endif %}
<pre>kernel_version</pre>
<p>{{kernel_version}}
{% if kernel_version is defined %}
<span class="annotation fn-annotatation" level="1">
A level 1 annotation for kernel_version
</span>
{% else %}
(no input)
{% endif %}
</article>
<p>the ones below do not have the "right" annotation levels</p>
<pre>last_user_added</pre>
<p>{{last_user_added}}
{% if last_user_added is defined %}
<span class="annotation fn-annotatation" level="1">
A level 1 annotation for last_user_added
</span>
{% else %}
(no input)
{% endif %}
<pre>users_created_today</pre>
<p>{{users_created_today}}
{% if users_created_today is defined %}
<span class="annotation fn-annotatation" level="1">
A level 1 annotation for users_created_today
</span>
{% else %}
(no input)
{% endif %}
<pre>list_active_services</pre>
<p>{{list_active_services}}
{% if list_active_services is defined %}
<span class="annotation fn-annotatation" level="1">
A level 1 annotation for list_active_services
</span>
{% else %}
(no input)
{% endif %}
<pre>list_groups</pre>
<p>{{list_groups}}
{% if list_groups is defined %}
<span class="annotation fn-annotatation" level="1">
A level 1 annotation for list_groups
</span>
{% else %}
(no input)
{% endif %}
<pre>list_package_installs</pre>
<p>{{list_package_installs}}
{% if list_package_installs is defined %}
<span class="annotation fn-annotatation" level="1">
A level 1 annotation for list_package_installs
</span>
{% else %}
(no input)
{% endif %}
<pre>list_package_upgrade</pre>
<p>{{list_package_upgrade}}
{% if list_package_upgrade is defined %}
<span class="annotation fn-annotatation" level="1">
A level 1 annotation for list_package_upgrade
</span>
{% else %}
(no input)
{% endif %}
<pre>list_package_remove</pre>
<p>{{list_package_remove}}
{% if list_package_remove is defined %}
<span class="annotation fn-annotatation" level="1">
A level 1 annotation for list_package_remove
</span>
{% else %}
(no input)
{% endif %}
<pre>device_info</pre>
<p>{{device_info}}
{% if device_info is defined %}
<span class="annotation fn-annotatation" level="1">
A level 1 annotation for device_info
</span>
{% else %}
(no input)
{% endif %}
<pre>debian_version</pre>
<p>{{debian_version}}
{% if debian_version is defined %}
<span class="annotation fn-annotatation" level="1">
A level 1 annotation for debian_version
</span>
{% else %}
(no input)
{% endif %}
<pre>kernel_version</pre>
<p>{{kernel_version}}
{% if kernel_version is defined %}
<span class="annotation fn-annotatation" level="1">
A level 1 annotation for kernel_version
</span>
{% else %}
(no input)
{% endif %}
</article>
</div>
</main>
<aside>
@ -172,24 +177,24 @@
<script type="text/javascript" src="script.js"></script>
<script type="text/javascript">
window.addEventListener("DOMContentLoaded", function() {
var nextDate = new Date("{{ next_report }}");
var now = new Date();
var ms = nextDate - now;
console.log("start a timeout in , ", ms);
if(ms > 0) {
window.setTimeout(function() {
// TODO: add a check if there is still an internet connection
// TODO: add a check if there is actually new content?
// TODO: think about server time vs. client time
window.location.reload(true);
}, ms + 10000);
}
});
</script>
<script type="text/javascript">
window.addEventListener("DOMContentLoaded", function () {
var nextDate = new Date("{{ next_report }}");
var now = new Date();
var ms = nextDate - now;
console.log("start a timeout in , ", ms);
if (ms > 0) {
window.setTimeout(function () {
// TODO: add a check if there is still an internet connection
// TODO: add a check if there is actually new content?
// TODO: think about server time vs. client time
window.location.reload(true);
}, ms + 10000);
}
});
</script>
</body>
</html>
Loading…
Cancel
Save