limit width, ensure body is max min height

This commit is contained in:
2024-10-16 01:16:38 -05:00
parent 54268297df
commit 30d9d96838
2 changed files with 5 additions and 3 deletions

View File

@@ -10,7 +10,7 @@
<title>App</title>
</head>
<body>
<div id="root"></div>
<div id="root" class="min-w-full min-h-screen"></div>
<script src="/src/index.tsx" type="module"></script>
</body>
</html>

View File

@@ -4,7 +4,7 @@ const backendUrl = import.meta.env.PROD ? '/api' : `http://${import.meta.env.VIT
const Code = (props: JSX.IntrinsicElements['code']) => (
<code
className="border-1 2py-1 rounded border border-pink-500 bg-neutral-100 px-1 font-mono font-light text-pink-500 dark:border-pink-400 dark:bg-neutral-700 dark:text-pink-400"
className="border-1 mx-1 2py-1 rounded border border-pink-500 bg-neutral-100 px-1 font-mono font-light text-pink-500 dark:border-pink-400 dark:bg-neutral-700 dark:text-pink-400"
{...props}
/>
);
@@ -38,7 +38,8 @@ export default function App() {
}, []);
return (
<div className="mx-auto my-8 mt-10 w-8/12 rounded border border-gray-200 p-4 shadow-md dark:border-neutral-600 dark:bg-neutral-800 dark:shadow-none">
<div className="min-w-full min-h-full">
<div className="mx-auto max-w-md my-8 mt-10 w-8/12 rounded border border-gray-200 p-4 shadow-md dark:border-neutral-600 dark:bg-neutral-800 dark:shadow-none">
<h1 className="mb-4 text-4xl">LinkPulse</h1>
<p className="mx-4 my-2">
The current time is: <Code>{time || 'N/A'}</Code>
@@ -47,5 +48,6 @@ export default function App() {
Your IP address is: <Code>{clientIp || 'N/A'}</Code>
</p>
</div>
</div>
);
}