word-games-theme 2.0.9 → 2.1.0
Sign up to get free protection for your applications and to get access to all the features.
- checksums.yaml +4 -4
- data/_data/wordgames/en/root.json +23 -0
- data/_includes/infographics/infographics.html +342 -0
- data/_includes/word-game/word-game-generator-online.html +1 -2
- data/_layouts/default.html +9 -0
- data/assets/css/style.css +4 -0
- data/assets/images/1.png +0 -0
- data/assets/images/2.png +0 -0
- data/assets/images/3.png +0 -0
- data/assets/js/createWordle.js +1 -0
- metadata +6 -2
checksums.yaml
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
---
|
|
2
2
|
SHA256:
|
|
3
|
-
metadata.gz:
|
|
4
|
-
data.tar.gz:
|
|
3
|
+
metadata.gz: c7802ef660368c3742b5d99e44b8d7c76c9c9593fc8e0ffc61ddefb011dc58b6
|
|
4
|
+
data.tar.gz: df1c7a1be0d88e61a4be22d96a21622a238be2d3aa624d898109724dfd0f8813
|
|
5
5
|
SHA512:
|
|
6
|
-
metadata.gz:
|
|
7
|
-
data.tar.gz:
|
|
6
|
+
metadata.gz: eb189ada6cfb99e90dbdd9c3c922d0c89503c926f187c02ed4df4f3bf4e1e51f129af90b8734e88f1645e2067e11c3794f8a6f70e149c9b3d922c1caf3c76716
|
|
7
|
+
data.tar.gz: fb2d3a457ee71091a3f36a1f2aa8cadeac8ac98f2dc02c8594a72430e99dffcb4c6875dcd4057297f0778349f9038d9e82d039d98cafe69cd4597129b6528a7c
|
|
@@ -14,6 +14,29 @@
|
|
|
14
14
|
"Faq_title": "FAQ",
|
|
15
15
|
"aboutNo": "05",
|
|
16
16
|
"about_title": "About",
|
|
17
|
+
"infographics": [
|
|
18
|
+
{
|
|
19
|
+
"image": "/assets/images/1.png",
|
|
20
|
+
"description": "How to set alarm on wake me up at 4:45 am tool"
|
|
21
|
+
},
|
|
22
|
+
{
|
|
23
|
+
"image": "/assets/images/2.png",
|
|
24
|
+
"description": "5 benefits of using wake me up at 4:45 am tool"
|
|
25
|
+
},
|
|
26
|
+
{
|
|
27
|
+
"image": "/assets/images/3.png",
|
|
28
|
+
"description": "Additional features of wake me up at 4:45 am tool"
|
|
29
|
+
},
|
|
30
|
+
{
|
|
31
|
+
"image": "/assets/images/3.png",
|
|
32
|
+
"description": "Additional features of wake me up at 4:45 am tool"
|
|
33
|
+
},
|
|
34
|
+
{
|
|
35
|
+
"image": "/assets/images/3.png",
|
|
36
|
+
"description": "Additional features of wake me up at 4:45 am tool"
|
|
37
|
+
}
|
|
38
|
+
|
|
39
|
+
],
|
|
17
40
|
"featureList": [
|
|
18
41
|
{
|
|
19
42
|
"feature_heading": "How to create words with letters by using this tool?",
|
|
@@ -0,0 +1,342 @@
|
|
|
1
|
+
<!-- <style>
|
|
2
|
+
/* Reset default browser styles */
|
|
3
|
+
|
|
4
|
+
.infographic {
|
|
5
|
+
display: flex;
|
|
6
|
+
justify-content: space-between;
|
|
7
|
+
align-items: center;
|
|
8
|
+
margin: 50px auto;
|
|
9
|
+
max-width: 800px;
|
|
10
|
+
}
|
|
11
|
+
.infographic-item {
|
|
12
|
+
flex-basis: 30%;
|
|
13
|
+
text-align: center;
|
|
14
|
+
/* background-color: #404040; */
|
|
15
|
+
/* border-radius: 10px; */
|
|
16
|
+
/* padding: 30px; */
|
|
17
|
+
}
|
|
18
|
+
|
|
19
|
+
.infographic-item img {
|
|
20
|
+
max-width: 100%;
|
|
21
|
+
height: auto;
|
|
22
|
+
border-radius: 8px;
|
|
23
|
+
margin-bottom: 10px;
|
|
24
|
+
box-shadow: 15px 15px 40px rgba(0, 0, 0, 50%);
|
|
25
|
+
}
|
|
26
|
+
|
|
27
|
+
.infographic-item h3 {
|
|
28
|
+
font-size: 20px;
|
|
29
|
+
margin-bottom: 10px;
|
|
30
|
+
color: #fff;
|
|
31
|
+
}
|
|
32
|
+
|
|
33
|
+
.infographic-item p {
|
|
34
|
+
font-size: 16px;
|
|
35
|
+
margin-bottom: 0px;
|
|
36
|
+
}
|
|
37
|
+
|
|
38
|
+
@media (max-width: 600px) {
|
|
39
|
+
.infographic {
|
|
40
|
+
flex-wrap: wrap;
|
|
41
|
+
}
|
|
42
|
+
|
|
43
|
+
.infographic-item {
|
|
44
|
+
flex-basis: 100%;
|
|
45
|
+
margin-bottom: 30px;
|
|
46
|
+
}
|
|
47
|
+
}
|
|
48
|
+
</style>
|
|
49
|
+
<div class="infographics_section">
|
|
50
|
+
<h3 class="text-center w-100 mb-5"><b>Other useful information</b></h3>
|
|
51
|
+
<div class="infographic">
|
|
52
|
+
{%- for item in dataToShow.infographics -%}
|
|
53
|
+
<div class="infographic-item">
|
|
54
|
+
<img src="{{item.image}}" alt="Image 1">
|
|
55
|
+
<p class="infographic-desc">{{item.description | capitalize }}</p>
|
|
56
|
+
</div>
|
|
57
|
+
{%- endfor -%}
|
|
58
|
+
</div>
|
|
59
|
+
|
|
60
|
+
|
|
61
|
+
<div class="slider">
|
|
62
|
+
<div class="row">
|
|
63
|
+
<div class="col-md-12 mx-auto">
|
|
64
|
+
<div id="carousel">
|
|
65
|
+
{%- for item in featureData.infographics -%}
|
|
66
|
+
<div class="slide">
|
|
67
|
+
<img src="{{item.image}}" alt="Photo1" />
|
|
68
|
+
<p class="infographics-desc">{{item.description | capitalize }}</p>
|
|
69
|
+
</div>
|
|
70
|
+
{%- endfor -%}
|
|
71
|
+
</div>
|
|
72
|
+
</div>
|
|
73
|
+
</div>
|
|
74
|
+
<button class="btn-slide prev"><i class="fas fa-3x fa-chevron-circle-left"></i></button>
|
|
75
|
+
<button class="btn-slide next"><i class="fas fa-3x fa-chevron-circle-right"></i></button>
|
|
76
|
+
</div>
|
|
77
|
+
<div class="dots-container">
|
|
78
|
+
{%- for item in featureData.infographics -%}
|
|
79
|
+
<span class="dot active" data-slide="{{ forloop.index0 }}"></span>
|
|
80
|
+
{%- endfor -%}
|
|
81
|
+
</div> -->
|
|
82
|
+
<!-- </div> -->
|
|
83
|
+
|
|
84
|
+
<!-- <script>
|
|
85
|
+
function Slider() {
|
|
86
|
+
const carouselSlides = document.querySelectorAll('.slide');
|
|
87
|
+
const btnPrev = document.querySelector('.prev');
|
|
88
|
+
const btnNext = document.querySelector('.next');
|
|
89
|
+
const dotsSlide = document.querySelector('.dots-container');
|
|
90
|
+
let currentSlide = 0;
|
|
91
|
+
|
|
92
|
+
const activeDot = function (slide) {
|
|
93
|
+
document.querySelectorAll('.dot').forEach(dot => dot.classList.remove('active'));
|
|
94
|
+
document.querySelector(`.dot[data-slide="${slide}"]`).classList.add('active');
|
|
95
|
+
};
|
|
96
|
+
activeDot(currentSlide);
|
|
97
|
+
|
|
98
|
+
const changeSlide = function (slides) {
|
|
99
|
+
carouselSlides.forEach((slide, index) => (slide.style.transform = `translateX(${100 * (index - slides)}%)`));
|
|
100
|
+
};
|
|
101
|
+
changeSlide(currentSlide);
|
|
102
|
+
|
|
103
|
+
btnNext.addEventListener('click', function () {
|
|
104
|
+
currentSlide++;
|
|
105
|
+
if (carouselSlides.length - 1 < currentSlide) {
|
|
106
|
+
currentSlide = 0;
|
|
107
|
+
};
|
|
108
|
+
changeSlide(currentSlide);
|
|
109
|
+
activeDot(currentSlide);
|
|
110
|
+
});
|
|
111
|
+
btnPrev.addEventListener('click', function () {
|
|
112
|
+
currentSlide--;
|
|
113
|
+
if (0 >= currentSlide) {
|
|
114
|
+
currentSlide = 0;
|
|
115
|
+
};
|
|
116
|
+
changeSlide(currentSlide);
|
|
117
|
+
activeDot(currentSlide);
|
|
118
|
+
});
|
|
119
|
+
|
|
120
|
+
dotsSlide.addEventListener('click', function (e) {
|
|
121
|
+
if (e.target.classList.contains('dot')) {
|
|
122
|
+
const slide = e.target.dataset.slide;
|
|
123
|
+
changeSlide(slide);
|
|
124
|
+
activeDot(slide);
|
|
125
|
+
}
|
|
126
|
+
});
|
|
127
|
+
};
|
|
128
|
+
Slider();
|
|
129
|
+
</script> -->
|
|
130
|
+
|
|
131
|
+
|
|
132
|
+
|
|
133
|
+
|
|
134
|
+
|
|
135
|
+
|
|
136
|
+
|
|
137
|
+
|
|
138
|
+
|
|
139
|
+
|
|
140
|
+
|
|
141
|
+
|
|
142
|
+
|
|
143
|
+
<style>
|
|
144
|
+
.infographics-wrapper {
|
|
145
|
+
display: flex;
|
|
146
|
+
align-items: center;
|
|
147
|
+
justify-content: center;
|
|
148
|
+
overflow-x: hidden;
|
|
149
|
+
overflow-y: hidden;
|
|
150
|
+
height: 130vh;
|
|
151
|
+
}
|
|
152
|
+
|
|
153
|
+
.infographics-wrapper .container {
|
|
154
|
+
width: 100%;
|
|
155
|
+
height: 100%;
|
|
156
|
+
display: flex;
|
|
157
|
+
transform-style: preserve-3d;
|
|
158
|
+
align-items: center;
|
|
159
|
+
flex-direction: column;
|
|
160
|
+
}
|
|
161
|
+
|
|
162
|
+
.infographics-wrapper .cards {
|
|
163
|
+
position: relative;
|
|
164
|
+
width: 300px;
|
|
165
|
+
height: 300px;
|
|
166
|
+
margin-bottom: 20px;
|
|
167
|
+
perspective: 1000px;
|
|
168
|
+
transform-style: preserve-3d;
|
|
169
|
+
}
|
|
170
|
+
|
|
171
|
+
.infographics-wrapper .cards label {
|
|
172
|
+
position: absolute;
|
|
173
|
+
width: 300px;
|
|
174
|
+
left: 0;
|
|
175
|
+
right: 0;
|
|
176
|
+
margin: auto;
|
|
177
|
+
cursor: pointer;
|
|
178
|
+
transition: transform 0.55s ease;
|
|
179
|
+
}
|
|
180
|
+
|
|
181
|
+
.infographics-wrapper .cards .card {
|
|
182
|
+
position: relative;
|
|
183
|
+
height: 100%;
|
|
184
|
+
background-color: #323444;
|
|
185
|
+
border-radius: 10px;
|
|
186
|
+
padding: 5px;
|
|
187
|
+
}
|
|
188
|
+
|
|
189
|
+
.infographics-wrapper .card .image {
|
|
190
|
+
display: flex;
|
|
191
|
+
justify-content: space-between;
|
|
192
|
+
}
|
|
193
|
+
|
|
194
|
+
.infographics-wrapper .card .image img {
|
|
195
|
+
border-radius: 5px;
|
|
196
|
+
box-shadow: 15px 15px 40px rgba(0, 0, 0, 50%);
|
|
197
|
+
margin-top: 23px;
|
|
198
|
+
width: 86%;
|
|
199
|
+
object-fit: cover;
|
|
200
|
+
}
|
|
201
|
+
|
|
202
|
+
.infographics-wrapper .card .image .dots {
|
|
203
|
+
text-align: center;
|
|
204
|
+
}
|
|
205
|
+
|
|
206
|
+
.dots div {
|
|
207
|
+
width: 10px;
|
|
208
|
+
height: 10px;
|
|
209
|
+
border-radius: 50%;
|
|
210
|
+
margin-bottom: 10px;
|
|
211
|
+
}
|
|
212
|
+
|
|
213
|
+
.dots div:nth-child(1) {
|
|
214
|
+
background-color: var(--current-color1);
|
|
215
|
+
}
|
|
216
|
+
|
|
217
|
+
.dots div:nth-child(2) {
|
|
218
|
+
background-color: #5B85F9;
|
|
219
|
+
}
|
|
220
|
+
|
|
221
|
+
.dots div:nth-child(3) {
|
|
222
|
+
|
|
223
|
+
background-color: #000;
|
|
224
|
+
}
|
|
225
|
+
|
|
226
|
+
.card .infos {
|
|
227
|
+
display: block;
|
|
228
|
+
text-align: end;
|
|
229
|
+
padding-top: 2rem;
|
|
230
|
+
}
|
|
231
|
+
|
|
232
|
+
.infos span {
|
|
233
|
+
|
|
234
|
+
display: block;
|
|
235
|
+
}
|
|
236
|
+
|
|
237
|
+
.infos .name {
|
|
238
|
+
font-size: 30px;
|
|
239
|
+
color: var(--current-color1);
|
|
240
|
+
letter-spacing: 8px;
|
|
241
|
+
margin-bottom: 20px;
|
|
242
|
+
padding-left: 25%;
|
|
243
|
+
transition: all .6s ease;
|
|
244
|
+
}
|
|
245
|
+
|
|
246
|
+
.infos .lorem {
|
|
247
|
+
font-size: 15px;
|
|
248
|
+
color: #ECEAED;
|
|
249
|
+
|
|
250
|
+
text-align: center;
|
|
251
|
+
}
|
|
252
|
+
|
|
253
|
+
#s1:checked~.cards #slide4,
|
|
254
|
+
#s2:checked~.cards #slide5,
|
|
255
|
+
#s3:checked~.cards #slide1,
|
|
256
|
+
#s4:checked~.cards #slide2,
|
|
257
|
+
#s5:checked~.cards #slide3 {
|
|
258
|
+
transform: translate3d(-70%, 0, -220px);
|
|
259
|
+
--current-color1: #ECEAED;
|
|
260
|
+
--current-color2: #404457;
|
|
261
|
+
}
|
|
262
|
+
|
|
263
|
+
#s1:checked~.cards #slide5,
|
|
264
|
+
#s2:checked~.cards #slide1,
|
|
265
|
+
#s3:checked~.cards #slide2,
|
|
266
|
+
#s4:checked~.cards #slide3,
|
|
267
|
+
#s5:checked~.cards #slide4 {
|
|
268
|
+
|
|
269
|
+
transform: translate3d(-35%, 0, -120px);
|
|
270
|
+
--current-color1: #ECEAED;
|
|
271
|
+
--current-color2: #404457;
|
|
272
|
+
}
|
|
273
|
+
|
|
274
|
+
#s1:checked~.cards #slide1,
|
|
275
|
+
#s2:checked~.cards #slide2,
|
|
276
|
+
#s3:checked~.cards #slide3,
|
|
277
|
+
#s4:checked~.cards #slide4,
|
|
278
|
+
#s5:checked~.cards #slide5 {
|
|
279
|
+
transform: translate3d(0, 0, 0);
|
|
280
|
+
--current-color1: #fad00c;
|
|
281
|
+
--current-color2: #ECEAED;
|
|
282
|
+
}
|
|
283
|
+
|
|
284
|
+
#s1:checked~.cards #slide2,
|
|
285
|
+
#s2:checked~.cards #slide3,
|
|
286
|
+
#s3:checked~.cards #slide4,
|
|
287
|
+
#s4:checked~.cards #slide5,
|
|
288
|
+
#s5:checked~.cards #slide1 {
|
|
289
|
+
|
|
290
|
+
transform: translate3d(35%, 0, -120px);
|
|
291
|
+
--current-color1: #ECEAED;
|
|
292
|
+
--current-color2: #404457;
|
|
293
|
+
}
|
|
294
|
+
|
|
295
|
+
#s1:checked~.cards #slide3,
|
|
296
|
+
#s2:checked~.cards #slide4,
|
|
297
|
+
#s3:checked~.cards #slide5,
|
|
298
|
+
#s4:checked~.cards #slide1,
|
|
299
|
+
#s5:checked~.cards #slide2 {
|
|
300
|
+
transform: translate3d(70%, 0, -220px);
|
|
301
|
+
--current-color1: #ECEAED;
|
|
302
|
+
--current-color2: #404457;
|
|
303
|
+
}
|
|
304
|
+
|
|
305
|
+
@media (max-width:768px) {
|
|
306
|
+
.infographics-wrapper .cards label{
|
|
307
|
+
left: -100px;
|
|
308
|
+
}
|
|
309
|
+
|
|
310
|
+
}
|
|
311
|
+
</style>
|
|
312
|
+
|
|
313
|
+
<div class="infographics-wrapper">
|
|
314
|
+
<div class="container">
|
|
315
|
+
<h3 class="text-center w-100 mb-5 mt-5" style="font-size:20px"><b>Other useful information</b></h3>
|
|
316
|
+
<input type="radio" name="slider" class="d-none" id="s1" checked>
|
|
317
|
+
<input type="radio" name="slider" class="d-none" id="s2">
|
|
318
|
+
<input type="radio" name="slider" class="d-none" id="s3">
|
|
319
|
+
<input type="radio" name="slider" class="d-none" id="s4">
|
|
320
|
+
<input type="radio" name="slider" class="d-none" id="s5">
|
|
321
|
+
<div class="cards">
|
|
322
|
+
|
|
323
|
+
{%- for item in dataToShow.infographics -%}
|
|
324
|
+
<label for="s{{ forloop.index }}" id="slide{{ forloop.index }}">
|
|
325
|
+
<div class="card">
|
|
326
|
+
<div class="image">
|
|
327
|
+
<img src="{{item.image}}" alt="">
|
|
328
|
+
<div class="dots">
|
|
329
|
+
<div class="dot1"></div>
|
|
330
|
+
<div class="dot2"></div>
|
|
331
|
+
<div class="dot3"></div>
|
|
332
|
+
</div>
|
|
333
|
+
</div>
|
|
334
|
+
<div class="infos">
|
|
335
|
+
<span class="lorem">{{item.description | capitalize }}</span>
|
|
336
|
+
</div>
|
|
337
|
+
</div>
|
|
338
|
+
</label>
|
|
339
|
+
{%- endfor -%}
|
|
340
|
+
</div>
|
|
341
|
+
</div>
|
|
342
|
+
</div>
|
|
@@ -10,8 +10,7 @@
|
|
|
10
10
|
<h3 class="font-weight-bolder mt-4">Make your own wordle</h3>
|
|
11
11
|
<input id="cstmword" autocomplete="off" type="text" class="form-control custom-word"
|
|
12
12
|
placeholder="Enter Up to 5 Letters?" name="custom-word" required maxlength="5">
|
|
13
|
-
<
|
|
14
|
-
class="btn generate-word-game-link">Generate Link</button>
|
|
13
|
+
<input id="generate_link" value="Generate Link" type="submit" class="btn generate-word-game-link">
|
|
15
14
|
<!-- <span class="open-popup" data-toggle="modal" data-target="#exampleModal"></span> -->
|
|
16
15
|
</form>
|
|
17
16
|
</div>
|
data/_layouts/default.html
CHANGED
|
@@ -27,6 +27,13 @@
|
|
|
27
27
|
|
|
28
28
|
{% include adBlocker/adBlocker.html %}
|
|
29
29
|
{%- include Rating/rating.html -%}
|
|
30
|
+
|
|
31
|
+
{%- if dataToShow.infographics.size > 0 -%}
|
|
32
|
+
{%- include infographics/infographics.html -%}
|
|
33
|
+
{%- endif -%}
|
|
34
|
+
|
|
35
|
+
|
|
36
|
+
|
|
30
37
|
{%- include share/socialshare.html -%}
|
|
31
38
|
|
|
32
39
|
{%- assign langen = "en" -%}
|
|
@@ -46,6 +53,8 @@
|
|
|
46
53
|
{%- include section/recent_posts.html -%}
|
|
47
54
|
{% endif %}
|
|
48
55
|
|
|
56
|
+
|
|
57
|
+
|
|
49
58
|
{%- include footer/index.html -%}
|
|
50
59
|
|
|
51
60
|
{%- include script.html -%}
|
data/assets/css/style.css
CHANGED
data/assets/images/1.png
ADDED
|
Binary file
|
data/assets/images/2.png
ADDED
|
Binary file
|
data/assets/images/3.png
ADDED
|
Binary file
|
data/assets/js/createWordle.js
CHANGED
metadata
CHANGED
|
@@ -1,14 +1,14 @@
|
|
|
1
1
|
--- !ruby/object:Gem::Specification
|
|
2
2
|
name: word-games-theme
|
|
3
3
|
version: !ruby/object:Gem::Version
|
|
4
|
-
version: 2.0
|
|
4
|
+
version: 2.1.0
|
|
5
5
|
platform: ruby
|
|
6
6
|
authors:
|
|
7
7
|
- manpreet-appscms
|
|
8
8
|
autorequire:
|
|
9
9
|
bindir: bin
|
|
10
10
|
cert_chain: []
|
|
11
|
-
date: 2023-06-
|
|
11
|
+
date: 2023-06-24 00:00:00.000000000 Z
|
|
12
12
|
dependencies:
|
|
13
13
|
- !ruby/object:Gem::Dependency
|
|
14
14
|
name: jekyll
|
|
@@ -137,6 +137,7 @@ files:
|
|
|
137
137
|
- _includes/header/blogHeader.html
|
|
138
138
|
- _includes/header/index.html
|
|
139
139
|
- _includes/howto.html
|
|
140
|
+
- _includes/infographics/infographics.html
|
|
140
141
|
- _includes/languages/languages.html
|
|
141
142
|
- _includes/multiple-word-anagram-solver/index.html
|
|
142
143
|
- _includes/paginationBlogPage.html
|
|
@@ -201,6 +202,9 @@ files:
|
|
|
201
202
|
- assets/css/wordGroup.css
|
|
202
203
|
- assets/css/wordleSolver.css
|
|
203
204
|
- assets/css/wordsInCertainPosition.css
|
|
205
|
+
- assets/images/1.png
|
|
206
|
+
- assets/images/2.png
|
|
207
|
+
- assets/images/3.png
|
|
204
208
|
- assets/images/404.svg
|
|
205
209
|
- assets/images/Ankita.webp
|
|
206
210
|
- assets/images/Anushka.webp
|