login.html (3157B)
1 <!DOCTYPE html> 2 <html> 3 4 <head> 5 <meta charset="utf-8"> 6 <meta name="viewport" content="width=device-width, initial-scale=1"> 7 <title>CB | {{ page_title }}</title> 8 9 <link rel="stylesheet" href="{{ url_for('static', filename='css/materialize.min.css') }}"> 10 <link href="https://fonts.googleapis.com/icon?family=Material+Icons" rel="stylesheet"> 11 <script defer src="{{ url_for('static', filename='js/materialize.min.js') }}"></script> 12 <link rel="preconnect" href="https://fonts.googleapis.com"> 13 <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin> 14 <link href="https://fonts.googleapis.com/css2?family=Roboto:wght@100&display=swap" rel="stylesheet"> 15 <style> 16 17 body { 18 background-color: #f4f4f4; 19 } 20 21 .container .z-depth-1 { 22 background-color: #ffffff; 23 box-shadow: 0px 0px 10px rgba(0, 0, 0, 0.1); 24 } 25 26 /* Existing styles for input fields */ 27 .input-field input:focus { 28 border-bottom: 1px solid #2c3e50; 29 box-shadow: 0 1px 0 0 #2c3e50; 30 } 31 32 .input-field input:focus + label { 33 color: #2c3e50; 34 } 35 36 input:-webkit-autofill, 37 input:-webkit-autofill:hover, 38 input:-webkit-autofill:focus, 39 input:-webkit-autofill:active { 40 -webkit-box-shadow: 0 0 0 30px #f4f4f4 inset !important; 41 } 42 </style> 43 </head> 44 45 46 <body> 47 <main> 48 <center> 49 <div class="section"></div> 50 <div class="container"> 51 <div class="z-depth-1 grey lighten-4 card-panel" style="max-width:350px; padding: 40px 30px 30px 30px; border: 1px solid #EEE;"> 52 <form class="col s12" method="post"> 53 <h5 class="login-label">Login</h5> 54 <div class='row'> 55 <div class='input-field col s12'> 56 <input class='validate' type='text' name='username' id='username' /> 57 <label for='username'>Username</label> 58 </div> 59 </div> 60 <div class='row'> 61 <div class='input-field col s12'> 62 <input class='validate' type='password' name='password' id='password' /> 63 <label for='password'>Password</label> 64 </div> 65 </div> 66 <div class='row'> 67 <button type='submit' name='btn_login' class='col s12 btn btn-large waves-effect indigo'>Login</button> 68 </div> 69 <div class='row'> 70 Server: 71 <span id="domain-label"></span> 72 </div> 73 </form> 74 </div> 75 </div> 76 </center> 77 </main> 78 <script> 79 document.addEventListener('DOMContentLoaded', function() { 80 var serverDomain = window.location.hostname; 81 document.getElementById('domain-label').textContent = serverDomain; 82 }); 83 </script> 84 </body> 85 86 </html>