From 360dfca18ef7e95871080052d2260903b4ed46bd Mon Sep 17 00:00:00 2001
From: saberzero1 <github@emilebangma.com>
Date: Thu, 26 Feb 2026 19:16:02 +0100
Subject: [PATCH] fix: view classes

---
 quartz/components/DesktopOnly.tsx | 6 +++++-
 quartz/components/MobileOnly.tsx  | 6 +++++-
 2 files changed, 10 insertions(+), 2 deletions(-)

diff --git a/quartz/components/DesktopOnly.tsx b/quartz/components/DesktopOnly.tsx
index ee80137be..b163eb9d5 100644
--- a/quartz/components/DesktopOnly.tsx
+++ b/quartz/components/DesktopOnly.tsx
@@ -3,7 +3,11 @@ import { QuartzComponent, QuartzComponentConstructor, QuartzComponentProps } fro
 export default ((component: QuartzComponent) => {
   const Component = component
   const DesktopOnly: QuartzComponent = (props: QuartzComponentProps) => {
-    return <Component displayClass="desktop-only" {...props} />
+    return (
+      <div class="desktop-only">
+        <Component {...props} />
+      </div>
+    )
   }
 
   DesktopOnly.displayName = component.displayName
diff --git a/quartz/components/MobileOnly.tsx b/quartz/components/MobileOnly.tsx
index 29958cf0c..2c108358e 100644
--- a/quartz/components/MobileOnly.tsx
+++ b/quartz/components/MobileOnly.tsx
@@ -3,7 +3,11 @@ import { QuartzComponent, QuartzComponentConstructor, QuartzComponentProps } fro
 export default ((component: QuartzComponent) => {
   const Component = component
   const MobileOnly: QuartzComponent = (props: QuartzComponentProps) => {
-    return <Component displayClass="mobile-only" {...props} />
+    return (
+      <div class="mobile-only">
+        <Component {...props} />
+      </div>
+    )
   }
 
   MobileOnly.displayName = component.displayName