+ -Set value as an input element / input type numbers + -Set calculate as a button / input type submit ~ may need to change later + + -Set Celsius as a paragraph element
with strong tags and a class + +# CSS + + -Add a solid border around all elements + - Center Header + - Align fahrenheit, value input and calculate button in a row. Center + - Set Button to blue + - Center Celsius + +# Javascript + +- Read the value inside of input box +- Grab the value inside of input +- Add value to the formula for celsius +- Output the value next to celsius element +- diff --git a/root/app.js b/root/app.js new file mode 100644 index 0000000..85318a9 --- /dev/null +++ b/root/app.js @@ -0,0 +1,21 @@ +function tempConvert() { + let scaleCalc = document.querySelector("#selectScale").value; //Takes the value of scale selector + let inputNum = parseFloat(document.querySelector("#inputValue").value); //Takes the value of user input + + switch (scaleCalc) { + case "Fahrenheit": //Takes the value of fahrenheit and converts to other scales + document.querySelector("#getCelsius").innerHTML = + Math.round(inputNum * (9 / 5) + 32) + " C"; + + document.querySelector("#getFahrenheit").innerHTML = + Math.round(inputNum) + " F"; + + document.querySelector("#getKelvin").innerHTML = + (inputNum - 32) * (5 / 9) + 273.15 + " K"; + + document.querySelector("#getRankine").innerHTML = + inputNum + 459.67 + " R"; + break; + //case "Celsius": + } +} diff --git a/root/index.html b/root/index.html new file mode 100644 index 0000000..393f70f --- /dev/null +++ b/root/index.html @@ -0,0 +1,46 @@ + + + +
+ + +