-
Notifications
You must be signed in to change notification settings - Fork 0
/
ui.html
93 lines (77 loc) · 2.4 KB
/
ui.html
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
<body>
<h2 id="title-plugin">Nepali Faker</h2>
<p>
<input
id="search-bar"
type="text"
placeholder="Search for available options"
/>
</p>
<available-options id="available-options">
<button id="first-name">First Name</button>
<button id="last-name">Last Name</button>
<button id="full-name">Full Name</button>
<button id="phn">Phone Number</button>
<button id="address">Address</button>
<button id="email">Email Address</button>
<button id="date">Date</button>
</available-options>
</body>
<style>
body {
background-color: #f5f5f5;
height: 500px;
}
#title-plugin {
/* font-size: 1.5em; */
font-weight: bold;
margin-bottom: 1em;
padding-left: 4%;
color: rgb(56, 55, 55);
}
button {
text-align: left;
display: block;
width: 92%;
border: none;
color: rgb(56, 55, 55);
border-radius: 5%;
margin: 4% 4%;
padding: 2% 6%;
}
button:hover {
background-color: rgb(56, 55, 55);
color: white;
cursor: pointer;
}
#search-bar {
border-radius: 4px;
border: solid 0.5px #817f7f;
margin: 1.3% 4%;
padding: 2% 6%;
width: 92%;
}
</style>
<script>
document.getElementById("first-name").addEventListener("click", function() {
parent.postMessage({ pluginMessage: { type: 'first-name' } }, "*");
});
document.getElementById("last-name").addEventListener("click", function() {
parent.postMessage({ pluginMessage: { type: 'last-name' } }, "*");
});
document.getElementById("full-name").addEventListener("click", function() {
parent.postMessage({ pluginMessage: { type: 'full-name' } }, "*");
});
document.getElementById("phn").addEventListener("click", function() {
parent.postMessage({ pluginMessage: { type: 'phn' } }, "*");
});
document.getElementById("address").addEventListener("click", function() {
parent.postMessage({ pluginMessage: { type: 'address' } }, "*");
});
document.getElementById("email").addEventListener("click", function() {
parent.postMessage({ pluginMessage: { type: 'email' } }, "*");
});
document.getElementById("date").addEventListener("click", function() {
parent.postMessage({ pluginMessage: { type: 'date' } }, "*");
});
</script>