--gruvbox-green: #b8bb26;
--gruvbox-bg1: #7c6f64;
--gruvbox-bg2: #665c54;
-
}
.title {
table {
margin: 0 auto !important;
+ margin-bottom: 20px !important;
}
.hdlist1 {
- font-size: 1.3em;
+ /*font-size: 1.3em;*/
+ text-decoration: underline;
+}
+
+/* for list element definitions * *define-me*: */
+li strong {
+ /*text-decoration: underline;*/
+ border-radius: .2;
+ color: grey;
}
cite {
.checklist {
text-align: left;
- font-size: .8em;
}
-.checklist li ul { margin-left: 3%;
-}
+.checklist li ul { margin-left: 3%; }
#content, h1, pre {
border-radius: 8px !important;
padding-left: 2%;
}
+.sect1 {
+ padding-bottom: 0;
+}
+
.sect1 + .sect1 {
border-top: none !important;
}
text-shadow: 1px 1px 1px var(--gruvbox-black);
text-shadow: 3px 3px 3px var(--gruvbox-black);
text-shadow: 5px 5px 5px var(--gruvbox-blue);
+ border-bottom: solid;
*/
+ width: fit-content;
}
h3, h4, h5 {
}
h3 {
- color: var(--gruvbox-red) !important;
+ color: var(--gruvbox-green) !important;
+ opacity: 80%;
}
h4 {
margin: auto;
}
+.exampleblock >.content {
+ background: var(--gruvbox-black);
+ border-color: #e0e0dc;
+ box-shadow: 3px 2px 9px #e0e0dc;
+}
+
.center {
max-width: 500px;
display: flex;
width: 100%;
}
+/* ================= SCROLLBARS (WebKit) ================= */
+::-webkit-scrollbar {
+ width: 8px;
+}
+
+::-webkit-scrollbar-thumb {
+ background: var(--gruvbox-bg1);
+ border-radius: 4px;
+}
+
+::-webkit-scrollbar-track {
+ background: transparent;
+}
+
+div.ulist {
+ max-width: 95%;
+}
+
+.paragraph {
+ max-width: 98%;
+}
+
+.todo-list li .checkbox {
+ display: inline-block; /* already set */
+ width: 1.5em; /* fixed width */
+ height: 1.5em; /* keep height same */
+ margin-right: 0.5em;
+ vertical-align: middle; /* align with text nicely */
+ text-align: center;
+}
+
+li.started .checkbox {
+ color: var(--gruvbox-yellow);
+}
+
+li.completed .checkbox {
+ color: var(--gruvbox-green);
+}
+
+li.empty .checkbox {
+ color: var(--gruvbox-red);
+}
+
+.todo-list li {
+ font-family: "inherit"; /* inherits whatever body is using */
+ line-height: 1.4em; /* optional: keep spacing nice */
+}
+
+ul.checklist li p {
+ font-size: 1.2em; /* same as body text */
+}
+
+
+
+
+div#header {
+ background-color: var(--gruvbox-blue);
+ height: 100px;
+ top: 0px;
+ background-color: var(--gruvbox-black);
+ z-index: 1000;
+}
+
</style>
</head>
-<script src="docinfo.js"></script>
+<script>
+function sendHeight() {
+ const height = document.documentElement.scrollHeight;
+ parent.postMessage({ type: "HEIGHT", height }, "*");
+}
+
+window.addEventListener("load", sendHeight);
+window.addEventListener("resize", sendHeight);
+
+/*
+document.addEventListener("keydown", (e) => {
+ if (e.key === "o") {
+ e.preventDefault();
+ parent.postMessage({ type: "CLOSE_NOTES" }, "*");
+ }
+});
+*/
+let scrollKeys = { j: false, k: false };
+let isScrolling = false;
+const SCROLL_SPEED = 10; // pixels per frame
+
+function scrollStep() {
+ let delta = 0;
+ if (scrollKeys.j) delta += SCROLL_SPEED;
+ if (scrollKeys.k) delta -= SCROLL_SPEED;
+
+ if (delta !== 0) {
+ window.scrollBy(0, delta);
+ requestAnimationFrame(scrollStep);
+ } else {
+ isScrolling = false;
+ }
+}
+
+document.addEventListener("keydown", (e) => {
+ const tag = document.activeElement.tagName;
+ if (tag === "INPUT" || tag === "TEXTAREA" || document.activeElement.isContentEditable) return;
+
+ if (e.key === "j" || e.key === "k") {
+ e.preventDefault();
+ scrollKeys[e.key] = true;
+
+ if (!isScrolling) {
+ isScrolling = true;
+ requestAnimationFrame(scrollStep);
+ }
+ }
+ if(e.key === "o") {
+ e.preventDefault();
+ parent.postMessage({ type: "CLOSE_NOTES" }, "*");
+ }
+});
+
+document.addEventListener("keyup", (e) => {
+ if (e.key === "j" || e.key === "k") {
+ scrollKeys[e.key] = false;
+ }
+});
+
+
+
+window.onload = function () {
+
+ // Select all checklist ULs
+ document.querySelectorAll('ul.checklist').forEach(function(ul) {
+ ul.classList.add('todo-list');
+
+ ul.querySelectorAll('li').forEach(function(li) {
+ const p = li.querySelector('p');
+ if (!p) return;
+
+ const text = p.textContent.trim();
+
+ let state = '';
+ if (text.startsWith('❏')) {
+ state = 'empty';
+ } else if (text.startsWith('✓')) {
+ state = 'started';
+ } else if (text.startsWith('[X]')) {
+ state = 'completed';
+ } else {
+ return;
+ }
+
+ li.classList.add(state);
+
+ // Remove the marker
+ let content = '';
+ if (state === 'completed') {
+ content = text.slice(3).trim();
+ } else {
+ content = text.slice(1).trim();
+ }
+
+ // Only rewrite the first <p>, keep nested divs/lists intact
+ p.innerHTML = '';
+ const checkbox = document.createElement('span');
+ checkbox.className = 'checkbox';
+ /*
+ if (state === 'empty') checkbox.textContent = '🌑';
+ else if (state === 'started') checkbox.textContent = '🌓';
+ else if (state === 'completed') checkbox.textContent = '🌕';
+ */
+ if (state === 'empty') checkbox.textContent = '☐';
+ else if (state === 'started') checkbox.textContent = '◪';
+ else if (state === 'completed') checkbox.textContent = '▣';
+
+ p.appendChild(checkbox);
+ p.appendChild(document.createTextNode(' ' + content));
+ });
+});
+
+};
+window.addEventListener("load", e => {
+ // Request the scroll position as soon as the iframe is loaded
+ window.parent.postMessage({
+ type: "SCROLL_REQUEST_GET"
+ }, "*");
+});
+
+// Capture scroll position while scrolling
+window.addEventListener("scroll", e => {
+ const scrollPosition = window.scrollY || document.documentElement.scrollTop;
+ window.parent.postMessage({
+ type: "SCROLL_REQUEST_SET",
+ scrollPosition: scrollPosition
+ }, "*");
+});
+
+// Receive messages to set the scroll position
+window.addEventListener("message", (e) => {
+ if (e.data.type === "SCROLL_POSITION") {
+ // Set the scroll position to the iframe
+ window.scrollTo(0, e.data.scrollPosition);
+ }
+});
+</script>
</head>
<body class="article">
<div id="header">
projects / tst.git / commitdiff