
<?php
require('db.php');

$content = "No content";
try {
    $stmt = $pdo->prepare("
        SELECT  fullname, email, password, phone
        FROM users
        
    ");

    $stmt->execute();

    $stmt->setFetchMode(PDO::FETCH_OBJ);
    $sql = $stmt->fetchAll();
//The HTML <th> element defines a cell as header of a group of table cells. The exact nature of this group is defined by the scope and headers attributes.
// thead table head
    $content = "<table><thead><tr><th>Name and Surname</th><th>E-mail</th> <th>Password</th><th>Phone Number</th></tr></thead><tbody>";

    if (count($sql) > 0) {
        foreach ($sql as $row) {
            $content .= "<tr><td>{$row->fullname}</td><td>{$row->email}</td><td>{$row->password}</td><td>{$row->phone}</td></tr>";
        }
    } else {
        $content .= "<tr><td colspan='4'>No data</td></tr>";
    }
    $content .= "</tbody></table>";
} catch (Exception $e) {
    $content = "Unable to read data: " . $e->getMessage();
}
		
	
        
	?>




<!DOCTYPE html>
<html>
<head>
 <title>Exam Table</title>
		<meta charset='utf-8' />
		<meta name='viewport' content='width=device-width, initial-scale=1.0' />
 
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link rel="stylesheet" type="text/css" href="admin.css">
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.0/jquery.min.js"></script>
<link href='https://fonts.googleapis.com/css?family=Open+Sans:400,300,300italic,600,400italic,600italic,700' rel='stylesheet' type='text/css'>

		
		<style>
		th {color:#fffff6;}
		table {background-color:#fffff6;}
			#demo-form>div {
				display: flex;
				max-width: 100%;
				margin: 0 0 1em 0;
				background-color:#EAEBCC;
				
			}

			#demo-form>div>* {
				flex: 1 1 50%;
				background-color:#EAEBCC;
				
			}
#demo-form>th { color:#C816BC;}
table { margin-left:0%;
	align-content:center;
	width: 100%;
	border: 3px;
	border-collapse: collapse;
	border-top: 1px solid #CCCCCC;
	border-left: 1px solid #CCCCCC;
	border-bottom: 0px solid #CCCCCC;
	border-right: 0px solid #CCCCCC;
	padding: 3px;
	background-color: #FFFFFF;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 20px;
	color: #000000;
}
 th {
	background-color: #2980b9;
	padding-top: 5px;
	padding-left: 5px;
	padding-right: 5px;
	padding-bottom: 5px;
	border-top: 0px solid #CCCCCC;
	border-left: 0px solid #CCCCCC;
	border-bottom: 1px solid #CCCCCC;
	border-right: 1px solid #CCCCCC;
}
 td {
	padding-top: 5px;
	padding-left: 5px;
	padding-right: 5px;
	padding-bottom: 5px;
	border-top: 0px solid #CCCCCC;
	border-left: 0px solid #CCCCCC;
	border-bottom: 1px solid #CCCCCC;
	border-right: 2px solid #CCCCCC;
}

		</style>
	</head>

<body class='no-heading'>

<div id="header" style="overflow: hidden; height:70px;">
  <div class="logo" >
    <a href="#"><img alt="logo" src="logomini.png" style=" height:60px; float:left;"  >
   </a>
   <a style="float: right; margin-top: 10px; margin-left: 1050px;" href="#">Logout
    </a>
  </div>
  
</div>


<a class="mobile">MENU</a>


<div id="container">

  <div class="sidebar">
    <ul id="nav">
      <li><a class="selected" href="#">Dashboard</a></li>
      <li><a href="#">Registration</a></li>
      <li><a href="#">Posts</a></li>
    
      <li><a href="#">Media</a></li>
     <li><a href="#">Rehalibition centers</a></li>
      <li><a href="#">Medical Information</a></li>
     <li><a href="#">Medical Spas</a></li>
     <li><a href="#">Events</a></li>
      <li><a href="#">News</a></li>
     <li><a href="#">About</a></li>
     <li><a href="#">Contact</a></li>
      
    </ul>
    
  </div>

  <div class="content">
    <h1>Dashboard</h1>
    <p>Control content</p>
   
   <main>
    		<h2 style="color:#FFfff6" align="center";>Members have been registerd</h2>
    		<div>
    			<?php echo $content; ?>
    		</div>
		</main>

    <div id="box" style="margin-bottom: 10px;">
     <div class="box-top">Medical Information</div>
     <div class="box-panel">Insert medical information</div>
     <div style="float: left; height: 30px; background-color: aliceblue; width: 100%;  "> <div style="margin-left: 80%; margin-top: 2px;"><button type="button" onclick="alert('Hello world!')">Add new</button>
     <button type="button" onclick="alert('Hello world!')">Edit</button>
     <button type="button" onclick="alert('Hello world!')">Delet</button>
      </div>
     </div>
    </div>
  <div id="box" style="margin-bottom: 10px;">
     <div class="box-top" style=" margin-top: 50px;">Rehalibition centers</div>
     <div class="box-panel">Insert rehalibition centers</div>
     <div style="float: left; height: 30px; background-color: aliceblue; width: 100%;  "> <div style="margin-left: 80%; margin-top: 2px;"><button type="button" onclick="alert('Hello world!')">Add new</button>
     <button type="button" onclick="alert('Hello world!')">Edit</button>
     <button type="button" onclick="alert('Hello world!')">Delet</button>
      </div>
     </div>
    </div>
   <div id="box" style="margin-bottom: 10px;">
     <div class="box-top"style=" margin-top: 50px;">News</div>
     <div class="box-panel">insert news</div>
     <div style="float: left; height: 30px; background-color: aliceblue; width: 100%;  "> <div style="margin-left: 80%; margin-top: 2px;"><button type="button" onclick="alert('Hello world!')">Add new</button>
     <button type="button" onclick="alert('Hello world!')">Edit</button>
     <button type="button" onclick="alert('Hello world!')">Delet</button>
      </div>
     </div>
    </div>

   <div id="box" style="background-color: crimson;">
     <div class="box-top" style=" margin-top: 50px;">News</div>
     <div class="box-panel">Lorem nes stuf</div>
    </div>


    <div id="box">
     <div class="box-top">News</div>
     <div class="box-panel">Lorem nes stuf</div>
    </div>


  </div>


</div><!-- #container -->

<script type="text/javascript">

	$(document).ready(function(){
     $("a.mobile").click(function(){
      $(".sidebar").slideToggle('fast');
     });

    window.onresize = function(event) {
      if($(window).width() > 480){
      	$(".sidebar").show();
      }
    };


	});

</script>
<footer style="height: 100px;
             background-color: black; 
                position:fixed;
   bottom:0px;
   width:100%;
   height:60px;   /* Height of the footer */
  
               ">
 <p style=" margin-top: 20px; text-align: center;  color:bisque;   "> @ 2017 All rights reserved, Powered by Taisir Obad</p></footer>
</body>
</html>
