Skip to content

Amanda & Stacy D. - #62

Open
amandajones1996 wants to merge 12 commits into
Ada-C19:mainfrom
amandajones1996:main
Open

Amanda & Stacy D. #62
amandajones1996 wants to merge 12 commits into
Ada-C19:mainfrom
amandajones1996:main

Conversation

@amandajones1996

Copy link
Copy Markdown

No description provided.

Comment thread index.html
Comment on lines +13 to +29
<h1 class="header" id = "header_id1"> Today's Weather Report </h1>
<h3 class="header" id = "header_id2"> For The Lovely City of <span id = "header-city">Atlanta</span></h3>
<h4 id="temp">Temperature</h4>
<button id="up">&#11014;</button>
<p id="temperature-now"></p>
<button id="down">&#11015;</button>
<button id="real-time-temp">Get Real Time Temperature</button>
<form id="cityinput">
City:
<input id ="city" type="text" placeholder="Enter a city"/>
</form>
<button id="defaultCity">Reset</button>
<h4 id="garden"></h4>
<!-- <span </span id="sky"></span> -->
<span </span id="weather-garden"></span>
<h4 id="sky"></h4>
<select id="sky-drop-down">

Copy link
Copy Markdown

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Markup looks great!

Comment thread index.html
Comment on lines +30 to +35
<option value="Sunny">Choose Your Sky</option>
<option value="Sunny">Sunny</option>
<option value="Cloudy">Cloudy</option>
<option value="Snowy">Snowy</option>
<option value="Rainey">Rainy</option>
</select>

Copy link
Copy Markdown

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

👍🏾

Comment thread src/index.js
Comment on lines +2 to +14
const state = {
temperature: 1,
upButton: null,
downButton: null,
tempDisplay: 10,
city: null,
headerCity: null,
weatherGarden: null,
skyDropDown: null,
sky: null,
defaultCity: null,
realTimeTemp : null
};

Copy link
Copy Markdown

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Great job creating state!

Comment thread src/index.js
Comment on lines +82 to +89
const accessLocation = () => {
axios.get(`http://127.0.0.1:5000/location?q=${state.headerCity.textContent}`).then(resp => {
let lat = resp.data[0]["lat"]
let lon = resp.data[0]["lon"]
accessWeather(lat, lon);
})
.catch(error => console.log(error))
};

Copy link
Copy Markdown

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Great function naming, this looks really clean 💯

Comment thread src/index.js
console.log(resp.data["main"]["temp"])
state.temperature = kelvinToFarenheit(resp.data["main"]["temp"])
state.tempDisplay.innerText = state.temperature
changeTemp();

Copy link
Copy Markdown

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

👍🏾

Comment thread src/index.js
Comment on lines +105 to +127
const changeTemp = () => {
if (state.temperature >= 80) {
state.tempDisplay.style.color = "rgb(252, 115 , 115)";
state.weatherGarden.textContent = "🌵__🐍_🦂_🌵🌵__🐍_🏜_🦂";
document.body.style.backgroundColor = "rgb(255, 194 , 185)"
} else if (state.temperature >= 70) {
state.tempDisplay.style.color = "rgb(229, 114, 0)";
state.weatherGarden.textContent = "🌸🌿🌼__🌷🌻🌿_☘️🌱_🌻🌷";
document.body.style.backgroundColor = "rgb(252, 179 , 137)"
} else if (state.temperature >= 60) {
state.tempDisplay.style.color = "rgb(255, 217, 0)";
state.weatherGarden.textContent = "🌾🌾_🍃_🪨__🛤_🌾🌾🌾_🍃";
document.body.style.backgroundColor = "rgb(255, 253, 179)"
} else if (state.temperature >= 50) {
state.tempDisplay.style.color = "green";
state.weatherGarden.textContent = "🌲🌲⛄️🌲⛄️🍂🌲🍁🌲🌲⛄️🍂🌲";
document.body.style.backgroundColor = "rgb(204, 250, 192)"
} else {
state.tempDisplay.style.color = "teal";
state.weatherGarden.textContent = "🌲🌲⛄️🌲⛄️🍂🌲🍁🌲🌲⛄️🍂🌲";
document.body.style.backgroundColor = "rgb(192, 246, 250)"
}
};

Copy link
Copy Markdown

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Your conditional comprehension is very strong

Comment thread styles/index.css
Comment on lines +2 to +24
body{
display: grid;
height: 100vh;
width: 100vw;
grid-template: 12.5% 12.5% 9.375% 9.375% 9.375% 9.375% 9.375% 9.375% 9.375% 9.375% / 20% 20% 20% 20% 20%;
/* border-radius: 100px; */
border-style: solid;
padding: 10px;
border: 10px;
border-width: 10px;
border-color: black;
}

#defaultCity {
grid-row-start: 9;
grid-row-end: 10;
color: black;
background-color: lightpink;
}

#cityinput {
grid-row-start: 8;
grid-row-end: 9;

Copy link
Copy Markdown

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Nice work with this CSS

@ameerrah9 ameerrah9 left a comment

Copy link
Copy Markdown

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Great work, Amanda + Stacy! 🥳

Thank you for your patience as we catch up on grading. Nice work! The HTML is structured well and the JS is clear and well-factored. This project is a Green. 🟢

Keep it up!

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

3 participants