minecraft theme weather app
- 17 Devlogs
- 25 Total hours
i am learning HTML,java script and CSS for the first time and i am trying to build a weather app
i am learning HTML,java script and CSS for the first time and i am trying to build a weather app
devlog#17
i have added i 5-day weather forecast it displays the temperature and weather condition for the next five days for the city entered,when you click on the forecast the background changes to a brick wall so that it looks good when you scroll down
devlog#16
i have fixed some bugs in my app, it showed random cities when you entered random numbers that is now fixed and now i am currently drawing different backgrounds which will be displayed according to the temperature for example if the temperature is higher than 30 degrees it will display a desert biome and if the temperature is below 10 degrees it will display a snow biome and if the temperature is above 10 and below 30 degrees it will display a normal grass biome. the picture below is the normal grass biome it is almost complete i just have to fix some things on it then i will draw the other biome backgrounds
devlog#15
i have now added the clock icon from minecraft beside the time
devlog#14
i have now changed my cursor to a diamond sword from minecraft to make it more minecraft themed
devlog#13
now my weather app also displays the real time of the city or place which is entered i have also changed the drizzle weather icon
devlog#12
now i have changed the mist weather icon now only the drizzle icon is left then I’ll fix the droplet(humidity icon) then maybe ill change the background to a minecraft biome or I’ll set conditions to change the background according to the temperature for example if the temperature is cold and freezing ill make a condition to display the snow biome in the background
devlog#11
i have now replaced the rain weather icon . this time i made the clouds a little different and boxy, i want y’all to tell me if they look good and if i should replace the old clouds which i drew for the other weather icons with the clouds that i drew right now
devlog#10
i have now replaced the snow weather icon with a snow ball which is inside the game minecraft. in the screenshot its not actually snowing in new jersey i just set the code to display the snow icon in every city because i could not find any city where it was snowing and i had to see how the icon looked :))
devlog#9
now i have changed the icons for wind speed and humidity percentage which are displayed at the bottom
devlog#8
now i have customized the cloudy weather icon . i didnt draw the actual clouds which are in the game because they did not look good so i just made normal clouds
devlog#7
i have now also changed the search icon
devlog#6
i have replaced the sun weather icon with the minecraft sun which i drew in libresprite and also added a glow affect. now i am going to customize the other remaining weather icons in minecraft themeand then i will ship this project
devlog#5
i have now changed the color of the search bar and the shape of the search button i have also added a minecraft click sound effect when you press enter or when you click the search button
devlog#4
i created a stone brick wall in libresprite for the background now i am going to customize the icons also and i am also thinking of adding a sound affect when you press enter or click the search icon
devlog#3
after completing my weather app i planned to change how it looked and up til now i have changed its font to mojangles which is the minecraft font now i will change its back ground and weather icons to minecraft theme. i will be making them in libresprite
devlog#2
i have completed my weather app. now if you load the app on the browser it displays the search bar. the app displays the temperature of the place its wind speed and its humidity percentage. the icons/images of the clouds change according to the weather of the place. it also displays an error message “invalid city name” when a wrong city name is entered and it is also displayed when a wrong spelling is entered. now i am planning to change the font and overall look of the webpage by creating custom assets and artwork
devlog#1
i am learning css,html and js for the first time and so far i have made a search bar for the weather app for which i made a style.css file and a index.html file . i have made the search bar to have a gradient and also added a search icon. also added search bar prompt text inside the search bar.