message-center.html

<!DOCTYPE html>
<html>
<head>
  <title>Message Center</title>
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <link href="css/foundation.css" rel="stylesheet" type="text/css">
  <link rel="stylesheet" type="text/css" href="css/normalize.css">
  <link rel="stylesheet" type="text/css" href="css/custom.css">
</head>

<body>
	
	<header class="">
		<div>
			<!-- <img src="img/mest-logo.png"> -->
		<h3>MELTWATER ENTREPRENEURIAL SCHOOL OF TECHNOLOGY</h3>
		</div>


		<!-- test nav start -->
		<nav class ="top-bar " data-options ="is_hover:false">
		 	 <ul class="title-area ">
		    <!-- Title Area -->
			    <li class="name">
			      <h1><a href="#"></a></h1>
			    </li>
		   		 <li class ="toggle-topbar menu-icon"><a href="#"><span>Menu</span></a></li>
		 	 </ul>

			  <section class ="top-bar-section ">
			    <!-- Left Nav Section -->
				    <ul class="left">
				    	<li><a href="index.html">Home</a></li>
				    </ul>

				    <!-- Right Nav Section -->
				    <ul class ="right">
					    <li class="hide-for-small"></li>
					    <li class="active"><a href="">Search</a></li>				   
					   	<li><a href="">Messages</a></li>
					    <li><a href="">Favorite</a></li>				    
					    <li id="profile-pic"><img src="img/nick.jpg"></li>
					    <li class ="has-dropdown "><a href="">Hello, Nick</a>	
					       	<ul class ="dropdown">
					       		<li><a href="#">logout</a></li>
					      	</ul>    	
					</ul>
			  </section>
		</nav>
		<!-- test nav ends -->
	</header>
 <!-- side nav -->
 	<div class="side-nav">
 		<div class="section-container accordion" data-section="accordion">
 			<section>
 				<p class="title active" data-section-title><a href="#">Mentors</a></p>
 				<div class="content" data-section-content>
 					<ul>
			 			<li><a href=""></a></li>
			 			<li><a href=""></a></li>
			 			<li><a href=""></a></li>
			 			<li><a href=""></a></li>
			 		</ul>
 				</div>
 			</section>
 			<section>
 				<p class="title" data-section-title><a href="#">Job Applicants</a></p>
 				<div class="content" data-section-content>
 					<ul>
 						<li><a href=""></a></li>
 						<li><a href=""></a></li>
 						<li><a href=""></a></li>
 						<li><a href=""></a></li>
 						<li><a href=""></a></li>
 					</ul>
 				</div>

 			</section>
 			<section>
 				<p class="title" data-section-title><a href="#">Contacts</a></p>
 				<div class="content" data-section-content>
 					<ul>
 						<li><a href=""></a></li>
 						<li><a href=""></a></li>
 						<li><a href=""></a></li>
 					</ul>
 				</div>
 			</section>
 			<section>
 				<p class="title" data-section-title><a href="#">Settings</a></p>
 				<div class="content" data-section-content>
 					<ul>
 						<li><a href=""></a></li>
 						<li><a href=""></a></li>
 					</ul>
 					<a href="#"></a>
 				</div>
 			</section>
 		</div>
 	</div>
	<!-- side nav ends -->

	<div id="body-content">
		<div> 
			<button name="compose" class="row collapse small-2" value="compose"><a href="compose-message.html">Compose</a></button>
			<div class="large-8 columns" id="search-box">
		        <div class="row collapse">
		        	<div class="small-9 columns">
		            	<input type="text" placeholder="Search for  mentors">
		         	</div>
		        	<div class="small-3 columns">
		            	<span class="postfix">Search</span>
		          	</div>
		        </div>
        	</div>
		</div>
		
      <!-- mentor inbox -->
	    <div  >
	    	<header><h3>Mentor Inbox</h3></header>
	      	
	      	<div id="mentor-inbox">
	      		<ul>
	      			<li>Donnah White</li>
	      			<li>Messsage title</li>
	      			<li class="date-time-mail">Date</li>
	      		</ul>
	      		<ul>
	      			<li>Donnah White</li>
	      			<li>Messsage title</li>
	      			<li class="date-time-mail">Date</li>
	      		</ul>
	      		<ul>
	      			<li>Donnah White</li>
	      			<li>Messsage title</li>
	      			<li class="date-time-mail">Date</li>
	      		</ul>
	      		<ul>
	      			<li>Donnah White</li>
	      			<li>Messsage title</li>
	      			<li class="date-time-mail">Date</li>
	      		</ul>
	      		<ul>
	      			<li>Donnah White</li>
	      			<li>Messsage title</li>
	      			<li class="date-time-mail">Date</li>
	      		</ul>
	      		<ul>
	      			<li>Donnah White</li>
	      			<li>Messsage title</li>
	      			<li class="date-time-mail">Date</li>
	      		</ul>
	      		<ul>
	      			<li>Donnah White</li>
	      			<li>Messsage title</li>
	      			<li class="date-time-mail">Date</li>
	      		</ul>
	      		<ul>
	      			<li>Donnah White</li>
	      			<li>Messsage title</li>
	      			<li class="date-time-mail">Date</li>
	      		</ul>
	      	</div>
	     </div>

	</div> 


 <!-- scripts go here	-->
 <script>
  document.write('<script src=' +
  ('__proto__' in {} ? 'js/vendor/zepto' : 'js/vendor/jquery') +
  '.js><\/script>')
  </script>
  <script src="js/foundation/foundation.js"></script>
  <script src="js/foundation/foundation.alerts.js"></script>
  <script src="js/foundation/foundation.clearing.js"></script>
  <script src="js/foundation/foundation.cookie.js"></script>
  <script src="js/foundation/foundation.dropdown.js"></script>
  <script src="js/foundation/foundation.forms.js"></script>
  <script src="js/foundation/foundation.joyride.js"></script>
  <script src="js/foundation/foundation.magellan.js"></script>
  <script src="js/foundation/foundation.orbit.js"></script>
  <script src="js/foundation/foundation.placeholder.js"></script>
  <script src="js/foundation/foundation.reveal.js"></script>
  <script src="js/foundation/foundation.section.js"></script>
  <script src="js/foundation/foundation.tooltips.js"></script>
  <script src="js/foundation/foundation.topbar.js"></script>
  <script src="js/foundation/foundation.interchange.js"></script>
  <script>
    $(document).foundation();
  </script>
</body>
</html>