Quartz sync: Jun 19, 2025, 5:06 PM

content/index.md

@@ -9,7 +9,7 @@ title: Liz's Notebook
 > I go by the name <span class="h-card"><a href="http://liz.computer/" class="u-url u-uid"><img class="h-card" src="https://binarycdn.b-cdn.net/liz/smol-flopp.png" width="80" align="right"/>Liz Roboto</a></span> - some people know me as B. I'm a tech director, artist, casual gamer and CSS tinkerer. I love the small web, retro tech, travel, art, fashion, photography and currently working on a creative portfolio and digital garden. Please keep checking back for updates each week. Subscribe to my updated <a href="/index.xml">RSS feed</a>, sign my <a href="/guestbook/">guestbook</a>, or say hi via <a href="/about#contact/">email</a>)!
 > <br>
 
-> [!alert] Current Status
+<!-- > [!alert] Current Status
 > <script src="https://status.cafe/current-status.js?name=lizbytes" defer></script>
 > <div id="statuscafe"><div id="statuscafe-username"></div><div id="statuscafe-content"></div></div>
-> <br>
+> <br> -->

quartz.layout.ts

@@ -41,10 +41,10 @@ export const defaultContentPageLayout: PageLayout = {
     Component.Explorer(),
   ],
   right: [
-    Component.TableOfContents(),
+    Component.Status(),
     Component.Backlinks(),
     Component.Graph(),
-    // Component.DesktopOnly(Component.TableOfContents()),
+    Component.DesktopOnly(Component.TableOfContents()),
   ],
 }
 

quartz/components/Status.tsx

@@ -0,0 +1,10 @@
+export default (() => {
+  function Status() {
+    // return <p><h3>Current Status:</h3><div id="statuscafe"><div id="statuscafe-username"></div><div id="statuscafe-content"><script src="https://status.cafe/current-status.js?name=lizbytes" defer></script></div>
+    // </div>
+    // </p>    
+    return <p><script src="https://status.lol/binarydigit.js?time&fluent&pretty"></script></p>
+  }
+
+  return Status
+}) satisfies QuartzComponentConstructor

quartz/components/index.ts

@@ -23,6 +23,7 @@ import Breadcrumbs from "./Breadcrumbs"
 import Comments from "./Comments"
 import Flex from "./Flex"
 import ConditionalRender from "./ConditionalRender"
+import Status from "./Status"
 
 export {
   ArticleTitle,
@@ -50,4 +51,5 @@ export {
   Comments,
   Flex,
   ConditionalRender,
+  Status,
 }