widget static resources are now built locally

This commit is contained in:
realaravinth
2021-07-07 00:28:32 +05:30
parent 5d55971f19
commit bfebca6e0e
36 changed files with 2086 additions and 168 deletions

View File

@@ -0,0 +1,49 @@
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width" />
<title>mcaptcha demo form</title>
</head>
<body>
<div class="">
<!-- BEGIN: ReCAPTCHA implementation example. -->
<div
id="recaptcha-demo"
class="g-recaptcha"
data-sitekey="6Le-wvkSAAAAAPBMRTvw0Q4Muexq9bi0DJwx_mJ-"
data-callback="onSuccess"
data-action="action"
>
<div style="width: 304px; height: 78px;">
<div>
<iframe
title="mCaptcha"
src="http://localhost:7000/widget"
role="presentation"
name="a-i3v5fjryp9h"
scrolling="no"
sandbox="allow-scripts"
width="304"
height="78"
frameborder="0"
></iframe>
<!-- sandbox="allow-forms allow-popups allow-same-origin allow-scripts allow-top-navigation allow-modals allow-popups-to-escape-sandbox allow-storage-access-by-user-activation" -->
</div>
<textarea
id="g-recaptcha-response"
name="g-recaptcha-response"
class="g-recaptcha-response"
style="width: 250px; height: 40px; border: 1px solid rgb(193, 193, 193); margin: 10px 25px; padding: 0px; resize: none; display: none; --darkreader-inline-border-top:#48443c; --darkreader-inline-border-right:#48443c; --darkreader-inline-border-bottom:#48443c; --darkreader-inline-border-left:#48443c;"
data-darkreader-inline-border-top=""
data-darkreader-inline-border-right=""
data-darkreader-inline-border-bottom=""
data-darkreader-inline-border-left=""
></textarea>
</div>
<iframe style="display: none;"></iframe>
</div>
</script>
</div>
</body>
</html>

124
browser/static/index.html Normal file
View File

@@ -0,0 +1,124 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>mCaptcha</title>
</head>
<body>
<form class="contaienr">
<noscript class="noscript-container">
<span class="warning">
Please enable JavaScript to receive mCaptcha challenge
</span>
<a class="source-code" href="https://github.com/mCaptcha">
Read our source code
</a>
</noscript>
<label class="checkbox-label" for="verification">
<input id="verification" class="checkbox" type="checkbox" />
I'm not a robot
</label>
<div class="details">
<a href="https://mcaptcha.org" class="logo-container">
<img
class="logo"
src="https://mcaptcha.org/icon-trans.png"
alt="mCaptcha logo"
/>
<p class="brand-name">mCaptcha</p>
</a>
<div class="links-container">
<a class="links" href="https://mcaptcha.org/privacy-policy">
Privacy
</a>
<a class="links" href="https://mcaptcha.org/terms">
Terms
</a>
</div>
</div>
</form>
</body>
<style type="text/css" media="screen">
.contaienr {
max-width: 350px;
max-height: 90px;
display: flex;
box-sizing: border-box;
}
.noscript-container {
display: flex;
font-size: 0.7rem;
line-height: 20px;
flex-direction: column;
padding: 5px;
}
.warning {
display: block;
margin: auto;
flex: 2;
width: 100%;
margin: auto;
}
.source-code {
display: block;
flex: 1;
}
.checkbox-label {
display: none;
/*display: flex; */
align-items: center;
line-height: 30px;
flex: 2;
margin: auto;
font-size: 0.99rem;
}
.checkbox {
width: 30px;
height: 30px;
margin: 0 10px;
}
.details {
flex: 1;
display: flex;
flex-direction: column;
box-sizing: border-box;
}
.logo-container {
flex: 2;
padding-top: 5px;
}
.brand-name {
font-size: 0.6rem;
margin: auto;
text-align: center;
}
.logo {
display: block;
width: 45px;
margin: auto;
}
.links-container {
display: flex;
margin: auto;
}
.links {
font-size: 0.5rem;
margin: 5px;
}
</style>
<script>
document.querySelector(".checkbox-label").style.display = "flex";
</script>
</html>