This commit is contained in:
christian 2024-05-04 23:47:07 +02:00
commit 0e710e80c3
5 changed files with 96 additions and 34 deletions

View File

@ -1,33 +1,3 @@
@tailwind base;
@tailwind components;
@tailwind utilities;
:root {
--foreground-rgb: 0, 0, 0;
--background-start-rgb: 214, 219, 220;
--background-end-rgb: 255, 255, 255;
}
@media (prefers-color-scheme: dark) {
:root {
--foreground-rgb: 255, 255, 255;
--background-start-rgb: 0, 0, 0;
--background-end-rgb: 0, 0, 0;
}
}
body {
color: rgb(var(--foreground-rgb));
background: linear-gradient(
to bottom,
transparent,
rgb(var(--background-end-rgb))
)
rgb(var(--background-start-rgb));
}
@layer utilities {
.text-balance {
text-wrap: balance;
}
}
@tailwind utilities;

View File

@ -1,4 +1,5 @@
import Weather from '../components/Weather'
import LocationSearch from '@/components/LocationSearch';
import WeatherNow from '../components/WeatherNow'
const location = {
latitude: '55.645519',
@ -8,8 +9,11 @@ const location = {
export default function Home() {
return (
<main>
<h1>The weather in Sluseholmen for the next 3 days</h1>
<Weather location={location}/>
<div className='block mx-auto max-w-4xl'>
<LocationSearch />
<h1>The weather in Sluseholmen for the next 3 days</h1>
<WeatherNow location={location}/>
</div>
</main>
);
}

View File

@ -0,0 +1,7 @@
export default async function LocationSearch() {
return (
<h1>yes yes yes</h1>
);
}

View File

81
components/WeatherNow.tsx Normal file
View File

@ -0,0 +1,81 @@
import { error } from "console";
interface Forecast {
coord: {
lon: number;
lat: number;
};
weather: {
id: number;
main: string;
description: string;
icon: string;
}[];
base: string;
main: {
temp: number;
feels_like: number;
temp_min: number;
temp_max: number;
pressure: number;
humidity: number;
sea_level: number;
grnd_level: number;
};
visibility: number;
wind: {
speed: number;
deg: number;
gust: number;
};
rain: {
onehour: number;
};
clouds: {
all: number;
};
dt: number;
sys: {
type: number;
id: number;
country: string;
sunrise: number;
sunset: number;
};
timezone: number;
id: number;
name: string;
cod: number;
}
interface LocationType {
latitude: string;
longtitude: string;
}
async function getForecast(location: LocationType): Promise<Forecast> {
const { latitude, longtitude } = location;
const appId = "546911d860cb81f16585f7973b394b70";
const res = await fetch(
`https://api.openweathermap.org/data/2.5/weather?lat=${latitude}&lon=${longtitude}&appid=${appId}`
);
if (!res.ok) {
throw new Error(`This is not great ${error}`);
}
return res.json();
}
export default async function WeatherNow(props: { location: LocationType }) {
const kelvin = 273.15;
const location = props.location;
const weather = await getForecast(location);
const temp = weather.main.temp - kelvin;
return (
<main>
<h1>Forecast</h1>
<p>{temp}</p>
<p></p>
</main>
);
}