Skip to content

Min Weather Report App#70

Open
Eatmine wants to merge 5 commits intoAda-C16:mainfrom
Eatmine:main
Open

Min Weather Report App#70
Eatmine wants to merge 5 commits intoAda-C16:mainfrom
Eatmine:main

Conversation

@Eatmine
Copy link
Copy Markdown

@Eatmine Eatmine commented Dec 14, 2021

No description provided.

Comment thread index.html
<h2 id=gardenText></h2>

</div>
<br>
Copy link
Copy Markdown

Choose a reason for hiding this comment

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

instead of using a br you could add margins to your divs to create space

Comment thread index.html
Comment on lines +70 to +73
<!-- ‼️❗️🤯😳☀️😎 🌆🌇🎇🥵💃🏾💋‼️❗️🤯 -->
<!-- 🥶🧊💎🥶🧊💎🥶🧊💎🥶🧊💎🥶🧊💎🥶🧊💎🥶🧊💎🥶🧊💎🥶🧊💎🥶
✈️☁️✌🏾✈️☁️✌🏾✈️☁️✌🏾✈️☁️✌🏾✈️☁️✌🏾✈️☁️✌🏾✈️☁️✌🏾✈️☁️✌🏾✈️☁️✌🏾✈️☁️✌🏾✈️☁️✌🏾✈️☁️✌🏾✈️☁️
🌧☔️🌂🌧☔️🌂🌧☔️🌂🌧☔️🌂🌧☔️🌂🌧☔️🌂🌧☔️🌂🌧☔️🌂🌧☔️🌂🌧☔️🌂🌧☔️🌂 --> No newline at end of file
Copy link
Copy Markdown

Choose a reason for hiding this comment

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

I would remove these emojis in your HTML file because you are using them in your JS file.

Comment thread src/index.js
@@ -0,0 +1,139 @@
console.log("loaded")
Copy link
Copy Markdown

Choose a reason for hiding this comment

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

remove your console.log

Comment thread src/index.js
state.tempchange += 1;
const increseButtonElement = document.getElementById('tempvalue');
increseButtonElement.textContent = `${state.tempchange}`;
console.log("clickly click click");
Copy link
Copy Markdown

Choose a reason for hiding this comment

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

remove your console log

Comment thread src/index.js
state.tempchange -= 1;
const decreaseButtonElement = document.getElementById('tempvalue');
decreaseButtonElement.textContent = `${state.tempchange}`;
console.log("downbutton click")
Copy link
Copy Markdown

Choose a reason for hiding this comment

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

remove console log

Comment thread src/index.js
Comment on lines +27 to +39
// let gardenGifs = "cloudy";

// if (inputSky === "cloudy") {
// gardenGifs = "cloudy"

// } else if (inputSky === "sunny") {
// gardenGifs = "sunny";
// } else if (inputSky === "rainy") {
// gardenGifs = "rainy";
// } else if (inputSky === "snowy") {
// gardenGifs = "snowy";
// }

Copy link
Copy Markdown

Choose a reason for hiding this comment

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

remove this unused code

Comment thread src/index.js
const cityNameInputEl= document.getElementById("cityNameInput").value;
const headerCityEl = document.getElementById("CityName");
headerCityEl.textContent = cityNameInputEl;
console.log("citygirls")
Copy link
Copy Markdown

Choose a reason for hiding this comment

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

remove console.log

Comment thread src/index.js
Comment on lines +65 to +78
const tempColor = document.getElementById("tempvalue");
let color = "blue";
if (state.tempchange >=80){
color = "rgba(24, 17, 24, 0.836)";
console.log("hotttttttttt")
}else if (state.tempchange >=70){
color = "rgb(117, 87, 117)";
}else if (state.tempchange >=60){
color = "rgb(175, 124, 175)";
}else if (state.tempchange >=50){
color = "black";
}
tempColor.classList = color;

Copy link
Copy Markdown

Choose a reason for hiding this comment

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

in css you need to add properties for each of the colors and then the value you want. For example, if color = "black" then in CSS you should have

.black {
   color: black;
}

Comment thread index.html

</div>
<br>
<div class = "landscape">🥵🔥🔥🔥🔥🔥🔥🔥🔥🔥🔥🔥🔥🔥🔥🔥🔥🔥🔥🔥🥵</div>
Copy link
Copy Markdown

@tgoslee tgoslee Dec 22, 2021

Choose a reason for hiding this comment

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

Suggested change
<div class = "landscape">🥵🔥🔥🔥🔥🔥🔥🔥🔥🔥🔥🔥🔥🔥🔥🔥🔥🔥🔥🔥🥵</div>
<div class="landscape" >🥵🔥🔥🔥🔥🔥🔥🔥🔥🔥🔥🔥🔥🔥🔥🔥🔥🔥🔥🔥🥵</div>

Comment thread src/index.js

const changeGarden = ()=> {

const landContainer = document.querySelector("#landscape")
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 landscape is a class name in HTML not an id. So you could do document.getElementsByClassName("landscape")

Comment thread src/index.js
cityNameInputEl.addEventListener("input", changeCityName)

const resetButton = document.getElementById("cityNameInput")
resetButton.addEventListener("click", changeCityName)
Copy link
Copy Markdown

Choose a reason for hiding this comment

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

instead of calling the changeCityName function, you should create a function to reset the city name back to the default city name

Comment thread styles/index.css
width: 480px;
height: 30px;
align-self: flex-end;
/* display: block; */
Copy link
Copy Markdown

Choose a reason for hiding this comment

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

remove unused code

Comment thread styles/index.css
align-self:center;
margin-left: 30%;
font-size: larger;
/* background-image: linear-gradient(315deg, #000000 0%, #ffffff 74%); */
Copy link
Copy Markdown

Choose a reason for hiding this comment

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

remove unused code

@tgoslee
Copy link
Copy Markdown

tgoslee commented Dec 22, 2021

This is a good start. I like the background and gifs you chose to use. I added some comments on refactoring your code and adding functionality.

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.

2 participants