Amethyst - Stacey-AnBa#65
Open
ngwin-ab wants to merge 28 commits into
Open
Conversation
…ather, incorporated codes for changing temperature
ameerrah9
reviewed
Jun 27, 2023
Comment on lines
+1
to
+25
| html { | ||
| background: url(../assets/images/taylor-van-riper-yQorCngxzwI-unsplash.jpg) no-repeat center center fixed; | ||
| -webkit-background-size: cover; | ||
| -moz-background-size: cover; | ||
| -o-background-size: cover; | ||
| background-size: cover; | ||
| } | ||
|
|
||
|
|
||
| body { | ||
| font-family: "Helvetica", Sans-Serif; | ||
| text-align: center; | ||
| margin: 0px; | ||
| padding: 0px; | ||
| } | ||
|
|
||
| /* ======================== HEADER ========================*/ | ||
|
|
||
| header { | ||
| width: 100vw; | ||
| background: url("../assets/images/ameythst.jpeg") 75% 0 no-repeat; | ||
| background-size: cover; | ||
| } | ||
|
|
||
| h1 { |
ameerrah9
reviewed
Jun 27, 2023
Comment on lines
+98
to
+118
| /* ======================== CITY NAME DISPLAY ========================*/ | ||
|
|
||
| #city-container { | ||
| margin: 0px; | ||
| padding: 5px; | ||
| display: flex; | ||
| justify-content: center; | ||
| align-items: center; | ||
| text-align: center; | ||
| } | ||
|
|
||
| #city-spotlight { | ||
| color: white; | ||
| margin-top: 1px; | ||
| margin-bottom: 1px; | ||
| font-size: 30px; | ||
| width: 200px; | ||
| } | ||
|
|
||
| /* ======================== TEMPERATURE DISPLAY ========================*/ | ||
| #temperature-container { |
Comment on lines
+38
to
+58
|
|
||
| <!-- Temperature --> | ||
| <div id="temperature-container"> | ||
| <h3 id="temp-header">Current Temperature :</h3> | ||
|
|
||
| <!-- Temperature Buttons --> | ||
| <div class="temp-adustment-container"> | ||
| <button id="down-button">Decrease ↓</button> | ||
|
|
||
| <span> | ||
| <h2 id="temp-value"></h2> | ||
| </span> | ||
|
|
||
| <button id="up-button">Increase ↑</button> | ||
| </div> | ||
| </div> | ||
|
|
||
| <!-- Sky conditions --> | ||
| <div id="sky-container"> | ||
| <label for="weather-conditions" id="label"> | ||
| <h4>Sky Condition :</h4> |
ameerrah9
reviewed
Jun 27, 2023
Comment on lines
+130
to
+145
| // axios | ||
| // .get('https://us1.locationiq.com/v1/search?key=YOUR_ACCESS_TOKEN&q=SEARCH_STRING&format=json') | ||
| // .then((response) => { | ||
|
|
||
| // }) | ||
| // .catch((error) => { | ||
|
|
||
| // }); | ||
|
|
||
|
|
||
| // additional weather data: | ||
| // let city = 'london' | ||
| // $.ajax({ | ||
| // method: 'GET', | ||
| // url: 'https://api.api-ninjas.com/v1/weather?city=' + city, | ||
| // headers: { 'X-Api-Key': 'YOUR_API_KEY'}, |
There was a problem hiding this comment.
Remember to remove debugging log statements & comments
There was a problem hiding this comment.
Removed- two of them were additional features we were working on- the additional weather data and animation.
ameerrah9
reviewed
Jun 27, 2023
| }); | ||
| }; | ||
|
|
||
| const getRtWeather = () => { |
ameerrah9
reviewed
Jun 27, 2023
|
|
||
| const handleUpBtnClicked = () => { | ||
| state.tempValue += 1; | ||
| console.log(state.tempValue); |
There was a problem hiding this comment.
Remember to remove debugging log statements
ameerrah9
reviewed
Jun 27, 2023
Comment on lines
+15
to
+19
| const changeCityHeader = () => { | ||
| const cityName = document.getElementById("city-spotlight"); | ||
| const searchInput = document.getElementById("search-input").value; | ||
| cityName.innerHTML = `${searchInput}`; | ||
| }; |
ameerrah9
reviewed
Jun 27, 2023
ameerrah9
left a comment
ameerrah9
left a comment
There was a problem hiding this comment.
Great work, An Ba & Stacey! 🥳
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. However, there are some comments left in your code. This makes the project a Yellow 🟡
ameerrah9
reviewed
Jun 27, 2023
Comment on lines
+21
to
+33
| const getLocation = () => { | ||
| let lat; | ||
| let lon; | ||
| return axios.get("http://127.0.0.1:5000/location", { | ||
| params: { | ||
| q: document.getElementById("search-input").value | ||
| } | ||
| }) | ||
| .then((response) => { | ||
| state.lat = response.data[0].lat; | ||
| state.lon = response.data[0].lon; | ||
| getRtWeather(); | ||
| }) |
ameerrah9
reviewed
Jun 27, 2023
Comment on lines
+26
to
+53
| <button id="search-button">Search</button> | ||
| <button id="reset-button">Reset</button> | ||
| </div> | ||
|
|
||
| <!-- City Header --> | ||
| <div id="city-container"> | ||
|
|
||
| <span> | ||
| <h2 id="city-spotlight"></h2> | ||
| </span> | ||
| </div> | ||
|
|
||
|
|
||
| <!-- Temperature --> | ||
| <div id="temperature-container"> | ||
| <h3 id="temp-header">Current Temperature :</h3> | ||
|
|
||
| <!-- Temperature Buttons --> | ||
| <div class="temp-adustment-container"> | ||
| <button id="down-button">Decrease ↓</button> | ||
|
|
||
| <span> | ||
| <h2 id="temp-value"></h2> | ||
| </span> | ||
|
|
||
| <button id="up-button">Increase ↑</button> | ||
| </div> | ||
| </div> |
ameerrah9
reviewed
Jun 27, 2023
Comment on lines
+47
to
+70
|
|
||
| /* ======================== SEARCH ========================*/ | ||
| #search-container { | ||
| margin: 15px; | ||
| display: flex; | ||
| overflow: hidden; | ||
| padding: 10px 5px; | ||
| background-color: #CBC3E3; | ||
| width: 70vw; | ||
| border: #5D3FD3; | ||
| border-style: solid; | ||
| justify-content: center; | ||
| } | ||
|
|
||
| #city-intro { | ||
| font-size: 20px; | ||
| margin-top: 2px; | ||
| margin-bottom: 2px; | ||
| margin-left: 40px; | ||
| margin-right: 40px; | ||
| color: #301934; | ||
| } | ||
|
|
||
| #search-input { |
ameerrah9
reviewed
Jun 27, 2023
Comment on lines
+160
to
+173
|
|
||
| /* ======================== TEMPERATURE DISPLAY ========================*/ | ||
| #sky-container { | ||
| display: inline; | ||
| justify-content: space-around; | ||
| margin: 0px; | ||
| overflow: hidden; | ||
| /* padding: 8px 10px; */ | ||
| } | ||
|
|
||
| #label { | ||
| font-size: 20px; | ||
| margin: 0px; | ||
| color: #5D3FD3; |
ameerrah9
reviewed
Jun 27, 2023
Comment on lines
+5
to
+13
| const state = { | ||
| citySearchButton: null, | ||
| resetButton: null, | ||
| tempValue: 0, | ||
| lat: null, | ||
| lon: null, | ||
| upbutton: null, | ||
| downbutton: null | ||
| }; |
|
Removed comments and console logs. |
|
should be green now |
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
3 participants
Add this suggestion to a batch that can be applied as a single commit.This suggestion is invalid because no changes were made to the code.Suggestions cannot be applied while the pull request is closed.Suggestions cannot be applied while viewing a subset of changes.Only one suggestion per line can be applied in a batch.Add this suggestion to a batch that can be applied as a single commit.Applying suggestions on deleted lines is not supported.You must change the existing code in this line in order to create a valid suggestion.Outdated suggestions cannot be applied.This suggestion has been applied or marked resolved.Suggestions cannot be applied from pending reviews.Suggestions cannot be applied on multi-line comments.Suggestions cannot be applied while the pull request is queued to merge.Suggestion cannot be applied right now. Please check back later.
No description provided.