JSFiddle - React, Tailwind, and code Playground

by Serge Karchmit

HTML

<body onload="menuClose()" 
	onload = "viewClose()">

				<nav>
					<ul id = "mainNav">
						<li><center>
							<img id = "logo" src = "https://31.media.tumblr.com/cfc2c43f7e34ec3fcb60405fa5d4f5a5/tumblr_n9nvpjtNNW1tgkx81o1_1280.png"></center>
						</li>
						<li id = "search">

							<form name = "searchField">
								<img src = "http://31.media.tumblr.com/7732f8901e9c94cb94aa5cff9e11b2ae/tumblr_n8zm5cD1SL1tgkx81o1_1280.png"><input name = "search" type = "text" placeHolder = "" id = "search">
							</form>

						</li>
						<li><a href ="#">
							<img src = "https://38.media.tumblr.com/f319cbdb3a9bd4041fd2c6056827794b/tumblr_n9lpsfYFOB1tgkx81o3_1280.png" alt = "img/home.png">HOME</a>
						</li>
						<li><a href ="#">
							<img src = "https://31.media.tumblr.com/1dc400960f59fca2f738ceab516d24f4/tumblr_n9lpsfYFOB1tgkx81o4_1280.png" alt = "img/info.png">ABOUT</a>
						</li>
						<li id = "section"><a href ="#">
							<img src = "https://38.media.tumblr.com/11cb610a9c031eaf5bb8789cb9739717/tumblr_n9lpsfYFOB1tgkx81o1_1280.png"alt = "img/camera.png">PHOTOGRAPHY</a>
							<ul>
								<li><a href = "/photography">San Francisco</a></li>
								<li><a href = "#">Lake Tahoe</a></li>
							</ul>
						</li>
						<li id = "section"><a href ="#">
							<img src = "https://31.media.tumblr.com/bd112082d5c902750e78aa9d7dd817fc/tumblr_n9lpsfYFOB1tgkx81o5_1280.png"alt = "img/projects.png">PROJECTS</a>
							<ul>
								<li><a href = "/projects#informative">Informative</a></li>
								<li><a href = "/projects#profile">Profile</a></li>
							</ul>
						</li>
						<li id = "section"><a href ="#">
							<img src = "https://33.media.tumblr.com/e9a7f9ae946bdf2950be96f27023bb78/tumblr_n9lpsfYFOB1tgkx81o2_1280.png"alt = "img/contact.png">CONTACT</a>

							<ul>
								<li><a href = "http://www.twitter.com/skarchmit" target =" _blank">Twitter</a></li>
								<li><a href = "http://www.instagram.com/skarchmit" target ="...