styling improvement
This commit is contained in:
parent
2b7fe2015c
commit
51efe04caa
|
@ -94,8 +94,8 @@ export default function Index() {
|
|||
const data = useLoaderData();
|
||||
|
||||
return (
|
||||
<div className="container mx-auto">
|
||||
<header className="flex w-full items-center justify-between border-b p-4">
|
||||
<div className="container mx-auto flex min-h-screen flex-col">
|
||||
<header className="flex w-full flex-col items-center justify-between rounded-b-2xl border-b bg-slate-50 px-12 py-4 text-center md:flex-row">
|
||||
<h1 className="text-2xl tracking-tighter">Maakunta ranking</h1>
|
||||
{data.me ? (
|
||||
<div className="flex flex-col items-center justify-center">
|
||||
|
@ -166,7 +166,7 @@ export default function Index() {
|
|||
""
|
||||
)}
|
||||
{data.countyData.length > 0 ? (
|
||||
<ul className="flex items-center justify-center p-4">
|
||||
<ul className="flex flex-grow flex-col items-center justify-center p-4 md:flex-row">
|
||||
{data.countyData.map((county) => (
|
||||
<li
|
||||
className="m-4 flex w-full max-w-md flex-col space-y-2 rounded border p-4 text-black shadow-lg"
|
||||
|
@ -198,7 +198,7 @@ export default function Index() {
|
|||
))}
|
||||
</ul>
|
||||
) : (
|
||||
<h1 className="p-6 text-center text-4xl">No data yet</h1>
|
||||
<h1 className="flex-grow p-6 text-center text-4xl">No data yet</h1>
|
||||
)}
|
||||
</div>
|
||||
);
|
||||
|
|
Loading…
Reference in New Issue