HTML of the events bar

events-bar-html.html

<div class="tribe-events-calendar-events-bar">

	<h2 class="tribe-common-a11y-visual-hide">Events Search and Views Navigation</h2>

	<div class="tribe-events-calendar-events-bar--form">

		<form action="http://beta.local/events?post_type=tribe_events&#038;eventDisplay=default" method="post" class="tribe-common-c-search">
			<div class="tribe-common-form-control-text-group">
				<div class="tribe-common-form-control-text">
					<label for="keyword">Keyword</label>
					<input
						type="text"
						id="keyword"
						name="keyword"
						aria-label="Search for Events by Keyword."
						value=""
						placeholder="Keyword"
					/>
				</div>
				<div class="tribe-common-form-control-text">
					<label for="location">Location</label>
					<input
						type="text"
						id="location"
						name="location"
						aria-label="Search for Events by Location."
						value=""
						placeholder="Location"
					/>
				</div>			
				<div class="tribe-common-form-control-text">
					<label for="date">Date</label>
					<input
						type="text"
						id="tribe-bar-date"
						name="tribe-bar-date"
						aria-label="Search for Events by Date. Please use the format 4 digit year hyphen 2 digit month hyphen 2 digit day."
						value=""
						placeholder="Enter date"
					/>
				</div>		
			</div>
			<input
				class="tribe-common-c-btn"
				type="submit"
				name="submit-bar"
				aria-label="Submit Events search"
				value="Find Events"
			/>	
		</form>
	</div>
	
	<div class="tribe-events-calendar-events-bar--views">
		<h3 class="tribe-common-a11y-visual-hide">Event Views Navigation</h3>
		<div class="tribe-common-form-control-tabs">
			<button id="tabButton" aria-haspopup="listbox" aria-labelledby="tabButton" aria-expanded="true">Views</button>
			<ul tabindex="-1" role="listbox" aria-activedescendant="tabOneLabel">
				<li role="presentation">
					<input id="tabList" name="tabGroup" type="radio" value="tabList" checked="checked" />
					<label id="tabListLabel" for="tabList" role="option" aria-selected="true">List</label>
				</li>
				<li role="presentation">
					<input id="tabMonth" name="tabGroup" type="radio" value="tabMonth" />
					<label id="tabMonthLabel" for="tabMonth" role="option">Month</label>
				</li>
				<li role="presentation">
					<input id="tabWeek" name="tabGroup" type="radio" value="tabWeek" />
					<label id="tabWeekLabel" for="tabWeek" role="option">Week</label>
				</li>
			</ul>
		</div>
	</div>
	<div class="tribe-events-calendar-events-bar--filters">
		<a class="tribe-common-c-btn-icon tribe-common-c-btn-icon--border tribe-common-c-btn-icon--filters"></a>
	</div>
	
</div>