snowlune / trip-planner Goto Github PK

Style the main element with id main-content

Use tailwind and/or css to create centered 1200px wide. uses id #main-content. HTML exists, just needs styling

Add the following temporarily into the day-events article element.

<section class="day"><h2 class="event-date">Thu Jan 1, 1970</h2><div class="weather"><div class="weather-main"><img class="weather-main-icon" src=""><p class="weather-main-text">Clear</p></div><div class="weather-temp"><p class="weather-high">34</p><p class="weather-low">10</p></div></div><div class="events"><div class="event"><img class="event-thumbnail" src=""><p class="event-title">Test Debug in Concert</p><p class="event-time-and-venue"><span class="event-time">3:00pm</span><span class="event-venue">Big Concert Hall</span></p><p class="event-description">Test Debug lorem ipsum tour</p></div><div class="event"><img class="event-thumbnail" src=""><p class="event-title">Test Debug 2 in Concert</p><p class="event-time-and-venue"><span class="event-time">9:00pm</span><span class="event-venue">Music Place Center</span></p><p class="event-description">Test Debug lorem ipsum tour 2</p></div></div></section>

• Style with tailwind and css as you normally would to match the mockup
• When you are finished add the tailwind classes to their corresponding "className = " assignment in script.js
• Remove the template from the html when you are finished
• Push feat branch and PR

INPUTS: Location, Date
OUTPUTS: Multiday forecast for specified date

Add a Weather class that contains the functions for asynchronously pulling weather information to itself

Should contain information, such as names of the authors and APIs used

Get tailwind to work correctly in a feature branch then pull request

INPUTS: Location, date
OUTPUTS: 3-5 events with thumbnails, title, venue, and time

Define the scope and functionality of the project

• What problem are we solving?
  • A user visits our site to do what exactly?
• What are the inputs and outputs of the website?
• What does the site look like when we first visit it?

We should be able to create a complete user story and our own acceptance criteria.

Once we have done this we can begin to break down the project into smaller pieces with individual scope.

• Background color of footer should be darker than the rest of the body.
• Text should be smaller and centered.

Put the form in the header inside a <nav> element
Style header and nav

Remove redundant functions and add additional comments as needed

Update createDay to output date as date in timezone local to location
Add "On {date} the weather will be"

• Add a function that handles location and date values upon submit event in the main form.

  • This is the function that kickstarts the rest of the calls that will be made to create weather and event objects, then creates the day event

• Add an event listener to call this function

Create centered h1 element to contain location label.
Add js to update it's contents in the createDay function