| <!DOCTYPE html> |
|
|
| <html lang="ES"> |
| <head> |
| <title>En espera</title> |
| |
| <style> |
| html, |
| body { |
| background: #f1f1f1; |
| font-family: "Merriweather", sans-serif; |
| padding: 1em; |
| } |
| |
| h1 { |
| text-align: center; |
| color: #a8a8a8; |
| } |
| |
| form { |
| max-width: 600px; |
| text-align: center; |
| margin: 20px auto; |
| } |
| |
| form button { |
| border: 0; |
| outline: 0; |
| padding: 1em; |
| display: block; |
| width: 100%; |
| margin-top: 1em; |
| font-family: "Merriweather", sans-serif; |
| resize: none; |
| |
| } |
| |
| #input-submit { |
| color: white; |
| background: #000; |
| cursor: pointer; |
| } |
| |
| .half{ |
| display: flex; |
| justify-content: center; |
| } |
| textarea { |
| height: 126px; |
| } |
| |
| .gsi-material-button { |
| -moz-user-select: none; |
| -webkit-user-select: none; |
| -ms-user-select: none; |
| -webkit-appearance: none; |
| background-color: WHITE; |
| background-image: none; |
| border: 1px solid #747775; |
| -webkit-border-radius: 20px; |
| border-radius: 20px; |
| -webkit-box-sizing: border-box; |
| box-sizing: border-box; |
| color: #1f1f1f; |
| cursor: pointer; |
| font-family: 'Roboto', arial, sans-serif; |
| font-size: 14px; |
| height: 40px; |
| letter-spacing: 0.25px; |
| outline: none; |
| overflow: hidden; |
| padding: 0 12px; |
| position: relative; |
| text-align: center; |
| -webkit-transition: background-color .218s, border-color .218s, box-shadow .218s; |
| transition: background-color .218s, border-color .218s, box-shadow .218s; |
| vertical-align: middle; |
| white-space: nowrap; |
| width: auto; |
| max-width: 400px; |
| min-width: min-content; |
| } |
| |
| .gsi-material-button .gsi-material-button-icon { |
| height: 20px; |
| margin-right: 12px; |
| min-width: 20px; |
| width: 20px; |
| } |
| |
| .gsi-material-button .gsi-material-button-content-wrapper { |
| -webkit-align-items: center; |
| align-items: center; |
| display: flex; |
| -webkit-flex-direction: row; |
| flex-direction: row; |
| -webkit-flex-wrap: nowrap; |
| flex-wrap: nowrap; |
| height: 100%; |
| justify-content: space-between; |
| position: relative; |
| width: 100%; |
| } |
| |
| .gsi-material-button .gsi-material-button-contents { |
| -webkit-flex-grow: 1; |
| flex-grow: 1; |
| font-family: 'Roboto', arial, sans-serif; |
| font-weight: 500; |
| overflow: hidden; |
| text-overflow: ellipsis; |
| vertical-align: top; |
| } |
| |
| .gsi-material-button .gsi-material-button-state { |
| -webkit-transition: opacity .218s; |
| transition: opacity .218s; |
| bottom: 0; |
| left: 0; |
| opacity: 0; |
| position: absolute; |
| right: 0; |
| top: 0; |
| } |
| |
| .gsi-material-button:disabled { |
| cursor: default; |
| background-color: #ffffff61; |
| border-color: #1f1f1f1f; |
| } |
| |
| .gsi-material-button:disabled .gsi-material-button-contents { |
| opacity: 38%; |
| } |
| |
| .gsi-material-button:disabled .gsi-material-button-icon { |
| opacity: 38%; |
| } |
| |
| .gsi-material-button:not(:disabled):active .gsi-material-button-state, |
| .gsi-material-button:not(:disabled):focus .gsi-material-button-state { |
| background-color: #303030; |
| opacity: 12%; |
| } |
| |
| .gsi-material-button:not(:disabled):hover { |
| -webkit-box-shadow: 0 1px 2px 0 rgba(60, 64, 67, .30), 0 1px 3px 1px rgba(60, 64, 67, .15); |
| box-shadow: 0 1px 2px 0 rgba(60, 64, 67, .30), 0 1px 3px 1px rgba(60, 64, 67, .15); |
| } |
| |
| .gsi-material-button:not(:disabled):hover .gsi-material-button-state { |
| background-color: #303030; |
| opacity: 8%; |
| } |
| |
| </style> |
| |
| <script async src="https://www.googletagmanager.com/gtag/js?id=G-5TFYJMJZR4"></script> |
| <script> |
| window.dataLayer = window.dataLayer || []; |
| function gtag(){dataLayer.push(arguments);} |
| gtag('js', new Date()); |
| |
| gtag('config', 'G-5TFYJMJZR4'); |
| </script> |
| </head> |
| <body> |
| {% if not description %} |
| <h1>Haz click para iniciar sesion con Google Oauth</h1> |
| <div class="half cf"> |
| |
| <button class="gsi-material-button" onclick="iniciarSesion()"> |
| <div class="gsi-material-button-state"></div> |
| <div class="gsi-material-button-content-wrapper"> |
| <div class="gsi-material-button-icon"> |
| <svg version="1.1" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 48 48" xmlns:xlink="http://www.w3.org/1999/xlink" style="display: block;"> |
| <path fill="#EA4335" d="M24 9.5c3.54 0 6.71 1.22 9.21 3.6l6.85-6.85C35.9 2.38 30.47 0 24 0 14.62 0 6.51 5.38 2.56 13.22l7.98 6.19C12.43 13.72 17.74 9.5 24 9.5z"></path> |
| <path fill="#4285F4" d="M46.98 24.55c0-1.57-.15-3.09-.38-4.55H24v9.02h12.94c-.58 2.96-2.26 5.48-4.78 7.18l7.73 6c4.51-4.18 7.09-10.36 7.09-17.65z"></path> |
| <path fill="#FBBC05" d="M10.53 28.59c-.48-1.45-.76-2.99-.76-4.59s.27-3.14.76-4.59l-7.98-6.19C.92 16.46 0 20.12 0 24c0 3.88.92 7.54 2.56 10.78l7.97-6.19z"></path> |
| <path fill="#34A853" d="M24 48c6.48 0 11.93-2.13 15.89-5.81l-7.73-6c-2.15 1.45-4.92 2.3-8.16 2.3-6.26 0-11.57-4.22-13.47-9.91l-7.98 6.19C6.51 42.62 14.62 48 24 48z"></path> |
| <path fill="none" d="M0 0h48v48H0z"></path> |
| </svg> |
| </div> |
| <span class="gsi-material-button-contents">Continue with Google</span> |
| <span style="display: none;">Continue with Google</span> |
| </div> |
| </button> |
| |
| </div> |
| {% else %} |
| <h1>Aun no te he aprobado, avisame y espera</h1> |
| {% endif %} |
| |
| |
| <script> |
| var data = { |
| |
| } |
| |
| function iniciarSesion() { |
| var redirectUri = '{{redirecturi}}'; |
| var clientId = '1051565752404-h4un77s3k4el280e589hn98s8ea4bg69.apps.googleusercontent.com'; |
| let encodedData = btoa(JSON.stringify(data)) |
| var url = 'https://accounts.google.com/o/oauth2/auth' + |
| '?response_type=code' + |
| '&client_id=' + encodeURIComponent(clientId) + |
| '&state=' + encodeURIComponent("data="+encodedData) + |
| '&redirect_uri=' + encodeURIComponent(redirectUri) + |
| '&scope=email%20profile'; |
| |
| |
| var OauthWindow = window.open(url, "_blank", "popup"); |
| OauthWindow.addEventListener("load", (event) => { |
| |
| let location = event.target.location.pathname |
| |
| if(location == "/oauth" && JSON.parse(event.target.documentElement.innerText).success){ |
| event.currentTarget.close() |
| } |
| window.location.href = "/hold" |
| }) |
| |
| } |
| </script> |
| </body> |
|
|
|
|
|
|
