first commit
This commit is contained in:
		
							
								
								
									
										134
									
								
								templates/socialaccount/login.html
									
									
									
									
									
										Executable file
									
								
							
							
						
						
									
										134
									
								
								templates/socialaccount/login.html
									
									
									
									
									
										Executable file
									
								
							| @@ -0,0 +1,134 @@ | ||||
| {% load i18n %} | ||||
| <!DOCTYPE html> | ||||
| <html lang="zh-CN"> | ||||
| <head> | ||||
|     <meta charset="UTF-8"> | ||||
|     <title>{% trans "Google 登录" %}</title> | ||||
|     <link rel="stylesheet" href="https://file.guimiaokeji.com/layui/css/layui.css"> | ||||
|     <style> | ||||
|         body { | ||||
|             background: linear-gradient(to right, #1e3c72, #2a5298); | ||||
|             display: flex; | ||||
|             justify-content: center; | ||||
|             align-items: center; | ||||
|             height: 100vh; | ||||
|             margin: 0; | ||||
|             font-family: 'Arial', sans-serif; | ||||
|             color: #fff; | ||||
|         } | ||||
|         .container { | ||||
|             background: rgba(255, 255, 255, 0.1); | ||||
|             padding: 30px; | ||||
|             border-radius: 10px; | ||||
|             box-shadow: 0 10px 30px rgba(0, 0, 0, 0.2); | ||||
|             width: 90%; | ||||
|             max-width: 400px; | ||||
|             animation: fadeIn 1s ease-in-out; | ||||
|             backdrop-filter: blur(10px); | ||||
|             text-align: center; | ||||
|         } | ||||
|         .layui-btn { | ||||
|             width: 100%; | ||||
|         } | ||||
|         .title { | ||||
|             font-size: 24px; | ||||
|             margin-bottom: 20px; | ||||
|         } | ||||
|         @keyframes fadeIn { | ||||
|             from { | ||||
|                 opacity: 0; | ||||
|                 transform: translateY(-20px); | ||||
|             } | ||||
|             to { | ||||
|                 opacity: 1; | ||||
|                 transform: translateY(0); | ||||
|             } | ||||
|         } | ||||
|         input::-webkit-input-placeholder { | ||||
|             color: rgba(255, 255, 255, 0.7); | ||||
|         } | ||||
|         input:-ms-input-placeholder { | ||||
|             color: rgba(255, 255, 255, 0.7); | ||||
|         } | ||||
|         input::-ms-input-placeholder { | ||||
|             color: rgba(255, 255, 255, 0.7); | ||||
|         } | ||||
|         input::placeholder { | ||||
|             color: rgba(255, 255, 255, 0.7); | ||||
|         } | ||||
|         .layui-form-item .layui-input { | ||||
|             background: rgba(255, 255, 255, 0.2); | ||||
|             border: 1px solid rgba(255, 255, 255, 0.3); | ||||
|             color: #fff; | ||||
|         } | ||||
|         .layui-form-item .layui-input:focus { | ||||
|             border-color: #3b82ec; | ||||
|         } | ||||
|         .layui-form-label { | ||||
|             color: #fff; | ||||
|         } | ||||
|         .agreement { | ||||
|             display: flex; | ||||
|             align-items: center; | ||||
|         } | ||||
|         .agreement input { | ||||
|             margin-right: 10px; | ||||
|         } | ||||
|         .agreement a { | ||||
|             color: #3b82ec; | ||||
|             text-decoration: underline; | ||||
|             cursor: pointer; | ||||
|         } | ||||
|     </style> | ||||
| </head> | ||||
| <body> | ||||
| <div class="container"> | ||||
|     <h2 class="title">{% trans "通过 Google 登录" %}</h2> | ||||
|     <p>{% trans "您即将使用来自 Google 的第三方账户登录。" %}</p> | ||||
|     <form class="layui-form" method="post" action="{{ form.action }}" id="googleLoginForm"> | ||||
|         {% csrf_token %} | ||||
|         <div class="layui-form-item agreement"> | ||||
|             <input type="checkbox" id="agreeTerms" lay-skin="primary" lay-verify="checked" title="我已阅读并同意"> | ||||
|             <label for="agreeTerms"><a href="#" id="termsLink">用户注册条款</a></label> | ||||
|         </div> | ||||
|         <button type="submit" class="layui-btn layui-btn-normal" lay-submit lay-filter="submitForm">{% trans "继续" %}</button> | ||||
|     </form> | ||||
| </div> | ||||
| <script src="https://file.guimiaokeji.com/layui/layui.js"></script> | ||||
| <script src="https://file.guimiaokeji.com/layui/jquery-3.6.0.min.js"></script> | ||||
| <script> | ||||
|     layui.use(['form', 'layer'], function() { | ||||
|         var form = layui.form; | ||||
|         var layer = layui.layer; | ||||
|  | ||||
|         // 打开用户注册条款链接 | ||||
|         document.getElementById('termsLink').addEventListener('click', function(event) { | ||||
|             event.preventDefault(); | ||||
|             // 在这里打开你的用户注册条款链接 | ||||
|             window.open('/path/to/your/terms', '_blank'); | ||||
|         }); | ||||
|  | ||||
|         // 自定义验证规则 | ||||
|         form.verify({ | ||||
|  | ||||
|             checked: function(value, item){ | ||||
|                 console.log(1111111111) | ||||
|                 console.log(value) | ||||
|                 console.log(item) | ||||
|                 if(!$('#agreeTerms').prop('checked')){ | ||||
|                     return '请阅读并同意用户注册条款后再继续。'; | ||||
|                 } | ||||
|             } | ||||
|         }); | ||||
|  | ||||
|         // 监听表单提交 | ||||
|         form.on('submit(submitForm)', function(data) { | ||||
|             // 在这里添加处理表单提交的逻辑 | ||||
|             return true; // 阻止表单跳转。如果需要表单跳转,去掉这段即可。 | ||||
|         }); | ||||
|  | ||||
|         form.render(); | ||||
|     }); | ||||
| </script> | ||||
| </body> | ||||
| </html> | ||||
		Reference in New Issue
	
	Block a user
	 root
					root