This commit is contained in:
2023-08-30 16:24:17 -04:00
parent ac0ecdff5e
commit 0c930a24ea
8 changed files with 34 additions and 10 deletions

View File

@@ -7,12 +7,20 @@ import '@fortawesome/fontawesome-svg-core/styles.css';
import { config } from '@fortawesome/fontawesome-svg-core';
config.autoAddCss = false; /* eslint-disable import/first */
import 'styles/globals.css';
import Link from 'next/link';
export default function RootLayout({ children }: { children: React.ReactNode }) {
return (
<html lang="en">
<link rel="stylesheet" href="https://unpkg.com/leaflet@1.0.1/dist/leaflet.css" />
<head>
<title>Aviation Weather</title>
</head>
<body className='bg-gray-600'>
<div className="flex justify-between bg-gray-700 px-4 py-1 sm:px-6 select-none">
<h3 className="text-lg font-bold leading-6 text-gray-200">Aviation Weather</h3>
<Link className='text-base text-gray-200' href={'/profile'}>Profile</Link>
</div>
<RecoilRootWrapper>{children}</RecoilRootWrapper>
</body>
</html>

View File

@@ -26,9 +26,6 @@ export default function Page() {
return <>
<div className="bg-gray-700 px-4 py-1 sm:px-6">
<h3 className="text-lg font-bold leading-6 text-gray-200">Metar Map</h3>
</div>
<div>
<Metar/>
</div>

3
src/app/user/page.tsx Normal file
View File

@@ -0,0 +1,3 @@
export default function Profile() {
}

View File

@@ -4,6 +4,7 @@ import { Metar } from '@/js/weather';
import { faArrowsSpin, faLocationArrow, faLocationPin } from '@fortawesome/free-solid-svg-icons';
import { FontAwesomeIcon } from '@fortawesome/react-fontawesome';
import { DivIcon } from 'leaflet';
import Link from 'next/link';
import { useEffect, useState } from 'react';
import ReactDOMServer from 'react-dom/server';
import { MapContainer, Marker, Popup, TileLayer, Tooltip, useMapEvents } from 'react-leaflet';
@@ -117,9 +118,9 @@ function MapTiles({ airports }: {airports: Airport[] }) {
<Tooltip className='metar-tooltip' direction="top" offset={[5, -5]} opacity={1}>{airport.icao}</Tooltip>
<Popup>
<div className="min-w-0 flex-1 select-none">
{/* <Link href={`/airport/${airport.icao}`}> */}
<h1 className="text-lg text-gray-900 pb-1"><span className='font-semibold'>{airport.icao}</span> {airport.name}</h1>
{/* </Link> */}
<Link href={`/airport/${airport.icao}`}>
<h1 className="text-base text-gray-900 pb-1"><span className='font-semibold'>{airport.icao}</span> {airport.name}</h1>
</Link>
<hr/>
<p className='text-sm font-medium text-gray-500'>{airport.metar?.raw_text}</p>
<div className='mt-2 flex'>