jtpmcdevitt/web_next
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

made changes in some files

Browse source
This commit is contained in:
Juthatip McDevitt 2024-03-22 14:27:43 -05:00
parent 2b26060093
commit 78fe037e63
7 changed files with 19 additions and 10 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

1
weather_app/app/components/airPollution/AirPollution.tsx
View file

@ -17,6 +17,7 @@ const AirPollution = () => {
const filterAQI = air_QualityIndex.find((item) => { const filterAQI = air_QualityIndex.find((item) => {
return item.rating === airQualityIndex; return item.rating === airQualityIndex;
}) })
console.log(airQualityIndex)
return ( return (

4
weather_app/app/components/daily_forcast/DailyForecast.tsx
View file

@ -9,7 +9,7 @@ import {
CarouselItem, CarouselItem,
} from "@/components/ui/carousel" } from "@/components/ui/carousel"
import moment from 'moment'; import moment from 'moment';
import { kelvinToCelsius } from '@/app/utils/Misc'; import { kelvinToFarenheit } from '@/app/utils/Misc';
const DailyForcast = () => { const DailyForcast = () => {
const {forecast, dailyForecast} = useGlobalContext(); const {forecast, dailyForecast} = useGlobalContext();
@ -58,7 +58,7 @@ const DailyForcast = () => {
return <CarouselItem key={forecast.dt_txt} className='flex flex-col gap-4 basis-[6rem] cursor-grab items-center'> return <CarouselItem key={forecast.dt_txt} className='flex flex-col gap-4 basis-[6rem] cursor-grab items-center'>
<p>{moment(forecast.dt_txt).format("hh:mm")}</p> <p>{moment(forecast.dt_txt).format("hh:mm")}</p>
<p>{getIcon()}</p> <p>{getIcon()}</p>
<p className='mt-4'>{kelvinToCelsius(forecast.main.temp)}°F </p> <p className='mt-4'>{kelvinToFarenheit(forecast.main.temp)}°F </p>
</CarouselItem> </CarouselItem>
}) })
} }

8
weather_app/app/components/temp/Temperature.tsx
View file

@ -1,6 +1,6 @@
"use client" "use client"
import { useGlobalContext } from '@/app/context/globalContext' import { useGlobalContext } from '@/app/context/globalContext'
import { kelvinToCelsius } from '@/app/utils/Misc'; import { kelvinToFarenheit } from '@/app/utils/Misc';
import { CloudIcon, CloudRainIcon, SnowflakeIcon, SunIcon, Zap } from 'lucide-react'; import { CloudIcon, CloudRainIcon, SnowflakeIcon, SunIcon, Zap } from 'lucide-react';
import { IoNavigateOutline } from "react-icons/io5"; import { IoNavigateOutline } from "react-icons/io5";
@ -13,9 +13,9 @@ const Temperature = () => {
if(!forecast || !weather){ if(!forecast || !weather){
return <div>Loading...</div> return <div>Loading...</div>
} }
const temp = kelvinToCelsius(main?.temp); const temp = kelvinToFarenheit(main?.temp);
const minTemp = kelvinToCelsius(main?.temp_min); const minTemp = kelvinToFarenheit(main?.temp_min);
const maxTemp = kelvinToCelsius(main?.temp_max); const maxTemp = kelvinToFarenheit(main?.temp_max);
//set time, day, weather //set time, day, weather
const [localTime, setLocalTime] = useState<String>(""); const [localTime, setLocalTime] = useState<String>("");

4
weather_app/app/components/uvIndex/UVI.tsx
View file

@ -54,11 +54,11 @@ const UVI = () => {
<h2 className='flex items-center gap-1 '><TbUvIndex />UV Index</h2> <h2 className='flex items-center gap-1 '><TbUvIndex />UV Index</h2>
<div className='flex items-center gap-1 pb-2 pt-6'> <div className='flex items-center gap-1 pb-2 pt-6'>
<p>{uvIndexMax}</p> <p>{uvIndexMax}</p>
<span className='text-xs'>({uvIndexScale(uvIndexMax).text})</span> <span>({uvIndexScale(uvIndexMax).text})</span>
</div> </div>
<Progress value={leftProgress} className='air-progress' max={12}/> <Progress value={leftProgress} className='air-progress' max={12}/>
</div> </div>
<p className='text-xs'>{uvIndexScale(uvIndexMax).desc}</p> <p>{uvIndexScale(uvIndexMax).desc}</p>
</div> </div>
) )
} }

2
weather_app/app/globals.css
View file

@ -76,5 +76,5 @@
} }
.air-progress{ .air-progress{
background-image: linear-gradient(to right, violet, indigo, blue, green, yellow, orange, red); background-image: linear-gradient(to right, green, yellow, orange, red, indigo, maroon);
} }

2
weather_app/app/layout.tsx
View file

@ -6,7 +6,7 @@ import { ThemeProvider } from "./providers/ThemeProvider";
const inter = Inter({ subsets: ["latin"] }); const inter = Inter({ subsets: ["latin"] });
export const metadata: Metadata = { export const metadata: Metadata = {
title: "Weather APP | Tempreture, Air Pollution...", title: "Weather & Forecasting APP | Tempreture, Air Pollution...",
description: "Openweather application", description: "Openweather application",
}; };

8
weather_app/app/page.tsx
View file

@ -1,9 +1,13 @@
import Navbar from "./components/Navbar"; import Navbar from "./components/Navbar";
import AirPollution from "./components/airPollution/AirPollution"; import AirPollution from "./components/airPollution/AirPollution";
import DailyForcast from "./components/daily_forcast/DailyForecast"; import DailyForcast from "./components/daily_forcast/DailyForecast";
import FeelLike from "./components/feelLike/FeelLike";
import Humidity from "./components/humidity/Humidity";
import Pressure from "./components/pressure/Pressure";
import Sunset from "./components/sunset/Sunset"; import Sunset from "./components/sunset/Sunset";
import Temperature from "./components/temp/Temperature"; import Temperature from "./components/temp/Temperature";
import UVI from "./components/uvIndex/UVI"; import UVI from "./components/uvIndex/UVI";
import Visibility from "./components/visibility/Visibility";
import Wind from "./components/wind/Wind"; import Wind from "./components/wind/Wind";
@ -22,6 +26,10 @@ export default function Home() {
<Wind/> <Wind/>
<DailyForcast/> <DailyForcast/>
<UVI/> <UVI/>
<FeelLike/>
<Humidity/>
<Visibility/>
<Pressure/>
</div> </div>
</div> </div>
</div> </div>