diff --git a/templates/widget/index.html b/templates/widget/index.html
index e7b4f0b7..bbee2b0f 100644
--- a/templates/widget/index.html
+++ b/templates/widget/index.html
@@ -16,7 +16,10 @@
id="widget__verification-checkbox"
class="widget__verification-checkbox"
type="checkbox" />
- I'm not a robot
+ I'm not a robot
+ Processing...
+ Verified!
+ Something wen't wrong
-
+
<.include!("./footer.html"); .>
diff --git a/templates/widget/index.ts b/templates/widget/index.ts
index d043c787..61832223 100644
--- a/templates/widget/index.ts
+++ b/templates/widget/index.ts
@@ -16,7 +16,10 @@
*/
import './main.scss';
+const PARENT = window.parent;
const verificationContainer = (
document.querySelector('.widget__verification-container')
);
verificationContainer.style.display = 'flex';
+
+//PARENT.postMessage
diff --git a/templates/widget/main.scss b/templates/widget/main.scss
index 73d57735..8c131bd7 100644
--- a/templates/widget/main.scss
+++ b/templates/widget/main.scss
@@ -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;