138 lines
		
	
	
		
			2.5 KiB
		
	
	
	
		
			HTML
		
	
	
			
		
		
	
	
			138 lines
		
	
	
		
			2.5 KiB
		
	
	
	
		
			HTML
		
	
	
| {% block body %}
 | |
| {% if session['logged_in'] %}
 | |
| 
 | |
| You're logged in already! <a href="/logout">Logout</a>.
 | |
| 
 | |
| {% else %}
 | |
| <meta name="viewport" content="width=device-width, initial-scale=1.0, minimum-scale=0.5, maximum-scale=3.0, user-scalable=yes" />
 | |
| <p>{{ get_flashed_messages()[0] | safe }}</p>
 | |
| 
 | |
| <style>
 | |
| 
 | |
| .container{
 | |
|         background-color: #FFFFFF;
 | |
|         width: 400px;
 | |
|         height: 500px;
 | |
|         margin: 7em auto;
 | |
|         border-radius: 1.5em;
 | |
|         box-shadow: 0px 11px 35px 2px rgba(0, 0, 0, 0.14);
 | |
|     
 | |
| }
 | |
| 
 | |
| .signin-heading{
 | |
|         padding-top: 5px;
 | |
|         color: #8C55AA;
 | |
|         font-family: 'Ubuntu', sans-serif;
 | |
|         font-weight: bold;
 | |
|         font-size: 23px;
 | |
|         text-align: center;
 | |
| }
 | |
| 
 | |
| .username,.password, .re-password{
 | |
|     width: 76%;
 | |
|     color: rgb(38, 50, 56);
 | |
|     font-weight: 700;
 | |
|     font-size: 14px;
 | |
|     letter-spacing: 1px;
 | |
|     background: rgba(136, 126, 126, 0.04);
 | |
|     padding: 10px 20px;
 | |
|     border: none;
 | |
|     border-radius: 20px;
 | |
|     outline: none;
 | |
|     box-sizing: border-box;
 | |
|     border: 2px solid rgba(124, 16, 97, 0.02);
 | |
|     margin-bottom: 50px;
 | |
|     margin-left: 46px;
 | |
|     text-align: center;
 | |
|     margin-bottom: 27px;
 | |
|     font-family: 'Ubuntu', sans-serif;
 | |
| }
 | |
| 
 | |
| .btn{
 | |
|     width: 50%;
 | |
|     border: none;
 | |
|     border-radius: 20px;
 | |
|     box-sizing: border-box;
 | |
|     border: 2px solid #8C55AA;
 | |
|     margin-bottom: 50px;
 | |
|     margin-left: 90px;
 | |
|     padding: 10px 20px;
 | |
|    
 | |
| }
 | |
| 
 | |
| .btn:hover{
 | |
| 
 | |
|     background: #8C55AA;
 | |
|     transition: .5s;
 | |
|     cursor: pointer;
 | |
|     color: #fff;
 | |
| }
 | |
| 
 | |
| 
 | |
| .signup{
 | |
|     display: flex;
 | |
|     justify-content: center;
 | |
|     align-items: center;
 | |
| }
 | |
| 
 | |
| ul{
 | |
|     position: absolute;
 | |
|     display: flex;
 | |
|     left: 65%;
 | |
|     
 | |
| }
 | |
| 
 | |
| li{
 | |
|     padding: 10px;
 | |
|     margin: 10px;  
 | |
| }
 | |
| 
 | |
|  a{
 | |
|     text-decoration: none;
 | |
|     list-style: none;
 | |
|     font-weight: bold;
 | |
|     font-family: 'ink free';
 | |
|     
 | |
| }
 | |
| 
 | |
| .main_menu a{
 | |
|     color: #fff;
 | |
|     font-size: 300;
 | |
| }
 | |
| 
 | |
| li :hover{
 | |
|     color: #8C55AA;
 | |
|     transition: .5s;
 | |
| }
 | |
| 
 | |
| h1{
 | |
|     font-family: 'ink free';
 | |
| 
 | |
| }
 | |
| 
 | |
| .main_menu h1{
 | |
|     color: #fff;
 | |
| }
 | |
| 
 | |
| 
 | |
| </style>
 | |
| 
 | |
| <div class="container">
 | |
| 
 | |
|   <section class="signin-heading">
 | |
|     <h1>Sign Up</h1>
 | |
|   </section>
 | |
| 
 | |
|   <form action="/signup" method="POST">
 | |
|     <p><input type="username" name="username" placeholder="输入用户名" required="required" class="username"></p>
 | |
|     <p><input type="password" name="password" placeholder="输入密码" class="password"></p>
 | |
|     <p><input type="password" name="password2" placeholder="确认密码" class="password" required="required"></p>
 | |
|     <button type="submit" class="btn">注册</button>
 | |
|   </form>
 | |
| 
 | |
| </div>
 | |
|   
 | |
| {% endif %}
 | |
| {% endblock %}
 | |
| 
 |