From 889163af6a5704785dad98825277a4acdc3de949 Mon Sep 17 00:00:00 2001
From: Nikolaj Frey <nikolaj@dotdev.com.au>
Date: Mon, 10 Jul 2023 10:45:27 +1000
Subject: [PATCH] feat: main

---
 .../components/Thingtime/ThingtimeDemo.tsx    | 45 ++++++++++---------
 1 file changed, 23 insertions(+), 22 deletions(-)

diff --git a/remix/app/components/Thingtime/ThingtimeDemo.tsx b/remix/app/components/Thingtime/ThingtimeDemo.tsx
index 418b372..d30b562 100644
--- a/remix/app/components/Thingtime/ThingtimeDemo.tsx
+++ b/remix/app/components/Thingtime/ThingtimeDemo.tsx
@@ -1,40 +1,41 @@
-import React from 'react'
-import { Thingtime } from './Thingtime'
-import { Flex } from '@chakra-ui/react'
+import React from "react"
+import { Flex } from "@chakra-ui/react"
 
-export const ThingtimeDemo = props => {
+import { Thingtime } from "./Thingtime"
+
+export const ThingtimeDemo = (props) => {
   const thing = {
-    Suggestion: 'Press ctrl/cmd + P',
-    Name: 'thingtime',
+    Suggestion: "Press ctrl/cmd + P",
+    Name: "thingtime",
     Description: `
       Thing Time is a versatile online platform that empowers users to organize, customize, and manage different types of data. By generalizing the concept of social media feeds, Thing Time allows users to switch between various data schemas, essentially providing them with personalized feeds and organizational tools. It's like a combination of Facebook, Twitter, and Evernote, but with the user in control of what kind of data they want to see and manage. Whether it's social posts, marketplace listings, or personal notes, Thing Time puts the power of data organization and customization in the user’s hands.
     `,
-    'Image URL': 'https://google.com/images',
-    Price: '$100',
+    "Image URL": "https://google.com/images",
+    Price: "$100",
     QTY: 1,
     ID: 123,
     Nested: {
       data: {
         is: {
-          fun: "Isn't it?"
-        }
-      }
+          fun: "Isn't it?",
+        },
+      },
     },
-    Array: ['one', 'two', 'three'],
-    'Array of Objects': [
+    Array: ["one", "two", "three"],
+    "Array of Objects": [
       {
-        name: 'one'
+        name: "one",
       },
       {
-        name: 'two'
+        name: "two",
       },
       {
-        name: 'three'
-      }
+        name: "three",
+      },
     ],
-    '...unique1': "I'm unique",
-    '...unique2': "I'm unique",
-    '...unique3': "I'm unique"
+    "...unique1": "I'm unique",
+    "...unique2": "I'm unique",
+    "...unique3": "I'm unique",
   }
 
   const [demoThing, setDemoThing] = React.useState(thing)
@@ -46,8 +47,8 @@ export const ThingtimeDemo = props => {
   // return null
 
   return (
-    <Flex maxW='100%' pb={40}>
-      <Thingtime thing={demoThing}></Thingtime>
+    <Flex maxWidth="100%" paddingBottom={40}>
+      <Thingtime width="500px" thing={demoThing}></Thingtime>
     </Flex>
   )
 }