mirrors/mCaptcha
1
0
Fork 0
mirror of https://github.com/mCaptcha/mCaptcha.git synced 2025-02-17 08:59:46 +03:00
Code Issues Projects Releases Packages Wiki Activity

widget: messages for various stages

Browse source
This commit is contained in:
realaravinth 2021-05-29 19:45:56 +05:30
parent fd32f5be32
commit d9cb38ac13
No known key found for this signature in database
GPG key ID: AD9F0F08E855ED88
3 changed files with 38 additions and 2 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

7
templates/widget/index.html
View file

@ -16,7 +16,10 @@
id="widget__verification-checkbox"
class="widget__verification-checkbox"
type="checkbox" />
I'm not a robot
<span class="widget__verification-text--before">I'm not a robot</span>
<span class="widget__verification-text--during">Processing...</span>
<span class="widget__verification-text--after">Verified!</span>
<span class="widget__verification-text--error">Something wen't wrong</span>
</label>
<div class="widget__mcaptcha-details">
<a href="<.= crate::PKG_HOMEPAGE .>"
@ -40,5 +43,5 @@
</a>
</div>
</div>
</div>
</form>
<.include!("./footer.html"); .>

3
templates/widget/index.ts
View file

@ -16,7 +16,10 @@
*/
import './main.scss';
const PARENT = window.parent;
const verificationContainer = <HTMLElement>(
document.querySelector('.widget__verification-container')
);
verificationContainer.style.display = 'flex';
//PARENT.postMessage

30
templates/widget/main.scss
View file

@ -64,6 +64,36 @@
margin: 0 10px;
}
.widget__verification-text--during {
display: none;
}
.widget__verification-text--after {
display: none;
color: green;
}
.widget__verification-text--error {
display: none;
color: red;
}
.widget__verification-checkbox:checked ~ .widget__verification-text--before {
display: none;
}
.widget__verification-checkbox:checked ~ .widget__verification-text--during {
display: non;
}
.widget__verification-checkbox:checked ~ .widget__verification-text--error {
display: none;
}
.widget__verification-checkbox:checked ~ .widget__verification-text--after {
display: block;
}
.widget__mcaptcha-details {
flex: 1;
display: flex;