feat: studio-clock-obs block

resir014 · Jan 19, 2025 · a6eee1f · a6eee1f
1 parent 50eb266
commit a6eee1f
Show file tree

Hide file tree

Showing 2 changed files with 24 additions and 6 deletions.
diff --git a/src/modules/studio-clock/index.astro b/src/modules/studio-clock/index.astro
@@ -7,7 +7,12 @@ import {
 } from './components/studio-clock-interface';
 import Document from '../_document.astro';
 
+type Props = {
+  isFullScreen?: boolean;
+};
+
 const { searchParams } = Astro.url;
+const { isFullScreen } = Astro.props;
 
 const clockProps: StudioClockInterfaceProps = {
   uiFont: parseString(searchParams.get('uiFont')),
@@ -18,12 +23,20 @@ const clockProps: StudioClockInterfaceProps = {
 
 <Document>
   <OverlayWrapper>
-    <div>
-      <StudioClockInterface {...clockProps} client:only="react">
-        <slot name="fallback">
-          <StudioClockInterface {...clockProps} />
-        </slot>
-      </StudioClockInterface>
+    <div
+      class:list={[
+        ...(isFullScreen
+          ? ['flex w-full h-screen items-center justify-center bg-chungking-black']
+          : []),
+      ]}
+    >
+      <div class:list={[...(isFullScreen ? ['scale-50'] : [])]}>
+        <StudioClockInterface hideTimezone={isFullScreen} {...clockProps} client:only="react">
+          <slot name="fallback">
+            <StudioClockInterface hideTimezone={isFullScreen} {...clockProps} />
+          </slot>
+        </StudioClockInterface>
+      </div>
     </div>
   </OverlayWrapper>
 </Document>
diff --git a/src/pages/blocks/studio-clock-obs.astro b/src/pages/blocks/studio-clock-obs.astro
@@ -0,0 +1,5 @@
+---
+import StudioClockPage from '~/@studio-clock/index.astro';
+---
+
+<StudioClockPage isFullScreen />