@digital-ai/dot-illustrations 1.0.26 → 1.0.28
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/integrations/demo/demo.css +70 -40
- package/integrations/demo/index.html +4 -625
- package/integrations/demo/script.js +226 -47
- package/package.json +1 -1
|
@@ -3,33 +3,19 @@
|
|
|
3
3
|
}
|
|
4
4
|
|
|
5
5
|
body {
|
|
6
|
-
font-family: 'Lucida Sans', Arial, sans-serif;
|
|
6
|
+
font-family: 'Trebuchet MS', 'Lucida Sans Unicode', 'Lucida Grande', 'Lucida Sans', Arial, sans-serif;
|
|
7
7
|
margin: 0 auto;
|
|
8
8
|
height: 100%;
|
|
9
9
|
text-align: center;
|
|
10
10
|
overflow-y: hidden;
|
|
11
11
|
}
|
|
12
12
|
|
|
13
|
-
.top-link{
|
|
14
|
-
color: cornflowerblue;
|
|
15
|
-
opacity: 1;
|
|
16
|
-
}
|
|
17
|
-
|
|
18
|
-
.top-link:hover{
|
|
19
|
-
color: cornflowerblue;
|
|
20
|
-
}
|
|
21
|
-
|
|
22
|
-
a {
|
|
23
|
-
opacity: 0;
|
|
24
|
-
font-size: 14px;
|
|
25
|
-
color: cornflowerblue;
|
|
26
|
-
}
|
|
27
|
-
|
|
28
|
-
a:hover {
|
|
29
|
-
color:rgb(198, 215, 238);
|
|
30
|
-
}
|
|
31
|
-
|
|
32
13
|
.search-wrapper {
|
|
14
|
+
border-radius: 4px;
|
|
15
|
+
border: #878f9a 1px solid;
|
|
16
|
+
top: 0;
|
|
17
|
+
background-color: #fff;
|
|
18
|
+
z-index: 999;
|
|
33
19
|
display: flex;
|
|
34
20
|
width: 720px;
|
|
35
21
|
height: 48px;
|
|
@@ -38,11 +24,6 @@ a:hover {
|
|
|
38
24
|
gap: 4px;
|
|
39
25
|
padding-left: 12px;
|
|
40
26
|
padding-right: 12px;
|
|
41
|
-
|
|
42
|
-
/* new added code */
|
|
43
|
-
top: 0;
|
|
44
|
-
background-color: #fff;
|
|
45
|
-
z-index: 999;
|
|
46
27
|
}
|
|
47
28
|
|
|
48
29
|
input {
|
|
@@ -62,16 +43,16 @@ input {
|
|
|
62
43
|
align-content: flex-start;
|
|
63
44
|
}
|
|
64
45
|
|
|
65
|
-
.demo-wrapper>div {
|
|
46
|
+
.demo-wrapper > div {
|
|
66
47
|
z-index: 1;
|
|
67
48
|
display: grid;
|
|
68
49
|
grid-template-rows: 1fr 1fr;
|
|
69
50
|
width: 220px;
|
|
70
51
|
height: 220px;
|
|
71
|
-
min-height: 220px;
|
|
72
52
|
min-width: 220px;
|
|
73
|
-
max-width:
|
|
74
|
-
max-height:
|
|
53
|
+
max-width: 460px;
|
|
54
|
+
max-height: 460px;
|
|
55
|
+
min-height: 220px;
|
|
75
56
|
overflow: hidden;
|
|
76
57
|
background: #fff;
|
|
77
58
|
margin: 16px;
|
|
@@ -84,12 +65,12 @@ input {
|
|
|
84
65
|
position: relative;
|
|
85
66
|
}
|
|
86
67
|
|
|
87
|
-
.demo-wrapper>div:hover{
|
|
68
|
+
.demo-wrapper > div:hover {
|
|
88
69
|
opacity: 0.7;
|
|
89
70
|
background: var(--Overlay-colors-default-overlay, #3B485C);
|
|
71
|
+
z-index: 2;
|
|
90
72
|
}
|
|
91
73
|
|
|
92
|
-
|
|
93
74
|
img {
|
|
94
75
|
align-items: center;
|
|
95
76
|
height: 72px;
|
|
@@ -107,16 +88,27 @@ span {
|
|
|
107
88
|
flex-wrap: wrap;
|
|
108
89
|
font-family: 'Lato', sans-serif;
|
|
109
90
|
font-size: 14px;
|
|
110
|
-
margin-top:
|
|
91
|
+
margin-top: -10px;
|
|
111
92
|
text-align: center;
|
|
112
93
|
color: #667385;
|
|
113
94
|
z-index: 0;
|
|
114
95
|
}
|
|
115
96
|
|
|
97
|
+
|
|
98
|
+
.copy-container{}
|
|
99
|
+
|
|
100
|
+
/* Align buttons vertically in the nested div */
|
|
101
|
+
.button-group {
|
|
102
|
+
display: flex;
|
|
103
|
+
flex-direction: column; /* Stack buttons vertically */
|
|
104
|
+
align-items: center; /* Center buttons horizontally */
|
|
105
|
+
gap: 15px; /* Add spacing between the buttons */
|
|
106
|
+
}
|
|
107
|
+
|
|
116
108
|
.button {
|
|
109
|
+
position: relative; /* Make tooltip positioning relative to button */
|
|
117
110
|
opacity: 0;
|
|
118
111
|
transition: opacity 0.3s ease;
|
|
119
|
-
transform: translate(-50%, -50%);
|
|
120
112
|
border: solid 1px #667385;
|
|
121
113
|
border-radius: 4px;
|
|
122
114
|
background: #FFF;
|
|
@@ -125,20 +117,58 @@ span {
|
|
|
125
117
|
font-size: 16px;
|
|
126
118
|
padding: 8px 16px;
|
|
127
119
|
z-index: 29;
|
|
128
|
-
|
|
129
|
-
top: 50%;
|
|
130
|
-
left: 50%;
|
|
120
|
+
margin-bottom: 8px;
|
|
131
121
|
}
|
|
132
122
|
|
|
133
123
|
.demo-wrapper div:hover .button {
|
|
134
124
|
opacity: 1;
|
|
135
125
|
}
|
|
136
126
|
|
|
137
|
-
.demo-wrapper div:hover
|
|
127
|
+
.demo-wrapper div:hover img {
|
|
128
|
+
opacity: 0.5;
|
|
129
|
+
}
|
|
130
|
+
|
|
131
|
+
.tooltiptext {
|
|
132
|
+
visibility: hidden;
|
|
133
|
+
background-color: black;
|
|
134
|
+
color: #fff;
|
|
135
|
+
text-align: center;
|
|
136
|
+
border-radius: 5px;
|
|
137
|
+
padding: 5px;
|
|
138
|
+
position: absolute;
|
|
139
|
+
z-index: 1;
|
|
140
|
+
bottom: 125%; /* Position the tooltip above the button */
|
|
141
|
+
left: 50%;
|
|
142
|
+
transform: translateX(-50%);
|
|
143
|
+
opacity: 0;
|
|
144
|
+
transition: opacity 0.3s;
|
|
145
|
+
white-space: nowrap; /* Prevent text wrapping */
|
|
146
|
+
}
|
|
147
|
+
|
|
148
|
+
.button:hover .tooltiptext {
|
|
149
|
+
visibility: visible;
|
|
138
150
|
opacity: 1;
|
|
139
|
-
color: #C1C6CD;
|
|
140
151
|
}
|
|
141
152
|
|
|
142
|
-
|
|
143
|
-
|
|
153
|
+
|
|
154
|
+
.codeBlock {
|
|
155
|
+
visibility: hidden;
|
|
156
|
+
white-space: pre-wrap; /* Preserve code formatting */
|
|
157
|
+
background-color: #f4f4f4;
|
|
158
|
+
padding: 10px;
|
|
159
|
+
border: 1px solid #ddd;
|
|
160
|
+
border-radius: 5px;
|
|
161
|
+
max-width: 300px; /* Optional: limit code block width */
|
|
162
|
+
overflow: auto; /* Scroll if content is too wide */
|
|
144
163
|
}
|
|
164
|
+
|
|
165
|
+
.codeInclude {
|
|
166
|
+
color: rgb(43, 50, 55);
|
|
167
|
+
white-space: pre-wrap; /* Preserve code formatting */
|
|
168
|
+
background-color: #f4f4f4;
|
|
169
|
+
padding: 10px;
|
|
170
|
+
border: 1px solid #ddd;
|
|
171
|
+
border-radius: 5px;
|
|
172
|
+
max-width: 300px; /* Optional: limit code block width */
|
|
173
|
+
overflow: auto; /* Scroll if content is too wide */
|
|
174
|
+
}
|
|
@@ -14,631 +14,10 @@
|
|
|
14
14
|
<a href="https://github.com/digital-ai/dot-illustrations/tree/main/integrations" target="_blank" class="top-link">
|
|
15
15
|
https://github.com/digital-ai/dot-illustrations/tree/main/integrations
|
|
16
16
|
</a>
|
|
17
|
-
</p>
|
|
18
|
-
|
|
19
|
-
<div class="demo-wrapper dot-integration">
|
|
20
|
-
|
|
21
|
-
|
|
22
|
-
<div>
|
|
23
|
-
<img class="agility"></i>
|
|
24
|
-
<button class="button" onclick="copyText(this)">Copy ID</button>
|
|
25
|
-
<span class="integrationIDelement">agility</span>
|
|
26
|
-
<a href="https://digital.ai/privacy-policy/" target="_blank">Privacy policy</a>
|
|
27
|
-
</div>
|
|
28
|
-
|
|
29
|
-
<div>
|
|
30
|
-
<img class="amazon-eks"></i>
|
|
31
|
-
<button class="button" onclick="copyText(this)">Copy ID</button>
|
|
32
|
-
<span class="integrationIDelement">amazon-eks</span>
|
|
33
|
-
<a href="https://www.microsoft.com/en-us/legal/intellectualproperty/trademarks" target="_blank">Privacy policy</a>
|
|
34
|
-
</div>
|
|
35
|
-
|
|
36
|
-
<div>
|
|
37
|
-
<img class="ansible"></i>
|
|
38
|
-
<button class="button" onclick="copyText(this)">Copy ID</button>
|
|
39
|
-
<span class="integrationIDelement">ansible</span>
|
|
40
|
-
<a href="https://www.redhat.com/en/about/trademark-guidelines-and-policies" target="_blank">Privacy policy</a>
|
|
41
|
-
</div>
|
|
42
|
-
|
|
43
|
-
<div>
|
|
44
|
-
<img class="apache-tomcat"></i>
|
|
45
|
-
<button class="button" onclick="copyText(this)">Copy ID</button>
|
|
46
|
-
<span class="integrationIDelement">apache-tomcat</span>
|
|
47
|
-
<a href="https://tomcat.apache.org/legal.html" target="_blank">Privacy policy</a>
|
|
48
|
-
</div>
|
|
49
|
-
|
|
50
|
-
<div>
|
|
51
|
-
<img class="app-aware">
|
|
52
|
-
<button class="button" onclick="copyText(this)">Copy ID</button>
|
|
53
|
-
<span class="integrationIDelement">app-aware</span>
|
|
54
|
-
<a href="#" target="_blank">Privacy policy</a>
|
|
55
|
-
</div>
|
|
56
|
-
<div>
|
|
57
|
-
<img class="app-dynamics">
|
|
58
|
-
<button class="button" onclick="copyText(this)">Copy ID</button>
|
|
59
|
-
<span class="integrationIDelement">app-dynamics</span>
|
|
60
|
-
<a href="#" target="_blank">Privacy policy</a>
|
|
61
|
-
</div>
|
|
62
|
-
<div>
|
|
63
|
-
<img class="app-management">
|
|
64
|
-
<button class="button" onclick="copyText(this)">Copy ID</button>
|
|
65
|
-
<span class="integrationIDelement">app-management</span>
|
|
66
|
-
<a href="#" target="_blank">Privacy policy</a>
|
|
67
|
-
</div>
|
|
68
|
-
<div>
|
|
69
|
-
<img class="application-protection">
|
|
70
|
-
<button class="button" onclick="copyText(this)">Copy ID</button>
|
|
71
|
-
<span class="integrationIDelement">application-protection</span>
|
|
72
|
-
<a href="#" target="_blank">Privacy policy</a>
|
|
73
|
-
</div>
|
|
74
|
-
<div>
|
|
75
|
-
<img class="aras">
|
|
76
|
-
<button class="button" onclick="copyText(this)">Copy ID</button>
|
|
77
|
-
<span class="integrationIDelement">aras</span>
|
|
78
|
-
<a href="#" target="_blank">Privacy policy</a>
|
|
79
|
-
</div>
|
|
80
|
-
<div>
|
|
81
|
-
<img class="arc-sight">
|
|
82
|
-
<button class="button" onclick="copyText(this)">Copy ID</button>
|
|
83
|
-
<span class="integrationIDelement">arc-sight</span>
|
|
84
|
-
<a href="#" target="_blank">Privacy policy</a>
|
|
85
|
-
</div>
|
|
86
|
-
<div>
|
|
87
|
-
<img class="argocd">
|
|
88
|
-
<button class="button" onclick="copyText(this)">Copy ID</button>
|
|
89
|
-
<span class="integrationIDelement">argocd</span>
|
|
90
|
-
<a href="#" target="_blank">Privacy policy</a>
|
|
91
|
-
</div>
|
|
92
|
-
<div>
|
|
93
|
-
<img class="atlassian">
|
|
94
|
-
<button class="button" onclick="copyText(this)">Copy ID</button>
|
|
95
|
-
<span class="integrationIDelement">atlassian</span>
|
|
96
|
-
<a href="#" target="_blank">Privacy policy</a>
|
|
97
|
-
</div>
|
|
98
|
-
<div>
|
|
99
|
-
<img class="avaya">
|
|
100
|
-
<button class="button" onclick="copyText(this)">Copy ID</button>
|
|
101
|
-
<span class="integrationIDelement">avaya</span>
|
|
102
|
-
<a href="#" target="_blank">Privacy policy</a>
|
|
103
|
-
</div>
|
|
104
|
-
<div>
|
|
105
|
-
<img class="aws">
|
|
106
|
-
<button class="button" onclick="copyText(this)">Copy ID</button>
|
|
107
|
-
<span class="integrationIDelement">aws</span>
|
|
108
|
-
<a href="#" target="_blank">Privacy policy</a>
|
|
109
|
-
</div>
|
|
110
|
-
<div>
|
|
111
|
-
<img class="azure">
|
|
112
|
-
<button class="button" onclick="copyText(this)">Copy ID</button>
|
|
113
|
-
<span class="integrationIDelement">azure</span>
|
|
114
|
-
<a href="#" target="_blank">Privacy policy</a>
|
|
115
|
-
</div>
|
|
116
|
-
<div>
|
|
117
|
-
<img class="azure-aks-2">
|
|
118
|
-
<button class="button" onclick="copyText(this)">Copy ID</button>
|
|
119
|
-
<span class="integrationIDelement">azure-aks-2</span>
|
|
120
|
-
<a href="#" target="_blank">Privacy policy</a>
|
|
121
|
-
</div>
|
|
122
|
-
<div>
|
|
123
|
-
<img class="azure-devops-tfs">
|
|
124
|
-
<button class="button" onclick="copyText(this)">Copy ID</button>
|
|
125
|
-
<span class="integrationIDelement">azure-devops-tfs</span>
|
|
126
|
-
<a href="#" target="_blank">Privacy policy</a>
|
|
127
|
-
</div>
|
|
128
|
-
<div>
|
|
129
|
-
<img class="azure-functions">
|
|
130
|
-
<button class="button" onclick="copyText(this)">Copy ID</button>
|
|
131
|
-
<span class="integrationIDelement">azure-functions</span>
|
|
132
|
-
<a href="#" target="_blank">Privacy policy</a>
|
|
133
|
-
</div>
|
|
134
|
-
<div>
|
|
135
|
-
<img class="bamboo">
|
|
136
|
-
<button class="button" onclick="copyText(this)">Copy ID</button>
|
|
137
|
-
<span class="integrationIDelement">bamboo</span>
|
|
138
|
-
<a href="#" target="_blank">Privacy policy</a>
|
|
139
|
-
</div>
|
|
140
|
-
<div>
|
|
141
|
-
<img class="bit-bucket">
|
|
142
|
-
<button class="button" onclick="copyText(this)">Copy ID</button>
|
|
143
|
-
<span class="integrationIDelement">bit-bucket</span>
|
|
144
|
-
<a href="#" target="_blank">Privacy policy</a>
|
|
145
|
-
</div>
|
|
146
|
-
<div>
|
|
147
|
-
<img class="biztalk">
|
|
148
|
-
<button class="button" onclick="copyText(this)">Copy ID</button>
|
|
149
|
-
<span class="integrationIDelement">biztalk</span>
|
|
150
|
-
<a href="#" target="_blank">Privacy policy</a>
|
|
151
|
-
</div>
|
|
152
|
-
<div>
|
|
153
|
-
<img class="black-duck">
|
|
154
|
-
<button class="button" onclick="copyText(this)">Copy ID</button>
|
|
155
|
-
<span class="integrationIDelement">black-duck</span>
|
|
156
|
-
<a href="#" target="_blank">Privacy policy</a>
|
|
157
|
-
</div>
|
|
158
|
-
<div>
|
|
159
|
-
<img class="blazemeter">
|
|
160
|
-
<button class="button" onclick="copyText(this)">Copy ID</button>
|
|
161
|
-
<span class="integrationIDelement">blazemeter</span>
|
|
162
|
-
<a href="#" target="_blank">Privacy policy</a>
|
|
163
|
-
</div>
|
|
164
|
-
<div>
|
|
165
|
-
<img class="bmc-helix">
|
|
166
|
-
<button class="button" onclick="copyText(this)">Copy ID</button>
|
|
167
|
-
<span class="integrationIDelement">bmc-helix</span>
|
|
168
|
-
<a href="#" target="_blank">Privacy policy</a>
|
|
169
|
-
</div>
|
|
170
|
-
<div>
|
|
171
|
-
<img class="checkmarx">
|
|
172
|
-
<button class="button" onclick="copyText(this)">Copy ID</button>
|
|
173
|
-
<span class="integrationIDelement">checkmarx</span>
|
|
174
|
-
<a href="#" target="_blank">Privacy policy</a>
|
|
175
|
-
</div>
|
|
176
|
-
<div>
|
|
177
|
-
<img class="chef">
|
|
178
|
-
<button class="button" onclick="copyText(this)">Copy ID</button>
|
|
179
|
-
<span class="integrationIDelement">chef</span>
|
|
180
|
-
<a href="#" target="_blank">Privacy policy</a>
|
|
181
|
-
</div>
|
|
182
|
-
<div>
|
|
183
|
-
<img class="chrome">
|
|
184
|
-
<button class="button" onclick="copyText(this)">Copy ID</button>
|
|
185
|
-
<span class="integrationIDelement">chrome</span>
|
|
186
|
-
<a href="#" target="_blank">Privacy policy</a>
|
|
187
|
-
</div>
|
|
188
|
-
<div>
|
|
189
|
-
<img class="cisco">
|
|
190
|
-
<button class="button" onclick="copyText(this)">Copy ID</button>
|
|
191
|
-
<span class="integrationIDelement">cisco</span>
|
|
192
|
-
<a href="#" target="_blank">Privacy policy</a>
|
|
193
|
-
</div>
|
|
194
|
-
<div>
|
|
195
|
-
<img class="citrix">
|
|
196
|
-
<button class="button" onclick="copyText(this)">Copy ID</button>
|
|
197
|
-
<span class="integrationIDelement">citrix</span>
|
|
198
|
-
<a href="#" target="_blank">Privacy policy</a>
|
|
199
|
-
</div>
|
|
200
|
-
<div>
|
|
201
|
-
<img class="clarity-ppm">
|
|
202
|
-
<button class="button" onclick="copyText(this)">Copy ID</button>
|
|
203
|
-
<span class="integrationIDelement">clarity-ppm</span>
|
|
204
|
-
<a href="#" target="_blank">Privacy policy</a>
|
|
205
|
-
</div>
|
|
206
|
-
<div>
|
|
207
|
-
<img class="cloud-foundry">
|
|
208
|
-
<button class="button" onclick="copyText(this)">Copy ID</button>
|
|
209
|
-
<span class="integrationIDelement">cloud-foundry</span>
|
|
210
|
-
<a href="#" target="_blank">Privacy policy</a>
|
|
211
|
-
</div>
|
|
212
|
-
<div>
|
|
213
|
-
<img class="continuostesting">
|
|
214
|
-
<button class="button" onclick="copyText(this)">Copy ID</button>
|
|
215
|
-
<span class="integrationIDelement">continuostesting</span>
|
|
216
|
-
<a href="#" target="_blank">Privacy policy</a>
|
|
217
|
-
</div>
|
|
218
|
-
<div>
|
|
219
|
-
<img class="cyberark">
|
|
220
|
-
<button class="button" onclick="copyText(this)">Copy ID</button>
|
|
221
|
-
<span class="integrationIDelement">cyberark</span>
|
|
222
|
-
<a href="#" target="_blank">Privacy policy</a>
|
|
223
|
-
</div>
|
|
224
|
-
<div>
|
|
225
|
-
<img class="dai-logo">
|
|
226
|
-
<button class="button" onclick="copyText(this)">Copy ID</button>
|
|
227
|
-
<span class="integrationIDelement">dai-logo</span>
|
|
228
|
-
<a href="#" target="_blank">Privacy policy</a>
|
|
229
|
-
</div>
|
|
230
|
-
<div>
|
|
231
|
-
<img class="delphix">
|
|
232
|
-
<button class="button" onclick="copyText(this)">Copy ID</button>
|
|
233
|
-
<span class="integrationIDelement">delpix</span>
|
|
234
|
-
</div>
|
|
235
|
-
|
|
236
|
-
<div>
|
|
237
|
-
<img class="deploy">
|
|
238
|
-
<button class="button" onclick="copyText(this)">Copy ID</button>
|
|
239
|
-
<span class="integrationIDelement">deploy</span>
|
|
240
|
-
<a href="#" target="_blank">Privacy policy</a>
|
|
241
|
-
</div>
|
|
242
|
-
<div>
|
|
243
|
-
<img class="docker">
|
|
244
|
-
<button class="button" onclick="copyText(this)">Copy ID</button>
|
|
245
|
-
<span class="integrationIDelement">docker</span>
|
|
246
|
-
<a href="#" target="_blank">Privacy policy</a>
|
|
247
|
-
</div>
|
|
248
|
-
<div>
|
|
249
|
-
<img class="docker-compose">
|
|
250
|
-
<button class="button" onclick="copyText(this)">Copy ID</button>
|
|
251
|
-
<span class="integrationIDelement">docker-compose</span>
|
|
252
|
-
<a href="#" target="_blank">Privacy policy</a>
|
|
253
|
-
</div>
|
|
254
|
-
<div>
|
|
255
|
-
<img class="dynatrace">
|
|
256
|
-
<button class="button" onclick="copyText(this)">Copy ID</button>
|
|
257
|
-
<span class="integrationIDelement">dynatrace</span>
|
|
258
|
-
<a href="#" target="_blank">Privacy policy</a>
|
|
259
|
-
</div>
|
|
260
|
-
<div>
|
|
261
|
-
<img class="edge">
|
|
262
|
-
<button class="button" onclick="copyText(this)">Copy ID</button>
|
|
263
|
-
<span class="integrationIDelement">edge</span>
|
|
264
|
-
<a href="#" target="_blank">Privacy policy</a>
|
|
265
|
-
</div>
|
|
266
|
-
<div>
|
|
267
|
-
<img class="essential-app-protection">
|
|
268
|
-
<button class="button" onclick="copyText(this)">Copy ID</button>
|
|
269
|
-
<span class="integrationIDelement">essential-app-protection</span>
|
|
270
|
-
<a href="#" target="_blank">Privacy policy</a>
|
|
271
|
-
</div>
|
|
272
|
-
<div>
|
|
273
|
-
<img class="explorer">
|
|
274
|
-
<button class="button" onclick="copyText(this)">Copy ID</button>
|
|
275
|
-
<span class="integrationIDelement">explorer</span>
|
|
276
|
-
<a href="#" target="_blank">Privacy policy</a>
|
|
277
|
-
</div>
|
|
278
|
-
<div>
|
|
279
|
-
<img class="f5">
|
|
280
|
-
<button class="button" onclick="copyText(this)">Copy ID</button>
|
|
281
|
-
<span class="integrationIDelement">f5</span>
|
|
282
|
-
<a href="#" target="_blank">Privacy policy</a>
|
|
283
|
-
</div>
|
|
284
|
-
<div>
|
|
285
|
-
<img class="firefox">
|
|
286
|
-
<button class="button" onclick="copyText(this)">Copy ID</button>
|
|
287
|
-
<span class="integrationIDelement">firefox</span>
|
|
288
|
-
<a href="#" target="_blank">Privacy policy</a>
|
|
289
|
-
</div>
|
|
290
|
-
<div>
|
|
291
|
-
<img class="fortify">
|
|
292
|
-
<button class="button" onclick="copyText(this)">Copy ID</button>
|
|
293
|
-
<span class="integrationIDelement">fortify</span>
|
|
294
|
-
<a href="#" target="_blank">Privacy policy</a>
|
|
295
|
-
</div>
|
|
296
|
-
<div>
|
|
297
|
-
<img class="fortify-on-demand">
|
|
298
|
-
<button class="button" onclick="copyText(this)">Copy ID</button>
|
|
299
|
-
<span class="integrationIDelement">fortify-on-demand</span>
|
|
300
|
-
<a href="#" target="_blank">Privacy policy</a>
|
|
301
|
-
</div>
|
|
302
|
-
<div>
|
|
303
|
-
<img class="free-marker">
|
|
304
|
-
<button class="button" onclick="copyText(this)">Copy ID</button>
|
|
305
|
-
<span class="integrationIDelement">free-marker</span>
|
|
306
|
-
<a href="#" target="_blank">Privacy policy</a>
|
|
307
|
-
</div>
|
|
308
|
-
<div>
|
|
309
|
-
<img class="git-ops">
|
|
310
|
-
<button class="button" onclick="copyText(this)">Copy ID</button>
|
|
311
|
-
<span class="integrationIDelement">git-ops</span>
|
|
312
|
-
<a href="#" target="_blank">Privacy policy</a>
|
|
313
|
-
</div>
|
|
314
|
-
<div>
|
|
315
|
-
<img class="github">
|
|
316
|
-
<button class="button" onclick="copyText(this)">Copy ID</button>
|
|
317
|
-
<span class="integrationIDelement">github</span>
|
|
318
|
-
<a href="#" target="_blank">Privacy policy</a>
|
|
319
|
-
</div>
|
|
320
|
-
<div>
|
|
321
|
-
<img class="github-actions">
|
|
322
|
-
<button class="button" onclick="copyText(this)">Copy ID</button>
|
|
323
|
-
<span class="integrationIDelement">github-actions</span>
|
|
324
|
-
<a href="#" target="_blank">Privacy policy</a>
|
|
325
|
-
</div>
|
|
326
|
-
<div>
|
|
327
|
-
<img class="gitlab">
|
|
328
|
-
<button class="button" onclick="copyText(this)">Copy ID</button>
|
|
329
|
-
<span class="integrationIDelement">gitlab</span>
|
|
330
|
-
<a href="#" target="_blank">Privacy policy</a>
|
|
331
|
-
</div>
|
|
332
|
-
<div>
|
|
333
|
-
<img class="google-cloud">
|
|
334
|
-
<button class="button" onclick="copyText(this)">Copy ID</button>
|
|
335
|
-
<span class="integrationIDelement">google-cloud</span>
|
|
336
|
-
<a href="#" target="_blank">Privacy policy</a>
|
|
337
|
-
</div>
|
|
338
|
-
<div>
|
|
339
|
-
<img class="google-cloud-functions">
|
|
340
|
-
<button class="button" onclick="copyText(this)">Copy ID</button>
|
|
341
|
-
<span class="integrationIDelement">google-cloud-functions</span>
|
|
342
|
-
<a href="#" target="_blank">Privacy policy</a>
|
|
343
|
-
</div>
|
|
344
|
-
<div>
|
|
345
|
-
<img class="google">
|
|
346
|
-
<button class="button" onclick="copyText(this)">Copy ID</button>
|
|
347
|
-
<span class="integrationIDelement">google</span>
|
|
348
|
-
<a href="#" target="_blank">Privacy policy</a>
|
|
349
|
-
</div>
|
|
350
|
-
<div>
|
|
351
|
-
<img class="hashi-corp-vault">
|
|
352
|
-
<button class="button" onclick="copyText(this)">Copy ID</button>
|
|
353
|
-
<span class="integrationIDelement">hashi-corp-vault</span>
|
|
354
|
-
<a href="#" target="_blank">Privacy policy</a>
|
|
355
|
-
</div>
|
|
356
|
-
<div>
|
|
357
|
-
<img class="helm">
|
|
358
|
-
<button class="button" onclick="copyText(this)">Copy ID</button>
|
|
359
|
-
<span class="integrationIDelement">helm</span>
|
|
360
|
-
<a href="#" target="_blank">Privacy policy</a>
|
|
361
|
-
</div>
|
|
362
|
-
<div>
|
|
363
|
-
<img class="ibm">
|
|
364
|
-
<button class="button" onclick="copyText(this)">Copy ID</button>
|
|
365
|
-
<span class="integrationIDelement">ibm</span>
|
|
366
|
-
<a href="#" target="_blank">Privacy policy</a>
|
|
367
|
-
</div>
|
|
368
|
-
<div>
|
|
369
|
-
<img class="ingress">
|
|
370
|
-
<button class="button" onclick="copyText(this)">Copy ID</button>
|
|
371
|
-
<span class="integrationIDelement">ingress</span>
|
|
372
|
-
<a href="#" target="_blank">Privacy policy</a>
|
|
373
|
-
</div>
|
|
374
|
-
<div>
|
|
375
|
-
<img class="jboss" src="jboss.svg">
|
|
376
|
-
<button class="button" onclick="copyText(this)">Copy ID</button>
|
|
377
|
-
<span class="integrationIDelement">jboss</span>
|
|
378
|
-
<a href="#" target="_blank">Privacy policy</a>
|
|
379
|
-
</div>
|
|
380
|
-
<div>
|
|
381
|
-
<img class="jenkins">
|
|
382
|
-
<button class="button" onclick="copyText(this)">Copy ID</button>
|
|
383
|
-
<span class="integrationIDelement">jenkins</span>
|
|
384
|
-
<a href="#" target="_blank">Privacy policy</a>
|
|
385
|
-
</div>
|
|
386
|
-
<div>
|
|
387
|
-
<img class="jfrog">
|
|
388
|
-
<button class="button" onclick="copyText(this)">Copy ID</button>
|
|
389
|
-
<span class="integrationIDelement">jfrog</span>
|
|
390
|
-
<a href="#" target="_blank">Privacy policy</a>
|
|
391
|
-
</div>
|
|
392
|
-
<div>
|
|
393
|
-
<img class="jira">
|
|
394
|
-
<button class="button" onclick="copyText(this)">Copy ID</button>
|
|
395
|
-
<span class="integrationIDelement">jira</span>
|
|
396
|
-
<a href="#" target="_blank">Privacy policy</a>
|
|
397
|
-
</div>
|
|
398
|
-
<div>
|
|
399
|
-
<img class="key">
|
|
400
|
-
<button class="button" onclick="copyText(this)">Copy ID</button>
|
|
401
|
-
<span class="integrationIDelement">key</span>
|
|
402
|
-
<a href="#" target="_blank">Privacy policy</a>
|
|
403
|
-
</div>
|
|
404
|
-
<div>
|
|
405
|
-
<img class="kubernetes">
|
|
406
|
-
<button class="button" onclick="copyText(this)">Copy ID</button>
|
|
407
|
-
<span class="integrationIDelement">kubernetes</span>
|
|
408
|
-
<a href="#" target="_blank">Privacy policy</a>
|
|
409
|
-
</div>
|
|
410
|
-
<div>
|
|
411
|
-
<img class="linux">
|
|
412
|
-
<button class="button" onclick="copyText(this)">Copy ID</button>
|
|
413
|
-
<span class="integrationIDelement">linux</span>
|
|
414
|
-
<a href="#" target="_blank">Privacy policy</a>
|
|
415
|
-
</div>
|
|
416
|
-
<div>
|
|
417
|
-
<img class="mailhog">
|
|
418
|
-
<button class="button" onclick="copyText(this)">Copy ID</button>
|
|
419
|
-
<span class="integrationIDelement">mailhog</span>
|
|
420
|
-
<a href="#" target="_blank">Privacy policy</a>
|
|
421
|
-
</div>
|
|
422
|
-
<div>
|
|
423
|
-
<img class="microsoft-iis">
|
|
424
|
-
<button class="button" onclick="copyText(this)">Copy ID</button>
|
|
425
|
-
<span class="integrationIDelement">microsoft-iis</span>
|
|
426
|
-
<a href="#" target="_blank">Privacy policy</a>
|
|
427
|
-
</div>
|
|
428
|
-
<div>
|
|
429
|
-
<img class="microsoft-teams">
|
|
430
|
-
<button class="button" onclick="copyText(this)">Copy ID</button>
|
|
431
|
-
<span class="integrationIDelement">microsoft-teams</span>
|
|
432
|
-
<a href="#" target="_blank">Privacy policy</a>
|
|
433
|
-
</div>
|
|
434
|
-
<div>
|
|
435
|
-
<img class="mysql">
|
|
436
|
-
<button class="button" onclick="copyText(this)">Copy ID</button>
|
|
437
|
-
<span class="integrationIDelement">mysql</span>
|
|
438
|
-
<a href="#" target="_blank">Privacy policy</a>
|
|
439
|
-
</div>
|
|
440
|
-
<div>
|
|
441
|
-
<img class="netscaler">
|
|
442
|
-
<button class="button" onclick="copyText(this)">Copy ID</button>
|
|
443
|
-
<span class="integrationIDelement">netscaler</span>
|
|
444
|
-
<a href="#" target="_blank">Privacy policy</a>
|
|
445
|
-
</div>
|
|
446
|
-
<div>
|
|
447
|
-
<img class="new-relic">
|
|
448
|
-
<button class="button" onclick="copyText(this)">Copy ID</button>
|
|
449
|
-
<span class="integrationIDelement">new-relic</span>
|
|
450
|
-
<a href="#" target="_blank">Privacy policy</a>
|
|
451
|
-
</div>
|
|
452
|
-
<div>
|
|
453
|
-
<img class="octopus-deploy">
|
|
454
|
-
<button class="button" onclick="copyText(this)">Copy ID</button>
|
|
455
|
-
<span class="integrationIDelement">octopus-deploy</span>
|
|
456
|
-
<a href="#" target="_blank">Privacy policy</a>
|
|
457
|
-
</div>
|
|
458
|
-
<div>
|
|
459
|
-
<img class="open-policy-agent">
|
|
460
|
-
<button class="button" onclick="copyText(this)">Copy ID</button>
|
|
461
|
-
<span class="integrationIDelement">open-policy-agent</span>
|
|
462
|
-
<a href="#" target="_blank">Privacy policy</a>
|
|
463
|
-
</div>
|
|
464
|
-
|
|
465
|
-
<div>
|
|
466
|
-
<img class="openid">
|
|
467
|
-
<button class="button" onclick="copyText(this)">Copy ID</button>
|
|
468
|
-
<span class="integrationIDelement">openid</span>
|
|
469
|
-
<a href="#" target="_blank">Privacy policy</a>
|
|
470
|
-
</div>
|
|
471
|
-
<div>
|
|
472
|
-
<img class="openshift">
|
|
473
|
-
<button class="button" onclick="copyText(this)">Copy ID</button>
|
|
474
|
-
<span class="integrationIDelement">openshift</span>
|
|
475
|
-
<a href="#" target="_blank">Privacy policy</a>
|
|
476
|
-
</div>
|
|
477
|
-
<div>
|
|
478
|
-
<img class="opsgenie">
|
|
479
|
-
<button class="button" onclick="copyText(this)">Copy ID</button>
|
|
480
|
-
<span class="integrationIDelement">opsgenie</span>
|
|
481
|
-
<a href="#" target="_blank">Privacy policy</a>
|
|
482
|
-
</div>
|
|
483
|
-
<div>
|
|
484
|
-
<img class="oracle">
|
|
485
|
-
<button class="button" onclick="copyText(this)">Copy ID</button>
|
|
486
|
-
<span class="integrationIDelement">oracle</span>
|
|
487
|
-
<a href="#" target="_blank">Privacy policy</a>
|
|
488
|
-
</div>
|
|
489
|
-
<div>
|
|
490
|
-
<img class="parasoft">
|
|
491
|
-
<button class="button" onclick="copyText(this)">Copy ID</button>
|
|
492
|
-
<span class="integrationIDelement">parasoft</span>
|
|
493
|
-
<a href="#" target="_blank">Privacy policy</a>
|
|
494
|
-
</div>
|
|
495
|
-
<div>
|
|
496
|
-
<img class="pendo">
|
|
497
|
-
<button class="button" onclick="copyText(this)">Copy ID</button>
|
|
498
|
-
<span class="integrationIDelement">pendo</span>
|
|
499
|
-
<a href="#" target="_blank">Privacy policy</a>
|
|
500
|
-
</div>
|
|
501
|
-
<div>
|
|
502
|
-
<img class="planview" src="planview.svg">
|
|
503
|
-
<button class="button" onclick="copyText(this)">Copy ID</button>
|
|
504
|
-
<span class="integrationIDelement">planview</span>
|
|
505
|
-
<a href="#" target="_blank">Privacy policy</a>
|
|
506
|
-
</div>
|
|
507
|
-
<div>
|
|
508
|
-
<img class="podman" src="podman.svg">
|
|
509
|
-
<button class="button" onclick="copyText(this)">Copy ID</button>
|
|
510
|
-
<span class="integrationIDelement">podman</span>
|
|
511
|
-
<a href="#" target="_blank">Privacy policy</a>
|
|
512
|
-
</div>
|
|
513
|
-
<div>
|
|
514
|
-
<img class="powershell">
|
|
515
|
-
<button class="button" onclick="copyText(this)">Copy ID</button>
|
|
516
|
-
<span class="integrationIDelement">powershell</span>
|
|
517
|
-
<a href="#" target="_blank">Privacy policy</a>
|
|
518
|
-
</div>
|
|
519
|
-
<div>
|
|
520
|
-
<img class="progress-chef">
|
|
521
|
-
<button class="button" onclick="copyText(this)">Copy ID</button>
|
|
522
|
-
<span class="integrationIDelement">progress-chef</span>
|
|
523
|
-
<a href="#" target="_blank">Privacy policy</a>
|
|
524
|
-
</div>
|
|
525
|
-
<div>
|
|
526
|
-
<img class="puppet">
|
|
527
|
-
<button class="button" onclick="copyText(this)">Copy ID</button>
|
|
528
|
-
<span class="integrationIDelement">puppet</span>
|
|
529
|
-
<a href="#" target="_blank">Privacy policy</a>
|
|
530
|
-
</div>
|
|
531
|
-
<div>
|
|
532
|
-
<img class="python">
|
|
533
|
-
<button class="button" onclick="copyText(this)">Copy ID</button>
|
|
534
|
-
<span class="integrationIDelement">python</span>
|
|
535
|
-
<a href="#" target="_blank">Privacy policy</a>
|
|
536
|
-
</div>
|
|
537
|
-
<div>
|
|
538
|
-
<img class="rabbitmq">
|
|
539
|
-
<button class="button" onclick="copyText(this)">Copy ID</button>
|
|
540
|
-
<span class="integrationIDelement">rabbitmq</span>
|
|
541
|
-
<a href="#" target="_blank">Privacy policy</a>
|
|
542
|
-
</div>
|
|
543
|
-
<div>
|
|
544
|
-
<img class="release">
|
|
545
|
-
<button class="button" onclick="copyText(this)">Copy ID</button>
|
|
546
|
-
<span class="integrationIDelement">release</span>
|
|
547
|
-
<a href="#" target="_blank">Privacy policy</a>
|
|
548
|
-
</div>
|
|
549
|
-
<div>
|
|
550
|
-
<img class="safari">
|
|
551
|
-
<button class="button" onclick="copyText(this)">Copy ID</button>
|
|
552
|
-
<span class="integrationIDelement">safari</span>
|
|
553
|
-
<a href="#" target="_blank">Privacy policy</a>
|
|
554
|
-
</div>
|
|
555
|
-
<div>
|
|
556
|
-
<img class="salesforce">
|
|
557
|
-
<button class="button" onclick="copyText(this)">Copy ID</button>
|
|
558
|
-
<span class="integrationIDelement">salesforce</span>
|
|
559
|
-
<a href="#" target="_blank">Privacy policy</a>
|
|
560
|
-
</div>
|
|
561
|
-
|
|
562
|
-
<div>
|
|
563
|
-
<img class="servicenow">
|
|
564
|
-
<button class="button" onclick="copyText(this)">Copy ID</button>
|
|
565
|
-
<span class="integrationIDelement">servicenow</span>
|
|
566
|
-
<a href="#" target="_blank">Privacy policy</a>
|
|
567
|
-
</div>
|
|
568
|
-
<div>
|
|
569
|
-
<img class="skytab">
|
|
570
|
-
<button class="button" onclick="copyText(this)">Copy ID</button>
|
|
571
|
-
<span class="integrationIDelement">skytab</span>
|
|
572
|
-
<a href="#" target="_blank">Privacy policy</a>
|
|
573
|
-
</div>
|
|
574
|
-
<div>
|
|
575
|
-
<img class="sonarcloud">
|
|
576
|
-
<button class="button" onclick="copyText(this)">Copy ID</button>
|
|
577
|
-
<span class="integrationIDelement">sonarcloud</span>
|
|
578
|
-
<a href="#" target="_blank">Privacy policy</a>
|
|
579
|
-
</div>
|
|
580
|
-
<div>
|
|
581
|
-
<img class="sonarqube">
|
|
582
|
-
<button class="button" onclick="copyText(this)">Copy ID</button>
|
|
583
|
-
<span class="integrationIDelement">sonarqube</span>
|
|
584
|
-
<a href="#" target="_blank">Privacy policy</a>
|
|
585
|
-
</div>
|
|
586
|
-
<div>
|
|
587
|
-
<img class="sonatype">
|
|
588
|
-
<button class="button" onclick="copyText(this)">Copy ID</button>
|
|
589
|
-
<span class="integrationIDelement">sonatype</span>
|
|
590
|
-
<a href="#" target="_blank">Privacy policy</a>
|
|
591
|
-
</div>
|
|
592
|
-
|
|
593
|
-
<div>
|
|
594
|
-
<img class="topaz">
|
|
595
|
-
<button class="button" onclick="copyText(this)">Copy ID</button>
|
|
596
|
-
<span class="integrationIDelement">topaz</span>
|
|
597
|
-
<a href="#" target="_blank">Privacy policy</a>
|
|
598
|
-
</div>
|
|
599
|
-
<div>
|
|
600
|
-
<img class="travis-ci">
|
|
601
|
-
<button class="button" onclick="copyText(this)">Copy ID</button>
|
|
602
|
-
<span class="integrationIDelement">travis-ci</span>
|
|
603
|
-
<a href="#" target="_blank">Privacy policy</a>
|
|
604
|
-
</div>
|
|
605
|
-
<div>
|
|
606
|
-
<img class="urbancode-deploy">
|
|
607
|
-
<button class="button" onclick="copyText(this)">Copy ID</button>
|
|
608
|
-
<span class="integrationIDelement">urbancode-deploy</span>
|
|
609
|
-
<a href="#" target="_blank">Privacy policy</a>
|
|
610
|
-
</div>
|
|
611
|
-
<div>
|
|
612
|
-
<img class="vmware">
|
|
613
|
-
<button class="button" onclick="copyText(this)">Copy ID</button>
|
|
614
|
-
<span class="integrationIDelement">vmware</span>
|
|
615
|
-
<a href="#" target="_blank">Privacy policy</a>
|
|
616
|
-
</div>
|
|
617
|
-
<div>
|
|
618
|
-
<img class="webhook">
|
|
619
|
-
<button class="button" onclick="copyText(this)">Copy ID</button>
|
|
620
|
-
<span class="integrationIDelement">webhook</span>
|
|
621
|
-
<a href="#" target="_blank">Privacy policy</a>
|
|
622
|
-
</div>
|
|
623
|
-
<div>
|
|
624
|
-
<img class="windows">
|
|
625
|
-
<button class="button" onclick="copyText(this)">Copy ID</button>
|
|
626
|
-
<span class="integrationIDelement">windows</span>
|
|
627
|
-
<a href="#" target="_blank">Privacy policy</a>
|
|
628
|
-
</div>
|
|
629
|
-
<div>
|
|
630
|
-
<img class="xray">
|
|
631
|
-
<button class="button" onclick="copyText(this)">Copy ID</button>
|
|
632
|
-
<span class="integrationIDelement">xray</span>
|
|
633
|
-
<a href="#" target="_blank">Privacy policy</a>
|
|
634
|
-
</div>
|
|
635
|
-
<div>
|
|
636
|
-
<img class="zendesk">
|
|
637
|
-
<button class="button" onclick="copyText(this)">Copy ID</button>
|
|
638
|
-
<span class="integrationIDelement">zendesk</span>
|
|
639
|
-
<a href="#" target="_blank">Privacy policy</a>
|
|
640
|
-
</div>
|
|
17
|
+
</p> <p>For using integrations as HTML include <code class="codeInclude">link rel="stylesheet" href="./index.css"</code></p>
|
|
18
|
+
<input class="search-wrapper" type="text" id="myInput" onkeyup="myFunction()" placeholder="Search for icons...">
|
|
19
|
+
<div id="integrations-list" class="demo-wrapper dot-integration">
|
|
641
20
|
|
|
642
21
|
</div>
|
|
643
|
-
|
|
22
|
+
</body>
|
|
644
23
|
</html>
|
|
@@ -1,51 +1,230 @@
|
|
|
1
1
|
function myFunction() {
|
|
2
|
-
|
|
3
|
-
|
|
4
|
-
|
|
5
|
-
|
|
6
|
-
|
|
7
|
-
|
|
8
|
-
|
|
9
|
-
|
|
10
|
-
|
|
11
|
-
|
|
12
|
-
|
|
13
|
-
|
|
14
|
-
}
|
|
2
|
+
var input, filter, divs, i, div, txtValue;
|
|
3
|
+
input = document.getElementById('myInput');
|
|
4
|
+
filter = input.value.toUpperCase();
|
|
5
|
+
divs = document.querySelectorAll('div');
|
|
6
|
+
|
|
7
|
+
for (i = 0; i < divs.length; i++) {
|
|
8
|
+
div = divs[i];
|
|
9
|
+
txtValue = div.textContent || div.innerText;
|
|
10
|
+
if (txtValue.toUpperCase().indexOf(filter) > -1) {
|
|
11
|
+
divs[i].style.display = "";
|
|
12
|
+
} else {
|
|
13
|
+
divs[i].style.display = "none";
|
|
15
14
|
}
|
|
16
15
|
}
|
|
16
|
+
}
|
|
17
|
+
|
|
18
|
+
function doMagic() {
|
|
19
|
+
const list = document.getElementById("integrations-list");
|
|
20
|
+
const integrations = [
|
|
21
|
+
"agility",
|
|
22
|
+
"amazon-eks",
|
|
23
|
+
"ansible",
|
|
24
|
+
"apache-tomcat",
|
|
25
|
+
"app-aware",
|
|
26
|
+
"app-dynamics",
|
|
27
|
+
"app-management",
|
|
28
|
+
"application-protection",
|
|
29
|
+
"aras",
|
|
30
|
+
"arc-sight",
|
|
31
|
+
"argocd",
|
|
32
|
+
"atlassian",
|
|
33
|
+
"avaya",
|
|
34
|
+
"aws",
|
|
35
|
+
"azure-aks-2",
|
|
36
|
+
"azure-devops-tfs",
|
|
37
|
+
"azure-functions",
|
|
38
|
+
"azure",
|
|
39
|
+
"bamboo",
|
|
40
|
+
"bit-bucket",
|
|
41
|
+
"biztalk",
|
|
42
|
+
"black-duck",
|
|
43
|
+
"blazemeter",
|
|
44
|
+
"bmc-helix",
|
|
45
|
+
"checkmarx",
|
|
46
|
+
"chef",
|
|
47
|
+
"chrome",
|
|
48
|
+
"cisco",
|
|
49
|
+
"citrix",
|
|
50
|
+
"clarity-ppm",
|
|
51
|
+
"cloud-foundry",
|
|
52
|
+
"continuoustesting",
|
|
53
|
+
"cyberark",
|
|
54
|
+
"dai-logo",
|
|
55
|
+
"delphix",
|
|
56
|
+
"deploy",
|
|
57
|
+
"docker-compose",
|
|
58
|
+
"docker",
|
|
59
|
+
"dynatrace",
|
|
60
|
+
"edge",
|
|
61
|
+
"essential-app-protection",
|
|
62
|
+
"explorer",
|
|
63
|
+
"f5",
|
|
64
|
+
"firefox",
|
|
65
|
+
"fortify-on-demand",
|
|
66
|
+
"fortify",
|
|
67
|
+
"free-marker",
|
|
68
|
+
"git-ops",
|
|
69
|
+
"github-actions",
|
|
70
|
+
"github",
|
|
71
|
+
"gitlab",
|
|
72
|
+
"google-cloud-functions",
|
|
73
|
+
"google-cloud",
|
|
74
|
+
"google",
|
|
75
|
+
"hashi-corp-vault",
|
|
76
|
+
"helm",
|
|
77
|
+
"ibm",
|
|
78
|
+
"index.html",
|
|
79
|
+
"ingress",
|
|
80
|
+
"jboss",
|
|
81
|
+
"jenkins",
|
|
82
|
+
"jfrog",
|
|
83
|
+
"jira",
|
|
84
|
+
"key",
|
|
85
|
+
"kubernetes",
|
|
86
|
+
"linux",
|
|
87
|
+
"mailhog",
|
|
88
|
+
"microsoft-iis",
|
|
89
|
+
"microsoft-teams",
|
|
90
|
+
"mysql",
|
|
91
|
+
"netscaler",
|
|
92
|
+
"new-relic",
|
|
93
|
+
"octopus-deploy",
|
|
94
|
+
"open-policy-agent",
|
|
95
|
+
"openid",
|
|
96
|
+
"openshift",
|
|
97
|
+
"opsgenie",
|
|
98
|
+
"oracle",
|
|
99
|
+
"parasoft",
|
|
100
|
+
"pendo",
|
|
101
|
+
"planview",
|
|
102
|
+
"podman",
|
|
103
|
+
"powershell",
|
|
104
|
+
"progress-chef",
|
|
105
|
+
"puppet",
|
|
106
|
+
"python",
|
|
107
|
+
"rabbitmq",
|
|
108
|
+
"release",
|
|
109
|
+
"safari",
|
|
110
|
+
"salesforce",
|
|
111
|
+
"script.js",
|
|
112
|
+
"servicenow",
|
|
113
|
+
"skytab",
|
|
114
|
+
"sonarcloud",
|
|
115
|
+
"sonarqube",
|
|
116
|
+
"sonatype",
|
|
117
|
+
"svn",
|
|
118
|
+
"team-forge",
|
|
119
|
+
"teamcity",
|
|
120
|
+
"terraform",
|
|
121
|
+
"testlink",
|
|
122
|
+
"topaz",
|
|
123
|
+
"travis-ci",
|
|
124
|
+
"urbancode-deploy",
|
|
125
|
+
"vmware",
|
|
126
|
+
"webhook",
|
|
127
|
+
"windows",
|
|
128
|
+
"xray",
|
|
129
|
+
"zendesk",
|
|
130
|
+
];
|
|
131
|
+
integrations.forEach(integration => {
|
|
132
|
+
const div = document.createElement("div");
|
|
133
|
+
div.setAttribute("class", "copy-container");
|
|
134
|
+
div.innerHTML = `
|
|
135
|
+
<img class="${integration}"></i>
|
|
136
|
+
<!-- Inner div wrapping only the buttons -->
|
|
137
|
+
<!-- Button for copying ID -->
|
|
138
|
+
<button id="CopyID" class="button" onmouseover="showTooltip(this)" onmouseout="hideTooltip(this)"
|
|
139
|
+
onclick="copyText(this)">Copy ID
|
|
140
|
+
<span class="tooltiptext">Copy ID</span>
|
|
141
|
+
</button>
|
|
142
|
+
<!-- Button for copying Code -->
|
|
143
|
+
<button class="button" onmouseover="showTooltip(this)" onmouseout="hideTooltip(this)" onclick="copyCode(this)">
|
|
144
|
+
Copy Code
|
|
145
|
+
<span class="tooltiptext">Copy Code</span>
|
|
146
|
+
</button>
|
|
147
|
+
<span class="iconID">${integration}</span>
|
|
148
|
+
<!-- Code block to be copied -->
|
|
149
|
+
<pre class="codeBlock">
|
|
150
|
+
<code class="codeBlock">
|
|
151
|
+
<span class="dot-integration">
|
|
152
|
+
<img class="${integration}""></img>
|
|
153
|
+
</span>
|
|
154
|
+
</code>
|
|
155
|
+
</pre>
|
|
156
|
+
`;
|
|
157
|
+
list.appendChild(div);
|
|
158
|
+
});
|
|
159
|
+
}
|
|
160
|
+
|
|
161
|
+
document.addEventListener("DOMContentLoaded", doMagic);
|
|
162
|
+
|
|
163
|
+
|
|
164
|
+
function showTooltip(button) {
|
|
165
|
+
var tooltip = button.querySelector('.tooltiptext');
|
|
166
|
+
tooltip.style.visibility = 'visible';
|
|
167
|
+
}
|
|
168
|
+
|
|
169
|
+
function hideTooltip(button) {
|
|
170
|
+
var tooltip = button.querySelector('.tooltiptext');
|
|
171
|
+
tooltip.style.visibility = 'hidden';
|
|
172
|
+
}
|
|
173
|
+
|
|
174
|
+
function copyCode(button) {
|
|
175
|
+
// Find the closest div with class 'copy-container'
|
|
176
|
+
var parentDiv = button.closest('.copy-container');
|
|
177
|
+
|
|
178
|
+
// Find the code block element within the same parent div
|
|
179
|
+
var copyCode = parentDiv.querySelector('.codeBlock code');
|
|
180
|
+
|
|
181
|
+
// Get the HTML content inside the code block as a string
|
|
182
|
+
var codeToCopy = copyCode.innerHTML;
|
|
183
|
+
|
|
184
|
+
|
|
185
|
+
|
|
186
|
+
// Use the Clipboard API to copy the text
|
|
187
|
+
navigator.clipboard.writeText(codeToCopy).then(function() {
|
|
188
|
+
// Show the tooltip with the copied code message
|
|
189
|
+
var tooltip = button.querySelector('.tooltiptext');
|
|
190
|
+
tooltip.innerHTML = "Copied code block";
|
|
191
|
+
tooltip.style.visibility = 'visible';
|
|
192
|
+
|
|
193
|
+
// Reset the tooltip back to "Copy Code" after 2 seconds
|
|
194
|
+
setTimeout(function() {
|
|
195
|
+
tooltip.innerHTML = "Copy Code:";
|
|
196
|
+
tooltip.style.visibility = 'hidden';
|
|
197
|
+
}, 2000);
|
|
198
|
+
|
|
199
|
+
}, function(err) {
|
|
200
|
+
console.error('Failed to copy code block: ', err);
|
|
201
|
+
});
|
|
202
|
+
}
|
|
203
|
+
|
|
204
|
+
function copyText(button) {
|
|
205
|
+
// Find the closest div with class 'copy-container'
|
|
206
|
+
var parentDiv = button.closest('.copy-container');
|
|
207
|
+
|
|
208
|
+
// Find the span with the class 'iconID'
|
|
209
|
+
var copyText = parentDiv.querySelector('.iconID');
|
|
210
|
+
|
|
211
|
+
// Get the text content of the span
|
|
212
|
+
var textToCopy = copyText.textContent;
|
|
213
|
+
|
|
214
|
+
// Use the Clipboard API to copy the text
|
|
215
|
+
navigator.clipboard.writeText(textToCopy).then(function() {
|
|
216
|
+
// Show the tooltip with the copied ID message
|
|
217
|
+
var tooltip = button.querySelector('.tooltiptext');
|
|
218
|
+
tooltip.innerHTML = "Copied: " + textToCopy;
|
|
219
|
+
tooltip.style.visibility = 'visible';
|
|
220
|
+
|
|
221
|
+
// Reset the tooltip back to "Copy ID" after 2 seconds
|
|
222
|
+
setTimeout(function() {
|
|
223
|
+
tooltip.innerHTML = "Copy ID";
|
|
224
|
+
tooltip.style.visibility = 'hidden';
|
|
225
|
+
}, 2000);
|
|
17
226
|
|
|
18
|
-
function
|
|
19
|
-
|
|
20
|
-
|
|
21
|
-
|
|
22
|
-
// Find the span within the same parent div
|
|
23
|
-
var copyText = parentDiv.querySelector('.integrationIDelement');
|
|
24
|
-
|
|
25
|
-
// Get the text content of the span
|
|
26
|
-
var textToCopy = copyText.textContent;
|
|
27
|
-
|
|
28
|
-
// Use the Clipboard API to copy the text
|
|
29
|
-
navigator.clipboard.writeText(textToCopy).then(function() {
|
|
30
|
-
// Alert the copied text
|
|
31
|
-
alert("Copied the text: " + textToCopy);
|
|
32
|
-
}, function(err) {
|
|
33
|
-
console.error('Failed to copy text: ', err);
|
|
34
|
-
});
|
|
35
|
-
}
|
|
36
|
-
|
|
37
|
-
function copyCode() {
|
|
38
|
-
// Get the code block element
|
|
39
|
-
var copyCode = document.getElementById("myCodeBlock");
|
|
40
|
-
|
|
41
|
-
// Get the text content of the code block
|
|
42
|
-
var codeToCopy = copyCode.textContent;
|
|
43
|
-
|
|
44
|
-
// Use the Clipboard API to copy the text
|
|
45
|
-
navigator.clipboard.writeText(codeToCopy).then(function() {
|
|
46
|
-
// Alert the copied code
|
|
47
|
-
alert("Copied the code block");
|
|
48
|
-
}, function(err) {
|
|
49
|
-
console.error('Failed to copy code block: ', err);
|
|
50
|
-
});
|
|
51
|
-
}
|
|
227
|
+
}, function(err) {
|
|
228
|
+
console.error('Failed to copy text: ', err);
|
|
229
|
+
});
|
|
230
|
+
}
|
package/package.json
CHANGED