<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%>
<%
String path = request.getContextPath();
String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"/";
%>

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
  <head>
    <base href="<%=basePath%>">
<meta charset="UTF-8">
	<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1.0, user-scalable=no">
	
	<title>skic用户注册</title>
	<!-- <link rel="stylesheet" type="text/css" href="css/normalize.css" /> -->
	<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/materialize/0.97.1/css/materialize.min.css">
	<style type="text/css">
	html,
	body {
	    height: 100%;
	}
	html {
	    display: table;
	    margin: auto;
	}
	body {
	    display: table-cell;
	    vertical-align: middle;
		color:#404d5b;
	}

	.margin {
	  margin: 0 !important;
	}
	
	.card-panel{ min-width:350px;}
	</style>
	<!--[if IE]>
		<script src="http://apps.bdimg.com/libs/html5shiv/3.7/html5shiv.min.js"></script>
	<![endif]-->
</head>
<body class="blue lighten-2">
<%
	if (request.getAttribute("msg") != null) {
			out.println(
					"<script language=javascript>alert('"+request.getAttribute("msg")+"')</script>");
		}
 %>
	<div id="login-page" class="row">
	    <div class="col s12 z-depth-6 card-panel">
	      <form class="login-form" action="<%=request.getContextPath()%>/CheckLoginServlet" method="post" name="loginSkic">
	        <div class="row">
	          <div class="input-field col s12 center">
	            <img src="http://w3lessons.info/logo.png" alt="" class="responsive-img valign profile-image-login">
	            <p class="center login-form-text">Welcome to skic</p>
	          </div>
	        </div>
	        <div class="row margin">
	          <div class="input-field col s12">
	            <i class="mdi-social-person-outline prefix"></i>
	            <input class="validate" name="userName" type="text">
	            <label for="email" data-error="wrong" data-success="right" class="center-align">UserName</label>
	          </div>
	        </div>
	        <div class="row margin">
	          <div class="input-field col s12">
	            <i class="mdi-action-lock-outline prefix"></i>
	            <input name="passWord" type="password">
	            <label for="password">Password</label>
	          </div>
	        </div>
	        <div class="row">          
	          <div class="input-field col s12 m12 l12  login-text">
	              <input type="checkbox" id="remember-me" />
	              <label for="remember-me">Remember me</label>
	          </div>
	        </div>
	        <div class="row">
	          <div class="input-field col s12">
	          		 <button class="btn waves-effect waves-light col s12" type="submit" name="action">Login</button>
	          </div>
	        </div>
	        <div class="row">
	          <div class="input-field col s6 m6 l6">
	            <p class="margin medium-small"><a href="register.jsp">Register</a></p>
	          </div>
	          <div class="input-field col s6 m6 l6">
	              <p class="margin right-align medium-small"><a href="forgot-password.jsp">Forgot password?</a></p>
	          </div>          
			</div>
	      </form>
	    </div>
	  </div>
	  </div>
	
	<script type="text/javascript" src="http://apps.bdimg.com/libs/jquery/1.11.1/jquery.min.js"></script>
	
  	<!--materialize js-->
  	<script src="https://cdnjs.cloudflare.com/ajax/libs/materialize/0.97.1/js/materialize.min.js"></script>
</body>
</html>