Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Paper : Karla #70

Open
wants to merge 8 commits into
base: main
Choose a base branch
from
Open

Paper : Karla #70

wants to merge 8 commits into from

Conversation

ktiktok96
Copy link

No description provided.

…rk box with dynmaic nature background. Up next: cont css adjustments and add javascript funtionality.
…re, a clickable element to increase/decrease temperature and an elementthat displays a landscape.
…entbyID was added still needs adjustments for JS to work.
…lect with change for eventlistener and removed search option. Next will begin wave 4.
… to drop editable and used a input type text instead. Reset button atm resets the city text box to a blank box.
Copy link

@CheezItMan CheezItMan left a comment

Choose a reason for hiding this comment

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

Overall nice work Karla, you hit the main learning goals. I left some minor feedback, but this works quite well. You didn't have the reset city name section, but otherwise you hit all the requirements. Well done.

Comment on lines +2 to +7
let btnAdd = document.getElementById('add');
let btnSubtract = document.getElementById('subtract');
let tempInput = document.getElementById('temp_id');
let landscape = document.getElementById('landscape');
let skiesInput = document.getElementById('sky-select');
let skiesLandscape = document.getElementById('sky-landscape');

Choose a reason for hiding this comment

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

Not a bad idea having these at the top, but it's possible the HTML might get loaded by the browser AFTER the JS. So in that case these variables would be set to undefined.

Also why not make them const?

Comment on lines +13 to +19
function countUp(element) {
element.value = parseInt(element.value) + 1;
}

function countDown(element) {
element.value = parseInt(element.value) - 1;
}

Choose a reason for hiding this comment

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

Nice helper functions

Comment on lines +22 to +32
if (tempInput.value >= 80) {
tempInput.style.color = 'red';
} else if (tempInput.value >= 70 && tempInput.value <= 79) {
tempInput.style.color = 'orange';
} else if (tempInput.value >= 60 && tempInput.value <= 69) {
tempInput.style.color = 'yellow';
} else if (tempInput.value >= 50 && tempInput.value <= 59) {
tempInput.style.color = 'green';
} else if (tempInput.value <= 49) {
tempInput.style.color = 'teal';
}

Choose a reason for hiding this comment

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

In general don't set styles directly, instead set the element's class name. Otherwise you're mixing roles between the behavior (JS) and presentation (CSS).

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